Upstream
/
WordPress
mirror of https://github.com/WordPress/WordPress.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Bundled Themes: Support pullquote block typography options in Twenty Twenty-One. 

Pullquotes were not inheriting the correct styling from the block
editor. This commit resolves the issue by supporting typography options.

1. The `font-family` variable remains on the paragraph (both editor and front) so the citation continues to use the body font even when the site redefines `var(--pullquote--font-family)`.

2. The `font-size`, `font-style`, `font-weight`, `letter-spacing` and `line-height` are set on the Pullquote block to allow overriding with the sidebar settings. Then the block's paragraph element inherits those styles.

3. When the settings do not give a custom `line-height` from the sidebar, these stylesheets set the paragraph to `var(--pullquote--line-height)` instead of inheriting 1.6 from the block styles. This patch uses `:where()` to avoid increasing specificity.

Moving styles from the paragraph element to the block should not affect the citation, which has had its own styles for `font-size`, `font-style`, `font-weight` and `letter-spacing`.

Follow-up to [56959], [56451], [55089], [55088], [49574], [49320], [49216].

Props sabernhardt, poena, darshitrajyaguru97, harshgajipara, shailu25, skyakash12.
Fixes #57854.
Built from https://develop.svn.wordpress.org/trunk@57631


git-svn-id: http://core.svn.wordpress.org/trunk@57132 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
hellofromTonya 2024-02-13 21:24:10 +00:00
parent 53b99200d6
commit 5e52fa8477
8 changed files with 102 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
wp-content/themes/twentytwentyone/assets/css/ie-editor.css
View File

@ -1306,6 +1306,17 @@ pre.wp-block-preformatted {
color: currentColor;
border-color: currentColor;
position: relative;
font-size: 2rem;
font-style: normal;
font-weight: 700;
letter-spacing: normal;
}
@media only screen and (min-width: 652px) {
.wp-block-pullquote {
font-size: 2rem;
}
}
.wp-block-pullquote blockquote::before {
@ -1321,18 +1332,16 @@ pre.wp-block-preformatted {
.wp-block-pullquote p {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-size: 2rem;
font-style: normal;
font-weight: 700;
letter-spacing: normal;
line-height: 1.3;
font-size: inherit;
font-style: inherit;
font-weight: inherit;
letter-spacing: inherit;
line-height: inherit;
margin: 0;
}
@media only screen and (min-width: 652px) {
.wp-block-pullquote p {
font-size: 2rem;
}
.wp-block-pullquote:where(:not([style*=line-height])) p {
line-height: 1.3;
}
.wp-block-pullquote a {

27
wp-content/themes/twentytwentyone/assets/css/ie.css
View File

@ -2977,12 +2977,23 @@ pre.wp-block-preformatted {
color: currentColor;
border-color: currentColor;
position: relative;
font-size: 2rem;
font-style: normal;
font-weight: 700;
letter-spacing: normal;
/**
* Block Options
*/
}
@media only screen and (min-width: 652px) {
.wp-block-pullquote {
font-size: 2rem;
}
}
.wp-block-pullquote blockquote::before {
color: currentColor;
content: "“";
@ -2996,18 +3007,16 @@ pre.wp-block-preformatted {
.wp-block-pullquote p {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-size: 2rem;
font-style: normal;
font-weight: 700;
letter-spacing: normal;
line-height: 1.3;
font-size: inherit;
font-style: inherit;
font-weight: inherit;
letter-spacing: inherit;
line-height: inherit;
margin: 0;
}
@media only screen and (min-width: 652px) {
.wp-block-pullquote p {
font-size: 2rem;
}
.wp-block-pullquote:where(:not([style*=line-height])) p {
line-height: 1.3;
}
.wp-block-pullquote a {

18
wp-content/themes/twentytwentyone/assets/css/style-editor.css
View File

@ -1418,6 +1418,10 @@ pre.wp-block-preformatted {
color: currentColor;
border-color: currentColor;
position: relative;
font-size: var(--pullquote--font-size);
font-style: var(--pullquote--font-style);
font-weight: 700;
letter-spacing: var(--pullquote--letter-spacing);
}
.wp-block-pullquote blockquote::before {
@ -1433,14 +1437,18 @@ pre.wp-block-preformatted {
.wp-block-pullquote p {
font-family: var(--pullquote--font-family);
font-size: var(--pullquote--font-size);
font-style: var(--pullquote--font-style);
font-weight: 700;
letter-spacing: var(--pullquote--letter-spacing);
line-height: var(--pullquote--line-height);
font-size: inherit;
font-style: inherit;
font-weight: inherit;
letter-spacing: inherit;
line-height: inherit;
margin: 0;
}
.wp-block-pullquote:where(:not([style*=line-height])) p {
line-height: var(--pullquote--line-height);
}
.wp-block-pullquote a {
color: currentColor;
}

18
wp-content/themes/twentytwentyone/assets/sass/05-blocks/pullquote/_editor.scss
View File

@ -7,6 +7,10 @@
color: currentColor;
border-color: currentColor;
position: relative;
font-size: var(--pullquote--font-size);
font-style: var(--pullquote--font-style);
font-weight: 700;
letter-spacing: var(--pullquote--letter-spacing);
blockquote::before {
color: currentColor;
@ -21,14 +25,18 @@
p {
font-family: var(--pullquote--font-family);
font-size: var(--pullquote--font-size);
font-style: var(--pullquote--font-style);
font-weight: 700;
letter-spacing: var(--pullquote--letter-spacing);
line-height: var(--pullquote--line-height);
font-size: inherit;
font-style: inherit;
font-weight: inherit;
letter-spacing: inherit;
line-height: inherit;
margin: 0;
}
&:where(:not([style*="line-height"])) p {
line-height: var(--pullquote--line-height);
}
a {
color: currentColor;
}

18
wp-content/themes/twentytwentyone/assets/sass/05-blocks/pullquote/_style.scss
View File

@ -7,6 +7,10 @@
color: currentColor;
border-color: currentColor;
position: relative;
font-size: var(--pullquote--font-size);
font-style: var(--pullquote--font-style);
font-weight: 700;
letter-spacing: var(--pullquote--letter-spacing);
blockquote::before {
color: currentColor;
@ -21,14 +25,18 @@
p {
font-family: var(--pullquote--font-family);
font-size: var(--pullquote--font-size);
font-style: var(--pullquote--font-style);
font-weight: 700;
letter-spacing: var(--pullquote--letter-spacing);
line-height: var(--pullquote--line-height);
font-size: inherit;
font-style: inherit;
font-weight: inherit;
letter-spacing: inherit;
line-height: inherit;
margin: 0;
}
&:where(:not([style*="line-height"])) p {
line-height: var(--pullquote--line-height);
}
a {
color: currentColor;
}

18
wp-content/themes/twentytwentyone/style-rtl.css
View File

@ -2813,6 +2813,10 @@ pre.wp-block-preformatted {
color: currentColor;
border-color: currentColor;
position: relative;
font-size: var(--pullquote--font-size);
font-style: var(--pullquote--font-style);
font-weight: 700;
letter-spacing: var(--pullquote--letter-spacing);
/**
* Block Options
@ -2832,14 +2836,18 @@ pre.wp-block-preformatted {
.wp-block-pullquote p {
font-family: var(--pullquote--font-family);
font-size: var(--pullquote--font-size);
font-style: var(--pullquote--font-style);
font-weight: 700;
letter-spacing: var(--pullquote--letter-spacing);
line-height: var(--pullquote--line-height);
font-size: inherit;
font-style: inherit;
font-weight: inherit;
letter-spacing: inherit;
line-height: inherit;
margin: 0;
}
.wp-block-pullquote:where(:not([style*=line-height])) p {
line-height: var(--pullquote--line-height);
}
.wp-block-pullquote a {
color: currentColor;
}

18
wp-content/themes/twentytwentyone/style.css
View File

@ -2823,6 +2823,10 @@ pre.wp-block-preformatted {
color: currentColor;
border-color: currentColor;
position: relative;
font-size: var(--pullquote--font-size);
font-style: var(--pullquote--font-style);
font-weight: 700;
letter-spacing: var(--pullquote--letter-spacing);
/**
* Block Options
@ -2842,14 +2846,18 @@ pre.wp-block-preformatted {
.wp-block-pullquote p {
font-family: var(--pullquote--font-family);
font-size: var(--pullquote--font-size);
font-style: var(--pullquote--font-style);
font-weight: 700;
letter-spacing: var(--pullquote--letter-spacing);
line-height: var(--pullquote--line-height);
font-size: inherit;
font-style: inherit;
font-weight: inherit;
letter-spacing: inherit;
line-height: inherit;
margin: 0;
}
.wp-block-pullquote:where(:not([style*=line-height])) p {
line-height: var(--pullquote--line-height);
}
.wp-block-pullquote a {
color: currentColor;
}

2
wp-includes/version.php
View File

@ -16,7 +16,7 @@
*
* @global string $wp_version
*/
$wp_version = '6.5-beta1-57630';
$wp_version = '6.5-beta1-57631';
/**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.