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

Twenty Twenty-One: Sync the latest changes for 5.6 RC2. 

This will be the final sync from GitHub before placing that repository into read-only mode. All further changes should now flow entirely through Trac.

For a full list of changes since [49633], see 1d5a895...53acd9b.

Props poena, luminuu, kjellr, ryelle, allancole, melchoyce, felipeelia, aljullu, kebbet, chaton666, Clorith, mkaz, ingereck, paaljoachim.
See #51526.
Built from https://develop.svn.wordpress.org/trunk@49726


git-svn-id: http://core.svn.wordpress.org/trunk@49449 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
desrosj 2020-12-01 19:09:05 +00:00
parent 2c1bfb5baf
commit 5bd111eb76
46 changed files with 3583 additions and 6264 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

File diff suppressed because it is too large Load Diff

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

File diff suppressed because it is too large Load Diff

4
wp-content/themes/twentytwentyone/assets/css/style-dark-mode-rtl.css
View File

@ -13,8 +13,8 @@
--global--color-border: #9ea1a7; --global--color-border: #9ea1a7;
} }
.is-dark-theme.is-dark-theme .site a:focus, .is-dark-theme.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
.is-dark-theme.is-dark-theme .site a:focus .meta-nav { .is-dark-theme.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
background: #000; background: #000;
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;

4
wp-content/themes/twentytwentyone/assets/css/style-dark-mode.css
View File

@ -13,8 +13,8 @@
--global--color-border: #9ea1a7; --global--color-border: #9ea1a7;
} }
.is-dark-theme.is-dark-theme .site a:focus, .is-dark-theme.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
.is-dark-theme.is-dark-theme .site a:focus .meta-nav { .is-dark-theme.is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
background: #000; background: #000;
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;

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

@ -374,6 +374,8 @@ blockquote:before {
content: "“"; content: "“";
font-size: var(--quote--font-size); font-size: var(--quote--font-size);
line-height: var(--quote--line-height); line-height: var(--quote--line-height);
position: absolute;
left: calc(-0.5 * var(--global--spacing-horizontal));
} }
blockquote .wp-block-quote__citation, blockquote .wp-block-quote__citation,
@ -416,7 +418,8 @@ video {
/* Media captions */ /* Media captions */
figcaption, figcaption,
.wp-caption, .wp-caption,
.wp-caption-text { .wp-caption-text,
.wp-block-embed figcaption {
color: currentColor; color: currentColor;
font-size: var(--global--font-size-xs); font-size: var(--global--font-size-xs);
line-height: var(--global--line-height-body); line-height: var(--global--line-height-body);
@ -430,7 +433,9 @@ figcaption,
.alignleft .wp-caption, .alignleft .wp-caption,
.alignright .wp-caption, .alignright .wp-caption,
.alignleft .wp-caption-text, .alignleft .wp-caption-text,
.alignright .wp-caption-text { .alignright .wp-caption-text,
.alignleft .wp-block-embed figcaption,
.alignright .wp-block-embed figcaption {
margin-bottom: 0; margin-bottom: 0;
} }
@ -474,45 +479,47 @@ a:hover {
text-decoration-skip-ink: none; text-decoration-skip-ink: none;
} }
.site a:focus { .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
/* Only visible in Windows High Contrast mode */ /* Only visible in Windows High Contrast mode */
outline: 2px solid transparent; outline: 2px solid transparent;
text-decoration: underline 1px dotted currentColor;
text-decoration-skip-ink: none;
background: rgba(255, 255, 255, 0.9); background: rgba(255, 255, 255, 0.9);
} }
.is-dark-theme .site a:focus, .is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
.is-dark-theme .site a:focus .meta-nav { .is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
color: var(--wp--style--color--link, var(--global--color-background)); color: var(--wp--style--color--link, var(--global--color-background));
} }
.has-background-white .site a:focus { .has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
background: rgba(0, 0, 0, 0.9); background: rgba(0, 0, 0, 0.9);
color: var(--wp--style--color--link, var(--global--color-white)); color: var(--wp--style--color--link, var(--global--color-white));
} }
.has-background-white .site a:focus .meta-nav { .has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
color: var(--wp--style--color--link, var(--global--color-white)); color: var(--wp--style--color--link, var(--global--color-white));
} }
.site a:focus.skip-link { .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link {
/* Only visible in Windows High Contrast mode */ /* Only visible in Windows High Contrast mode */
outline: 2px solid transparent; outline: 2px solid transparent;
outline-offset: -2px; outline-offset: -2px;
} }
.site a:focus.skip-link:focus { .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link:focus {
color: #21759b; color: #21759b;
background-color: #f1f1f1; background-color: #f1f1f1;
} }
.site a:focus img { .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) img {
outline: 2px dotted var(--wp--style--color--link, var(--global--color-primary)); outline: 2px dotted var(--wp--style--color--link, var(--global--color-primary));
} }
.has-background:not(.has-background-background-color) .has-link-color a, .has-background .has-link-color a,
.has-background:not(.has-background-background-color).has-link-color a { .has-background.has-link-color a {
color: var(--wp--style--color--link, var(--global--color-primary)); color: var(--wp--style--color--link, var(--global--color-primary));
} }
@ -530,22 +537,6 @@ a:hover {
padding: var(--button--padding-vertical) var(--button--padding-horizontal); padding: var(--button--padding-vertical) var(--button--padding-horizontal);
} }
.wp-block-button__link:before,
.wp-block-button__link:after {
content: "";
display: block;
height: 0;
width: 0;
}
.wp-block-button__link:before {
margin-bottom: -calc(.5em * var(--button--line-height) + -.38);
}
.wp-block-button__link:after {
margin-top: -calc(.5em * var(--button--line-height) + -.39);
}
.wp-block-button__link:focus { .wp-block-button__link:focus {
background: transparent; background: transparent;
outline-offset: -6px; outline-offset: -6px;
@ -690,6 +681,23 @@ a:hover {
margin-bottom: 0; margin-bottom: 0;
} }
.wp-block-cover > .wp-block-cover__inner-container > *:first-child,
.wp-block-cover-image > .wp-block-cover__inner-container > *:first-child {
margin-top: 0;
}
.wp-block-cover > .wp-block-cover__inner-container > *:last-child:not(.block-list-appender),
.wp-block-cover-image > .wp-block-cover__inner-container > *:last-child:not(.block-list-appender) {
margin-bottom: 0;
}
.wp-block-cover.has-child-selected > .wp-block-cover__inner-container > *:nth-last-child(2),
.wp-block-cover.is-selected > .wp-block-cover__inner-container > *:nth-last-child(2),
.wp-block-cover-image.has-child-selected > .wp-block-cover__inner-container > *:nth-last-child(2),
.wp-block-cover-image.is-selected > .wp-block-cover__inner-container > *:nth-last-child(2) {
margin-bottom: 0;
}
.wp-block-cover .wp-block-cover__inner-container, .wp-block-cover .wp-block-cover__inner-container,
.wp-block-cover .wp-block-cover-image-text, .wp-block-cover .wp-block-cover-image-text,
.wp-block-cover .wp-block-cover-text, .wp-block-cover .wp-block-cover-text,
@ -772,6 +780,19 @@ a:hover {
.wp-block-columns .wp-block-column { .wp-block-columns .wp-block-column {
max-width: inherit; max-width: inherit;
} }
.wp-block-columns > .wp-block-column > *:first-child {
margin-top: 0;
}
.wp-block-columns > .wp-block-column > *:last-child:not(.block-list-appender) {
margin-bottom: 0;
}
.wp-block-columns.has-child-selected > .wp-block-column > *:nth-last-child(2),
.wp-block-columns.is-selected > .wp-block-column > *:nth-last-child(2) {
margin-bottom: 0;
}
@media only screen and (min-width: 652px) { @media only screen and (min-width: 652px) {
.wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) { .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) {
@ -804,13 +825,13 @@ a:hover {
} }
} }
.wp-block[data-align=full] .wp-block-columns p:not(.has-background), .wp-block[data-align=full] > .wp-block-columns p:not(.has-background),
.wp-block[data-align=full] .wp-block-columns h1:not(.has-background), .wp-block[data-align=full] > .wp-block-columns h1:not(.has-background),
.wp-block[data-align=full] .wp-block-columns h2:not(.has-background), .wp-block[data-align=full] > .wp-block-columns h2:not(.has-background),
.wp-block[data-align=full] .wp-block-columns h3:not(.has-background), .wp-block[data-align=full] > .wp-block-columns h3:not(.has-background),
.wp-block[data-align=full] .wp-block-columns h4:not(.has-background), .wp-block[data-align=full] > .wp-block-columns h4:not(.has-background),
.wp-block[data-align=full] .wp-block-columns h5:not(.has-background), .wp-block[data-align=full] > .wp-block-columns h5:not(.has-background),
.wp-block[data-align=full] .wp-block-columns h6:not(.has-background) { .wp-block[data-align=full] > .wp-block-columns h6:not(.has-background) {
padding-left: var(--global--spacing-unit); padding-left: var(--global--spacing-unit);
padding-right: var(--global--spacing-unit); padding-right: var(--global--spacing-unit);
} }
@ -841,22 +862,6 @@ a:hover {
display: inline-block; display: inline-block;
} }
.wp-block-file .wp-block-file__button:before,
.wp-block-file .wp-block-file__button:after {
content: "";
display: block;
height: 0;
width: 0;
}
.wp-block-file .wp-block-file__button:before {
margin-bottom: -calc(.5em * var(--button--line-height) + -.38);
}
.wp-block-file .wp-block-file__button:after {
margin-top: -calc(.5em * var(--button--line-height) + -.39);
}
.wp-block-file .wp-block-file__button:focus { .wp-block-file .wp-block-file__button:focus {
background: transparent; background: transparent;
outline-offset: -6px; outline-offset: -6px;
@ -923,7 +928,16 @@ a:hover {
margin-left: calc(-1 * var(--global--spacing-vertical)); margin-left: calc(-1 * var(--global--spacing-vertical));
} }
.wp-block-group .wp-block-group__inner-container > *:last-child { .wp-block-group > .wp-block-group__inner-container > *:first-child {
margin-top: 0;
}
.wp-block-group > .wp-block-group__inner-container > *:last-child:not(.block-list-appender) {
margin-bottom: 0;
}
.wp-block-group.has-child-selected > .wp-block-group__inner-container > *:nth-last-child(2),
.wp-block-group.is-selected > .wp-block-group__inner-container > *:nth-last-child(2) {
margin-bottom: 0; margin-bottom: 0;
} }
@ -1304,18 +1318,23 @@ dt {
margin-bottom: 0; margin-bottom: 0;
} }
.wp-block-media-text .wp-block-media-text__content { .wp-block-media-text > .wp-block-media-text__content > *:first-child {
padding: var(--global--spacing-horizontal);
}
.wp-block-media-text .wp-block-media-text__content [data-block]:first-child {
margin-top: 0; margin-top: 0;
} }
.wp-block-media-text .wp-block-media-text__content [data-block]:last-child { .wp-block-media-text > .wp-block-media-text__content > *:last-child:not(.block-list-appender) {
margin-bottom: 0; margin-bottom: 0;
} }
.wp-block-media-text.has-child-selected > .wp-block-media-text__content > *:nth-last-child(2),
.wp-block-media-text.is-selected > .wp-block-media-text__content > *:nth-last-child(2) {
margin-bottom: 0;
}
.wp-block-media-text .wp-block-media-text__content {
padding: var(--global--spacing-horizontal);
}
.wp-block-media-text.is-style-twentytwentyone-border { .wp-block-media-text.is-style-twentytwentyone-border {
border: calc(3 * var(--separator--height)) solid var(--global--color-border); border: calc(3 * var(--separator--height)) solid var(--global--color-border);
} }
@ -1377,6 +1396,8 @@ pre.wp-block-preformatted {
color: currentColor; color: currentColor;
content: "“"; content: "“";
display: block; display: block;
position: relative;
left: 0;
font-size: 3rem; font-size: 3rem;
font-weight: 500; font-weight: 500;
line-height: 1; line-height: 1;
@ -1453,6 +1474,11 @@ pre.wp-block-preformatted {
padding: 0 calc(2 * var(--global--spacing-unit)); padding: 0 calc(2 * var(--global--spacing-unit));
} }
.wp-block[data-align=left] .wp-block-pullquote.is-style-solid-color,
.wp-block[data-align=right] .wp-block-pullquote.is-style-solid-color {
padding: var(--global--spacing-unit);
}
.wp-block-quote { .wp-block-quote {
position: relative; position: relative;
border-left: none; border-left: none;
@ -1475,7 +1501,6 @@ pre.wp-block-preformatted {
content: "“"; content: "“";
font-size: var(--quote--font-size); font-size: var(--quote--font-size);
line-height: var(--quote--line-height); line-height: var(--quote--line-height);
position: absolute;
left: calc(-0.5 * var(--global--spacing-horizontal)); left: calc(-0.5 * var(--global--spacing-horizontal));
} }
@ -1485,9 +1510,9 @@ pre.wp-block-preformatted {
font-style: var(--quote--font-style-cite); font-style: var(--quote--font-style-cite);
} }
.has-background:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation, .has-background .wp-block-quote .wp-block-quote__citation,
[class*=background-color]:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation, [class*=background-color] .wp-block-quote .wp-block-quote__citation,
[style*=background-color]:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation, [style*=background-color] .wp-block-quote .wp-block-quote__citation,
.wp-block-cover[style*=background-image] .wp-block-quote .wp-block-quote__citation { .wp-block-cover[style*=background-image] .wp-block-quote .wp-block-quote__citation {
color: currentColor; color: currentColor;
} }
@ -1499,9 +1524,15 @@ pre.wp-block-preformatted {
} }
.wp-block-quote.has-text-align-right:before { .wp-block-quote.has-text-align-right:before {
display: none;
}
.wp-block-quote.has-text-align-right p:before {
content: "”"; content: "”";
left: initial; font-size: var(--quote--font-size);
right: calc(-0.5 * var(--global--spacing-horizontal)); font-weight: normal;
line-height: var(--quote--line-height);
margin-right: 5px;
} }
.wp-block-quote.has-text-align-center { .wp-block-quote.has-text-align-center {
@ -1537,8 +1568,16 @@ pre.wp-block-preformatted {
.wp-block-quote.is-large.has-text-align-right:before, .wp-block-quote.is-large.has-text-align-right:before,
.wp-block-quote.is-style-large.has-text-align-right:before { .wp-block-quote.is-style-large.has-text-align-right:before {
left: initial; display: none;
right: calc(-1 * var(--global--spacing-horizontal)); }
.wp-block-quote.is-large.has-text-align-right p:before,
.wp-block-quote.is-style-large.has-text-align-right p:before {
content: "”";
font-size: var(--quote--font-size-large);
font-weight: normal;
line-height: var(--quote--line-height-large);
margin-right: 10px;
} }
@media only screen and (max-width: 481px) { @media only screen and (max-width: 481px) {
@ -1757,22 +1796,6 @@ pre.wp-block-preformatted {
color: var(--button--color-text-hover); color: var(--button--color-text-hover);
} }
.wp-block-search .wp-block-search__button:before,
.wp-block-search .wp-block-search__button:after {
content: "";
display: block;
height: 0;
width: 0;
}
.wp-block-search .wp-block-search__button:before {
margin-bottom: -calc(.5em * var(--button--line-height) + -.38);
}
.wp-block-search .wp-block-search__button:after {
margin-top: -calc(.5em * var(--button--line-height) + -.39);
}
.wp-block-search .wp-block-search__button:focus { .wp-block-search .wp-block-search__button:focus {
background: transparent; background: transparent;
outline-offset: -6px; outline-offset: -6px;
@ -1983,13 +2006,13 @@ hr.is-style-dots:before {
color: var(--separator--border-color); color: var(--separator--border-color);
} }
.has-background:not(.has-background-background-color) .wp-block-separator, .has-background .wp-block-separator,
[class*=background-color]:not(.has-background-background-color) .wp-block-separator, [class*=background-color] .wp-block-separator,
[style*=background-color]:not(.has-background-background-color) .wp-block-separator, [style*=background-color] .wp-block-separator,
.wp-block-cover[style*=background-image] .wp-block-separator, .wp-block-cover[style*=background-image] .wp-block-separator,
.has-background:not(.has-background-background-color) hr, .has-background hr,
[class*=background-color]:not(.has-background-background-color) hr, [class*=background-color] hr,
[style*=background-color]:not(.has-background-background-color) hr, [style*=background-color] hr,
.wp-block-cover[style*=background-image] hr { .wp-block-cover[style*=background-image] hr {
border-color: currentColor; border-color: currentColor;
} }
@ -2178,7 +2201,7 @@ pre.wp-block-verse {
color: var(--global--color-secondary); color: var(--global--color-secondary);
} }
.has-background:not(.has-background-background-color) a:not(.wp-block-button__link), .has-background a,
.has-background p, .has-background p,
.has-background h1, .has-background h1,
.has-background h2, .has-background h2,
@ -2209,23 +2232,11 @@ pre.wp-block-verse {
color: var(--global--color-primary); color: var(--global--color-primary);
} }
/**
* Spacing Overrides
*/
[data-block] { [data-block] {
margin-top: var(--global--spacing-vertical); margin-top: var(--global--spacing-vertical);
margin-bottom: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical);
} }
[data-block] [data-block]:first-child {
margin-top: 0;
}
[data-block] [data-block]:nth-last-child(2) {
margin-bottom: 0;
}
/* Block Alignments */
.wp-block { .wp-block {
max-width: var(--responsive--aligndefault-width); max-width: var(--responsive--aligndefault-width);
} }
@ -2274,6 +2285,14 @@ pre.wp-block-verse {
} }
} }
.wp-block-freeform.block-library-rich-text__tinymce blockquote {
border: none;
}
.wp-block-freeform.block-library-rich-text__tinymce blockquote:before {
left: 5px;
}
html { html {
font-family: var(--global--font-secondary); font-family: var(--global--font-secondary);
line-height: var(--global--line-height-body); line-height: var(--global--line-height-body);
@ -2303,8 +2322,8 @@ body {
text-decoration: none; text-decoration: none;
} }
.has-background:not(.has-background-background-color) .has-link-color a, .has-background .has-link-color a,
.has-background:not(.has-background-background-color).has-link-color a { .has-background.has-link-color a {
color: var(--wp--style--color--link, var(--global--color-primary)); color: var(--wp--style--color--link, var(--global--color-primary));
} }
@ -2353,7 +2372,7 @@ a {
color: var(--global--color-white); color: var(--global--color-white);
} }
.has-background:not(.has-background-background-color) a:not(.wp-block-button__link), .has-background a,
.has-background p, .has-background p,
.has-background h1, .has-background h1,
.has-background h2, .has-background h2,

6
wp-content/themes/twentytwentyone/assets/js/customize-preview.js
View File

@ -15,17 +15,21 @@
if ( isDark ) { if ( isDark ) {
document.body.classList.add( 'is-dark-theme' ); document.body.classList.add( 'is-dark-theme' );
document.documentElement.classList.add( 'is-dark-theme' ); document.documentElement.classList.add( 'is-dark-theme' );
document.body.classList.remove( 'is-light-theme' );
document.documentElement.classList.remove( 'is-light-theme' );
document.documentElement.classList.remove( 'respect-color-scheme-preference' ); document.documentElement.classList.remove( 'respect-color-scheme-preference' );
} else { } else {
document.body.classList.remove( 'is-dark-theme' ); document.body.classList.remove( 'is-dark-theme' );
document.documentElement.classList.remove( 'is-dark-theme' ); document.documentElement.classList.remove( 'is-dark-theme' );
document.body.classList.add( 'is-light-theme' );
document.documentElement.classList.add( 'is-light-theme' );
if ( wp.customize( 'respect_user_color_preference' ).get() ) { if ( wp.customize( 'respect_user_color_preference' ).get() ) {
document.documentElement.classList.add( 'respect-color-scheme-preference' ); document.documentElement.classList.add( 'respect-color-scheme-preference' );
} }
} }
// Toggle the white background class. // Toggle the white background class.
if ( '#ffffff' === to.toLowerCase() ) { if ( 225 <= lum ) {
document.body.classList.add( 'has-background-white' ); document.body.classList.add( 'has-background-white' );
} else { } else {
document.body.classList.remove( 'has-background-white' ); document.body.classList.remove( 'has-background-white' );

15
wp-content/themes/twentytwentyone/assets/js/primary-navigation.js
View File

@ -41,9 +41,18 @@ function twentytwentyoneCollapseMenuOnClickOutside( event ) {
*/ */
function twentytwentyoneSubmenuPosition( li ) { function twentytwentyoneSubmenuPosition( li ) {
var subMenu = li.querySelector( 'ul.sub-menu' ), var subMenu = li.querySelector( 'ul.sub-menu' ),
rect = subMenu.getBoundingClientRect(), rect,
right = Math.round( rect.right ), right,
left = Math.round( rect.left ), left,
windowWidth;
if ( ! subMenu ) {
return;
}
rect = subMenu.getBoundingClientRect();
right = Math.round( rect.right );
left = Math.round( rect.left );
windowWidth = Math.round( window.innerWidth ); windowWidth = Math.round( window.innerWidth );
if ( right > windowWidth ) { if ( right > windowWidth ) {

42
wp-content/themes/twentytwentyone/assets/sass/02-tools/extends.scss
View File

@ -1,42 +0,0 @@
/* Button extends */
// Button Placeholder style
// - Since buttons appear in various blocks,
// let’s use a placeholder to keep them all
// in-sync
%button-style {
@include crop-text(var(--button--line-height));
color: var(--button--color-text);
cursor: pointer;
font-weight: var(--button--font-weight);
font-family: var(--button--font-family);
font-size: var(--button--font-size);
background-color: var(--button--color-background);
border-radius: var(--button--border-radius);
border: var(--button--border-width) solid var(--button--color-background);
text-decoration: none;
padding: var(--button--padding-vertical) var(--button--padding-horizontal);
&:active {
color: var(--button--color-text-active);
background-color: var(--button--color-background-active);
}
&:hover {
color: var(--button--color-text-hover);
background: transparent;
}
&:focus,
&.has-focus {
outline-offset: -6px;
outline: 2px dotted currentColor;
}
&:disabled {
background-color: var(--global--color-white-50);
border-color: var(--global--color-white-50);
color: var(--button--color-text-active);
}
}

46
wp-content/themes/twentytwentyone/assets/sass/02-tools/mixins.scss
View File

@ -17,35 +17,10 @@
} }
} }
// Crop Text Boundry
// - Sets a fixed-width on content within alignwide and alignfull blocks
@mixin crop-text($inset-line-height: 1) {
line-height: $inset-line-height;
$offset-top: calc(.5em * #{$inset-line-height} + -.38);
$offset-bottom: calc(.5em * #{$inset-line-height} + -.39);
&:before,
&:after {
content: "";
display: block;
height: 0;
width: 0;
}
&:before {
margin-bottom: -($offset-top);
}
&:after {
margin-top: -($offset-bottom);
}
}
// Button style // Button style
// - Applies button styles to blocks and elements that share them. // - Applies button styles to blocks and elements that share them.
@mixin button-style() { @mixin button-style() {
@include crop-text(var(--button--line-height)); line-height: var(--button--line-height);
color: var(--button--color-text); color: var(--button--color-text);
cursor: pointer; cursor: pointer;
font-weight: var(--button--font-weight); font-weight: var(--button--font-weight);
@ -77,3 +52,22 @@
color: var(--button--color-text-active); color: var(--button--color-text-active);
} }
} }
@mixin innerblock-margin-clear($container) {
// Clear the top margin for the first-child.
> #{$container} > *:first-child {
margin-top: 0;
}
// Last child that is not the appender.
> #{$container} > *:last-child:not(.block-list-appender) {
margin-bottom: 0;
}
// When selected, the last item becomes the second last because of the appender.
&.has-child-selected > #{$container} > *:nth-last-child(2),
&.is-selected > #{$container} > *:nth-last-child(2) {
margin-bottom: 0;
}
}

2
wp-content/themes/twentytwentyone/assets/sass/04-elements/blockquote.scss
View File

@ -59,6 +59,8 @@ blockquote {
content: "\201C"; content: "\201C";
font-size: var(--quote--font-size); font-size: var(--quote--font-size);
line-height: var(--quote--line-height); line-height: var(--quote--line-height);
position: absolute;
left: calc(-0.5 * var(--global--spacing-horizontal));
} }
.wp-block-quote__citation, .wp-block-quote__citation,

14
wp-content/themes/twentytwentyone/assets/sass/04-elements/forms.scss
View File

@ -34,7 +34,6 @@ input[type="color"],
.is-dark-theme & { .is-dark-theme & {
background: var(--global--color-white-90); background: var(--global--color-white-90);
} }
} }
// Reset the negative offset from normalize to make the thicker "border" work on focus. // Reset the negative offset from normalize to make the thicker "border" work on focus.
@ -216,8 +215,8 @@ input[type="radio"] + label {
input[type="range"]::-webkit-slider-thumb { input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none; -webkit-appearance: none;
border: 3px solid var(--form--color-ranged); border: 3px solid var(--form--color-ranged);
height: 25px; height: 44px;
width: 25px; width: 44px;
border-radius: 50%; border-radius: 50%;
background: var(--global--color-background); background: var(--global--color-background);
cursor: pointer; cursor: pointer;
@ -225,11 +224,12 @@ input[type="radio"] + label {
input[type="range"]::-moz-range-thumb { input[type="range"]::-moz-range-thumb {
border: 3px solid var(--form--color-ranged); border: 3px solid var(--form--color-ranged);
height: 25px; height: 44px;
width: 25px; width: 44px;
border-radius: 50%; border-radius: 50%;
background: var(--global--color-background); background: var(--global--color-background);
cursor: pointer; cursor: pointer;
box-sizing: border-box;
} }
} }
@ -256,8 +256,8 @@ input[type="range"]::-ms-fill-lower {
input[type="range"]::-ms-thumb { input[type="range"]::-ms-thumb {
border: 3px solid var(--form--color-ranged); border: 3px solid var(--form--color-ranged);
height: 25px; height: 44px;
width: 25px; width: 44px;
border-radius: 50%; border-radius: 50%;
background: var(--global--color-background); background: var(--global--color-background);
cursor: pointer; cursor: pointer;

6
wp-content/themes/twentytwentyone/assets/sass/04-elements/links.scss
View File

@ -15,11 +15,13 @@ a:hover {
text-decoration-skip-ink: none; text-decoration-skip-ink: none;
} }
.site a:focus { .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
/* Only visible in Windows High Contrast mode */ /* Only visible in Windows High Contrast mode */
outline: 2px solid transparent; outline: 2px solid transparent;
text-decoration: underline 1px dotted currentColor;
text-decoration-skip-ink: none;
background: rgba(255, 255, 255, .9); background: rgba(255, 255, 255, .9);
// Change text color when the body background is dark. // Change text color when the body background is dark.
@ -57,7 +59,7 @@ a:hover {
// Enforce the custom link color even if a custom background color has been set. // Enforce the custom link color even if a custom background color has been set.
// The extra specificity here is required to override the background color styles. // The extra specificity here is required to override the background color styles.
.has-background:not(.has-background-background-color) { .has-background {
// Target both current level and nested block. // Target both current level and nested block.
.has-link-color a, .has-link-color a,
&.has-link-color a { &.has-link-color a {

4
wp-content/themes/twentytwentyone/assets/sass/04-elements/media.scss
View File

@ -17,11 +17,11 @@ video {
max-width: 100%; max-width: 100%;
} }
/* Media captions */ /* Media captions */
figcaption, figcaption,
.wp-caption, .wp-caption,
.wp-caption-text { .wp-caption-text,
.wp-block-embed figcaption {
color: currentColor; color: currentColor;
font-size: var(--global--font-size-xs); font-size: var(--global--font-size-xs);
line-height: var(--global--line-height-body); line-height: var(--global--line-height-body);

4
wp-content/themes/twentytwentyone/assets/sass/05-blocks/columns/_editor.scss
View File

@ -10,6 +10,8 @@
max-width: inherit; max-width: inherit;
} }
@include innerblock-margin-clear(".wp-block-column");
&.is-style-twentytwentyone-columns-overlap { &.is-style-twentytwentyone-columns-overlap {
@include media(laptop) { @include media(laptop) {
@ -50,7 +52,7 @@
} }
} }
.wp-block[data-align="full"] & { .wp-block[data-align="full"] > & {
p:not(.has-background), p:not(.has-background),
h1:not(.has-background), h1:not(.has-background),

2
wp-content/themes/twentytwentyone/assets/sass/05-blocks/cover/_editor.scss
View File

@ -15,6 +15,8 @@
margin-bottom: 0; margin-bottom: 0;
} }
@include innerblock-margin-clear(".wp-block-cover__inner-container");
.wp-block-cover__inner-container, .wp-block-cover__inner-container,
.wp-block-cover-image-text, .wp-block-cover-image-text,
.wp-block-cover-text, .wp-block-cover-text,

4
wp-content/themes/twentytwentyone/assets/sass/05-blocks/cover/_style.scss
View File

@ -18,11 +18,11 @@
.wp-block-cover__inner-container, .wp-block-cover__inner-container,
.wp-block-cover-image-text, .wp-block-cover-image-text,
.wp-block-cover-text { .wp-block-cover-text {
color: currentColor; // uses text color specified with background-color options in /blocks/utilities/_style.scss color: currentColor; // Uses text color specified with background-color options in 07-utilities\color-palette.scss
margin-top: var(--global--spacing-vertical); margin-top: var(--global--spacing-vertical);
margin-bottom: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical);
a { a:not(.wp-block-button__link):not(.wp-block-file__button) {
color: currentColor; color: currentColor;
} }

4
wp-content/themes/twentytwentyone/assets/sass/05-blocks/group/_editor.scss
View File

@ -36,9 +36,7 @@
} }
} }
.wp-block-group__inner-container > *:last-child { @include innerblock-margin-clear(".wp-block-group__inner-container");
margin-bottom: 0;
}
} }
.wp-block-group .wp-block-group.has-background > .block-editor-block-list__layout > [data-align="full"] { .wp-block-group .wp-block-group.has-background > .block-editor-block-list__layout > [data-align="full"] {

10
wp-content/themes/twentytwentyone/assets/sass/05-blocks/media-text/_editor.scss
View File

@ -5,16 +5,10 @@
margin-bottom: 0; margin-bottom: 0;
} }
@include innerblock-margin-clear(".wp-block-media-text__content");
.wp-block-media-text__content { .wp-block-media-text__content {
padding: var(--global--spacing-horizontal); padding: var(--global--spacing-horizontal);
[data-block]:first-child {
margin-top: 0;
}
[data-block]:last-child {
margin-bottom: 0;
}
} }
// Block Styles // Block Styles

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

@ -12,6 +12,8 @@
color: currentColor; color: currentColor;
content: "\201C"; content: "\201C";
display: block; display: block;
position: relative; // Override the absolute position.
left: 0;
font-size: 3rem; font-size: 3rem;
font-weight: 500; font-weight: 500;
line-height: 1; line-height: 1;
@ -94,3 +96,11 @@
} }
} }
} }
.wp-block[data-align="left"],
.wp-block[data-align="right"] {
.wp-block-pullquote.is-style-solid-color {
padding: var(--global--spacing-unit);
}
}

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

@ -4,12 +4,16 @@
border-width: var(--pullquote--border-width); border-width: var(--pullquote--border-width);
border-bottom-style: solid; border-bottom-style: solid;
border-top-style: solid; border-top-style: solid;
color: currentColor;
border-color: currentColor;
position: relative; position: relative;
blockquote::before { blockquote::before {
color: currentColor; color: currentColor;
content: "\201C"; content: "\201C";
display: block; display: block;
position: relative; // Override the absolute position.
left: 0;
font-size: 3rem; font-size: 3rem;
font-weight: 500; font-weight: 500;
line-height: 1; line-height: 1;
@ -46,7 +50,7 @@
background: none; background: none;
} }
&.alignleft { &.alignleft:not(.is-style-solid-color) {
blockquote:before, blockquote:before,
cite { cite {
@ -57,7 +61,6 @@
&.alignwide > p, &.alignwide > p,
&.alignwide blockquote { &.alignwide blockquote {
max-width: var(--responsive--alignwide-width); max-width: var(--responsive--alignwide-width);
} }
&.alignfull:not(.is-style-solid-color) > p, &.alignfull:not(.is-style-solid-color) > p,
@ -81,6 +84,7 @@
} }
blockquote { blockquote {
margin: 0;
max-width: inherit; max-width: inherit;
p { p {
@ -93,5 +97,14 @@
footer { footer {
color: currentColor; color: currentColor;
} }
&.alignleft,
&.alignright {
padding: var(--global--spacing-unit);
blockquote {
max-width: initial;
}
}
} }
} }

32
wp-content/themes/twentytwentyone/assets/sass/05-blocks/quote/_editor.scss
View File

@ -19,7 +19,6 @@
content: "\201C"; content: "\201C";
font-size: var(--quote--font-size); font-size: var(--quote--font-size);
line-height: var(--quote--line-height); line-height: var(--quote--line-height);
position: absolute;
left: calc(-0.5 * var(--global--spacing-horizontal)); left: calc(-0.5 * var(--global--spacing-horizontal));
} }
@ -28,9 +27,9 @@
font-size: var(--global--font-size-xs); font-size: var(--global--font-size-xs);
font-style: var(--quote--font-style-cite); font-style: var(--quote--font-style-cite);
.has-background:not(.has-background-background-color) &, .has-background &,
[class*="background-color"]:not(.has-background-background-color) &, [class*="background-color"] &,
[style*="background-color"]:not(.has-background-background-color) &, [style*="background-color"] &,
.wp-block-cover[style*="background-image"] & { .wp-block-cover[style*="background-image"] & {
color: currentColor; color: currentColor;
} }
@ -41,10 +40,18 @@
padding-right: 0; padding-right: 0;
border-right: none; border-right: none;
// Hide the left aligned quote.
&:before { &:before {
display: none;
}
// Align the quote left of the text.
p:before {
content: "\201D"; content: "\201D";
left: initial; font-size: var(--quote--font-size);
right: calc(-0.5 * var(--global--spacing-horizontal)); font-weight: normal;
line-height: var(--quote--line-height);
margin-right: 5px;
} }
} }
@ -78,9 +85,18 @@
&.has-text-align-right { &.has-text-align-right {
// Hide the left aligned quote.
&:before { &:before {
left: initial; display: none;
right: calc(-1 * var(--global--spacing-horizontal)); }
// Align the quote left of the text.
p:before {
content: "\201D";
font-size: var(--quote--font-size-large);
font-weight: normal;
line-height: var(--quote--line-height-large);
margin-right: 10px;
} }
} }

37
wp-content/themes/twentytwentyone/assets/sass/05-blocks/quote/_style.scss
View File

@ -1,11 +1,19 @@
.wp-block-quote { .wp-block-quote {
border-left: none;
&:before {
content: "\201C";
font-size: var(--quote--font-size);
line-height: var(--quote--line-height);
left: 8px;
}
.wp-block-quote__citation, .wp-block-quote__citation,
cite, cite,
footer { footer {
.has-background:not(.has-background-background-color) &, .has-background &,
[class*="background-color"]:not(.has-background-background-color) &, [class*="background-color"] &,
[style*="background-color"] &, [style*="background-color"] &,
.wp-block-cover[style*="background-image"] & { .wp-block-cover[style*="background-image"] & {
color: currentColor; color: currentColor;
@ -20,10 +28,18 @@
padding-right: 0; padding-right: 0;
border-right: none; border-right: none;
// Hide the left aligned quote.
&:before { &:before {
display: none;
}
// Align the quote left of the text.
p:before {
content: "\201D"; content: "\201D";
left: initial; font-size: var(--quote--font-size);
right: calc(-0.5 * var(--global--spacing-horizontal)); font-weight: normal;
line-height: var(--quote--line-height);
margin-right: 5px;
} }
} }
@ -58,9 +74,18 @@
&.has-text-align-right { &.has-text-align-right {
// Hide the left aligned quote.
&:before { &:before {
left: initial; display: none;
right: calc(-1 * var(--global--spacing-horizontal)); }
// Align the quote left of the text.
p:before {
content: "\201D";
font-size: var(--quote--font-size-large);
font-weight: normal;
line-height: var(--quote--line-height-large);
margin-right: 10px;
} }
} }

30
wp-content/themes/twentytwentyone/assets/sass/05-blocks/search/_style.scss
View File

@ -1,13 +1,6 @@
.wp-block-search { .wp-block-search {
max-width: var(--responsive--aligndefault-width); max-width: var(--responsive--aligndefault-width);
&__button-inside {
.wp-block-search__inside-wrapper {
background-color: var(--global--color-white);
}
}
&__button-only.aligncenter { &__button-only.aligncenter {
.wp-block-search__inside-wrapper { .wp-block-search__inside-wrapper {
@ -35,8 +28,8 @@
border-color: var(--form--border-color); border-color: var(--form--border-color);
} }
.has-background:not(.has-background-background-color) &, .has-background &,
[class*="background-color"]:not(.has-background-background-color) &, [class*="background-color"] &,
[style*="background-color"] &, [style*="background-color"] &,
.wp-block-cover[style*="background-image"] & { .wp-block-cover[style*="background-image"] & {
border-color: currentColor; border-color: currentColor;
@ -113,6 +106,25 @@
&.wp-block-search__button-inside { &.wp-block-search__button-inside {
.wp-block-search__inside-wrapper {
background-color: var(--global--color-white);
border: var(--form--border-width) solid var(--form--border-color);
border-radius: var(--form--border-radius);
.wp-block-search__input {
margin-right: 0;
&:focus {
outline: 2px dotted var(--form--border-color);
outline-offset: -5px;
.is-dark-theme & {
outline-color: currentColor;
}
}
}
}
&.wp-block-search__text-button { &.wp-block-search__text-button {
button.wp-block-search__button { button.wp-block-search__button {

6
wp-content/themes/twentytwentyone/assets/sass/05-blocks/separator/_editor.scss
View File

@ -39,9 +39,9 @@ hr {
} }
} }
.has-background:not(.has-background-background-color) &, .has-background &,
[class*="background-color"]:not(.has-background-background-color) &, [class*="background-color"] &,
[style*="background-color"]:not(.has-background-background-color) &, [style*="background-color"] &,
.wp-block-cover[style*="background-image"] & { .wp-block-cover[style*="background-image"] & {
border-color: currentColor; border-color: currentColor;
} }

12
wp-content/themes/twentytwentyone/assets/sass/05-blocks/separator/_style.scss
View File

@ -7,9 +7,17 @@ hr {
&.wp-block-separator { &.wp-block-separator {
border-bottom: var(--separator--height) solid var(--separator--border-color); border-bottom: var(--separator--height) solid var(--separator--border-color);
opacity: 1;
&:not(.is-style-dots):not(.alignwide) { &:not(.is-style-dots):not(.alignwide) {
max-width: var(--responsive--aligndefault-width); max-width: var(--responsive--aligndefault-width);
}
&:not(.is-style-dots) {
&.alignwide {
max-width: var(--responsive--alignwide-width);
}
&.alignfull { &.alignfull {
max-width: var(--responsive--alignfull-width); max-width: var(--responsive--alignfull-width);
@ -42,8 +50,8 @@ hr {
} }
} }
.has-background:not(.has-background-background-color) &, .has-background &,
[class*="background-color"]:not(.has-background-background-color) &, [class*="background-color"] &,
[style*="background-color"] &, [style*="background-color"] &,
.wp-block-cover[style*="background-image"] & { .wp-block-cover[style*="background-image"] & {
border-color: currentColor; border-color: currentColor;

9
wp-content/themes/twentytwentyone/assets/sass/05-blocks/social-icons/_style.scss
View File

@ -1,4 +1,10 @@
.wp-block-social-links.is-style-twentytwentyone-social-icons-color { .wp-block-social-links {
a:focus {
color: var(--global--color-primary);
}
&.is-style-twentytwentyone-social-icons-color {
a { a {
color: var(--global--color-primary); color: var(--global--color-primary);
@ -9,3 +15,4 @@
} }
} }
}

29
wp-content/themes/twentytwentyone/assets/sass/05-blocks/utilities/_editor.scss
View File

@ -26,7 +26,6 @@
} }
// Gutenberg text color options // Gutenberg text color options
.has-primary-color[class] { .has-primary-color[class] {
color: var(--global--color-primary); color: var(--global--color-primary);
} }
@ -38,7 +37,7 @@
// Gutenberg background-color options // Gutenberg background-color options
.has-background { .has-background {
&:not(.has-background-background-color) a:not(.wp-block-button__link), a,
p, p,
h1, h1,
h2, h2,
@ -70,25 +69,13 @@
color: var(--global--color-primary); color: var(--global--color-primary);
} }
/** // Spacing Overrides
* Spacing Overrides
*/
[data-block] { [data-block] {
margin-top: var(--global--spacing-vertical); margin-top: var(--global--spacing-vertical);
margin-bottom: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical);
[data-block]:first-child {
margin-top: 0;
} }
// Needs to be the second-last child to avoid applying this to the appender. // Block Alignments
[data-block]:nth-last-child(2) {
margin-bottom: 0;
}
}
/* Block Alignments */
.wp-block { .wp-block {
// Gutenberg injects a rule that limits the max width of .wp-block to 580px // Gutenberg injects a rule that limits the max width of .wp-block to 580px
@ -141,3 +128,13 @@
margin-left: var(--global--spacing-horizontal); margin-left: var(--global--spacing-horizontal);
} }
} }
// Remove the border of blockquotes inside the classic block.
.wp-block-freeform.block-library-rich-text__tinymce blockquote {
border: none;
}
// Adjust the position of the quote symbol for blockquotes inside the classic block.
.wp-block-freeform.block-library-rich-text__tinymce blockquote:before {
left: 5px;
}

2
wp-content/themes/twentytwentyone/assets/sass/06-components/editor.scss
View File

@ -30,7 +30,7 @@ body {
// Enforce the custom link color even if a custom background color has been set. // Enforce the custom link color even if a custom background color has been set.
// The extra specificity here is required to override the background color styles. // The extra specificity here is required to override the background color styles.
.has-background:not(.has-background-background-color) { .has-background {
// Target both current level and nested block. // Target both current level and nested block.
.has-link-color a, .has-link-color a,
&.has-link-color a { &.has-link-color a {

8
wp-content/themes/twentytwentyone/assets/sass/06-components/footer-navigation.scss
View File

@ -45,6 +45,14 @@
fill: var(--wp--style--color--link, var(--global--color-background)); fill: var(--wp--style--color--link, var(--global--color-background));
} }
} }
// Change colors when the body background is white.
.has-background-white & {
.svg-icon {
fill: var(--wp--style--color--link, var(--global--color-white));
}
}
} }
} }

12
wp-content/themes/twentytwentyone/assets/sass/06-components/footer.scss
View File

@ -8,6 +8,13 @@
.no-widgets & { .no-widgets & {
margin-top: calc(6 * var(--global--spacing-vertical)); margin-top: calc(6 * var(--global--spacing-vertical));
} }
@include media(mobile-only) {
.no-widgets & {
margin-top: calc(3 * var(--global--spacing-vertical));
}
}
} }
// Footer Branding // Footer Branding
@ -57,6 +64,11 @@
.is-dark-theme & { .is-dark-theme & {
color: var(--wp--style--color--link, var(--global--color-background)); color: var(--wp--style--color--link, var(--global--color-background));
} }
// Change colors when the body background is white.
.has-background-white & {
color: var(--wp--style--color--link, var(--global--color-white));
}
} }
} }
} }

9
wp-content/themes/twentytwentyone/assets/sass/06-components/header.scss
View File

@ -79,6 +79,14 @@
a.custom-logo-link { a.custom-logo-link {
text-decoration: none; text-decoration: none;
&:focus {
// Change colors when the body background is white.
.has-background-white &,
.is-dark-theme & {
background: none;
}
}
} }
.site-title > a { .site-title > a {
@ -86,7 +94,6 @@ a.custom-logo-link {
} }
// Site logo // Site logo
.site-logo { .site-logo {
margin: calc(var(--global--spacing-vertical) / 2) 0; margin: calc(var(--global--spacing-vertical) / 2) 0;

3
wp-content/themes/twentytwentyone/assets/sass/06-components/navigation.scss
View File

@ -374,7 +374,7 @@
padding-right: var(--primary-nav--padding); padding-right: var(--primary-nav--padding);
+ .sub-menu-toggle { + .sub-menu-toggle {
margin-left: calc(0px - var(--primary-nav--padding)); margin-left: calc(5px - var(--primary-nav--padding));
} }
} }
} }
@ -416,6 +416,7 @@
position: relative; position: relative;
z-index: 99999; // Ensure focus styles appear above absolute positioned elements z-index: 99999; // Ensure focus styles appear above absolute positioned elements
outline-offset: 0; outline-offset: 0;
text-decoration-thickness: 2px;
} }
} }

34
wp-content/themes/twentytwentyone/assets/sass/06-components/pagination.scss
View File

@ -11,6 +11,7 @@
&:hover { &:hover {
color: var(--global--color-primary-hover); color: var(--global--color-primary-hover);
text-decoration: underline; text-decoration: underline;
text-decoration-style: dotted;
} }
&:focus { &:focus {
@ -123,17 +124,8 @@
&:last-child { &:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
&:hover {
.post-title {
text-decoration: underline;
text-decoration-thickness: 1px;
} }
} }
}
}
// Index/archive navigation // Index/archive navigation
.pagination, .pagination,
@ -157,6 +149,23 @@
color: var(--pagination--color-link-hover); color: var(--pagination--color-link-hover);
} }
.is-dark-theme & {
a:active,
a:hover:active,
a:hover:focus {
color: var(--global--color-background);
}
}
.has-background-white & {
a:active,
a:hover:active,
a:hover:focus {
color: var(--global--color-white);
}
}
} }
.nav-links > * { .nav-links > * {
@ -169,7 +178,11 @@
margin-right: calc(0.66 * var(--global--spacing-unit)); margin-right: calc(0.66 * var(--global--spacing-unit));
&.current { &.current {
border-bottom: 1px solid var(--pagination--color-text); text-decoration: underline;
}
&:not(.dots):not(.current):hover {
text-decoration-style: dotted;
} }
&:first-child { &:first-child {
@ -227,5 +240,4 @@
.nav-links > * { .nav-links > * {
font-size: var(--global--font-size-md); font-size: var(--global--font-size-md);
} }
} }

4
wp-content/themes/twentytwentyone/assets/sass/06-components/widgets.scss
View File

@ -16,6 +16,10 @@
grid-template-columns: repeat(3, 1fr); grid-template-columns: repeat(3, 1fr);
} }
@include media(mobile-only) {
margin-top: calc(3 * var(--global--spacing-vertical));
}
ul { ul {
list-style-type: none; list-style-type: none;
padding: 0; padding: 0;

2
wp-content/themes/twentytwentyone/assets/sass/07-utilities/color-palette.scss
View File

@ -43,7 +43,7 @@
// Gutenberg background-color options // Gutenberg background-color options
.has-background { .has-background {
&:not(.has-background-background-color) a:not(.wp-block-button__link), a,
p, p,
h1, h1,
h2, h2,

4
wp-content/themes/twentytwentyone/assets/sass/style-dark-mode.scss
View File

@ -12,8 +12,8 @@
--button--color-background-active: var(--global--color-background); --button--color-background-active: var(--global--color-background);
--global--color-border: #9ea1a7; --global--color-border: #9ea1a7;
.site a:focus, .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
.site a:focus .meta-nav { .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
background: #000; background: #000;
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;

6
wp-content/themes/twentytwentyone/classes/class-twenty-twenty-one-custom-colors.php
View File

@ -168,13 +168,15 @@ class Twenty_Twenty_One_Custom_Colors {
*/ */
public function body_class( $classes ) { public function body_class( $classes ) {
$background_color = get_theme_mod( 'background_color', 'D1E4DD' ); $background_color = get_theme_mod( 'background_color', 'D1E4DD' );
if ( 127 > self::get_relative_luminance_from_hex( $background_color ) ) { $luminance = self::get_relative_luminance_from_hex( $background_color );
if ( 127 > $luminance ) {
$classes[] = 'is-dark-theme'; $classes[] = 'is-dark-theme';
} else { } else {
$classes[] = 'is-light-theme'; $classes[] = 'is-light-theme';
} }
if ( 'ffffff' === strtolower( $background_color ) ) { if ( 225 <= $luminance ) {
$classes[] = 'has-background-white'; $classes[] = 'has-background-white';
} }

10
wp-content/themes/twentytwentyone/classes/class-twenty-twenty-one-dark-mode.php
View File

@ -65,7 +65,7 @@ class Twenty_Twenty_One_Dark_Mode {
// Add Dark Mode variable overrides. // Add Dark Mode variable overrides.
wp_add_inline_style( wp_add_inline_style(
'twenty-twenty-one-custom-color-overrides', 'twenty-twenty-one-custom-color-overrides',
'.is-dark-theme.is-dark-theme .editor-styles-wrapper { --global--color-background: var(--global--color-dark-gray); --global--color-primary: var(--global--color-light-gray); --global--color-secondary: var(--global--color-light-gray); }' '.is-dark-theme.is-dark-theme .editor-styles-wrapper { --global--color-background: var(--global--color-dark-gray); --global--color-primary: var(--global--color-light-gray); --global--color-secondary: var(--global--color-light-gray); --button--color-text: var(--global--color-background); --button--color-text-hover: var(--global--color-secondary); --button--color-text-active: var(--global--color-secondary); --button--color-background: var(--global--color-secondary); --button--color-background-active: var(--global--color-background); --global--color-border: #9ea1a7; }'
); );
} }
wp_enqueue_script( wp_enqueue_script(
@ -182,7 +182,13 @@ class Twenty_Twenty_One_Dark_Mode {
) )
); );
$description = '<p>' . __( 'Dark Mode is a device setting. If a visitor to your site requests it, your site will be shown with a dark background and light text. <a href="https://wordpress.org/support/article/twenty-twenty-one/">Learn more about Dark Mode.</a>', 'twentytwentyone' ) . '</p>'; $description = '<p>';
$description .= sprintf(
// translators: %s is the wordpress.org Twenty Twenty-One support article URL.
__( 'Dark Mode is a device setting. If a visitor to your site requests it, your site will be shown with a dark background and light text. <a href="%s">Learn more about Dark Mode.</a>', 'twentytwentyone' ),
__( 'https://wordpress.org/support/article/twenty-twenty-one/', 'twentytwentyone' )
);
$description .= '</p>';
$description .= '<p>' . __( 'Dark Mode can also be turned on and off with a button that you can find in the bottom right corner of the page.', 'twentytwentyone' ) . '</p>'; $description .= '<p>' . __( 'Dark Mode can also be turned on and off with a button that you can find in the bottom right corner of the page.', 'twentytwentyone' ) . '</p>';
$wp_customize->add_control( $wp_customize->add_control(

18
wp-content/themes/twentytwentyone/functions.php
View File

@ -272,42 +272,42 @@ if ( ! function_exists( 'twenty_twenty_one_setup' ) ) {
array( array(
array( array(
'name' => esc_html__( 'Purple to yellow', 'twentytwentyone' ), 'name' => esc_html__( 'Purple to yellow', 'twentytwentyone' ),
'gradient' => 'linear-gradient(160deg, ' . $purple . ', ' . $yellow . ')', 'gradient' => 'linear-gradient(160deg, ' . $purple . ' 0%, ' . $yellow . ' 100%)',
'slug' => 'purple-to-yellow', 'slug' => 'purple-to-yellow',
), ),
array( array(
'name' => esc_html__( 'Yellow to purple', 'twentytwentyone' ), 'name' => esc_html__( 'Yellow to purple', 'twentytwentyone' ),
'gradient' => 'linear-gradient(160deg, ' . $yellow . ', ' . $purple . ')', 'gradient' => 'linear-gradient(160deg, ' . $yellow . ' 0%, ' . $purple . ' 100%)',
'slug' => 'yellow-to-purple', 'slug' => 'yellow-to-purple',
), ),
array( array(
'name' => esc_html__( 'Green to yellow', 'twentytwentyone' ), 'name' => esc_html__( 'Green to yellow', 'twentytwentyone' ),
'gradient' => 'linear-gradient(160deg, ' . $green . ', ' . $yellow . ')', 'gradient' => 'linear-gradient(160deg, ' . $green . ' 0%, ' . $yellow . ' 100%)',
'slug' => 'green-to-yellow', 'slug' => 'green-to-yellow',
), ),
array( array(
'name' => esc_html__( 'Yellow to green', 'twentytwentyone' ), 'name' => esc_html__( 'Yellow to green', 'twentytwentyone' ),
'gradient' => 'linear-gradient(160deg, ' . $yellow . ', ' . $green . ')', 'gradient' => 'linear-gradient(160deg, ' . $yellow . ' 0%, ' . $green . ' 100%)',
'slug' => 'yellow-to-green', 'slug' => 'yellow-to-green',
), ),
array( array(
'name' => esc_html__( 'Red to yellow', 'twentytwentyone' ), 'name' => esc_html__( 'Red to yellow', 'twentytwentyone' ),
'gradient' => 'linear-gradient(160deg, ' . $red . ', ' . $yellow . ')', 'gradient' => 'linear-gradient(160deg, ' . $red . ' 0%, ' . $yellow . ' 100%)',
'slug' => 'red-to-yellow', 'slug' => 'red-to-yellow',
), ),
array( array(
'name' => esc_html__( 'Yellow to red', 'twentytwentyone' ), 'name' => esc_html__( 'Yellow to red', 'twentytwentyone' ),
'gradient' => 'linear-gradient(160deg, ' . $yellow . ', ' . $red . ')', 'gradient' => 'linear-gradient(160deg, ' . $yellow . ' 0%, ' . $red . ' 100%)',
'slug' => 'yellow-to-red', 'slug' => 'yellow-to-red',
), ),
array( array(
'name' => esc_html__( 'Purple to red', 'twentytwentyone' ), 'name' => esc_html__( 'Purple to red', 'twentytwentyone' ),
'gradient' => 'linear-gradient(160deg, ' . $purple . ', ' . $red . ')', 'gradient' => 'linear-gradient(160deg, ' . $purple . ' 0%, ' . $red . ' 100%)',
'slug' => 'purple-to-red', 'slug' => 'purple-to-red',
), ),
array( array(
'name' => esc_html__( 'Red to purple', 'twentytwentyone' ), 'name' => esc_html__( 'Red to purple', 'twentytwentyone' ),
'gradient' => 'linear-gradient(160deg, ' . $red . ', ' . $purple . ')', 'gradient' => 'linear-gradient(160deg, ' . $red . ' 0%, ' . $purple . ' 100%)',
'slug' => 'red-to-purple', 'slug' => 'red-to-purple',
), ),
) )
@ -333,7 +333,7 @@ if ( ! function_exists( 'twenty_twenty_one_setup' ) ) {
add_theme_support( 'experimental-link-color' ); add_theme_support( 'experimental-link-color' );
// Add support for experimental cover block spacing. // Add support for experimental cover block spacing.
add_theme_support( 'experimental-custom-spacing' ); add_theme_support( 'custom-spacing' );
// Add support for custom units. // Add support for custom units.
// This was removed in WordPress 5.6 but is still required to properly support WP 5.5. // This was removed in WordPress 5.6 but is still required to properly support WP 5.5.

2
wp-content/themes/twentytwentyone/inc/block-patterns.php
View File

@ -114,7 +114,7 @@ if ( function_exists( 'register_block_pattern' ) ) {
'title' => esc_html__( 'Contact information', 'twentytwentyone' ), 'title' => esc_html__( 'Contact information', 'twentytwentyone' ),
'categories' => array( 'twentytwentyone' ), 'categories' => array( 'twentytwentyone' ),
'description' => esc_html_x( 'A block with 3 columns that display contact information and social media links.', 'Block pattern description', 'twentytwentyone' ), 'description' => esc_html_x( 'A block with 3 columns that display contact information and social media links.', 'Block pattern description', 'twentytwentyone' ),
'content' => '<!-- wp:columns {"align":"wide"} --><div class="wp-block-columns alignwide"><!-- wp:column --><div class="wp-block-column"><!-- wp:paragraph --><p><a href="mailto:#">' . esc_html_x( 'example@example.com', 'Block pattern sample content', 'twentytwentyone' ) . '<br></a>' . esc_html_x( '123-456-7890', 'Block pattern sample content', 'twentytwentyone' ) . '</p><!-- /wp:paragraph --></div><!-- /wp:column --><!-- wp:column --><div class="wp-block-column"><!-- wp:paragraph {"align":"center"} --><p class="has-text-align-center">' . esc_html_x( '123 Main Street', 'Block pattern sample content', 'twentytwentyone' ) . '<br>' . esc_html_x( 'Cambridge, MA, 02139', 'Block pattern sample content', 'twentytwentyone' ) . '</p><!-- /wp:paragraph --></div><!-- /wp:column --><!-- wp:column {"verticalAlignment":"center"} --><div class="wp-block-column is-vertically-aligned-center"><!-- wp:social-links {"align":"right","className":"is-style-twentytwentyone-social-icons-color"} --><ul class="wp-block-social-links alignright is-style-twentytwentyone-social-icons-color"><!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /--><!-- wp:social-link {"url":"https://www.facebook.com/WordPress/","service":"facebook"} /--><!-- wp:social-link {"url":"https://twitter.com/WordPress","service":"twitter"} /--><!-- wp:social-link {"service":"instagram"} /--><!-- wp:social-link {"service":"linkedin"} /--><!-- wp:social-link {"service":"youtube"} /--><!-- wp:social-link {"url":"https://www.youtube.com/wordpress","service":"youtube"} /--></ul><!-- /wp:social-links --></div><!-- /wp:column --></div><!-- /wp:columns --><!-- wp:paragraph --><p></p><!-- /wp:paragraph -->', 'content' => '<!-- wp:columns {"align":"wide"} --><div class="wp-block-columns alignwide"><!-- wp:column --><div class="wp-block-column"><!-- wp:paragraph --><p><a href="mailto:#">' . esc_html_x( 'example@example.com', 'Block pattern sample content', 'twentytwentyone' ) . '<br></a>' . esc_html_x( '123-456-7890', 'Block pattern sample content', 'twentytwentyone' ) . '</p><!-- /wp:paragraph --></div><!-- /wp:column --><!-- wp:column --><div class="wp-block-column"><!-- wp:paragraph {"align":"center"} --><p class="has-text-align-center">' . esc_html_x( '123 Main Street', 'Block pattern sample content', 'twentytwentyone' ) . '<br>' . esc_html_x( 'Cambridge, MA, 02139', 'Block pattern sample content', 'twentytwentyone' ) . '</p><!-- /wp:paragraph --></div><!-- /wp:column --><!-- wp:column {"verticalAlignment":"center"} --><div class="wp-block-column is-vertically-aligned-center"><!-- wp:social-links {"align":"right","className":"is-style-twentytwentyone-social-icons-color"} --><ul class="wp-block-social-links alignright is-style-twentytwentyone-social-icons-color"><!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /--><!-- wp:social-link {"url":"https://www.facebook.com/WordPress/","service":"facebook"} /--><!-- wp:social-link {"url":"https://twitter.com/WordPress","service":"twitter"} /--><!-- wp:social-link {"url":"https://www.youtube.com/wordpress","service":"youtube"} /--></ul><!-- /wp:social-links --></div><!-- /wp:column --></div><!-- /wp:columns -->',
) )
); );
} }

6
wp-content/themes/twentytwentyone/inc/template-tags.php
View File

@ -193,6 +193,9 @@ if ( ! function_exists( 'twenty_twenty_one_post_thumbnail' ) ) {
// Thumbnail is loaded eagerly because it's going to be in the viewport immediately. // Thumbnail is loaded eagerly because it's going to be in the viewport immediately.
the_post_thumbnail( 'post-thumbnail', array( 'loading' => 'eager' ) ); the_post_thumbnail( 'post-thumbnail', array( 'loading' => 'eager' ) );
?> ?>
<?php if ( wp_get_attachment_caption( get_post_thumbnail_id() ) ) : ?>
<figcaption class="wp-caption-text"><?php echo wp_kses_post( wp_get_attachment_caption( get_post_thumbnail_id() ) ); ?></figcaption>
<?php endif; ?>
</figure><!-- .post-thumbnail --> </figure><!-- .post-thumbnail -->
<?php else : ?> <?php else : ?>
@ -201,6 +204,9 @@ if ( ! function_exists( 'twenty_twenty_one_post_thumbnail' ) ) {
<a class="post-thumbnail-inner alignwide" href="<?php the_permalink(); ?>" aria-hidden="true" tabindex="-1"> <a class="post-thumbnail-inner alignwide" href="<?php the_permalink(); ?>" aria-hidden="true" tabindex="-1">
<?php the_post_thumbnail( 'post-thumbnail' ); ?> <?php the_post_thumbnail( 'post-thumbnail' ); ?>
</a> </a>
<?php if ( wp_get_attachment_caption( get_post_thumbnail_id() ) ) : ?>
<figcaption class="wp-caption-text"><?php echo wp_kses_post( wp_get_attachment_caption( get_post_thumbnail_id() ) ); ?></figcaption>
<?php endif; ?>
</figure> </figure>
<?php endif; ?> <?php endif; ?>

763
wp-content/themes/twentytwentyone/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

4
wp-content/themes/twentytwentyone/package.json
View File

@ -9,9 +9,9 @@
"Theme" "Theme"
], ],
"bugs": { "bugs": {
"url": "https://github.com/wordpress/twentytwentyone" "url": "https://core.trac.wordpress.org/"
}, },
"homepage": "https://github.com/wordpress/twentytwentyone", "homepage": "https://wordpress.org/themes/twentytwentyone/",
"devDependencies": { "devDependencies": {
"@wordpress/browserslist-config": "^2.2.2", "@wordpress/browserslist-config": "^2.2.2",
"@wordpress/eslint-plugin": "^7.3.0", "@wordpress/eslint-plugin": "^7.3.0",

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

@ -1174,6 +1174,8 @@ blockquote:before {
content: "“"; content: "“";
font-size: var(--quote--font-size); font-size: var(--quote--font-size);
line-height: var(--quote--line-height); line-height: var(--quote--line-height);
position: absolute;
right: calc(-0.5 * var(--global--spacing-horizontal));
} }
blockquote .wp-block-quote__citation, blockquote .wp-block-quote__citation,
@ -1448,8 +1450,8 @@ input[type=radio] + label {
input[type=range]::-webkit-slider-thumb { input[type=range]::-webkit-slider-thumb {
-webkit-appearance: none; -webkit-appearance: none;
border: 3px solid var(--form--color-ranged); border: 3px solid var(--form--color-ranged);
height: 25px; height: 44px;
width: 25px; width: 44px;
border-radius: 50%; border-radius: 50%;
background: var(--global--color-background); background: var(--global--color-background);
cursor: pointer; cursor: pointer;
@ -1457,11 +1459,12 @@ input[type=radio] + label {
input[type=range]::-moz-range-thumb { input[type=range]::-moz-range-thumb {
border: 3px solid var(--form--color-ranged); border: 3px solid var(--form--color-ranged);
height: 25px; height: 44px;
width: 25px; width: 44px;
border-radius: 50%; border-radius: 50%;
background: var(--global--color-background); background: var(--global--color-background);
cursor: pointer; cursor: pointer;
box-sizing: border-box;
} }
} }
@ -1488,8 +1491,8 @@ input[type=range]::-ms-fill-lower {
input[type=range]::-ms-thumb { input[type=range]::-ms-thumb {
border: 3px solid var(--form--color-ranged); border: 3px solid var(--form--color-ranged);
height: 25px; height: 44px;
width: 25px; width: 44px;
border-radius: 50%; border-radius: 50%;
background: var(--global--color-background); background: var(--global--color-background);
cursor: pointer; cursor: pointer;
@ -1581,7 +1584,8 @@ video {
/* Media captions */ /* Media captions */
figcaption, figcaption,
.wp-caption, .wp-caption,
.wp-caption-text { .wp-caption-text,
.wp-block-embed figcaption {
color: currentColor; color: currentColor;
font-size: var(--global--font-size-xs); font-size: var(--global--font-size-xs);
line-height: var(--global--line-height-body); line-height: var(--global--line-height-body);
@ -1595,7 +1599,9 @@ figcaption,
.alignleft .wp-caption, .alignleft .wp-caption,
.alignright .wp-caption, .alignright .wp-caption,
.alignleft .wp-caption-text, .alignleft .wp-caption-text,
.alignright .wp-caption-text { .alignright .wp-caption-text,
.alignleft .wp-block-embed figcaption,
.alignright .wp-block-embed figcaption {
margin-bottom: 0; margin-bottom: 0;
} }
@ -1644,45 +1650,47 @@ a:hover {
text-decoration-skip-ink: none; text-decoration-skip-ink: none;
} }
.site a:focus { .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
/* Only visible in Windows High Contrast mode */ /* Only visible in Windows High Contrast mode */
outline: 2px solid transparent; outline: 2px solid transparent;
text-decoration: underline 1px dotted currentColor;
text-decoration-skip-ink: none;
background: rgba(255, 255, 255, 0.9); background: rgba(255, 255, 255, 0.9);
} }
.is-dark-theme .site a:focus, .is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
.is-dark-theme .site a:focus .meta-nav { .is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
color: var(--wp--style--color--link, var(--global--color-background)); color: var(--wp--style--color--link, var(--global--color-background));
} }
.has-background-white .site a:focus { .has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
background: rgba(0, 0, 0, 0.9); background: rgba(0, 0, 0, 0.9);
color: var(--wp--style--color--link, var(--global--color-white)); color: var(--wp--style--color--link, var(--global--color-white));
} }
.has-background-white .site a:focus .meta-nav { .has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
color: var(--wp--style--color--link, var(--global--color-white)); color: var(--wp--style--color--link, var(--global--color-white));
} }
.site a:focus.skip-link { .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link {
/* Only visible in Windows High Contrast mode */ /* Only visible in Windows High Contrast mode */
outline: 2px solid transparent; outline: 2px solid transparent;
outline-offset: -2px; outline-offset: -2px;
} }
.site a:focus.skip-link:focus { .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link:focus {
color: #21759b; color: #21759b;
background-color: #f1f1f1; background-color: #f1f1f1;
} }
.site a:focus img { .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) img {
outline: 2px dotted var(--wp--style--color--link, var(--global--color-primary)); outline: 2px dotted var(--wp--style--color--link, var(--global--color-primary));
} }
.has-background:not(.has-background-background-color) .has-link-color a, .has-background .has-link-color a,
.has-background:not(.has-background-background-color).has-link-color a { .has-background.has-link-color a {
color: var(--wp--style--color--link, var(--global--color-primary)); color: var(--wp--style--color--link, var(--global--color-primary));
} }
@ -1713,38 +1721,6 @@ input[type=reset],
padding: var(--button--padding-vertical) var(--button--padding-horizontal); padding: var(--button--padding-vertical) var(--button--padding-horizontal);
} }
.site .button:before,
.site .button:after,
input[type=submit]:before,
input[type=submit]:after,
input[type=reset]:before,
input[type=reset]:after,
.wp-block-search__button:before,
.wp-block-search__button:after,
.wp-block-button .wp-block-button__link:before,
.wp-block-button .wp-block-button__link:after {
content: "";
display: block;
height: 0;
width: 0;
}
.site .button:before,
input[type=submit]:before,
input[type=reset]:before,
.wp-block-search__button:before,
.wp-block-button .wp-block-button__link:before {
margin-bottom: -calc(.5em * var(--button--line-height) + -.38);
}
.site .button:after,
input[type=submit]:after,
input[type=reset]:after,
.wp-block-search__button:after,
.wp-block-button .wp-block-button__link:after {
margin-top: -calc(.5em * var(--button--line-height) + -.39);
}
.site .button:focus, .site .button:focus,
input[type=submit]:focus, input[type=submit]:focus,
input[type=reset]:focus, input[type=reset]:focus,
@ -2026,12 +2002,12 @@ input[type=reset]:hover,
margin-bottom: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical);
} }
.wp-block-cover .wp-block-cover__inner-container a, .wp-block-cover .wp-block-cover__inner-container a:not(.wp-block-button__link):not(.wp-block-file__button),
.wp-block-cover .wp-block-cover-image-text a, .wp-block-cover .wp-block-cover-image-text a:not(.wp-block-button__link):not(.wp-block-file__button),
.wp-block-cover .wp-block-cover-text a, .wp-block-cover .wp-block-cover-text a:not(.wp-block-button__link):not(.wp-block-file__button),
.wp-block-cover-image .wp-block-cover__inner-container a, .wp-block-cover-image .wp-block-cover__inner-container a:not(.wp-block-button__link):not(.wp-block-file__button),
.wp-block-cover-image .wp-block-cover-image-text a, .wp-block-cover-image .wp-block-cover-image-text a:not(.wp-block-button__link):not(.wp-block-file__button),
.wp-block-cover-image .wp-block-cover-text a { .wp-block-cover-image .wp-block-cover-text a:not(.wp-block-button__link):not(.wp-block-file__button) {
color: currentColor; color: currentColor;
} }
@ -2167,22 +2143,6 @@ input[type=reset]:hover,
display: inline-block; display: inline-block;
} }
.wp-block-file .wp-block-file__button:before,
.wp-block-file .wp-block-file__button:after {
content: "";
display: block;
height: 0;
width: 0;
}
.wp-block-file .wp-block-file__button:before {
margin-bottom: -calc(.5em * var(--button--line-height) + -.38);
}
.wp-block-file .wp-block-file__button:after {
margin-top: -calc(.5em * var(--button--line-height) + -.39);
}
.wp-block-file .wp-block-file__button:focus { .wp-block-file .wp-block-file__button:focus {
background: transparent; background: transparent;
outline-offset: -6px; outline-offset: -6px;
@ -2920,6 +2880,8 @@ pre.wp-block-preformatted {
border-width: var(--pullquote--border-width); border-width: var(--pullquote--border-width);
border-bottom-style: solid; border-bottom-style: solid;
border-top-style: solid; border-top-style: solid;
color: currentColor;
border-color: currentColor;
position: relative; position: relative;
/** /**
@ -2931,6 +2893,8 @@ pre.wp-block-preformatted {
color: currentColor; color: currentColor;
content: "“"; content: "“";
display: block; display: block;
position: relative;
right: 0;
font-size: 3rem; font-size: 3rem;
font-weight: 500; font-weight: 500;
line-height: 1; line-height: 1;
@ -2964,8 +2928,8 @@ pre.wp-block-preformatted {
background: none; background: none;
} }
.wp-block-pullquote.alignleft blockquote:before, .wp-block-pullquote.alignleft:not(.is-style-solid-color) blockquote:before,
.wp-block-pullquote.alignleft cite { .wp-block-pullquote.alignleft:not(.is-style-solid-color) cite {
text-align: center; text-align: center;
} }
@ -2998,6 +2962,7 @@ pre.wp-block-preformatted {
} }
.wp-block-pullquote.is-style-solid-color blockquote { .wp-block-pullquote.is-style-solid-color blockquote {
margin: 0;
max-width: inherit; max-width: inherit;
} }
@ -3011,23 +2976,41 @@ pre.wp-block-preformatted {
color: currentColor; color: currentColor;
} }
.wp-block-pullquote.is-style-solid-color.alignleft,
.wp-block-pullquote.is-style-solid-color.alignright {
padding: var(--global--spacing-unit);
}
.wp-block-pullquote.is-style-solid-color.alignleft blockquote,
.wp-block-pullquote.is-style-solid-color.alignright blockquote {
max-width: initial;
}
.wp-block-quote { .wp-block-quote {
border-right: none;
/** /**
* Block Options * Block Options
*/ */
} }
.has-background:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation, .wp-block-quote:before {
[class*=background-color]:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation, content: "“";
font-size: var(--quote--font-size);
line-height: var(--quote--line-height);
right: 8px;
}
.has-background .wp-block-quote .wp-block-quote__citation,
[class*=background-color] .wp-block-quote .wp-block-quote__citation,
[style*=background-color] .wp-block-quote .wp-block-quote__citation, [style*=background-color] .wp-block-quote .wp-block-quote__citation,
.wp-block-cover[style*=background-image] .wp-block-quote .wp-block-quote__citation, .wp-block-cover[style*=background-image] .wp-block-quote .wp-block-quote__citation,
.has-background:not(.has-background-background-color) .wp-block-quote cite, .has-background .wp-block-quote cite,
[class*=background-color]:not(.has-background-background-color) .wp-block-quote cite, [class*=background-color] .wp-block-quote cite,
[style*=background-color] .wp-block-quote cite, [style*=background-color] .wp-block-quote cite,
.wp-block-cover[style*=background-image] .wp-block-quote cite, .wp-block-cover[style*=background-image] .wp-block-quote cite,
.has-background:not(.has-background-background-color) .wp-block-quote footer, .has-background .wp-block-quote footer,
[class*=background-color]:not(.has-background-background-color) .wp-block-quote footer, [class*=background-color] .wp-block-quote footer,
[style*=background-color] .wp-block-quote footer, [style*=background-color] .wp-block-quote footer,
.wp-block-cover[style*=background-image] .wp-block-quote footer { .wp-block-cover[style*=background-image] .wp-block-quote footer {
color: currentColor; color: currentColor;
@ -3040,9 +3023,15 @@ pre.wp-block-preformatted {
} }
.wp-block-quote.has-text-align-right:before { .wp-block-quote.has-text-align-right:before {
display: none;
}
.wp-block-quote.has-text-align-right p:before {
content: "”"; content: "”";
right: initial; font-size: var(--quote--font-size);
left: calc(-0.5 * var(--global--spacing-horizontal)); font-weight: normal;
line-height: var(--quote--line-height);
margin-left: 5px;
} }
.wp-block-quote.has-text-align-center { .wp-block-quote.has-text-align-center {
@ -3079,8 +3068,16 @@ pre.wp-block-preformatted {
.wp-block-quote.is-large.has-text-align-right:before, .wp-block-quote.is-large.has-text-align-right:before,
.wp-block-quote.is-style-large.has-text-align-right:before { .wp-block-quote.is-style-large.has-text-align-right:before {
right: initial; display: none;
left: calc(-1 * var(--global--spacing-horizontal)); }
.wp-block-quote.is-large.has-text-align-right p:before,
.wp-block-quote.is-style-large.has-text-align-right p:before {
content: "”";
font-size: var(--quote--font-size-large);
font-weight: normal;
line-height: var(--quote--line-height-large);
margin-left: 10px;
} }
.wp-block-quote.is-large .wp-block-quote__citation, .wp-block-quote.is-large .wp-block-quote__citation,
@ -3242,10 +3239,6 @@ pre.wp-block-preformatted {
max-width: var(--responsive--aligndefault-width); max-width: var(--responsive--aligndefault-width);
} }
.wp-block-search__button-inside .wp-block-search__inside-wrapper {
background-color: var(--global--color-white);
}
.wp-block-search__button-only.aligncenter .wp-block-search__inside-wrapper { .wp-block-search__button-only.aligncenter .wp-block-search__inside-wrapper {
justify-content: center; justify-content: center;
} }
@ -3271,8 +3264,8 @@ pre.wp-block-preformatted {
border-color: var(--form--border-color); border-color: var(--form--border-color);
} }
.has-background:not(.has-background-background-color) .wp-block-search .wp-block-search__input, .has-background .wp-block-search .wp-block-search__input,
[class*=background-color]:not(.has-background-background-color) .wp-block-search .wp-block-search__input, [class*=background-color] .wp-block-search .wp-block-search__input,
[style*=background-color] .wp-block-search .wp-block-search__input, [style*=background-color] .wp-block-search .wp-block-search__input,
.wp-block-cover[style*=background-image] .wp-block-search .wp-block-search__input { .wp-block-cover[style*=background-image] .wp-block-search .wp-block-search__input {
border-color: currentColor; border-color: currentColor;
@ -3362,6 +3355,25 @@ pre.wp-block-preformatted {
color: var(--button--color-background); color: var(--button--color-background);
} }
.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
background-color: var(--global--color-white);
border: var(--form--border-width) solid var(--form--border-color);
border-radius: var(--form--border-radius);
}
.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
margin-left: 0;
}
.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input:focus {
outline: 2px dotted var(--form--border-color);
outline-offset: -5px;
}
.is-dark-theme .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input:focus {
outline-color: currentColor;
}
.wp-block-search.wp-block-search__button-inside.wp-block-search__text-button button.wp-block-search__button { .wp-block-search.wp-block-search__button-inside.wp-block-search__text-button button.wp-block-search__button {
padding: var(--button--padding-vertical) var(--button--padding-horizontal); padding: var(--button--padding-vertical) var(--button--padding-horizontal);
} }
@ -3417,6 +3429,7 @@ hr {
hr.wp-block-separator { hr.wp-block-separator {
border-bottom: var(--separator--height) solid var(--separator--border-color); border-bottom: var(--separator--height) solid var(--separator--border-color);
opacity: 1;
/** /**
* Block Options * Block Options
@ -3427,7 +3440,11 @@ hr.wp-block-separator:not(.is-style-dots):not(.alignwide) {
max-width: var(--responsive--aligndefault-width); max-width: var(--responsive--aligndefault-width);
} }
hr.wp-block-separator:not(.is-style-dots):not(.alignwide).alignfull { hr.wp-block-separator:not(.is-style-dots).alignwide {
max-width: var(--responsive--alignwide-width);
}
hr.wp-block-separator:not(.is-style-dots).alignfull {
max-width: var(--responsive--alignfull-width); max-width: var(--responsive--alignfull-width);
} }
@ -3452,13 +3469,17 @@ hr.wp-block-separator.is-style-dots:before {
padding-right: var(--global--font-size-sm); padding-right: var(--global--font-size-sm);
} }
.has-background:not(.has-background-background-color) hr.wp-block-separator, .has-background hr.wp-block-separator,
[class*=background-color]:not(.has-background-background-color) hr.wp-block-separator, [class*=background-color] hr.wp-block-separator,
[style*=background-color] hr.wp-block-separator, [style*=background-color] hr.wp-block-separator,
.wp-block-cover[style*=background-image] hr.wp-block-separator { .wp-block-cover[style*=background-image] hr.wp-block-separator {
border-color: currentColor; border-color: currentColor;
} }
.wp-block-social-links a:focus {
color: var(--global--color-primary);
}
.wp-block-social-links.is-style-twentytwentyone-social-icons-color a { .wp-block-social-links.is-style-twentytwentyone-social-icons-color a {
color: var(--global--color-primary); color: var(--global--color-primary);
} }
@ -3852,6 +3873,11 @@ a.custom-logo-link {
text-decoration: none; text-decoration: none;
} }
.has-background-white a.custom-logo-link:focus,
.is-dark-theme a.custom-logo-link:focus {
background: none;
}
.site-title > a { .site-title > a {
text-decoration-color: var(--global--color-secondary); text-decoration-color: var(--global--color-secondary);
} }
@ -3958,6 +3984,12 @@ a.custom-logo-link {
.no-widgets .site-footer { .no-widgets .site-footer {
margin-top: calc(6 * var(--global--spacing-vertical)); margin-top: calc(6 * var(--global--spacing-vertical));
} }
@media only screen and (max-width: 481px) {
.no-widgets .site-footer {
margin-top: calc(3 * var(--global--spacing-vertical));
}
}
.site-footer > .site-info { .site-footer > .site-info {
padding-top: var(--global--spacing-vertical); padding-top: var(--global--spacing-vertical);
@ -4011,6 +4043,10 @@ a.custom-logo-link {
color: var(--wp--style--color--link, var(--global--color-background)); color: var(--wp--style--color--link, var(--global--color-background));
} }
.has-background-white .site-footer > .site-info a:focus {
color: var(--wp--style--color--link, var(--global--color-white));
}
.singular .entry-header { .singular .entry-header {
border-bottom: 3px solid var(--global--color-border); border-bottom: 3px solid var(--global--color-border);
padding-bottom: calc(2 * var(--global--spacing-vertical)); padding-bottom: calc(2 * var(--global--spacing-vertical));
@ -4935,7 +4971,7 @@ h1.page-title {
} }
.primary-navigation .primary-menu-container > ul > .menu-item > a + .sub-menu-toggle { .primary-navigation .primary-menu-container > ul > .menu-item > a + .sub-menu-toggle {
margin-right: calc(0px - var(--primary-nav--padding)); margin-right: calc(5px - var(--primary-nav--padding));
} }
} }
@ -4976,6 +5012,7 @@ h1.page-title {
position: relative; position: relative;
z-index: 99999; z-index: 99999;
outline-offset: 0; outline-offset: 0;
text-decoration-thickness: 2px;
} }
.primary-navigation .current-menu-item > a:first-child, .primary-navigation .current-menu-item > a:first-child,
@ -5118,6 +5155,10 @@ h1.page-title {
fill: var(--wp--style--color--link, var(--global--color-background)); fill: var(--wp--style--color--link, var(--global--color-background));
} }
.has-background-white .footer-navigation-wrapper li a:focus .svg-icon {
fill: var(--wp--style--color--link, var(--global--color-white));
}
.footer-navigation-wrapper li .svg-icon { .footer-navigation-wrapper li .svg-icon {
vertical-align: middle; vertical-align: middle;
fill: var(--footer--color-link); fill: var(--footer--color-link);
@ -5145,6 +5186,7 @@ h1.page-title {
.navigation a:hover { .navigation a:hover {
color: var(--global--color-primary-hover); color: var(--global--color-primary-hover);
text-decoration: underline; text-decoration: underline;
text-decoration-style: dotted;
} }
.navigation a:focus { .navigation a:focus {
@ -5260,12 +5302,6 @@ h1.page-title {
margin-bottom: 0; margin-bottom: 0;
} }
.post-navigation .nav-next:hover .post-title,
.post-navigation .nav-previous:hover .post-title {
text-decoration: underline;
text-decoration-thickness: 1px;
}
.pagination, .pagination,
.comments-pagination { .comments-pagination {
border-top: 3px solid var(--global--color-border); border-top: 3px solid var(--global--color-border);
@ -5290,6 +5326,24 @@ h1.page-title {
color: var(--pagination--color-link-hover); color: var(--pagination--color-link-hover);
} }
.is-dark-theme .pagination .nav-links a:active,
.is-dark-theme .pagination .nav-links a:hover:active,
.is-dark-theme .pagination .nav-links a:hover:focus,
.is-dark-theme .comments-pagination .nav-links a:active,
.is-dark-theme .comments-pagination .nav-links a:hover:active,
.is-dark-theme .comments-pagination .nav-links a:hover:focus {
color: var(--global--color-background);
}
.has-background-white .pagination .nav-links a:active,
.has-background-white .pagination .nav-links a:hover:active,
.has-background-white .pagination .nav-links a:hover:focus,
.has-background-white .comments-pagination .nav-links a:active,
.has-background-white .comments-pagination .nav-links a:hover:active,
.has-background-white .comments-pagination .nav-links a:hover:focus {
color: var(--global--color-white);
}
.pagination .nav-links > *, .pagination .nav-links > *,
.comments-pagination .nav-links > * { .comments-pagination .nav-links > * {
color: var(--pagination--color-text); color: var(--pagination--color-text);
@ -5303,7 +5357,12 @@ h1.page-title {
.pagination .nav-links > *.current, .pagination .nav-links > *.current,
.comments-pagination .nav-links > *.current { .comments-pagination .nav-links > *.current {
border-bottom: 1px solid var(--pagination--color-text); text-decoration: underline;
}
.pagination .nav-links > *:not(.dots):not(.current):hover,
.comments-pagination .nav-links > *:not(.dots):not(.current):hover {
text-decoration-style: dotted;
} }
.pagination .nav-links > *:first-child, .pagination .nav-links > *:first-child,
@ -5390,6 +5449,12 @@ h1.page-title {
grid-template-columns: repeat(3, 1fr); grid-template-columns: repeat(3, 1fr);
} }
} }
@media only screen and (max-width: 481px) {
.widget-area {
margin-top: calc(3 * var(--global--spacing-vertical));
}
}
.widget-area ul { .widget-area ul {
list-style-type: none; list-style-type: none;
@ -5585,7 +5650,7 @@ h1.page-title {
color: var(--global--color-white); color: var(--global--color-white);
} }
.has-background:not(.has-background-background-color) a:not(.wp-block-button__link), .has-background a,
.has-background p, .has-background p,
.has-background h1, .has-background h1,
.has-background h2, .has-background h2,

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

@ -1182,6 +1182,8 @@ blockquote:before {
content: "“"; content: "“";
font-size: var(--quote--font-size); font-size: var(--quote--font-size);
line-height: var(--quote--line-height); line-height: var(--quote--line-height);
position: absolute;
left: calc(-0.5 * var(--global--spacing-horizontal));
} }
blockquote .wp-block-quote__citation, blockquote .wp-block-quote__citation,
@ -1458,8 +1460,8 @@ input[type=radio] + label {
input[type=range]::-webkit-slider-thumb { input[type=range]::-webkit-slider-thumb {
-webkit-appearance: none; -webkit-appearance: none;
border: 3px solid var(--form--color-ranged); border: 3px solid var(--form--color-ranged);
height: 25px; height: 44px;
width: 25px; width: 44px;
border-radius: 50%; border-radius: 50%;
background: var(--global--color-background); background: var(--global--color-background);
cursor: pointer; cursor: pointer;
@ -1467,11 +1469,12 @@ input[type=radio] + label {
input[type=range]::-moz-range-thumb { input[type=range]::-moz-range-thumb {
border: 3px solid var(--form--color-ranged); border: 3px solid var(--form--color-ranged);
height: 25px; height: 44px;
width: 25px; width: 44px;
border-radius: 50%; border-radius: 50%;
background: var(--global--color-background); background: var(--global--color-background);
cursor: pointer; cursor: pointer;
box-sizing: border-box;
} }
} }
@ -1498,8 +1501,8 @@ input[type=range]::-ms-fill-lower {
input[type=range]::-ms-thumb { input[type=range]::-ms-thumb {
border: 3px solid var(--form--color-ranged); border: 3px solid var(--form--color-ranged);
height: 25px; height: 44px;
width: 25px; width: 44px;
border-radius: 50%; border-radius: 50%;
background: var(--global--color-background); background: var(--global--color-background);
cursor: pointer; cursor: pointer;
@ -1591,7 +1594,8 @@ video {
/* Media captions */ /* Media captions */
figcaption, figcaption,
.wp-caption, .wp-caption,
.wp-caption-text { .wp-caption-text,
.wp-block-embed figcaption {
color: currentColor; color: currentColor;
font-size: var(--global--font-size-xs); font-size: var(--global--font-size-xs);
line-height: var(--global--line-height-body); line-height: var(--global--line-height-body);
@ -1605,7 +1609,9 @@ figcaption,
.alignleft .wp-caption, .alignleft .wp-caption,
.alignright .wp-caption, .alignright .wp-caption,
.alignleft .wp-caption-text, .alignleft .wp-caption-text,
.alignright .wp-caption-text { .alignright .wp-caption-text,
.alignleft .wp-block-embed figcaption,
.alignright .wp-block-embed figcaption {
margin-bottom: 0; margin-bottom: 0;
} }
@ -1654,45 +1660,47 @@ a:hover {
text-decoration-skip-ink: none; text-decoration-skip-ink: none;
} }
.site a:focus { .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
/* Only visible in Windows High Contrast mode */ /* Only visible in Windows High Contrast mode */
outline: 2px solid transparent; outline: 2px solid transparent;
text-decoration: underline 1px dotted currentColor;
text-decoration-skip-ink: none;
background: rgba(255, 255, 255, 0.9); background: rgba(255, 255, 255, 0.9);
} }
.is-dark-theme .site a:focus, .is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
.is-dark-theme .site a:focus .meta-nav { .is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
color: var(--wp--style--color--link, var(--global--color-background)); color: var(--wp--style--color--link, var(--global--color-background));
} }
.has-background-white .site a:focus { .has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
background: rgba(0, 0, 0, 0.9); background: rgba(0, 0, 0, 0.9);
color: var(--wp--style--color--link, var(--global--color-white)); color: var(--wp--style--color--link, var(--global--color-white));
} }
.has-background-white .site a:focus .meta-nav { .has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav {
color: var(--wp--style--color--link, var(--global--color-white)); color: var(--wp--style--color--link, var(--global--color-white));
} }
.site a:focus.skip-link { .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link {
/* Only visible in Windows High Contrast mode */ /* Only visible in Windows High Contrast mode */
outline: 2px solid transparent; outline: 2px solid transparent;
outline-offset: -2px; outline-offset: -2px;
} }
.site a:focus.skip-link:focus { .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link:focus {
color: #21759b; color: #21759b;
background-color: #f1f1f1; background-color: #f1f1f1;
} }
.site a:focus img { .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) img {
outline: 2px dotted var(--wp--style--color--link, var(--global--color-primary)); outline: 2px dotted var(--wp--style--color--link, var(--global--color-primary));
} }
.has-background:not(.has-background-background-color) .has-link-color a, .has-background .has-link-color a,
.has-background:not(.has-background-background-color).has-link-color a { .has-background.has-link-color a {
color: var(--wp--style--color--link, var(--global--color-primary)); color: var(--wp--style--color--link, var(--global--color-primary));
} }
@ -1723,38 +1731,6 @@ input[type=reset],
padding: var(--button--padding-vertical) var(--button--padding-horizontal); padding: var(--button--padding-vertical) var(--button--padding-horizontal);
} }
.site .button:before,
.site .button:after,
input[type=submit]:before,
input[type=submit]:after,
input[type=reset]:before,
input[type=reset]:after,
.wp-block-search__button:before,
.wp-block-search__button:after,
.wp-block-button .wp-block-button__link:before,
.wp-block-button .wp-block-button__link:after {
content: "";
display: block;
height: 0;
width: 0;
}
.site .button:before,
input[type=submit]:before,
input[type=reset]:before,
.wp-block-search__button:before,
.wp-block-button .wp-block-button__link:before {
margin-bottom: -calc(.5em * var(--button--line-height) + -.38);
}
.site .button:after,
input[type=submit]:after,
input[type=reset]:after,
.wp-block-search__button:after,
.wp-block-button .wp-block-button__link:after {
margin-top: -calc(.5em * var(--button--line-height) + -.39);
}
.site .button:focus, .site .button:focus,
input[type=submit]:focus, input[type=submit]:focus,
input[type=reset]:focus, input[type=reset]:focus,
@ -2036,12 +2012,12 @@ input[type=reset]:hover,
margin-bottom: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical);
} }
.wp-block-cover .wp-block-cover__inner-container a, .wp-block-cover .wp-block-cover__inner-container a:not(.wp-block-button__link):not(.wp-block-file__button),
.wp-block-cover .wp-block-cover-image-text a, .wp-block-cover .wp-block-cover-image-text a:not(.wp-block-button__link):not(.wp-block-file__button),
.wp-block-cover .wp-block-cover-text a, .wp-block-cover .wp-block-cover-text a:not(.wp-block-button__link):not(.wp-block-file__button),
.wp-block-cover-image .wp-block-cover__inner-container a, .wp-block-cover-image .wp-block-cover__inner-container a:not(.wp-block-button__link):not(.wp-block-file__button),
.wp-block-cover-image .wp-block-cover-image-text a, .wp-block-cover-image .wp-block-cover-image-text a:not(.wp-block-button__link):not(.wp-block-file__button),
.wp-block-cover-image .wp-block-cover-text a { .wp-block-cover-image .wp-block-cover-text a:not(.wp-block-button__link):not(.wp-block-file__button) {
color: currentColor; color: currentColor;
} }
@ -2177,22 +2153,6 @@ input[type=reset]:hover,
display: inline-block; display: inline-block;
} }
.wp-block-file .wp-block-file__button:before,
.wp-block-file .wp-block-file__button:after {
content: "";
display: block;
height: 0;
width: 0;
}
.wp-block-file .wp-block-file__button:before {
margin-bottom: -calc(.5em * var(--button--line-height) + -.38);
}
.wp-block-file .wp-block-file__button:after {
margin-top: -calc(.5em * var(--button--line-height) + -.39);
}
.wp-block-file .wp-block-file__button:focus { .wp-block-file .wp-block-file__button:focus {
background: transparent; background: transparent;
outline-offset: -6px; outline-offset: -6px;
@ -2930,6 +2890,8 @@ pre.wp-block-preformatted {
border-width: var(--pullquote--border-width); border-width: var(--pullquote--border-width);
border-bottom-style: solid; border-bottom-style: solid;
border-top-style: solid; border-top-style: solid;
color: currentColor;
border-color: currentColor;
position: relative; position: relative;
/** /**
@ -2941,6 +2903,8 @@ pre.wp-block-preformatted {
color: currentColor; color: currentColor;
content: "“"; content: "“";
display: block; display: block;
position: relative;
left: 0;
font-size: 3rem; font-size: 3rem;
font-weight: 500; font-weight: 500;
line-height: 1; line-height: 1;
@ -2974,8 +2938,8 @@ pre.wp-block-preformatted {
background: none; background: none;
} }
.wp-block-pullquote.alignleft blockquote:before, .wp-block-pullquote.alignleft:not(.is-style-solid-color) blockquote:before,
.wp-block-pullquote.alignleft cite { .wp-block-pullquote.alignleft:not(.is-style-solid-color) cite {
text-align: center; text-align: center;
} }
@ -3008,6 +2972,7 @@ pre.wp-block-preformatted {
} }
.wp-block-pullquote.is-style-solid-color blockquote { .wp-block-pullquote.is-style-solid-color blockquote {
margin: 0;
max-width: inherit; max-width: inherit;
} }
@ -3021,23 +2986,41 @@ pre.wp-block-preformatted {
color: currentColor; color: currentColor;
} }
.wp-block-pullquote.is-style-solid-color.alignleft,
.wp-block-pullquote.is-style-solid-color.alignright {
padding: var(--global--spacing-unit);
}
.wp-block-pullquote.is-style-solid-color.alignleft blockquote,
.wp-block-pullquote.is-style-solid-color.alignright blockquote {
max-width: initial;
}
.wp-block-quote { .wp-block-quote {
border-left: none;
/** /**
* Block Options * Block Options
*/ */
} }
.has-background:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation, .wp-block-quote:before {
[class*=background-color]:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation, content: "“";
font-size: var(--quote--font-size);
line-height: var(--quote--line-height);
left: 8px;
}
.has-background .wp-block-quote .wp-block-quote__citation,
[class*=background-color] .wp-block-quote .wp-block-quote__citation,
[style*=background-color] .wp-block-quote .wp-block-quote__citation, [style*=background-color] .wp-block-quote .wp-block-quote__citation,
.wp-block-cover[style*=background-image] .wp-block-quote .wp-block-quote__citation, .wp-block-cover[style*=background-image] .wp-block-quote .wp-block-quote__citation,
.has-background:not(.has-background-background-color) .wp-block-quote cite, .has-background .wp-block-quote cite,
[class*=background-color]:not(.has-background-background-color) .wp-block-quote cite, [class*=background-color] .wp-block-quote cite,
[style*=background-color] .wp-block-quote cite, [style*=background-color] .wp-block-quote cite,
.wp-block-cover[style*=background-image] .wp-block-quote cite, .wp-block-cover[style*=background-image] .wp-block-quote cite,
.has-background:not(.has-background-background-color) .wp-block-quote footer, .has-background .wp-block-quote footer,
[class*=background-color]:not(.has-background-background-color) .wp-block-quote footer, [class*=background-color] .wp-block-quote footer,
[style*=background-color] .wp-block-quote footer, [style*=background-color] .wp-block-quote footer,
.wp-block-cover[style*=background-image] .wp-block-quote footer { .wp-block-cover[style*=background-image] .wp-block-quote footer {
color: currentColor; color: currentColor;
@ -3050,9 +3033,15 @@ pre.wp-block-preformatted {
} }
.wp-block-quote.has-text-align-right:before { .wp-block-quote.has-text-align-right:before {
display: none;
}
.wp-block-quote.has-text-align-right p:before {
content: "”"; content: "”";
left: initial; font-size: var(--quote--font-size);
right: calc(-0.5 * var(--global--spacing-horizontal)); font-weight: normal;
line-height: var(--quote--line-height);
margin-right: 5px;
} }
.wp-block-quote.has-text-align-center { .wp-block-quote.has-text-align-center {
@ -3089,8 +3078,16 @@ pre.wp-block-preformatted {
.wp-block-quote.is-large.has-text-align-right:before, .wp-block-quote.is-large.has-text-align-right:before,
.wp-block-quote.is-style-large.has-text-align-right:before { .wp-block-quote.is-style-large.has-text-align-right:before {
left: initial; display: none;
right: calc(-1 * var(--global--spacing-horizontal)); }
.wp-block-quote.is-large.has-text-align-right p:before,
.wp-block-quote.is-style-large.has-text-align-right p:before {
content: "”";
font-size: var(--quote--font-size-large);
font-weight: normal;
line-height: var(--quote--line-height-large);
margin-right: 10px;
} }
.wp-block-quote.is-large .wp-block-quote__citation, .wp-block-quote.is-large .wp-block-quote__citation,
@ -3252,10 +3249,6 @@ pre.wp-block-preformatted {
max-width: var(--responsive--aligndefault-width); max-width: var(--responsive--aligndefault-width);
} }
.wp-block-search__button-inside .wp-block-search__inside-wrapper {
background-color: var(--global--color-white);
}
.wp-block-search__button-only.aligncenter .wp-block-search__inside-wrapper { .wp-block-search__button-only.aligncenter .wp-block-search__inside-wrapper {
justify-content: center; justify-content: center;
} }
@ -3281,8 +3274,8 @@ pre.wp-block-preformatted {
border-color: var(--form--border-color); border-color: var(--form--border-color);
} }
.has-background:not(.has-background-background-color) .wp-block-search .wp-block-search__input, .has-background .wp-block-search .wp-block-search__input,
[class*=background-color]:not(.has-background-background-color) .wp-block-search .wp-block-search__input, [class*=background-color] .wp-block-search .wp-block-search__input,
[style*=background-color] .wp-block-search .wp-block-search__input, [style*=background-color] .wp-block-search .wp-block-search__input,
.wp-block-cover[style*=background-image] .wp-block-search .wp-block-search__input { .wp-block-cover[style*=background-image] .wp-block-search .wp-block-search__input {
border-color: currentColor; border-color: currentColor;
@ -3372,6 +3365,25 @@ pre.wp-block-preformatted {
color: var(--button--color-background); color: var(--button--color-background);
} }
.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
background-color: var(--global--color-white);
border: var(--form--border-width) solid var(--form--border-color);
border-radius: var(--form--border-radius);
}
.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
margin-right: 0;
}
.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input:focus {
outline: 2px dotted var(--form--border-color);
outline-offset: -5px;
}
.is-dark-theme .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input:focus {
outline-color: currentColor;
}
.wp-block-search.wp-block-search__button-inside.wp-block-search__text-button button.wp-block-search__button { .wp-block-search.wp-block-search__button-inside.wp-block-search__text-button button.wp-block-search__button {
padding: var(--button--padding-vertical) var(--button--padding-horizontal); padding: var(--button--padding-vertical) var(--button--padding-horizontal);
} }
@ -3427,6 +3439,7 @@ hr {
hr.wp-block-separator { hr.wp-block-separator {
border-bottom: var(--separator--height) solid var(--separator--border-color); border-bottom: var(--separator--height) solid var(--separator--border-color);
opacity: 1;
/** /**
* Block Options * Block Options
@ -3437,7 +3450,11 @@ hr.wp-block-separator:not(.is-style-dots):not(.alignwide) {
max-width: var(--responsive--aligndefault-width); max-width: var(--responsive--aligndefault-width);
} }
hr.wp-block-separator:not(.is-style-dots):not(.alignwide).alignfull { hr.wp-block-separator:not(.is-style-dots).alignwide {
max-width: var(--responsive--alignwide-width);
}
hr.wp-block-separator:not(.is-style-dots).alignfull {
max-width: var(--responsive--alignfull-width); max-width: var(--responsive--alignfull-width);
} }
@ -3462,13 +3479,17 @@ hr.wp-block-separator.is-style-dots:before {
padding-left: var(--global--font-size-sm); padding-left: var(--global--font-size-sm);
} }
.has-background:not(.has-background-background-color) hr.wp-block-separator, .has-background hr.wp-block-separator,
[class*=background-color]:not(.has-background-background-color) hr.wp-block-separator, [class*=background-color] hr.wp-block-separator,
[style*=background-color] hr.wp-block-separator, [style*=background-color] hr.wp-block-separator,
.wp-block-cover[style*=background-image] hr.wp-block-separator { .wp-block-cover[style*=background-image] hr.wp-block-separator {
border-color: currentColor; border-color: currentColor;
} }
.wp-block-social-links a:focus {
color: var(--global--color-primary);
}
.wp-block-social-links.is-style-twentytwentyone-social-icons-color a { .wp-block-social-links.is-style-twentytwentyone-social-icons-color a {
color: var(--global--color-primary); color: var(--global--color-primary);
} }
@ -3872,6 +3893,11 @@ a.custom-logo-link {
text-decoration: none; text-decoration: none;
} }
.has-background-white a.custom-logo-link:focus,
.is-dark-theme a.custom-logo-link:focus {
background: none;
}
.site-title > a { .site-title > a {
text-decoration-color: var(--global--color-secondary); text-decoration-color: var(--global--color-secondary);
} }
@ -3978,6 +4004,12 @@ a.custom-logo-link {
.no-widgets .site-footer { .no-widgets .site-footer {
margin-top: calc(6 * var(--global--spacing-vertical)); margin-top: calc(6 * var(--global--spacing-vertical));
} }
@media only screen and (max-width: 481px) {
.no-widgets .site-footer {
margin-top: calc(3 * var(--global--spacing-vertical));
}
}
.site-footer > .site-info { .site-footer > .site-info {
padding-top: var(--global--spacing-vertical); padding-top: var(--global--spacing-vertical);
@ -4031,6 +4063,10 @@ a.custom-logo-link {
color: var(--wp--style--color--link, var(--global--color-background)); color: var(--wp--style--color--link, var(--global--color-background));
} }
.has-background-white .site-footer > .site-info a:focus {
color: var(--wp--style--color--link, var(--global--color-white));
}
.singular .entry-header { .singular .entry-header {
border-bottom: 3px solid var(--global--color-border); border-bottom: 3px solid var(--global--color-border);
padding-bottom: calc(2 * var(--global--spacing-vertical)); padding-bottom: calc(2 * var(--global--spacing-vertical));
@ -4971,7 +5007,7 @@ h1.page-title {
} }
.primary-navigation .primary-menu-container > ul > .menu-item > a + .sub-menu-toggle { .primary-navigation .primary-menu-container > ul > .menu-item > a + .sub-menu-toggle {
margin-left: calc(0px - var(--primary-nav--padding)); margin-left: calc(5px - var(--primary-nav--padding));
} }
} }
@ -5012,6 +5048,7 @@ h1.page-title {
position: relative; position: relative;
z-index: 99999; z-index: 99999;
outline-offset: 0; outline-offset: 0;
text-decoration-thickness: 2px;
} }
.primary-navigation .current-menu-item > a:first-child, .primary-navigation .current-menu-item > a:first-child,
@ -5154,6 +5191,10 @@ h1.page-title {
fill: var(--wp--style--color--link, var(--global--color-background)); fill: var(--wp--style--color--link, var(--global--color-background));
} }
.has-background-white .footer-navigation-wrapper li a:focus .svg-icon {
fill: var(--wp--style--color--link, var(--global--color-white));
}
.footer-navigation-wrapper li .svg-icon { .footer-navigation-wrapper li .svg-icon {
vertical-align: middle; vertical-align: middle;
fill: var(--footer--color-link); fill: var(--footer--color-link);
@ -5181,6 +5222,7 @@ h1.page-title {
.navigation a:hover { .navigation a:hover {
color: var(--global--color-primary-hover); color: var(--global--color-primary-hover);
text-decoration: underline; text-decoration: underline;
text-decoration-style: dotted;
} }
.navigation a:focus { .navigation a:focus {
@ -5296,12 +5338,6 @@ h1.page-title {
margin-bottom: 0; margin-bottom: 0;
} }
.post-navigation .nav-next:hover .post-title,
.post-navigation .nav-previous:hover .post-title {
text-decoration: underline;
text-decoration-thickness: 1px;
}
.pagination, .pagination,
.comments-pagination { .comments-pagination {
border-top: 3px solid var(--global--color-border); border-top: 3px solid var(--global--color-border);
@ -5326,6 +5362,24 @@ h1.page-title {
color: var(--pagination--color-link-hover); color: var(--pagination--color-link-hover);
} }
.is-dark-theme .pagination .nav-links a:active,
.is-dark-theme .pagination .nav-links a:hover:active,
.is-dark-theme .pagination .nav-links a:hover:focus,
.is-dark-theme .comments-pagination .nav-links a:active,
.is-dark-theme .comments-pagination .nav-links a:hover:active,
.is-dark-theme .comments-pagination .nav-links a:hover:focus {
color: var(--global--color-background);
}
.has-background-white .pagination .nav-links a:active,
.has-background-white .pagination .nav-links a:hover:active,
.has-background-white .pagination .nav-links a:hover:focus,
.has-background-white .comments-pagination .nav-links a:active,
.has-background-white .comments-pagination .nav-links a:hover:active,
.has-background-white .comments-pagination .nav-links a:hover:focus {
color: var(--global--color-white);
}
.pagination .nav-links > *, .pagination .nav-links > *,
.comments-pagination .nav-links > * { .comments-pagination .nav-links > * {
color: var(--pagination--color-text); color: var(--pagination--color-text);
@ -5339,7 +5393,12 @@ h1.page-title {
.pagination .nav-links > *.current, .pagination .nav-links > *.current,
.comments-pagination .nav-links > *.current { .comments-pagination .nav-links > *.current {
border-bottom: 1px solid var(--pagination--color-text); text-decoration: underline;
}
.pagination .nav-links > *:not(.dots):not(.current):hover,
.comments-pagination .nav-links > *:not(.dots):not(.current):hover {
text-decoration-style: dotted;
} }
.pagination .nav-links > *:first-child, .pagination .nav-links > *:first-child,
@ -5426,6 +5485,12 @@ h1.page-title {
grid-template-columns: repeat(3, 1fr); grid-template-columns: repeat(3, 1fr);
} }
} }
@media only screen and (max-width: 481px) {
.widget-area {
margin-top: calc(3 * var(--global--spacing-vertical));
}
}
.widget-area ul { .widget-area ul {
list-style-type: none; list-style-type: none;
@ -5621,7 +5686,7 @@ h1.page-title {
color: var(--global--color-white); color: var(--global--color-white);
} }
.has-background:not(.has-background-background-color) a:not(.wp-block-button__link), .has-background a,
.has-background p, .has-background p,
.has-background h1, .has-background h1,
.has-background h2, .has-background h2,

2
wp-includes/version.php
View File

@ -13,7 +13,7 @@
* *
* @global string $wp_version * @global string $wp_version
*/ */
$wp_version = '5.7-alpha-49725'; $wp_version = '5.7-alpha-49726';
/** /**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema. * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.