Twenty Twenty-One: Import the latest changes.

For a full list of changes since [49320], see 461dcf9cd...5759e96.

Props poena, melchoyce, aristath, justinahinon, ryelle.
See #51526.

git-svn-id: https://develop.svn.wordpress.org/trunk@49330 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Jonathan Desrosiers 2020-10-27 17:05:51 +00:00
parent d56906f5b0
commit 21aa04629e
8 changed files with 1496 additions and 874 deletions

View File

@ -10,12 +10,17 @@
*/
get_header();
$description = get_the_archive_description();
?>
<?php if ( have_posts() ) : ?>
<header class="page-header alignwide">
<?php the_archive_title( '<h1 class="page-title">', '</h1>' ); ?>
<?php if ( $description ) : ?>
<div class="archive-description"><?php echo wp_kses_post( wpautop( $description ) ); ?></div>
<?php endif; ?>
</header><!-- .page-header -->
<?php while ( have_posts() ) : ?>

View File

@ -10,7 +10,6 @@
/* Headings */
/* Block: Latest posts */
/* Colors */
/* white 50% opacity used in form fields.*/
/* Body text color, site title, footer text color. */
/* Headings */
/* Mint, default body background */
@ -30,131 +29,6 @@
/* Widgets */
}
/* Button extends */
.wp-block-button__link {
line-height: 1.5;
color: #d1e4dd;
cursor: pointer;
font-weight: 500;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-size: 1.25rem;
background-color: #39414d;
border-radius: 0;
border: 3px solid #39414d;
text-decoration: none;
padding: 15px 30px;
}
.wp-block-file .wp-block-file__button {
line-height: 1.5;
color: #d1e4dd;
cursor: pointer;
font-weight: 500;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-size: 1.25rem;
background-color: #39414d;
border-radius: 0;
border: 3px solid #39414d;
text-decoration: none;
padding: 15px 30px;
}
.wp-block-search .wp-block-search__button {
line-height: 1.5;
color: #d1e4dd;
cursor: pointer;
font-weight: 500;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-size: 1.25rem;
background-color: #39414d;
border-radius: 0;
border: 3px solid #39414d;
text-decoration: none;
padding: 15px 30px;
}
.wp-block-button__link:before, .wp-block-file .wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .wp-block-button__link:after, .wp-block-file .wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
content: "";
display: block;
height: 0;
width: 0;
}
.wp-block-button__link:before {
margin-bottom: -calc(1em - 0);
}
.wp-block-file .wp-block-file__button:before {
margin-bottom: -calc(1em - 0);
}
.wp-block-search .wp-block-search__button:before {
margin-bottom: -calc(1em - 0);
}
.wp-block-button__link:after {
margin-top: -calc(1em - 0);
}
.wp-block-file .wp-block-file__button:after {
margin-top: -calc(1em - 0);
}
.wp-block-search .wp-block-search__button:after {
margin-top: -calc(1em - 0);
}
.wp-block-button__link:active {
color: #39414d;
background-color: #d1e4dd;
}
.wp-block-file .wp-block-file__button:active {
color: #39414d;
background-color: #d1e4dd;
}
.wp-block-search .wp-block-search__button:active {
color: #39414d;
background-color: #d1e4dd;
}
.wp-block-button__link:hover {
color: #39414d;
background: transparent;
}
.wp-block-file .wp-block-file__button:hover {
color: #39414d;
background: transparent;
}
.wp-block-search .wp-block-search__button:hover {
color: #39414d;
background: transparent;
}
.wp-block-button__link:focus, .wp-block-file .wp-block-file__button:focus, .wp-block-search .wp-block-search__button:focus, .has-focus.wp-block-button__link, .wp-block-file .has-focus.wp-block-file__button, .wp-block-search .has-focus.wp-block-search__button {
outline-offset: -4px;
outline: 2px dotted currentColor;
}
.wp-block-button__link:disabled {
background-color: rgba(255, 255, 255, 0.5);
border-color: rgba(255, 255, 255, 0.5);
color: #39414d;
}
.wp-block-file .wp-block-file__button:disabled {
background-color: rgba(255, 255, 255, 0.5);
border-color: rgba(255, 255, 255, 0.5);
color: #39414d;
}
.wp-block-search .wp-block-search__button:disabled {
background-color: rgba(255, 255, 255, 0.5);
border-color: rgba(255, 255, 255, 0.5);
color: #39414d;
}
/**
* Repsonsive Styles
*/
@ -400,59 +274,124 @@ a:hover {
color: #28303d;
}
.wp-block-button__link.is-style-outline {
.wp-block-button__link {
line-height: 1.5;
color: #d1e4dd;
cursor: pointer;
font-weight: 500;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-size: 1.25rem;
background-color: #39414d;
border-radius: 0;
border: 3px solid #39414d;
text-decoration: none;
padding: 15px 30px;
}
.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(1em - 0);
}
.wp-block-button__link:after {
margin-top: -calc(1em - 0);
}
.wp-block-button__link:focus {
outline-offset: -6px;
outline: 2px dotted currentColor;
}
.wp-block-button__link:disabled {
background-color: rgba(255, 255, 255, 0.5);
border-color: rgba(255, 255, 255, 0.5);
color: #39414d;
}
/**
* Block Options
*/
.wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background):not(.has-text-color):active {
color: #39414d;
background-color: #d1e4dd;
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background):not(.has-text-color):hover {
color: #39414d;
background: transparent;
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link.has-background:active, .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-background:hover, .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-text-color:active, .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-text-color:hover {
outline-offset: -7px;
outline: 2px dotted currentColor;
}
.wp-block-button.is-style-outline .wp-block-button__link {
color: #39414d;
background: transparent;
border: 3px solid currentColor;
padding: 15px 30px;
}
.is-style-outline .wp-block-button__link {
color: #39414d;
background: transparent;
border: 3px solid currentColor;
}
.wp-block-button__link.is-style-outline:visited {
.wp-block-button.is-style-outline .wp-block-button__link:visited {
color: #39414d;
}
.is-style-outline .wp-block-button__link:visited {
.wp-block-button.is-style-outline .wp-block-button__link:active {
background-color: #39414d;
color: #d1e4dd;
border: 3px solid #39414d;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
background-color: #39414d;
color: #d1e4dd;
border: 3px solid #39414d;
}
.wp-block-button.is-style-outline .wp-block-button__link.has-background {
background: transparent !important;
}
.wp-block-button.is-style-outline .wp-block-button__link.has-background:active {
color: #39414d;
}
.wp-block-button__link.is-style-outline:active {
background-color: #39414d;
color: #d1e4dd;
border: 3px solid #39414d;
}
.wp-block-button__link.is-style-outline:hover {
background-color: #39414d;
color: #d1e4dd;
border: 3px solid #39414d;
}
.is-style-outline .wp-block-button__link:active {
background-color: #39414d;
color: #d1e4dd;
border: 3px solid #39414d;
}
.is-style-outline .wp-block-button__link:hover {
background-color: #39414d;
color: #d1e4dd;
border: 3px solid #39414d;
}
.wp-block-button__link.is-style-outline:focus, .wp-block-button__link.is-style-outline.has-focus,
.is-style-outline .wp-block-button__link:focus,
.is-style-outline .wp-block-button__link.has-focus {
outline-offset: -7px;
background: transparent;
outline: 2px dotted currentColor;
border: 3px solid currentColor;
}
.wp-block-button__link.is-style-squared,
.is-style-squared .wp-block-button__link {
.wp-block-button.is-style-outline .wp-block-button__link.has-background:hover {
color: #39414d;
outline-offset: -7px;
background: transparent;
outline: 2px dotted currentColor;
border: 3px solid currentColor;
}
.wp-block-button.is-style-outline .wp-block-button__link.has-text-color:active {
color: #39414d;
outline-offset: -7px;
background: transparent;
outline: 2px dotted currentColor;
border: 3px solid currentColor;
}
.wp-block-button.is-style-outline .wp-block-button__link.has-text-color:hover {
color: #39414d;
outline-offset: -7px;
background: transparent;
outline: 2px dotted currentColor;
border: 3px solid currentColor;
}
.wp-block-button.is-style-squared {
border-radius: 0;
}
@ -755,9 +694,51 @@ a:hover {
}
.wp-block-file .wp-block-file__button {
line-height: 1.5;
color: #d1e4dd;
cursor: pointer;
font-weight: 500;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-size: 1.25rem;
background-color: #39414d;
border-radius: 0;
border: 3px solid #39414d;
text-decoration: none;
padding: 15px 30px;
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(1em - 0);
}
.wp-block-file .wp-block-file__button:after {
margin-top: -calc(1em - 0);
}
.wp-block-file .wp-block-file__button:focus {
outline-offset: -6px;
outline: 2px dotted currentColor;
}
.wp-block-file .wp-block-file__button:disabled {
background-color: rgba(255, 255, 255, 0.5);
border-color: rgba(255, 255, 255, 0.5);
color: #39414d;
}
.wp-block-file .wp-block-file__button:hover {
color: #39414d;
background: transparent;
}
.wp-block-gallery figcaption {
margin-bottom: 0;
}
@ -1233,6 +1214,12 @@ h6 {
line-height: 1.3;
}
[data-type="core/html"] textarea {
color: #28303d;
border-radius: 0;
padding: 20px;
}
/* Center image block by default in the editor */
.wp-block-image > div {
text-align: center;
@ -1999,12 +1986,49 @@ pre.wp-block-preformatted {
}
.wp-block-search .wp-block-search__button {
line-height: 1.5;
color: #d1e4dd;
cursor: pointer;
font-weight: 500;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-size: 1.25rem;
background-color: #39414d;
border-radius: 0;
border: 3px solid #39414d;
text-decoration: none;
padding: 15px 30px;
box-shadow: none;
margin-left: 0;
background-color: transparent;
color: #39414d;
}
.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(1em - 0);
}
.wp-block-search .wp-block-search__button:after {
margin-top: -calc(1em - 0);
}
.wp-block-search .wp-block-search__button:focus {
outline-offset: -6px;
outline: 2px dotted currentColor;
}
.wp-block-search .wp-block-search__button:disabled {
background-color: rgba(255, 255, 255, 0.5);
border-color: rgba(255, 255, 255, 0.5);
color: #39414d;
}
.wp-block-search .wp-block-search__button:hover {
background-color: #39414d;
color: #d1e4dd;
@ -2239,6 +2263,7 @@ table.wp-calendar-table caption {
pre.wp-block-verse {
padding: 0;
color: currentColor;
}
:root .is-extra-small-text {
@ -2771,4 +2796,4 @@ a {
.has-red-to-purple-gradient-background {
background: linear-gradient(160deg, #e4d1d1, #d1d1e4);
}
/*# sourceMappingURL=ie-editor.css.map */
/*# sourceMappingURL=ie-editor.css.map */

File diff suppressed because it is too large Load Diff

View File

@ -65,7 +65,7 @@
--global--color-yellow: #eeeadd;
--global--color-white: #fff;
--global--color-white-50: rgba(255, 255, 255, 0.5);
/* white 50% opacity used in form fields.*/
--global--color-white-90: rgba(255, 255, 255, 0.9);
--global--color-primary: var(--global--color-dark-gray);
/* Body text color, site title, footer text color. */
--global--color-secondary: var(--global--color-gray);
@ -152,6 +152,7 @@
--primary-nav--color-link-hover: var(--global--color-primary-hover);
--primary-nav--color-text: var(--global--color-primary);
--primary-nav--padding: calc(0.66 * var(--global--spacing-unit));
--primary-nav--border-color: var(--global--color-primary);
/* Pagination */
--pagination--color-text: var(--global--color-primary);
--pagination--color-link-hover: var(--global--color-primary-hover);
@ -208,57 +209,6 @@
}
}
/* Button extends */
.wp-block-button__link, .wp-block-file .wp-block-file__button, .wp-block-search .wp-block-search__button {
line-height: 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);
}
.wp-block-button__link:before, .wp-block-file .wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .wp-block-button__link:after, .wp-block-file .wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
content: "";
display: block;
height: 0;
width: 0;
}
.wp-block-button__link:before, .wp-block-file .wp-block-file__button:before, .wp-block-search .wp-block-search__button:before {
margin-bottom: -calc(.5em * var(--button--line-height) + -.38);
}
.wp-block-button__link:after, .wp-block-file .wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
margin-top: -calc(.5em * var(--button--line-height) + -.39);
}
.wp-block-button__link:active, .wp-block-file .wp-block-file__button:active, .wp-block-search .wp-block-search__button:active {
color: var(--button--color-text-active);
background-color: var(--button--color-background-active);
}
.wp-block-button__link:hover, .wp-block-file .wp-block-file__button:hover, .wp-block-search .wp-block-search__button:hover {
color: var(--button--color-text-hover);
background: transparent;
}
.wp-block-button__link:focus, .wp-block-file .wp-block-file__button:focus, .wp-block-search .wp-block-search__button:focus, .has-focus.wp-block-button__link, .wp-block-file .has-focus.wp-block-file__button, .wp-block-search .has-focus.wp-block-search__button {
outline-offset: -4px;
outline: 2px dotted currentColor;
}
.wp-block-button__link:disabled, .wp-block-file .wp-block-file__button:disabled, .wp-block-search .wp-block-search__button:disabled {
background-color: var(--global--color-white-50);
border-color: var(--global--color-white-50);
color: var(--button--color-text-active);
}
/**
* Repsonsive Styles
*/
@ -465,35 +415,94 @@ a:hover {
color: var(--wp--style--color--link, var(--global--color-primary));
}
.wp-block-button__link.is-style-outline,
.is-style-outline .wp-block-button__link {
.wp-block-button__link {
line-height: 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);
}
.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 {
outline-offset: -6px;
outline: 2px dotted currentColor;
}
.wp-block-button__link:disabled {
background-color: var(--global--color-white-50);
border-color: var(--global--color-white-50);
color: var(--button--color-text-active);
}
/**
* Block Options
*/
.wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background):not(.has-text-color):active {
color: var(--button--color-text-active);
background-color: var(--button--color-background-active);
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background):not(.has-text-color):hover {
color: var(--button--color-text-hover);
background: transparent;
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link.has-background:active, .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-background:hover, .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-text-color:active, .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-text-color:hover {
outline-offset: -7px;
outline: 2px dotted currentColor;
}
.wp-block-button.is-style-outline .wp-block-button__link {
color: var(--button--color-background);
background: transparent;
border: var(--button--border-width) solid currentColor;
padding: var(--button--padding-vertical) var(--button--padding-horizontal);
}
.wp-block-button__link.is-style-outline:visited,
.is-style-outline .wp-block-button__link:visited {
.wp-block-button.is-style-outline .wp-block-button__link:visited {
color: var(--button--color-background);
}
.wp-block-button__link.is-style-outline:active, .wp-block-button__link.is-style-outline:hover,
.is-style-outline .wp-block-button__link:active,
.is-style-outline .wp-block-button__link:hover {
.wp-block-button.is-style-outline .wp-block-button__link:active, .wp-block-button.is-style-outline .wp-block-button__link:hover {
background-color: var(--button--color-background);
color: var(--button--color-text);
border: var(--button--border-width) solid var(--button--color-background);
}
.wp-block-button__link.is-style-outline:focus, .wp-block-button__link.is-style-outline.has-focus,
.is-style-outline .wp-block-button__link:focus,
.is-style-outline .wp-block-button__link.has-focus {
outline-offset: -7px;
background: transparent;
.wp-block-button.is-style-outline .wp-block-button__link.has-background {
background: transparent !important;
}
.wp-block-button__link.is-style-squared,
.is-style-squared .wp-block-button__link {
.wp-block-button.is-style-outline .wp-block-button__link.has-background:active, .wp-block-button.is-style-outline .wp-block-button__link.has-background:hover, .wp-block-button.is-style-outline .wp-block-button__link.has-text-color:active, .wp-block-button.is-style-outline .wp-block-button__link.has-text-color:hover {
color: var(--button--color-background);
outline-offset: -7px;
background: transparent;
outline: 2px dotted currentColor;
border: var(--button--border-width) solid currentColor;
}
.wp-block-button.is-style-squared {
border-radius: 0;
}
@ -660,9 +669,51 @@ a:hover {
}
.wp-block-file .wp-block-file__button {
line-height: 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);
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 {
outline-offset: -6px;
outline: 2px dotted currentColor;
}
.wp-block-file .wp-block-file__button:disabled {
background-color: var(--global--color-white-50);
border-color: var(--global--color-white-50);
color: var(--button--color-text-active);
}
.wp-block-file .wp-block-file__button:hover {
color: var(--button--color-text-hover);
background: transparent;
}
.wp-block-gallery figcaption {
margin-bottom: 0;
}
@ -813,6 +864,12 @@ h6,
line-height: var(--heading--line-height-h6);
}
[data-type="core/html"] textarea {
color: var(--global--color-dark-gray);
border-radius: 0;
padding: var(--global--spacing-unit);
}
/* Center image block by default in the editor */
.wp-block-image > div {
text-align: center;
@ -1444,12 +1501,49 @@ pre.wp-block-preformatted {
}
.wp-block-search .wp-block-search__button {
line-height: 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);
box-shadow: none;
margin-left: 0;
background-color: transparent;
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 {
outline-offset: -6px;
outline: 2px dotted currentColor;
}
.wp-block-search .wp-block-search__button:disabled {
background-color: var(--global--color-white-50);
border-color: var(--global--color-white-50);
color: var(--button--color-text-active);
}
.wp-block-search .wp-block-search__button:hover {
background-color: var(--button--color-background);
color: var(--button--color-text);
@ -1624,6 +1718,7 @@ table.wp-calendar-table caption {
pre.wp-block-verse {
padding: 0;
color: currentColor;
}
:root .is-extra-small-text,
@ -1971,4 +2066,4 @@ a {
background: linear-gradient(160deg, var(--global--color-red), var(--global--color-purple));
}
/*# sourceMappingURL=style-editor.css.map */
/*# sourceMappingURL=style-editor.css.map */

View File

@ -472,3 +472,42 @@ function twenty_twenty_one_password_form( $post = 0 ) {
return $output;
}
add_filter( 'the_password_form', 'twenty_twenty_one_password_form' );
/**
* Filters the list of attachment image attributes.
*
* @since 1.0.0
*
* @param array $attr Array of attribute values for the image markup, keyed by attribute name.
* See wp_get_attachment_image().
* @param WP_Post $attachment Image attachment post.
* @param string|array $size Requested size. Image size or array of width and height values
* (in that order). Default 'thumbnail'.
*
* @return array
*/
function twenty_twenty_one_get_attachment_image_attributes( $attr, $attachment, $size ) {
$width = false;
$height = false;
if ( is_array( $size ) ) {
$width = (int) $size[0];
$height = (int) $size[1];
} elseif ( $attachment && is_object( $attachment ) && $attachment->ID ) {
$meta = wp_get_attachment_metadata( $attachment->ID );
if ( $meta['width'] && $meta['height'] ) {
$width = (int) $meta['width'];
$height = (int) $meta['height'];
}
}
if ( $width && $height ) {
// Add style.
$attr['style'] = isset( $attr['style'] ) ? $attr['style'] : '';
$attr['style'] = 'width:100%;height:' . round( 100 * $meta['height'] / $meta['width'], 2 ) . '%;' . $attr['style'];
}
return $attr;
}
add_filter( 'wp_get_attachment_image_attributes', 'twenty_twenty_one_get_attachment_image_attributes', 10, 3 );

View File

@ -726,6 +726,12 @@
"integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==",
"dev": true
},
"prettier": {
"version": "npm:wp-prettier@2.0.5",
"resolved": "https://registry.npmjs.org/wp-prettier/-/wp-prettier-2.0.5.tgz",
"integrity": "sha512-5GCgdeevIXwR3cW4Qj5XWC5MO1iSCz8+IPn0mMw6awAt/PBiey8yyO7MhePRsaMqghJAhg6Q3QLYWSnUHWkG6A==",
"dev": true
},
"resolve-from": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
@ -5028,12 +5034,6 @@
"integrity": "sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==",
"dev": true
},
"prettier": {
"version": "npm:wp-prettier@2.0.5",
"resolved": "https://registry.npmjs.org/wp-prettier/-/wp-prettier-2.0.5.tgz",
"integrity": "sha512-5GCgdeevIXwR3cW4Qj5XWC5MO1iSCz8+IPn0mMw6awAt/PBiey8yyO7MhePRsaMqghJAhg6Q3QLYWSnUHWkG6A==",
"dev": true
},
"prettier-linter-helpers": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz",

View File

@ -24,7 +24,6 @@ Twenty Twenty-One is distributed under the terms of the GNU GPL.
* Global...............Project-specific, globally available variables.
*
* TOOLS
* Extends..............Global extends.
* Functions............Global functions.
* Mixins...............Global mixins.
*
@ -157,7 +156,7 @@ Twenty Twenty-One is distributed under the terms of the GNU GPL.
--global--color-yellow: #eeeadd;
--global--color-white: #fff;
--global--color-white-50: rgba(255, 255, 255, 0.5);
/* white 50% opacity used in form fields.*/
--global--color-white-90: rgba(255, 255, 255, 0.9);
--global--color-primary: var(--global--color-dark-gray);
/* Body text color, site title, footer text color. */
--global--color-secondary: var(--global--color-gray);
@ -244,6 +243,7 @@ Twenty Twenty-One is distributed under the terms of the GNU GPL.
--primary-nav--color-link-hover: var(--global--color-primary-hover);
--primary-nav--color-text: var(--global--color-primary);
--primary-nav--padding: calc(0.66 * var(--global--spacing-unit));
--primary-nav--border-color: var(--global--color-primary);
/* Pagination */
--pagination--color-text: var(--global--color-primary);
--pagination--color-link-hover: var(--global--color-primary-hover);
@ -300,97 +300,6 @@ Twenty Twenty-One is distributed under the terms of the GNU GPL.
}
}
/* Button extends */
.site .button,
input[type="submit"],
input[type="reset"],
.wp-block-search__button,
.wp-block-button .wp-block-button__link, .wp-block-file .wp-block-file__button {
line-height: 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);
}
.site .button:before,
input[type="submit"]:before,
input[type="reset"]:before,
.wp-block-search__button:before,
.wp-block-button .wp-block-button__link:before, .wp-block-file .wp-block-file__button:before, .site .button:after,
input[type="submit"]:after,
input[type="reset"]:after,
.wp-block-search__button:after,
.wp-block-button .wp-block-button__link:after, .wp-block-file .wp-block-file__button: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, .wp-block-file .wp-block-file__button: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, .wp-block-file .wp-block-file__button:after {
margin-top: -calc(.5em * var(--button--line-height) + -.39);
}
.site .button:active,
input:active[type="submit"],
input:active[type="reset"],
.wp-block-search__button:active,
.wp-block-button .wp-block-button__link:active, .wp-block-file .wp-block-file__button:active {
color: var(--button--color-text-active);
background-color: var(--button--color-background-active);
}
.site .button:hover,
input:hover[type="submit"],
input:hover[type="reset"],
.wp-block-search__button:hover,
.wp-block-button .wp-block-button__link:hover, .wp-block-file .wp-block-file__button:hover {
color: var(--button--color-text-hover);
background: transparent;
}
.site .button:focus,
input:focus[type="submit"],
input:focus[type="reset"],
.wp-block-search__button:focus,
.wp-block-button .wp-block-button__link:focus, .wp-block-file .wp-block-file__button:focus, .site .has-focus.button,
input.has-focus[type="submit"],
input.has-focus[type="reset"],
.has-focus.wp-block-search__button,
.wp-block-button .has-focus.wp-block-button__link, .wp-block-file .has-focus.wp-block-file__button {
outline-offset: -4px;
outline: 2px dotted currentColor;
}
.site .button:disabled,
input:disabled[type="submit"],
input:disabled[type="reset"],
.wp-block-search__button:disabled,
.wp-block-button .wp-block-button__link:disabled, .wp-block-file .wp-block-file__button:disabled {
background-color: var(--global--color-white-50);
border-color: var(--global--color-white-50);
color: var(--button--color-text-active);
}
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
========================================================================== */
@ -1157,9 +1066,9 @@ input[type="color"],
border: var(--form--border-width) solid var(--form--border-color);
border-radius: var(--form--border-radius);
color: var(--form--color-text);
background: var(--global--color-white-50);
line-height: var(--global--line-height-body);
padding: var(--form--spacing-unit);
margin: 0 2px;
}
input[type="text"]:focus,
@ -1178,8 +1087,8 @@ input[type="datetime-local"]:focus,
input[type="color"]:focus,
.site textarea:focus {
color: var(--form--color-text);
outline: 1px solid var(--form--border-color);
background: var(--global--color-white);
outline-offset: 2px;
outline: 2px dotted var(--form--border-color);
}
input[type="text"]:disabled,
@ -1200,16 +1109,33 @@ input[type="color"]:disabled,
opacity: 0.7;
}
input[type="search"]:focus {
outline-offset: 0;
.has-background-dark input[type="text"], .has-background-dark
input[type="email"], .has-background-dark
input[type="url"], .has-background-dark
input[type="password"], .has-background-dark
input[type="search"], .has-background-dark
input[type="number"], .has-background-dark
input[type="tel"], .has-background-dark
input[type="date"], .has-background-dark
input[type="month"], .has-background-dark
input[type="week"], .has-background-dark
input[type="time"], .has-background-dark
input[type="datetime"], .has-background-dark
input[type="datetime-local"], .has-background-dark
input[type="color"], .has-background-dark
.site textarea {
background: var(--global--color-white-90);
}
input[type="date"] {
background: var(--global--color-white);
input[type="search"]:focus {
outline-offset: -7px;
}
.has-background-dark input[type="search"]:focus {
outline-color: var(--global--color-background);
}
input[type="color"] {
background: var(--global--color-white);
padding: calc(var(--form--spacing-unit) / 2);
height: calc(4 * var(--form--spacing-unit));
}
@ -1234,7 +1160,15 @@ select {
}
select:focus {
outline: 1px solid var(--form--border-color);
outline-offset: 2px;
outline: 2px dotted var(--form--border-color);
}
.has-background-dark select {
/* stylelint-disable */
background: var(--global--color-white-90) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='%2328303d'><polygon points='0,0 10,0 5,5'/></svg>") no-repeat;
/* stylelint-enable */
background-position: left var(--form--spacing-unit) top 60%;
}
textarea {
@ -1260,17 +1194,20 @@ License: MIT.
position: relative;
width: 25px;
height: 25px;
background: var(--global--color-white-50);
border: var(--form--border-width) solid var(--form--border-color);
outline-offset: 0;
background: var(--global--color-white);
}
input[type="checkbox"]:disabled,
input[type="radio"]:disabled {
opacity: 0.7;
}
.has-background-dark input[type="checkbox"], .has-background-dark
input[type="radio"] {
background: var(--global--color-white-90);
}
input[type="checkbox"]:focus {
outline: 1px solid var(--form--border-color);
background: var(--global--color-white);
outline-offset: 2px;
outline: 2px dotted var(--form--border-color);
}
input[type="checkbox"]:after {
content: "";
@ -1287,7 +1224,6 @@ License: MIT.
transform: rotate(-30deg);
}
input[type="checkbox"]:checked {
background: var(--global--color-white);
color: var(--form--color-text);
}
input[type="checkbox"]:checked:after {
@ -1297,9 +1233,8 @@ License: MIT.
border-radius: 50%;
}
input[type="radio"]:focus {
background: var(--global--color-white);
border: 4px solid var(--form--border-color);
outline: 1px dotted transparent;
outline-offset: 2px;
outline: 2px dotted var(--form--border-color);
}
input[type="radio"]:after {
content: "";
@ -1314,15 +1249,14 @@ License: MIT.
background: var(--form--color-text);
}
input[type="radio"]:checked {
background: var(--global--color-white);
border: 4px solid var(--form--border-color);
outline: 1px dotted transparent;
}
input[type="radio"]:checked:after {
opacity: 1;
}
input[type="radio"]:checked:focus {
box-shadow: 0 0 0 2px var(--form--border-color);
outline-offset: 4px;
outline: 2px dotted var(--form--border-color);
}
}
@ -1429,6 +1363,10 @@ fieldset input[type="checkbox"] + label {
margin-bottom: var(--global--spacing-unit);
}
::-moz-placeholder {
opacity: 1;
}
img {
display: block;
height: auto;
@ -1541,40 +1479,149 @@ a:hover {
/**
* Button
*/
/**
* Block Options
*/
.wp-block-button.is-style-outline.wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link {
color: var(--button--color-background);
background: transparent;
border: var(--button--border-width) solid currentColor;
.site .button,
input[type="submit"],
input[type="reset"],
.wp-block-search__button,
.wp-block-button .wp-block-button__link {
line-height: 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);
}
.wp-block-button.is-style-outline.wp-block-button__link:visited,
.wp-block-button.is-style-outline .wp-block-button__link:visited {
color: var(--button--color-background);
.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;
}
.wp-block-button.is-style-outline.wp-block-button__link:active, .wp-block-button.is-style-outline.wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:active,
.wp-block-button.is-style-outline .wp-block-button__link:hover {
.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,
input[type="submit"]:focus,
input[type="reset"]:focus,
.wp-block-search__button:focus,
.wp-block-button .wp-block-button__link:focus {
outline-offset: -6px;
outline: 2px dotted currentColor;
}
.site .button:disabled,
input[type="submit"]:disabled,
input[type="reset"]:disabled,
.wp-block-search__button:disabled,
.wp-block-button .wp-block-button__link:disabled {
background-color: var(--global--color-white-50);
border-color: var(--global--color-white-50);
color: var(--button--color-text-active);
}
.site .button:active,
input[type="submit"]:active,
input[type="reset"]:active,
.wp-block-search .wp-block-search__button:active,
.wp-block-file .wp-block-file__button:active {
color: var(--button--color-text-active);
background-color: var(--button--color-background-active);
}
.site .button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
.wp-block-search .wp-block-search__button:hover,
.wp-block-file .wp-block-file__button:hover {
color: var(--button--color-text-hover);
background: transparent;
}
/**
* Block Options
*/
.wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background):not(.has-text-color):active {
color: var(--button--color-text-active);
background-color: var(--button--color-background-active);
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background):not(.has-text-color):hover {
color: var(--button--color-text-hover);
background: transparent;
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link.has-background:active, .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-background:hover, .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-background:focus, .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-text-color:active, .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-text-color:hover, .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-text-color:focus {
outline-offset: -7px;
outline: 2px dotted currentColor;
}
.wp-block-button.is-style-outline .wp-block-button__link {
background: transparent;
padding: var(--button--padding-vertical) var(--button--padding-horizontal);
}
.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color) {
color: var(--button--color-background);
border: var(--button--border-width) solid currentColor;
}
.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):active, .wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):hover {
background-color: var(--button--color-background);
color: var(--button--color-text);
border: var(--button--border-width) solid var(--button--color-background);
}
.wp-block-button.is-style-outline.wp-block-button__link:focus, .wp-block-button.is-style-outline.wp-block-button__link.has-focus,
.wp-block-button.is-style-outline .wp-block-button__link:focus,
.wp-block-button.is-style-outline .wp-block-button__link.has-focus {
.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):focus {
outline-offset: -7px;
background: transparent;
outline: 2px dotted var(--button--color-background);
color: var(--button--color-background);
}
.wp-block-button.is-style-squared .wp-block-button__link {
.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):visited {
color: var(--button--color-background);
}
.wp-block-button.is-style-outline .wp-block-button__link.has-background, .wp-block-button.is-style-outline .wp-block-button__link.has-text-color {
border: var(--button--border-width) solid currentColor;
}
.wp-block-button.is-style-outline .wp-block-button__link.has-background:active, .wp-block-button.is-style-outline .wp-block-button__link.has-background:hover, .wp-block-button.is-style-outline .wp-block-button__link.has-background:focus, .wp-block-button.is-style-outline .wp-block-button__link.has-text-color:active, .wp-block-button.is-style-outline .wp-block-button__link.has-text-color:hover, .wp-block-button.is-style-outline .wp-block-button__link.has-text-color:focus {
outline-offset: -7px;
background: transparent;
outline: 2px dotted currentColor;
border: var(--button--border-width) solid currentColor;
}
.wp-block-button .is-style-squared .wp-block-button__link {
border-radius: 0;
}
@ -1822,9 +1869,46 @@ a:hover {
}
.wp-block-file .wp-block-file__button {
line-height: 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);
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 {
outline-offset: -6px;
outline: 2px dotted currentColor;
}
.wp-block-file .wp-block-file__button:disabled {
background-color: var(--global--color-white-50);
border-color: var(--global--color-white-50);
color: var(--button--color-text-active);
}
.wp-block-gallery {
margin: 0 auto;
}
@ -2396,11 +2480,28 @@ dd {
.wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container {
background: var(--global--color-background);
box-shadow: var(--global--elevation);
margin: 0;
padding: 0;
position: absolute;
top: 100%;
border: 1px solid var(--primary-nav--border-color);
}
.wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container:before, .wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container:after {
content: "";
display: block;
position: absolute;
width: 0;
top: -10px;
right: var(--global--spacing-horizontal);
border-style: solid;
border-color: var(--primary-nav--border-color) transparent;
border-width: 0 7px 10px 7px;
}
.wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container:after {
top: -9px;
border-color: var(--global--color-background) transparent;
}
.wp-block-navigation:not(.has-background) .wp-block-navigation__container {
@ -2415,6 +2516,11 @@ dd {
color: var(--primary-nav--color-link-hover);
}
.wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:hover {
text-decoration: underline;
text-decoration-style: dotted;
}
.wp-block-navigation:not(.has-text-color) .wp-block-navigation-link__content {
color: currentColor;
}
@ -3729,6 +3835,12 @@ h1.page-title {
margin-left: calc(0.5 * var(--global--spacing-unit));
}
.archive-description {
margin-top: var(--global--spacing-vertical);
font-size: var(--global--font-size-xl);
line-height: var(--global--line-height-heading);
}
.error404 main p {
font-size: var(--global--font-size-lg);
margin-bottom: calc(var(--global--spacing-vertical) * 1.6666666667);
@ -4283,15 +4395,26 @@ h1.page-title {
transition: all 0.5s ease;
z-index: 88888;
}
.primary-navigation > div > .menu-wrapper > li > .sub-menu:before, .primary-navigation > div > .menu-wrapper > li > .sub-menu:after {
content: "";
display: block;
position: absolute;
width: 0;
top: -10px;
right: var(--global--spacing-horizontal);
border-style: solid;
border-color: var(--primary-nav--border-color) transparent;
border-width: 0 7px 10px 7px;
}
.primary-navigation > div > .menu-wrapper > li > .sub-menu:after {
top: -9px;
border-color: var(--global--color-background) transparent;
}
.primary-navigation > div > .menu-wrapper > li > .sub-menu li {
background: var(--global--color-background);
}
}
.primary-navigation > div > .menu-wrapper > li > .sub-menu .sub-menu {
width: 100%;
}
.primary-navigation .primary-menu > .menu-item:hover > a {
color: var(--primary-nav--color-link-hover);
}
@ -4367,6 +4490,11 @@ h1.page-title {
padding: 0;
list-style: none;
margin-right: var(--primary-nav--padding);
border: 1px solid var(--primary-nav--border-color);
}
.primary-navigation .sub-menu .sub-menu {
border: none;
}
@media only screen and (min-width: 482px) {
@ -5066,4 +5194,12 @@ footer {
.is-IE.has-background-dark .skip-link:focus {
color: #21759b;
}
.is-IE .navigation .nav-links {
display: block;
}
.is-IE .post-thumbnail .wp-post-image {
min-width: auto;
}

View File

@ -24,7 +24,6 @@ Twenty Twenty-One is distributed under the terms of the GNU GPL.
* Global...............Project-specific, globally available variables.
*
* TOOLS
* Extends..............Global extends.
* Functions............Global functions.
* Mixins...............Global mixins.
*
@ -157,7 +156,7 @@ Twenty Twenty-One is distributed under the terms of the GNU GPL.
--global--color-yellow: #eeeadd;
--global--color-white: #fff;
--global--color-white-50: rgba(255, 255, 255, 0.5);
/* white 50% opacity used in form fields.*/
--global--color-white-90: rgba(255, 255, 255, 0.9);
--global--color-primary: var(--global--color-dark-gray);
/* Body text color, site title, footer text color. */
--global--color-secondary: var(--global--color-gray);
@ -244,6 +243,7 @@ Twenty Twenty-One is distributed under the terms of the GNU GPL.
--primary-nav--color-link-hover: var(--global--color-primary-hover);
--primary-nav--color-text: var(--global--color-primary);
--primary-nav--padding: calc(0.66 * var(--global--spacing-unit));
--primary-nav--border-color: var(--global--color-primary);
/* Pagination */
--pagination--color-text: var(--global--color-primary);
--pagination--color-link-hover: var(--global--color-primary-hover);
@ -300,97 +300,6 @@ Twenty Twenty-One is distributed under the terms of the GNU GPL.
}
}
/* Button extends */
.site .button,
input[type="submit"],
input[type="reset"],
.wp-block-search__button,
.wp-block-button .wp-block-button__link, .wp-block-file .wp-block-file__button {
line-height: 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);
}
.site .button:before,
input[type="submit"]:before,
input[type="reset"]:before,
.wp-block-search__button:before,
.wp-block-button .wp-block-button__link:before, .wp-block-file .wp-block-file__button:before, .site .button:after,
input[type="submit"]:after,
input[type="reset"]:after,
.wp-block-search__button:after,
.wp-block-button .wp-block-button__link:after, .wp-block-file .wp-block-file__button: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, .wp-block-file .wp-block-file__button: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, .wp-block-file .wp-block-file__button:after {
margin-top: -calc(.5em * var(--button--line-height) + -.39);
}
.site .button:active,
input:active[type="submit"],
input:active[type="reset"],
.wp-block-search__button:active,
.wp-block-button .wp-block-button__link:active, .wp-block-file .wp-block-file__button:active {
color: var(--button--color-text-active);
background-color: var(--button--color-background-active);
}
.site .button:hover,
input:hover[type="submit"],
input:hover[type="reset"],
.wp-block-search__button:hover,
.wp-block-button .wp-block-button__link:hover, .wp-block-file .wp-block-file__button:hover {
color: var(--button--color-text-hover);
background: transparent;
}
.site .button:focus,
input:focus[type="submit"],
input:focus[type="reset"],
.wp-block-search__button:focus,
.wp-block-button .wp-block-button__link:focus, .wp-block-file .wp-block-file__button:focus, .site .has-focus.button,
input.has-focus[type="submit"],
input.has-focus[type="reset"],
.has-focus.wp-block-search__button,
.wp-block-button .has-focus.wp-block-button__link, .wp-block-file .has-focus.wp-block-file__button {
outline-offset: -4px;
outline: 2px dotted currentColor;
}
.site .button:disabled,
input:disabled[type="submit"],
input:disabled[type="reset"],
.wp-block-search__button:disabled,
.wp-block-button .wp-block-button__link:disabled, .wp-block-file .wp-block-file__button:disabled {
background-color: var(--global--color-white-50);
border-color: var(--global--color-white-50);
color: var(--button--color-text-active);
}
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
========================================================================== */
@ -1161,9 +1070,9 @@ input[type="color"],
border: var(--form--border-width) solid var(--form--border-color);
border-radius: var(--form--border-radius);
color: var(--form--color-text);
background: var(--global--color-white-50);
line-height: var(--global--line-height-body);
padding: var(--form--spacing-unit);
margin: 0 2px;
}
input[type="text"]:focus,
@ -1182,8 +1091,8 @@ input[type="datetime-local"]:focus,
input[type="color"]:focus,
.site textarea:focus {
color: var(--form--color-text);
outline: 1px solid var(--form--border-color);
background: var(--global--color-white);
outline-offset: 2px;
outline: 2px dotted var(--form--border-color);
}
input[type="text"]:disabled,
@ -1204,16 +1113,33 @@ input[type="color"]:disabled,
opacity: 0.7;
}
input[type="search"]:focus {
outline-offset: 0;
.has-background-dark input[type="text"], .has-background-dark
input[type="email"], .has-background-dark
input[type="url"], .has-background-dark
input[type="password"], .has-background-dark
input[type="search"], .has-background-dark
input[type="number"], .has-background-dark
input[type="tel"], .has-background-dark
input[type="date"], .has-background-dark
input[type="month"], .has-background-dark
input[type="week"], .has-background-dark
input[type="time"], .has-background-dark
input[type="datetime"], .has-background-dark
input[type="datetime-local"], .has-background-dark
input[type="color"], .has-background-dark
.site textarea {
background: var(--global--color-white-90);
}
input[type="date"] {
background: var(--global--color-white);
input[type="search"]:focus {
outline-offset: -7px;
}
.has-background-dark input[type="search"]:focus {
outline-color: var(--global--color-background);
}
input[type="color"] {
background: var(--global--color-white);
padding: calc(var(--form--spacing-unit) / 2);
height: calc(4 * var(--form--spacing-unit));
}
@ -1239,7 +1165,15 @@ select {
}
select:focus {
outline: 1px solid var(--form--border-color);
outline-offset: 2px;
outline: 2px dotted var(--form--border-color);
}
.has-background-dark select {
/* stylelint-disable */
background: var(--global--color-white-90) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='%2328303d'><polygon points='0,0 10,0 5,5'/></svg>") no-repeat;
/* stylelint-enable */
background-position: right var(--form--spacing-unit) top 60%;
}
textarea {
@ -1265,17 +1199,20 @@ License: MIT.
position: relative;
width: 25px;
height: 25px;
background: var(--global--color-white-50);
border: var(--form--border-width) solid var(--form--border-color);
outline-offset: 0;
background: var(--global--color-white);
}
input[type="checkbox"]:disabled,
input[type="radio"]:disabled {
opacity: 0.7;
}
.has-background-dark input[type="checkbox"], .has-background-dark
input[type="radio"] {
background: var(--global--color-white-90);
}
input[type="checkbox"]:focus {
outline: 1px solid var(--form--border-color);
background: var(--global--color-white);
outline-offset: 2px;
outline: 2px dotted var(--form--border-color);
}
input[type="checkbox"]:after {
content: "";
@ -1292,7 +1229,6 @@ License: MIT.
transform: rotate(30deg);
}
input[type="checkbox"]:checked {
background: var(--global--color-white);
color: var(--form--color-text);
}
input[type="checkbox"]:checked:after {
@ -1302,9 +1238,8 @@ License: MIT.
border-radius: 50%;
}
input[type="radio"]:focus {
background: var(--global--color-white);
border: 4px solid var(--form--border-color);
outline: 1px dotted transparent;
outline-offset: 2px;
outline: 2px dotted var(--form--border-color);
}
input[type="radio"]:after {
content: "";
@ -1319,15 +1254,14 @@ License: MIT.
background: var(--form--color-text);
}
input[type="radio"]:checked {
background: var(--global--color-white);
border: 4px solid var(--form--border-color);
outline: 1px dotted transparent;
}
input[type="radio"]:checked:after {
opacity: 1;
}
input[type="radio"]:checked:focus {
box-shadow: 0 0 0 2px var(--form--border-color);
outline-offset: 4px;
outline: 2px dotted var(--form--border-color);
}
}
@ -1434,6 +1368,10 @@ fieldset input[type="checkbox"] + label {
margin-bottom: var(--global--spacing-unit);
}
::-moz-placeholder {
opacity: 1;
}
img {
display: block;
height: auto;
@ -1546,40 +1484,149 @@ a:hover {
/**
* Button
*/
/**
* Block Options
*/
.wp-block-button.is-style-outline.wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link {
color: var(--button--color-background);
background: transparent;
border: var(--button--border-width) solid currentColor;
.site .button,
input[type="submit"],
input[type="reset"],
.wp-block-search__button,
.wp-block-button .wp-block-button__link {
line-height: 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);
}
.wp-block-button.is-style-outline.wp-block-button__link:visited,
.wp-block-button.is-style-outline .wp-block-button__link:visited {
color: var(--button--color-background);
.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;
}
.wp-block-button.is-style-outline.wp-block-button__link:active, .wp-block-button.is-style-outline.wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:active,
.wp-block-button.is-style-outline .wp-block-button__link:hover {
.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,
input[type="submit"]:focus,
input[type="reset"]:focus,
.wp-block-search__button:focus,
.wp-block-button .wp-block-button__link:focus {
outline-offset: -6px;
outline: 2px dotted currentColor;
}
.site .button:disabled,
input[type="submit"]:disabled,
input[type="reset"]:disabled,
.wp-block-search__button:disabled,
.wp-block-button .wp-block-button__link:disabled {
background-color: var(--global--color-white-50);
border-color: var(--global--color-white-50);
color: var(--button--color-text-active);
}
.site .button:active,
input[type="submit"]:active,
input[type="reset"]:active,
.wp-block-search .wp-block-search__button:active,
.wp-block-file .wp-block-file__button:active {
color: var(--button--color-text-active);
background-color: var(--button--color-background-active);
}
.site .button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
.wp-block-search .wp-block-search__button:hover,
.wp-block-file .wp-block-file__button:hover {
color: var(--button--color-text-hover);
background: transparent;
}
/**
* Block Options
*/
.wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background):not(.has-text-color):active {
color: var(--button--color-text-active);
background-color: var(--button--color-background-active);
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background):not(.has-text-color):hover {
color: var(--button--color-text-hover);
background: transparent;
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link.has-background:active, .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-background:hover, .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-background:focus, .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-text-color:active, .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-text-color:hover, .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-text-color:focus {
outline-offset: -7px;
outline: 2px dotted currentColor;
}
.wp-block-button.is-style-outline .wp-block-button__link {
background: transparent;
padding: var(--button--padding-vertical) var(--button--padding-horizontal);
}
.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color) {
color: var(--button--color-background);
border: var(--button--border-width) solid currentColor;
}
.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):active, .wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):hover {
background-color: var(--button--color-background);
color: var(--button--color-text);
border: var(--button--border-width) solid var(--button--color-background);
}
.wp-block-button.is-style-outline.wp-block-button__link:focus, .wp-block-button.is-style-outline.wp-block-button__link.has-focus,
.wp-block-button.is-style-outline .wp-block-button__link:focus,
.wp-block-button.is-style-outline .wp-block-button__link.has-focus {
.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):focus {
outline-offset: -7px;
background: transparent;
outline: 2px dotted var(--button--color-background);
color: var(--button--color-background);
}
.wp-block-button.is-style-squared .wp-block-button__link {
.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):visited {
color: var(--button--color-background);
}
.wp-block-button.is-style-outline .wp-block-button__link.has-background, .wp-block-button.is-style-outline .wp-block-button__link.has-text-color {
border: var(--button--border-width) solid currentColor;
}
.wp-block-button.is-style-outline .wp-block-button__link.has-background:active, .wp-block-button.is-style-outline .wp-block-button__link.has-background:hover, .wp-block-button.is-style-outline .wp-block-button__link.has-background:focus, .wp-block-button.is-style-outline .wp-block-button__link.has-text-color:active, .wp-block-button.is-style-outline .wp-block-button__link.has-text-color:hover, .wp-block-button.is-style-outline .wp-block-button__link.has-text-color:focus {
outline-offset: -7px;
background: transparent;
outline: 2px dotted currentColor;
border: var(--button--border-width) solid currentColor;
}
.wp-block-button .is-style-squared .wp-block-button__link {
border-radius: 0;
}
@ -1827,9 +1874,46 @@ a:hover {
}
.wp-block-file .wp-block-file__button {
line-height: 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);
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 {
outline-offset: -6px;
outline: 2px dotted currentColor;
}
.wp-block-file .wp-block-file__button:disabled {
background-color: var(--global--color-white-50);
border-color: var(--global--color-white-50);
color: var(--button--color-text-active);
}
.wp-block-gallery {
margin: 0 auto;
}
@ -2401,11 +2485,28 @@ dd {
.wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container {
background: var(--global--color-background);
box-shadow: var(--global--elevation);
margin: 0;
padding: 0;
position: absolute;
top: 100%;
border: 1px solid var(--primary-nav--border-color);
}
.wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container:before, .wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container:after {
content: "";
display: block;
position: absolute;
width: 0;
top: -10px;
left: var(--global--spacing-horizontal);
border-style: solid;
border-color: var(--primary-nav--border-color) transparent;
border-width: 0 7px 10px 7px;
}
.wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container:after {
top: -9px;
border-color: var(--global--color-background) transparent;
}
.wp-block-navigation:not(.has-background) .wp-block-navigation__container {
@ -2420,6 +2521,11 @@ dd {
color: var(--primary-nav--color-link-hover);
}
.wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:hover {
text-decoration: underline;
text-decoration-style: dotted;
}
.wp-block-navigation:not(.has-text-color) .wp-block-navigation-link__content {
color: currentColor;
}
@ -3739,6 +3845,12 @@ h1.page-title {
margin-right: calc(0.5 * var(--global--spacing-unit));
}
.archive-description {
margin-top: var(--global--spacing-vertical);
font-size: var(--global--font-size-xl);
line-height: var(--global--line-height-heading);
}
.error404 main p {
font-size: var(--global--font-size-lg);
margin-bottom: calc(var(--global--spacing-vertical) * 1.6666666667);
@ -4293,15 +4405,26 @@ h1.page-title {
transition: all 0.5s ease;
z-index: 88888;
}
.primary-navigation > div > .menu-wrapper > li > .sub-menu:before, .primary-navigation > div > .menu-wrapper > li > .sub-menu:after {
content: "";
display: block;
position: absolute;
width: 0;
top: -10px;
left: var(--global--spacing-horizontal);
border-style: solid;
border-color: var(--primary-nav--border-color) transparent;
border-width: 0 7px 10px 7px;
}
.primary-navigation > div > .menu-wrapper > li > .sub-menu:after {
top: -9px;
border-color: var(--global--color-background) transparent;
}
.primary-navigation > div > .menu-wrapper > li > .sub-menu li {
background: var(--global--color-background);
}
}
.primary-navigation > div > .menu-wrapper > li > .sub-menu .sub-menu {
width: 100%;
}
.primary-navigation .primary-menu > .menu-item:hover > a {
color: var(--primary-nav--color-link-hover);
}
@ -4377,6 +4500,11 @@ h1.page-title {
padding: 0;
list-style: none;
margin-left: var(--primary-nav--padding);
border: 1px solid var(--primary-nav--border-color);
}
.primary-navigation .sub-menu .sub-menu {
border: none;
}
@media only screen and (min-width: 482px) {
@ -5078,4 +5206,12 @@ footer {
color: #21759b;
}
.is-IE .navigation .nav-links {
display: block;
}
.is-IE .post-thumbnail .wp-post-image {
min-width: auto;
}
/*# sourceMappingURL=style.css.map */