Bundled Themes: Update Twenty Twenty.

This brings `trunk`’s version of Twenty Twenty in-sync with GitHub.

For a complete list of changes since [46271], see 932b16248...dd7032f

Props anlino, ianbelanger, nielslange, acosmin, netweb, williampatton, adhitya03, phpdocs, acalfieri, itowhid06, littlebigthing, aristath, karmatosed, poena.
See #48110.
Built from https://develop.svn.wordpress.org/trunk@46357


git-svn-id: http://core.svn.wordpress.org/trunk@46156 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
desrosj 2019-09-30 17:41:57 +00:00
parent 6566808e8a
commit 2abcce6dfc
68 changed files with 16579 additions and 16787 deletions

View File

@ -12,7 +12,7 @@ get_header();
<main id="site-content" role="main">
<div class="section-inner thin">
<div class="section-inner thin error404-content">
<h1 class="entry-title"><?php _e( 'Page Not Found', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></h1>
@ -21,13 +21,15 @@ get_header();
<?php
get_search_form(
array(
'label' => __( '404 not found', 'twentytwenty' ),
'label' => _x( '404 not found', 'Label', 'twentytwenty' ),
)
);
?>
</div><!-- .section-inner -->
<?php get_template_part( 'template-parts/footer-menus-widgets' ); ?>
</main><!-- #site-content -->
<?php

View File

@ -13,7 +13,7 @@
.editor-styles-wrapper > * {
color: #000;
font-family: Inter, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
font-size: 18px;
}
@ -45,102 +45,9 @@
src: url(data:application/font-woff2;charset=utf-8;base64,d09GMgABAAAAAAMoAA0AAAAACDQAAALTAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP0ZGVE0cGh4GYACCahEICjx3CywAATYCJANUBCAFhiEHgWwbXQfILgpsY+rQRRARwyAs6uL7pxzYhxEE+32b3aeHmifR6tklkS9hiZA0ewkqGRJE+H7/+6378ASViK/PGeavqJyOzsceKi1s3BCiQsiOdn1r/RBgIJYEgCUhbm/8/8/h4saPssnTNkkiWUBrTRtjmQSajw3Ui3pZ3LYDPD+XG2C3JA/yKAS8/rU5eNfuGqRf4eNNgV4YAlIIgxglEkWe6FYpq10+wi3g+/nUgvgPFczNrz/RsTgVm/zfbPuHZlsuQECxuyqBcQwKFBjFgKO8AqP4bAN9tFJtnM9xPcbNjeXS/x1wY/xU52f5W/X1+9cnH4YwKIaoRRAkUkj/YlAAeF/624foiIDBgBmgQBeGAyhBljUPZUm/l2dTvmpqcBDUOHdbPZWd8JsBAsGr4w8/EDn82/bUPx4eh0YNrQTBuHO2FjQEAGBwK0DeI37DpQVqdERS4gZBhpeUhWCfLFz7J99aEBgsJCHvUGAdAPp4IADDCAPCEFMGpMZ9AQpTfQtQGhLbGVBZFV8BaqNyP68oTZgHNj3M8kBPfXTTC9t90UuzYhy9ciH0grVlOcqyCytisvbsERsEYztiznR0WCrmTksJwbSNK6fd1Rvr25I9oLvctUoEbNOmXJbqgYgPXEHJ82IUsrCnpkxh23F1rfZ2zcRnJYoXtauB3VTFkFXQg3uoZYD5qE0kdjDtoDoF1h2bulGmev5HbYhbrjtohQSRI4aNOkffIcT+d3v6atpaYh3JvPoQsztCcqvaBkppDSPcQ3bw3KaCBo1f5CJWTZEgW3LjLofYg51MaVezrx8xZitYbQ9KYeoRaqQdVLwSEfrKXLK1otCWOKNdR/YwYAfon5Yk8O2MJfSD10dPGA5PIJJQMkah0ugMJiv6x4Dm7LEa8xnrRGGGLAg4sAlbsA07sAt76DOsXKO3hIjtIlpnnFrt1qW4kh6NhS83P/6HB/fl1SMAAA==) format("woff2"), url(data:application/font-woff;charset=utf-8;base64,d09GRgABAAAAAAUQAA0AAAAACDQAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAE9AAAABwAAAAchf5yU0dERUYAAATYAAAAHAAAAB4AJwAbT1MvMgAAAaAAAABJAAAAYJAcgU5jbWFwAAACIAAAAF4AAAFqUUxBZ2dhc3AAAATQAAAACAAAAAgAAAAQZ2x5ZgAAApAAAAAyAAAAPL0n8y9oZWFkAAABMAAAADAAAAA2Fi93Z2hoZWEAAAFgAAAAHQAAACQOSgWaaG10eAAAAewAAAAzAAAAVC7TAQBsb2NhAAACgAAAABAAAAAsAOQBAm1heHAAAAGAAAAAHQAAACAAWQALbmFtZQAAAsQAAAF6AAADIYvD/Adwb3N0AAAEQAAAAI4AAADsapk2o3jaY2BkYGAA4ov5mwzj+W2+MnCzXwCKMNzgCBSB0LfbQDQ7AxuI4mBgAlEAFKQIRHjaY2BkYGD3+NvCwMDBAALsDAyMDKhAFAA3+wH3AAAAeNpjYGRgYBBl4GBgYgABEMnIABJzAPMZAAVmAGUAAAB42mNgZlJhnMDAysDCKsKygYGBYRqEZtrDYMT4D8gHSmEHjgUFOQwODAqqf9g9/rYwMLB7MNUAhRlBcsxBrMlASoGBEQAj8QtyAAAAeNrjYGBkAAGmWQwMjO8gmBnIZ2NA0ExAzNjAAFYJVn0ASBsD6VAIDZb7AtELAgANIgb9AHjaY2BgYGaAYBkGRgYQSAHyGMF8FgYPIM3HwMHAxMDGoMCwQIFLQV8hXvXP//9AcRCfAcb///h/ygPW+w/vb7olBjUHCTCyMcAFGZmABBO6AogThgZgIUsXAEDcEzcAAHjaY2BgECMCyoEgACZaAed42mNgYmRgYGBnYGNgYAZSDJqMgorCgoqCjECRXwwNrCAKSP5mAAFGBiRgyAAAi/YFBQAAeNqtkc1OwkAUhU/5M25cEhcsZick0AwlBJq6MWwgJkAgYV/KAA2lJeUn+hY+gktXvpKv4dLTMqKycGHsTZNv7px7z50ZAFd4hYHjdw1Ls4EiHjVncIFnzVnc4F1zDkWjrzmPW+NNcwGlzIRKI3fJlUyrEjZQxb3mDH2fNGfRx4vmHKqG0JzHg6E0F9DOlFBGBxUI1GEzLNT4S0aLuTtsGAEUuYcQHkyg3KmIum1bNUvKlrjbbAIleqHHnS4iSudpQcySMYtdFiXlAxzSbAwfMxK6kZoHKhbjjespMTioOPZnzI+4ucCeTVyKMVKLfeAS6vSWaTinuZwzyy/Dc7vaed+6KaV0kukdPUk6yOcctZPvvxxqksq2lEW8RvHjMEO2FCl/zy6p3NEm0R9OFSafJdldc4QVeyaaObMBO0/5cCaa6d9Ggyubxire+lEojscdjoWUR1xGOy8KD8mG2ZLO2l2paDc3A39qmU2z2W5YNv5+u79e6QfGJY/hAAB42m3NywrCMBQE0DupWp/1AYI7/6DEaLQu66Mrd35BKUWKJSlFv1+rue4cGM7shgR981qSon+ZNwUJ8iDgoYU2OvDRRQ99DDDECAHGmGCKmf80hZSx/Kik/LliFbtmN6xmt+yOjdg9GztV4tROnRwX/Bsaaw51nt4Lc7tWaZYHp/MlzKx51LZs5htNri+2AAAAAQAB//8AD3jaY2BkYGDgAWIxIGZiYARCESBmAfMYAAR6AEMAAAABAAAAANXtRbgAAAAA2AhRFAAAAADYCNuG) format("woff");
}
/* INTER */
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 400;
src:
url(../fonts/inter/Inter-Regular.woff2) format("woff2"),
url(../fonts/inter/Inter-Regular.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: italic;
font-weight: 400;
src:
url(../fonts/inter/Inter-Italic.woff2) format("woff2"),
url(../fonts/inter/Inter-Italic.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 500;
src:
url(../fonts/inter/Inter-Medium.woff2) format("woff2"),
url(../fonts/inter/Inter-Medium.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: italic;
font-weight: 500;
src:
url(../fonts/inter/Inter-MediumItalic.woff2) format("woff2"),
url(../fonts/inter/Inter-MediumItalic.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 600;
src:
url(../fonts/inter/Inter-SemiBold.woff2) format("woff2"),
url(../fonts/inter/Inter-SemiBold.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: italic;
font-weight: 600;
src:
url(../fonts/inter/Inter-SemiBoldItalic.woff2) format("woff2"),
url(../fonts/inter/Inter-SemiBoldItalic.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 700;
src:
url(../fonts/inter/Inter-Bold.woff2) format("woff2"),
url(../fonts/inter/Inter-Bold.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: italic;
font-weight: 700;
src:
url(../fonts/inter/Inter-BoldItalic.woff2) format("woff2"),
url(../fonts/inter/Inter-BoldItalic.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 800;
src:
url(../fonts/inter/Inter-ExtraBold.woff2) format("woff2"),
url(../fonts/inter/Inter-ExtraBold.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: italic;
font-weight: 800;
src:
url(../fonts/inter/Inter-ExtraBoldItalic.woff2) format("woff2"),
url(../fonts/inter/Inter-ExtraBoldItalic.woff) format("woff");
}
/* ----------------------------------------------
Variable font. Usage:
Inter variable font. Usage:
html { font-family: Inter, sans-serif; }
@supports (font-variation-settings: normal) {
html { font-family: "Inter var", sans-serif; }
}
@ -219,7 +126,7 @@ html { font-family: Inter, sans-serif; }
.editor-styles-wrapper cite,
.editor-styles-wrapper figcaption,
.editor-styles-wrapper .wp-caption-text {
font-family: Inter, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
}
@supports ( font-variation-settings: normal ) {
@ -279,6 +186,11 @@ html { font-family: Inter, sans-serif; }
text-decoration: underline;
}
.editor-styles-wrapper a:focus,
.editor-styles-wrapper a:hover {
text-decoration: none;
}
.editor-post-title__block .editor-post-title__input,
.editor-styles-wrapper .wp-block h1,
.editor-styles-wrapper .wp-block h2,
@ -501,6 +413,16 @@ html { font-family: Inter, sans-serif; }
text-decoration: none;
}
.editor-styles-wrapper .wp-block-archives li > a:focus,
.editor-styles-wrapper .wp-block-archives li > a:hover,
.editor-styles-wrapper .wp-block-categories li > a:focus,
.editor-styles-wrapper .wp-block-categories li > a:hover,
.editor-styles-wrapper .wp-block-latest-posts li > a:focus,
.editor-styles-wrapper .wp-block-latest-posts li > a:hover {
font-weight: 700;
text-decoration: none;
}
.editor-styles-wrapper .wp-block-archives.aligncenter,
.editor-styles-wrapper .wp-block-categories.aligncenter {
text-align: center;
@ -577,7 +499,8 @@ html { font-family: Inter, sans-serif; }
/* Block: Separator -------------------------- */
hr.wp-block-separator {
border-top: 1px solid rgba(0, 0, 0, 0.42);
border-top: 1px solid #6d6d6d;
color: #6d6d6d;
margin: 30px 0;
}
@ -586,14 +509,18 @@ hr.wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
}
hr.wp-block-separator:not(.is-style-dots) {
background: linear-gradient(to left, rgba(0, 0, 0, 0.42) calc(50% - 16px), transparent calc(50% - 16px), transparent calc(50% + 16px), rgba(0, 0, 0, 0.42) calc(50% + 16px));
background: linear-gradient(to left, currentColor calc(50% - 16px), transparent calc(50% - 16px), transparent calc(50% + 16px), currentColor calc(50% + 16px));
background-color: transparent !important;
border: none;
color: rgba(0, 0, 0, 0.42);
height: 1px;
overflow: visible;
position: relative;
}
.wp-block-separator.has-background:not(.is-style-wide):not(.is-style-dots) {
height: 1px;
}
hr.wp-block-separator:not(.is-style-dots)::before,
hr.wp-block-separator:not(.is-style-dots)::after {
background: currentColor;
@ -617,7 +544,6 @@ hr.wp-block-separator::after {
/* STYLE: DOTS */
hr.wp-block-separator.is-style-dots::before {
color: rgba(0, 0, 0, 0.42);
font-size: 32px;
font-weight: 700;
letter-spacing: 1em;
@ -943,6 +869,11 @@ hr.wp-block-separator.is-style-dots::before {
text-decoration: none;
}
.editor-styles-wrapper .wp-block-latest-comments__comment-meta a:focus,
.editor-styles-wrapper .wp-block-latest-comments__comment-meta a:hover {
text-decoration: none;
}
/* HAS AVATAR */
.editor-styles-wrapper .wp-block-latest-comments.has-avatars .wp-block-latest-comments__comment {
@ -1024,6 +955,11 @@ hr.wp-block-separator.is-style-dots::before {
text-decoration: none;
}
.editor-styles-wrapper .wp-block-file .wp-block-file__textlink:focus,
.editor-styles-wrapper .wp-block-file .wp-block-file__textlink:hover {
text-decoration: underline;
}
.editor-styles-wrapper .wp-block-file .wp-block-file__button {
font-size: 14px;
padding: 1em 1.25em;

View File

@ -18,102 +18,9 @@
src: url(data:application/font-woff2;charset=utf-8;base64,d09GMgABAAAAAAMoAA0AAAAACDQAAALTAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP0ZGVE0cGh4GYACCahEICjx3CywAATYCJANUBCAFhiEHgWwbXQfILgpsY+rQRRARwyAs6uL7pxzYhxEE+32b3aeHmifR6tklkS9hiZA0ewkqGRJE+H7/+6378ASViK/PGeavqJyOzsceKi1s3BCiQsiOdn1r/RBgIJYEgCUhbm/8/8/h4saPssnTNkkiWUBrTRtjmQSajw3Ui3pZ3LYDPD+XG2C3JA/yKAS8/rU5eNfuGqRf4eNNgV4YAlIIgxglEkWe6FYpq10+wi3g+/nUgvgPFczNrz/RsTgVm/zfbPuHZlsuQECxuyqBcQwKFBjFgKO8AqP4bAN9tFJtnM9xPcbNjeXS/x1wY/xU52f5W/X1+9cnH4YwKIaoRRAkUkj/YlAAeF/624foiIDBgBmgQBeGAyhBljUPZUm/l2dTvmpqcBDUOHdbPZWd8JsBAsGr4w8/EDn82/bUPx4eh0YNrQTBuHO2FjQEAGBwK0DeI37DpQVqdERS4gZBhpeUhWCfLFz7J99aEBgsJCHvUGAdAPp4IADDCAPCEFMGpMZ9AQpTfQtQGhLbGVBZFV8BaqNyP68oTZgHNj3M8kBPfXTTC9t90UuzYhy9ciH0grVlOcqyCytisvbsERsEYztiznR0WCrmTksJwbSNK6fd1Rvr25I9oLvctUoEbNOmXJbqgYgPXEHJ82IUsrCnpkxh23F1rfZ2zcRnJYoXtauB3VTFkFXQg3uoZYD5qE0kdjDtoDoF1h2bulGmev5HbYhbrjtohQSRI4aNOkffIcT+d3v6atpaYh3JvPoQsztCcqvaBkppDSPcQ3bw3KaCBo1f5CJWTZEgW3LjLofYg51MaVezrx8xZitYbQ9KYeoRaqQdVLwSEfrKXLK1otCWOKNdR/YwYAfon5Yk8O2MJfSD10dPGA5PIJJQMkah0ugMJiv6x4Dm7LEa8xnrRGGGLAg4sAlbsA07sAt76DOsXKO3hIjtIlpnnFrt1qW4kh6NhS83P/6HB/fl1SMAAA==) format("woff2"), url(data:application/font-woff;charset=utf-8;base64,d09GRgABAAAAAAUQAA0AAAAACDQAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAE9AAAABwAAAAchf5yU0dERUYAAATYAAAAHAAAAB4AJwAbT1MvMgAAAaAAAABJAAAAYJAcgU5jbWFwAAACIAAAAF4AAAFqUUxBZ2dhc3AAAATQAAAACAAAAAgAAAAQZ2x5ZgAAApAAAAAyAAAAPL0n8y9oZWFkAAABMAAAADAAAAA2Fi93Z2hoZWEAAAFgAAAAHQAAACQOSgWaaG10eAAAAewAAAAzAAAAVC7TAQBsb2NhAAACgAAAABAAAAAsAOQBAm1heHAAAAGAAAAAHQAAACAAWQALbmFtZQAAAsQAAAF6AAADIYvD/Adwb3N0AAAEQAAAAI4AAADsapk2o3jaY2BkYGAA4ov5mwzj+W2+MnCzXwCKMNzgCBSB0LfbQDQ7AxuI4mBgAlEAFKQIRHjaY2BkYGD3+NvCwMDBAALsDAyMDKhAFAA3+wH3AAAAeNpjYGRgYBBl4GBgYgABEMnIABJzAPMZAAVmAGUAAAB42mNgZlJhnMDAysDCKsKygYGBYRqEZtrDYMT4D8gHSmEHjgUFOQwODAqqf9g9/rYwMLB7MNUAhRlBcsxBrMlASoGBEQAj8QtyAAAAeNrjYGBkAAGmWQwMjO8gmBnIZ2NA0ExAzNjAAFYJVn0ASBsD6VAIDZb7AtELAgANIgb9AHjaY2BgYGaAYBkGRgYQSAHyGMF8FgYPIM3HwMHAxMDGoMCwQIFLQV8hXvXP//9AcRCfAcb///h/ygPW+w/vb7olBjUHCTCyMcAFGZmABBO6AogThgZgIUsXAEDcEzcAAHjaY2BgECMCyoEgACZaAed42mNgYmRgYGBnYGNgYAZSDJqMgorCgoqCjECRXwwNrCAKSP5mAAFGBiRgyAAAi/YFBQAAeNqtkc1OwkAUhU/5M25cEhcsZick0AwlBJq6MWwgJkAgYV/KAA2lJeUn+hY+gktXvpKv4dLTMqKycGHsTZNv7px7z50ZAFd4hYHjdw1Ls4EiHjVncIFnzVnc4F1zDkWjrzmPW+NNcwGlzIRKI3fJlUyrEjZQxb3mDH2fNGfRx4vmHKqG0JzHg6E0F9DOlFBGBxUI1GEzLNT4S0aLuTtsGAEUuYcQHkyg3KmIum1bNUvKlrjbbAIleqHHnS4iSudpQcySMYtdFiXlAxzSbAwfMxK6kZoHKhbjjespMTioOPZnzI+4ucCeTVyKMVKLfeAS6vSWaTinuZwzyy/Dc7vaed+6KaV0kukdPUk6yOcctZPvvxxqksq2lEW8RvHjMEO2FCl/zy6p3NEm0R9OFSafJdldc4QVeyaaObMBO0/5cCaa6d9Ggyubxire+lEojscdjoWUR1xGOy8KD8mG2ZLO2l2paDc3A39qmU2z2W5YNv5+u79e6QfGJY/hAAB42m3NywrCMBQE0DupWp/1AYI7/6DEaLQu66Mrd35BKUWKJSlFv1+rue4cGM7shgR981qSon+ZNwUJ8iDgoYU2OvDRRQ99DDDECAHGmGCKmf80hZSx/Kik/LliFbtmN6xmt+yOjdg9GztV4tROnRwX/Bsaaw51nt4Lc7tWaZYHp/MlzKx51LZs5htNri+2AAAAAQAB//8AD3jaY2BkYGDgAWIxIGZiYARCESBmAfMYAAR6AEMAAAABAAAAANXtRbgAAAAA2AhRFAAAAADYCNuG) format("woff");
}
/* INTER */
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 400;
src:
url(../fonts/inter/Inter-Regular.woff2) format("woff2"),
url(../fonts/inter/Inter-Regular.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: italic;
font-weight: 400;
src:
url(../fonts/inter/Inter-Italic.woff2) format("woff2"),
url(../fonts/inter/Inter-Italic.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 500;
src:
url(../fonts/inter/Inter-Medium.woff2) format("woff2"),
url(../fonts/inter/Inter-Medium.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: italic;
font-weight: 500;
src:
url(../fonts/inter/Inter-MediumItalic.woff2) format("woff2"),
url(../fonts/inter/Inter-MediumItalic.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 600;
src:
url(../fonts/inter/Inter-SemiBold.woff2) format("woff2"),
url(../fonts/inter/Inter-SemiBold.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: italic;
font-weight: 600;
src:
url(../fonts/inter/Inter-SemiBoldItalic.woff2) format("woff2"),
url(../fonts/inter/Inter-SemiBoldItalic.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 700;
src:
url(../fonts/inter/Inter-Bold.woff2) format("woff2"),
url(../fonts/inter/Inter-Bold.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: italic;
font-weight: 700;
src:
url(../fonts/inter/Inter-BoldItalic.woff2) format("woff2"),
url(../fonts/inter/Inter-BoldItalic.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 800;
src:
url(../fonts/inter/Inter-ExtraBold.woff2) format("woff2"),
url(../fonts/inter/Inter-ExtraBold.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: italic;
font-weight: 800;
src:
url(../fonts/inter/Inter-ExtraBoldItalic.woff2) format("woff2"),
url(../fonts/inter/Inter-ExtraBoldItalic.woff) format("woff");
}
/* ----------------------------------------------
Variable font. Usage:
Inter variable font. Usage:
html { font-family: Inter, sans-serif; }
@supports (font-variation-settings: normal) {
html { font-family: "Inter var", sans-serif; }
}
@ -136,7 +43,7 @@ html { font-family: Inter, sans-serif; }
/* Structure --------------------------------- */
body#tinymce.wp-editor { /* stylelint-disable-line no-duplicate-selectors */
font-family: Inter, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
}
@supports ( font-variation-settings: normal ) {
@ -206,6 +113,7 @@ body#tinymce.wp-editor pre {
}
body#tinymce.wp-editor a,
body#tinymce.wp-editor a:focus,
body#tinymce.wp-editor a:hover {
color: #cd2653;
text-decoration: underline;
@ -277,7 +185,7 @@ body#tinymce.wp-editor .wp-caption-text,
body#tinymce.wp-editor .wp-caption-dd,
body#tinymce.wp-editor cite,
body#tinymce.wp-editor table {
font-family: Inter, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
line-height: 1;
}
@ -626,20 +534,20 @@ body#tinymce.wp-editor input[type="submit"] {
text-transform: uppercase;
}
body#tinymce.wp-editor button:focus,
body#tinymce.wp-editor button:hover,
body#tinymce.wp-editor .faux-button:hover,
body#tinymce.wp-editor .wp-block-button__link:hover,
body#tinymce.wp-editor .wp-block-file__button:hover,
body#tinymce.wp-editor input[type="button"]:hover,
body#tinymce.wp-editor input[type="reset"]:hover,
body#tinymce.wp-editor input[type="submit"]:hover,
body#tinymce.wp-editor button:focus,
body#tinymce.wp-editor .faux-button:focus,
body#tinymce.wp-editor .wp-block-button__link:focus,
body#tinymce.wp-editor .wp-block-button__link:hover,
body#tinymce.wp-editor .wp-block-file__button:focus,
body#tinymce.wp-editor .wp-block-file__button:hover,
body#tinymce.wp-editor input[type="button"]:focus,
body#tinymce.wp-editor input[type="button"]:hover,
body#tinymce.wp-editor input[type="reset"]:focus,
body#tinymce.wp-editor input[type="submit"]:focus {
body#tinymce.wp-editor input[type="reset"]:hover,
body#tinymce.wp-editor input[type="submit"]:focus,
body#tinymce.wp-editor input[type="submit"]:hover {
color: #fff;
text-decoration: underline;
}
@ -658,6 +566,7 @@ body#tinymce.wp-editor input[type="submit"]:focus {
/* BUTTON STYLE: OUTLINE */
body#tinymce.wp-editor .is-style-outline .wp-block-button__link,
body#tinymce.wp-editor .is-style-outline .wp-block-button__link:focus,
body#tinymce.wp-editor .is-style-outline .wp-block-button__link:hover {
color: #cd2653;
}

View File

@ -18,102 +18,9 @@
src: url(data:application/font-woff2;charset=utf-8;base64,d09GMgABAAAAAAMoAA0AAAAACDQAAALTAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP0ZGVE0cGh4GYACCahEICjx3CywAATYCJANUBCAFhiEHgWwbXQfILgpsY+rQRRARwyAs6uL7pxzYhxEE+32b3aeHmifR6tklkS9hiZA0ewkqGRJE+H7/+6378ASViK/PGeavqJyOzsceKi1s3BCiQsiOdn1r/RBgIJYEgCUhbm/8/8/h4saPssnTNkkiWUBrTRtjmQSajw3Ui3pZ3LYDPD+XG2C3JA/yKAS8/rU5eNfuGqRf4eNNgV4YAlIIgxglEkWe6FYpq10+wi3g+/nUgvgPFczNrz/RsTgVm/zfbPuHZlsuQECxuyqBcQwKFBjFgKO8AqP4bAN9tFJtnM9xPcbNjeXS/x1wY/xU52f5W/X1+9cnH4YwKIaoRRAkUkj/YlAAeF/624foiIDBgBmgQBeGAyhBljUPZUm/l2dTvmpqcBDUOHdbPZWd8JsBAsGr4w8/EDn82/bUPx4eh0YNrQTBuHO2FjQEAGBwK0DeI37DpQVqdERS4gZBhpeUhWCfLFz7J99aEBgsJCHvUGAdAPp4IADDCAPCEFMGpMZ9AQpTfQtQGhLbGVBZFV8BaqNyP68oTZgHNj3M8kBPfXTTC9t90UuzYhy9ciH0grVlOcqyCytisvbsERsEYztiznR0WCrmTksJwbSNK6fd1Rvr25I9oLvctUoEbNOmXJbqgYgPXEHJ82IUsrCnpkxh23F1rfZ2zcRnJYoXtauB3VTFkFXQg3uoZYD5qE0kdjDtoDoF1h2bulGmev5HbYhbrjtohQSRI4aNOkffIcT+d3v6atpaYh3JvPoQsztCcqvaBkppDSPcQ3bw3KaCBo1f5CJWTZEgW3LjLofYg51MaVezrx8xZitYbQ9KYeoRaqQdVLwSEfrKXLK1otCWOKNdR/YwYAfon5Yk8O2MJfSD10dPGA5PIJJQMkah0ugMJiv6x4Dm7LEa8xnrRGGGLAg4sAlbsA07sAt76DOsXKO3hIjtIlpnnFrt1qW4kh6NhS83P/6HB/fl1SMAAA==) format("woff2"), url(data:application/font-woff;charset=utf-8;base64,d09GRgABAAAAAAUQAA0AAAAACDQAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAE9AAAABwAAAAchf5yU0dERUYAAATYAAAAHAAAAB4AJwAbT1MvMgAAAaAAAABJAAAAYJAcgU5jbWFwAAACIAAAAF4AAAFqUUxBZ2dhc3AAAATQAAAACAAAAAgAAAAQZ2x5ZgAAApAAAAAyAAAAPL0n8y9oZWFkAAABMAAAADAAAAA2Fi93Z2hoZWEAAAFgAAAAHQAAACQOSgWaaG10eAAAAewAAAAzAAAAVC7TAQBsb2NhAAACgAAAABAAAAAsAOQBAm1heHAAAAGAAAAAHQAAACAAWQALbmFtZQAAAsQAAAF6AAADIYvD/Adwb3N0AAAEQAAAAI4AAADsapk2o3jaY2BkYGAA4ov5mwzj+W2+MnCzXwCKMNzgCBSB0LfbQDQ7AxuI4mBgAlEAFKQIRHjaY2BkYGD3+NvCwMDBAALsDAyMDKhAFAA3+wH3AAAAeNpjYGRgYBBl4GBgYgABEMnIABJzAPMZAAVmAGUAAAB42mNgZlJhnMDAysDCKsKygYGBYRqEZtrDYMT4D8gHSmEHjgUFOQwODAqqf9g9/rYwMLB7MNUAhRlBcsxBrMlASoGBEQAj8QtyAAAAeNrjYGBkAAGmWQwMjO8gmBnIZ2NA0ExAzNjAAFYJVn0ASBsD6VAIDZb7AtELAgANIgb9AHjaY2BgYGaAYBkGRgYQSAHyGMF8FgYPIM3HwMHAxMDGoMCwQIFLQV8hXvXP//9AcRCfAcb///h/ygPW+w/vb7olBjUHCTCyMcAFGZmABBO6AogThgZgIUsXAEDcEzcAAHjaY2BgECMCyoEgACZaAed42mNgYmRgYGBnYGNgYAZSDJqMgorCgoqCjECRXwwNrCAKSP5mAAFGBiRgyAAAi/YFBQAAeNqtkc1OwkAUhU/5M25cEhcsZick0AwlBJq6MWwgJkAgYV/KAA2lJeUn+hY+gktXvpKv4dLTMqKycGHsTZNv7px7z50ZAFd4hYHjdw1Ls4EiHjVncIFnzVnc4F1zDkWjrzmPW+NNcwGlzIRKI3fJlUyrEjZQxb3mDH2fNGfRx4vmHKqG0JzHg6E0F9DOlFBGBxUI1GEzLNT4S0aLuTtsGAEUuYcQHkyg3KmIum1bNUvKlrjbbAIleqHHnS4iSudpQcySMYtdFiXlAxzSbAwfMxK6kZoHKhbjjespMTioOPZnzI+4ucCeTVyKMVKLfeAS6vSWaTinuZwzyy/Dc7vaed+6KaV0kukdPUk6yOcctZPvvxxqksq2lEW8RvHjMEO2FCl/zy6p3NEm0R9OFSafJdldc4QVeyaaObMBO0/5cCaa6d9Ggyubxire+lEojscdjoWUR1xGOy8KD8mG2ZLO2l2paDc3A39qmU2z2W5YNv5+u79e6QfGJY/hAAB42m3NywrCMBQE0DupWp/1AYI7/6DEaLQu66Mrd35BKUWKJSlFv1+rue4cGM7shgR981qSon+ZNwUJ8iDgoYU2OvDRRQ99DDDECAHGmGCKmf80hZSx/Kik/LliFbtmN6xmt+yOjdg9GztV4tROnRwX/Bsaaw51nt4Lc7tWaZYHp/MlzKx51LZs5htNri+2AAAAAQAB//8AD3jaY2BkYGDgAWIxIGZiYARCESBmAfMYAAR6AEMAAAABAAAAANXtRbgAAAAA2AhRFAAAAADYCNuG) format("woff");
}
/* INTER */
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 400;
src:
url(../fonts/inter/Inter-Regular.woff2) format("woff2"),
url(../fonts/inter/Inter-Regular.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: italic;
font-weight: 400;
src:
url(../fonts/inter/Inter-Italic.woff2) format("woff2"),
url(../fonts/inter/Inter-Italic.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 500;
src:
url(../fonts/inter/Inter-Medium.woff2) format("woff2"),
url(../fonts/inter/Inter-Medium.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: italic;
font-weight: 500;
src:
url(../fonts/inter/Inter-MediumItalic.woff2) format("woff2"),
url(../fonts/inter/Inter-MediumItalic.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 600;
src:
url(../fonts/inter/Inter-SemiBold.woff2) format("woff2"),
url(../fonts/inter/Inter-SemiBold.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: italic;
font-weight: 600;
src:
url(../fonts/inter/Inter-SemiBoldItalic.woff2) format("woff2"),
url(../fonts/inter/Inter-SemiBoldItalic.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 700;
src:
url(../fonts/inter/Inter-Bold.woff2) format("woff2"),
url(../fonts/inter/Inter-Bold.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: italic;
font-weight: 700;
src:
url(../fonts/inter/Inter-BoldItalic.woff2) format("woff2"),
url(../fonts/inter/Inter-BoldItalic.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 800;
src:
url(../fonts/inter/Inter-ExtraBold.woff2) format("woff2"),
url(../fonts/inter/Inter-ExtraBold.woff) format("woff");
}
@font-face {
font-family: Inter;
font-style: italic;
font-weight: 800;
src:
url(../fonts/inter/Inter-ExtraBoldItalic.woff2) format("woff2"),
url(../fonts/inter/Inter-ExtraBoldItalic.woff) format("woff");
}
/* ----------------------------------------------
Variable font. Usage:
Inter variable font. Usage:
html { font-family: Inter, sans-serif; }
@supports (font-variation-settings: normal) {
html { font-family: "Inter var", sans-serif; }
}
@ -136,7 +43,7 @@ html { font-family: Inter, sans-serif; }
/* Structure --------------------------------- */
body#tinymce.wp-editor { /* stylelint-disable-line no-duplicate-selectors */
font-family: Inter, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
}
@supports ( font-variation-settings: normal ) {
@ -206,6 +113,7 @@ body#tinymce.wp-editor pre {
}
body#tinymce.wp-editor a,
body#tinymce.wp-editor a:focus,
body#tinymce.wp-editor a:hover {
color: #cd2653;
text-decoration: underline;
@ -277,7 +185,7 @@ body#tinymce.wp-editor .wp-caption-text,
body#tinymce.wp-editor .wp-caption-dd,
body#tinymce.wp-editor cite,
body#tinymce.wp-editor table {
font-family: Inter, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
line-height: 1;
}
@ -626,20 +534,20 @@ body#tinymce.wp-editor input[type="submit"] {
text-transform: uppercase;
}
body#tinymce.wp-editor button:focus,
body#tinymce.wp-editor button:hover,
body#tinymce.wp-editor .faux-button:hover,
body#tinymce.wp-editor .wp-block-button__link:hover,
body#tinymce.wp-editor .wp-block-file__button:hover,
body#tinymce.wp-editor input[type="button"]:hover,
body#tinymce.wp-editor input[type="reset"]:hover,
body#tinymce.wp-editor input[type="submit"]:hover,
body#tinymce.wp-editor button:focus,
body#tinymce.wp-editor .faux-button:focus,
body#tinymce.wp-editor .wp-block-button__link:focus,
body#tinymce.wp-editor .wp-block-button__link:hover,
body#tinymce.wp-editor .wp-block-file__button:focus,
body#tinymce.wp-editor .wp-block-file__button:hover,
body#tinymce.wp-editor input[type="button"]:focus,
body#tinymce.wp-editor input[type="button"]:hover,
body#tinymce.wp-editor input[type="reset"]:focus,
body#tinymce.wp-editor input[type="submit"]:focus {
body#tinymce.wp-editor input[type="reset"]:hover,
body#tinymce.wp-editor input[type="submit"]:focus,
body#tinymce.wp-editor input[type="submit"]:hover {
color: #fff;
text-decoration: underline;
}
@ -658,6 +566,7 @@ body#tinymce.wp-editor input[type="submit"]:focus {
/* BUTTON STYLE: OUTLINE */
body#tinymce.wp-editor .is-style-outline .wp-block-button__link,
body#tinymce.wp-editor .is-style-outline .wp-block-button__link:focus,
body#tinymce.wp-editor .is-style-outline .wp-block-button__link:hover {
color: #cd2653;
}

View File

@ -2,24 +2,16 @@
font-family: "Font Awesome 5";
font-style: normal;
font-weight: 400;
src: url(../fonts/font-awesome/fa-fallback.eot?15574881);
src:
url(../fonts/font-awesome/fa-fallback.eot?15574881#iefix) format("embedded-opentype"),
url(../fonts/font-awesome/fa-fallback.woff2?15574881) format("woff2"),
url(../fonts/font-awesome/fa-fallback.woff?15574881) format("woff"),
url(../fonts/font-awesome/fa-fallback.ttf?15574881) format("truetype"),
url(../fonts/font-awesome/fa-fallback.svg?15574881#font-awsome-fallback) format("svg");
url(../fonts/font-awesome/fa-fallback.woff?15574881) format("woff");
}
@font-face {
font-family: "Font Awesome 5 Brands";
font-style: normal;
font-weight: 400;
src: url(../fonts/font-awesome/fa-brands-400.eot);
src:
url(../fonts/font-awesome/fa-brands-400.eot?#iefix) format("embedded-opentype"),
url(../fonts/font-awesome/fa-brands-400.woff2) format("woff2"),
url(../fonts/font-awesome/fa-brands-400.woff) format("woff"),
url(../fonts/font-awesome/fa-brands-400.ttf) format("truetype"),
url(../fonts/font-awesome/fa-brands-400.svg#fontawesome) format("svg");
url(../fonts/font-awesome/fa-brands-400.woff) format("woff");
}

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 633 KiB

View File

@ -1,16 +0,0 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>Copyright (C) 2019 by original authors @ fontello.com</metadata>
<defs>
<font id="font-awsome-fallback" horiz-adv-x="1000" >
<font-face font-family="font-awsome-fallback" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
<missing-glyph horiz-adv-x="1000" />
<glyph glyph-name="link" unicode="&#xe805;" d="M813 171q0 23-16 38l-116 116q-16 16-38 16-24 0-40-18 1-1 10-10t12-12 9-11 7-14 2-15q0-23-16-38t-38-16q-8 0-15 2t-14 7-11 9-12 12-10 10q-19-17-19-40 0-23 16-38l115-116q15-15 38-15 22 0 38 15l82 81q16 16 16 37z m-393 394q0 22-15 38l-115 115q-16 16-38 16-22 0-38-15l-82-82q-16-15-16-37 0-22 16-38l116-116q15-15 38-15 23 0 40 17-2 2-11 11t-12 12-8 10-7 14-2 16q0 22 15 38t38 15q9 0 16-2t14-7 11-8 12-12 10-11q18 17 18 41z m500-394q0-66-48-113l-82-81q-46-47-113-47-68 0-114 48l-115 115q-46 47-46 114 0 68 49 116l-49 49q-48-49-116-49-67 0-114 47l-116 116q-47 47-47 114t47 113l82 82q47 46 114 46 67 0 114-47l115-116q46-46 46-113 0-69-49-117l49-49q48 49 116 49 67 0 114-47l116-116q47-47 47-114z" horiz-adv-x="928.6" />
<glyph glyph-name="rss" unicode="&#xf09e;" d="M214 100q0-45-31-76t-76-31-76 31-31 76 31 76 76 31 76-31 31-76z m286-69q1-15-9-26-10-12-27-12h-75q-14 0-24 9t-11 23q-12 128-103 219t-219 103q-14 1-23 11t-9 24v75q0 16 12 26 9 10 24 10h3q89-7 170-45t145-101q63-63 101-145t45-171z m286-1q1-15-10-26-10-11-26-11h-80q-14 0-25 10t-10 23q-7 120-57 228t-129 188-188 129-227 57q-14 1-24 11t-10 24v80q0 16 11 26 10 10 25 10h1q147-8 280-67t238-164q104-104 164-238t67-280z" horiz-adv-x="785.7" />
<glyph glyph-name="mail" unicode="&#xf0e0;" d="M1000 454v-443q0-37-26-63t-63-27h-822q-36 0-63 27t-26 63v443q25-27 56-49 202-137 278-192 32-24 51-37t53-27 61-13h2q28 0 61 13t53 27 51 37q95 68 278 192 32 22 56 49z m0 164q0-44-27-84t-68-69q-210-146-262-181-5-4-23-17t-30-22-29-18-32-15-28-5h-2q-12 0-27 5t-32 15-30 18-30 22-23 17q-51 35-147 101t-114 80q-35 23-65 64t-31 77q0 43 23 72t66 29h822q36 0 63-26t26-63z" horiz-adv-x="1000" />
</font>
</defs>
</svg>

Before

Width:  |  Height:  |  Size: 2.1 KiB

View File

@ -1,4 +1,4 @@
/* global backgroundColors, twentyTwentyColor, Color, jQuery, wp, _ */
/* global twentyTwentyBgColors, twentyTwentyColor, Color, jQuery, wp, _ */
/**
* Customizer enhancements for a better user experience.
*
@ -14,12 +14,12 @@
wp.customize( 'accent_hue', function( value ) {
value.bind( function( to ) {
// Update the value for our accessible colors for all areas.
Object.keys( backgroundColors ).forEach( function( context ) {
Object.keys( twentyTwentyBgColors ).forEach( function( context ) {
var backgroundColorValue;
if ( backgroundColors[ context ].color ) {
backgroundColorValue = backgroundColors[ context ].color;
if ( twentyTwentyBgColors[ context ].color ) {
backgroundColorValue = twentyTwentyBgColors[ context ].color;
} else {
backgroundColorValue = wp.customize( backgroundColors[ context ].setting ).get();
backgroundColorValue = wp.customize( twentyTwentyBgColors[ context ].setting ).get();
}
twentyTwentySetAccessibleColorsValue( context, backgroundColorValue, to );
} );
@ -27,8 +27,8 @@
} );
// Add a listener for background-color changes.
Object.keys( backgroundColors ).forEach( function( context ) {
wp.customize( backgroundColors[ context ].setting, function( value ) {
Object.keys( twentyTwentyBgColors ).forEach( function( context ) {
wp.customize( twentyTwentyBgColors[ context ].setting, function( value ) {
value.bind( function( to ) {
// Update the value for our accessible colors for this area.
twentyTwentySetAccessibleColorsValue( context, to, wp.customize( 'accent_hue' ).get(), to );
@ -68,11 +68,10 @@
};
// Get borders color.
value[ context ].borders = Color( {
h: colors.bgColorObj.h(),
s: colors.bgColorObj.s() * 0.3922,
l: colors.isDark ? colors.bgColorObj.l() + 9 : colors.bgColorObj.l() - 9
} ).toCSS();
value[ context ].borders = colors.bgColorObj
.clone()
.getReadableContrastingColor( colors.bgColorObj, 1.36 )
.toCSS();
// Get secondary color.
value[ context ].secondary = Color( {

View File

@ -1,4 +1,4 @@
/* global backgroundColors, previewElements, jQuery, _, wp */
/* global twentyTwentyBgColors, twentyTwentyPreviewEls, jQuery, _, wp */
/**
* Customizer enhancements for a better user experience.
*
@ -7,22 +7,123 @@
* @since 1.0.0
*/
( function() {
( function( $, api, _ ) {
/**
* Return a value for our partial refresh.
*
* @param {Object} partial Current partial.
*
* @return {jQuery.Promise} Resolved promise.
*/
function returnDeferred( partial ) {
var deferred = new $.Deferred();
deferred.resolveWith( partial, _.map( partial.placements(), function() {
return '';
} ) );
return deferred.promise();
}
// Selective refresh for "Fixed Background Image"
api.selectiveRefresh.partialConstructor.cover_fixed = api.selectiveRefresh.Partial.extend( {
/**
* Override the refresh method
*
* @return {jQuery.Promise} Resolved promise.
*/
refresh: function() {
var partial, cover, params;
partial = this;
params = partial.params;
cover = $( params.selector );
if ( cover.length && cover.hasClass( 'bg-image' ) ) {
cover.toggleClass( 'bg-attachment-fixed' );
}
return returnDeferred( partial );
}
} );
// Selective refresh for "Image Overlay Opacity"
api.selectiveRefresh.partialConstructor.cover_opacity = api.selectiveRefresh.Partial.extend( {
/**
* Input attributes.
*
* @type {Object}
*/
attrs: {},
/**
* Override the refresh method
*
* @return {jQuery.Promise} Resolved promise.
*/
refresh: function() {
var partial, ranges, attrs, setting, params, cover, className, classNames;
partial = this;
attrs = partial.attrs;
ranges = _.range( attrs.min, attrs.max + attrs.step, attrs.step );
params = partial.params;
setting = api( params.primarySetting );
cover = $( params.selector );
if ( cover.length ) {
classNames = _.map( ranges, function( val ) {
return 'opacity-' + val;
} );
className = classNames[ ranges.indexOf( parseInt( setting.get(), 10 ) ) ];
cover.removeClass( classNames.join( ' ' ) );
cover.addClass( className );
}
return returnDeferred( partial );
}
} );
// Add listener for the "header_footer_background_color" control.
wp.customize( 'header_footer_background_color', function( value ) {
api( 'header_footer_background_color', function( value ) {
value.bind( function( to ) {
// Add background color to header and footer wrappers.
jQuery( '#site-header,#site-footer' ).css( 'background-color', to );
$( '#site-header,#site-footer' ).css( 'background-color', to );
// Change body classes if this is the same background-color as the content background.
if ( to.toLowerCase() === api( 'background_color' ).get().toLowerCase() ) {
$( 'body' ).addClass( 'reduced-spacing' );
} else {
$( 'body' ).removeClass( 'reduced-spacing' );
}
} );
} );
// Add listener for the "background_color" control.
api( 'background_color', function( value ) {
value.bind( function( to ) {
// Change body classes if this is the same background-color as the header/footer background.
if ( to.toLowerCase() === api( 'header_footer_background_color' ).get().toLowerCase() ) {
$( 'body' ).addClass( 'reduced-spacing' );
} else {
$( 'body' ).removeClass( 'reduced-spacing' );
}
} );
} );
// Add listener for the accent color.
wp.customize( 'accent_hue', function( value ) {
api( 'accent_hue', function( value ) {
value.bind( function() {
// Generate the styles.
// Add a small delay to be sure the accessible colors were generated.
setTimeout( function() {
Object.keys( backgroundColors ).forEach( function( context ) {
Object.keys( twentyTwentyBgColors ).forEach( function( context ) {
twentyTwentyGenerateColorA11yPreviewStyles( context );
} );
}, 50 );
@ -30,8 +131,8 @@
} );
// Add listeners for background-color settings.
Object.keys( backgroundColors ).forEach( function( context ) {
wp.customize( backgroundColors[ context ].setting, function( value ) {
Object.keys( twentyTwentyBgColors ).forEach( function( context ) {
wp.customize( twentyTwentyBgColors[ context ].setting, function( value ) {
value.bind( function() {
// Generate the styles.
// Add a small delay to be sure the accessible colors were generated.
@ -55,17 +156,17 @@
// Get the accessible colors option.
var a11yColors = window.parent.wp.customize( 'accent_accessible_colors' ).get(),
stylesheedID = 'twentytwenty-customizer-styles-' + context,
stylesheet = jQuery( '#' + stylesheedID ),
stylesheet = $( '#' + stylesheedID ),
styles = '';
// If the stylesheet doesn't exist, create it and append it to <head>.
if ( ! stylesheet.length ) {
jQuery( '#twentytwenty-style-inline-css' ).after( '<style id="' + stylesheedID + '"></style>' );
stylesheet = jQuery( '#' + stylesheedID );
$( '#twentytwenty-style-inline-css' ).after( '<style id="' + stylesheedID + '"></style>' );
stylesheet = $( '#' + stylesheedID );
}
if ( ! _.isUndefined( a11yColors[ context ] ) ) {
// Check if we have elements defined.
if ( previewElements[ context ] ) {
_.each( previewElements[ context ], function( items, setting ) {
if ( twentyTwentyPreviewEls[ context ] ) {
_.each( twentyTwentyPreviewEls[ context ], function( items, setting ) {
_.each( items, function( elements, property ) {
if ( ! _.isUndefined( a11yColors[ context ][ setting ] ) ) {
styles += elements.join( ',' ) + '{' + property + ':' + a11yColors[ context ][ setting ] + ';}';
@ -78,8 +179,8 @@
stylesheet.html( styles );
}
// Generate styles on load. Handles page-changes on the preview pane.
jQuery( document ).ready( function() {
$( document ).ready( function() {
twentyTwentyGenerateColorA11yPreviewStyles( 'content' );
twentyTwentyGenerateColorA11yPreviewStyles( 'header-footer' );
} );
}() );
}( jQuery, wp.customize, _ ) );

View File

@ -0,0 +1,9 @@
/**
* Remove squared button style
*
* @since 1.0.0
*/
/* global wp */
wp.domReady( function() {
wp.blocks.unregisterBlockStyle( 'core/button', 'squared' );
} );

View File

@ -6,10 +6,6 @@ var twentytwenty = twentytwenty || {};
// polyfill closest
// https://developer.mozilla.org/en-US/docs/Web/API/Element/closest#Polyfill
if ( ! Element.prototype.matches ) {
Element.prototype.matches = Element.prototype.msMatchesSelector || Element.prototype.webkitMatchesSelector;
}
if ( ! Element.prototype.closest ) {
Element.prototype.closest = function( s ) {
var el = this;
@ -53,6 +49,24 @@ twentytwenty.createEvent = function( eventName ) {
return event;
};
// matches "polyfill"
// https://developer.mozilla.org/es/docs/Web/API/Element/matches
if ( ! Element.prototype.matches ) {
Element.prototype.matches =
Element.prototype.matchesSelector ||
Element.prototype.mozMatchesSelector ||
Element.prototype.msMatchesSelector ||
Element.prototype.oMatchesSelector ||
Element.prototype.webkitMatchesSelector ||
function( s ) {
var matches = ( this.document || this.ownerDocument ).querySelectorAll( s ),
i = matches.length;
while ( --i >= 0 && matches.item( i ) !== this ) {}
return i > -1;
};
}
/* -----------------------------------------------------------------------------------------------
Cover Modals
--------------------------------------------------------------------------------------------------- */
@ -137,8 +151,10 @@ twentytwenty.coverModals = {
};
function htmlStyles() {
var overflow = window.innerHeight > document.documentElement.getBoundingClientRect().height;
return {
'overflow-y': 'scroll',
'overflow-y': overflow ? 'hidden' : 'scroll',
position: 'fixed',
width: '100%',
top: getAdminBarHeight( true ),
@ -209,38 +225,6 @@ twentytwenty.coverModals = {
}; // twentytwenty.coverModals
/* -----------------------------------------------------------------------------------------------
Focus Management
--------------------------------------------------------------------------------------------------- */
twentytwenty.focusManagement = {
init: function() {
// If the visitor tabs out of the main menu, return focus to the navigation toggle
// Also, if the visitor tabs into a hidden element, move the focus to the element after the hidden element
this.focusLoop();
},
focusLoop: function() {
document.addEventListener( 'focusin', function( event ) {
var element = event.target;
var menuModal = document.querySelector( '.menu-modal' );
var headerToggles = document.querySelector( '.header-toggles' );
var searchModal = document.querySelector( '.search-modal' );
if ( menuModal && menuModal.classList.contains( '.active' ) ) {
if ( ! menuModal.contains( element ) && headerToggles && ! headerToggles.contains( element ) ) {
document.querySelector( '.close-nav-toggle' ).focus();
}
} else if ( searchModal && ! searchModal.classList.contains( '.active' ) ) {
if ( ! searchModal.contains( element ) ) {
searchModal.querySelector( '.search-field' ).focus();
}
}
} );
}
}; // twentytwenty.focusManagement
/* -----------------------------------------------------------------------------------------------
Intrinsic Ratio Embeds
--------------------------------------------------------------------------------------------------- */
@ -250,10 +234,6 @@ twentytwenty.intrinsicRatioVideos = {
init: function() {
this.makeFit();
window.addEventListener( 'fit-videos', function() {
this.makeFit();
}.bind( this ) );
window.addEventListener( 'resize', function() {
this.makeFit();
}.bind( this ) );
@ -383,30 +363,118 @@ twentytwenty.smoothScroll = {
}; // twentytwenty.smoothScroll
/* -----------------------------------------------------------------------------------------------
Main Menu
Modal Menu
--------------------------------------------------------------------------------------------------- */
twentytwenty.modalMenu = {
init: function() {
// If the current menu item is in a sub level, expand all the levels higher up on load
this.expandLevel();
this.goBackToCloseButton();
},
expandLevel: function() {
var modalMenu = document.querySelector( '.modal-menu' );
var activeMenuItem = modalMenu.querySelector( '.current-menu-item' );
var modalMenus = document.querySelectorAll( '.modal-menu' );
if ( activeMenuItem ) {
twentytwentyFindParents( activeMenuItem, 'li' ).forEach( function( element ) {
var subMenuToggle = element.querySelector( '.sub-menu-toggle' );
if ( subMenuToggle ) {
subMenuToggle.click();
}
} );
}
modalMenus.forEach( function( modalMenu ) {
var activeMenuItem = modalMenu.querySelector( '.current-menu-item' );
if ( activeMenuItem ) {
twentytwentyFindParents( activeMenuItem, 'li' ).forEach( function( element ) {
var subMenuToggle = element.querySelector( '.sub-menu-toggle' );
if ( subMenuToggle ) {
twentytwenty.toggles.performToggle( subMenuToggle, true );
}
} );
}
} );
},
// If the current menu item is the last one, return to close button when tab
goBackToCloseButton: function() {
document.addEventListener( 'keydown', function( event ) {
var desktopMenuButton = document.querySelector( '.toggle.close-nav-toggle' );
var mobileMenuButton = document.querySelector( '.toggle.mobile-nav-toggle' );
var isMobileMenu = desktopMenuButton ? window.getComputedStyle( desktopMenuButton, null ).getPropertyValue( 'display' ) === 'none' : false;
var firstMenuItem = isMobileMenu ? mobileMenuButton : desktopMenuButton;
var menuLinks = isMobileMenu ?
document.querySelectorAll( '.menu-modal .mobile-menu li' ) :
document.querySelectorAll( '.menu-modal .expanded-menu li' );
var socialLinks = document.querySelectorAll( '.menu-modal .social-menu > li' );
var hasSocialMenu = document.querySelectorAll( '.menu-modal .social-menu' ).length > 0;
var lastModalMenuItems = hasSocialMenu ? socialLinks : menuLinks;
var focusedElementParentLi = twentytwentyFindParents( event.target, 'li' );
var focusedElementIsInsideModal = twentytwentyFindParents( event.target, '.menu-modal' ).length > 0;
var lastMenuItem = lastModalMenuItems[lastModalMenuItems.length - 1];
var isFirstModalItem = isMobileMenu ?
event.target === mobileMenuButton :
focusedElementIsInsideModal && event.target === desktopMenuButton;
var isLastModalItem = focusedElementIsInsideModal && focusedElementParentLi[0] ?
focusedElementParentLi[0].className === lastMenuItem.className :
undefined;
if ( ! event.shiftKey && event.key === 'Tab' && isLastModalItem ) {
// Forward
event.preventDefault();
firstMenuItem.focus();
}
if ( event.shiftKey && event.key === 'Tab' && isFirstModalItem ) {
// Backward
event.preventDefault();
lastMenuItem.querySelector( 'a' ).focus();
}
} );
}
}; // twentytwenty.modalMenu
/* -----------------------------------------------------------------------------------------------
Primary Menu
--------------------------------------------------------------------------------------------------- */
twentytwenty.primaryMenu = {
init: function() {
this.focusMenuWithChildren();
},
// The focusMenuWithChildren() function implements Keyboard Navigation in the Primary Menu
// by adding the '.focus' class to all 'li.menu-item-has-children' when the focus is on the 'a' element.
focusMenuWithChildren: function() {
// Get all the link elements within the primary menu.
var menu = document.querySelector( '.primary-menu-wrapper' );
var links = menu.getElementsByTagName( 'a' );
var i, len;
// Each time a menu link is focused or blurred, toggle focus.
for ( i = 0, len = links.length; i < len; i++ ) {
links[i].addEventListener( 'focus', toggleFocus, true );
links[i].addEventListener( 'blur', toggleFocus, true );
}
//Sets or removes the .focus class on an element.
function toggleFocus() {
var self = this;
// Move up through the ancestors of the current link until we hit .primary-menu.
while ( -1 === self.className.indexOf( 'primary-menu' ) ) {
// On li elements toggle the class .focus.
if ( 'li' === self.tagName.toLowerCase() ) {
if ( -1 !== self.className.indexOf( 'focus' ) ) {
self.className = self.className.replace( ' focus', '' );
} else {
self.className += ' focus';
}
}
self = self.parentElement;
}
}
}
}; // twentytwenty.primaryMenu
/* -----------------------------------------------------------------------------------------------
Toggles
--------------------------------------------------------------------------------------------------- */
@ -424,98 +492,104 @@ twentytwenty.toggles = {
this.untoggleOnEscapeKeyPress();
},
performToggle: function( element, instantly ) {
var toggle, targetString, target, timeOutTime, classToToggle, activeClass;
// Get our targets
toggle = element;
targetString = toggle.dataset.toggleTarget;
activeClass = 'active';
if ( targetString === 'next' ) {
target = toggle.nextSibling;
} else {
target = document.querySelector( targetString );
}
// Trigger events on the toggle targets before they are toggled
if ( target.classList.contains( activeClass ) ) {
target.dispatchEvent( twentytwenty.createEvent( 'toggle-target-before-active' ) );
} else {
target.dispatchEvent( twentytwenty.createEvent( 'toggle-target-before-inactive' ) );
}
// Get the class to toggle, if specified
classToToggle = toggle.dataset.classToToggle ? toggle.dataset.classToToggle : activeClass;
// For cover modals, set a short timeout duration so the class animations have time to play out
timeOutTime = 0;
if ( target.classList.contains( 'cover-modal' ) ) {
timeOutTime = 10;
}
setTimeout( function() {
var focusElement, duration, newTarget, subMenued;
subMenued = target.classList.contains( 'sub-menu' );
newTarget = subMenued ? toggle.closest( '.menu-item' ).querySelector( '.sub-menu' ) : target;
duration = toggle.dataset.toggleDuration;
// Toggle the target of the clicked toggle
if ( toggle.dataset.toggleType === 'slidetoggle' && ! instantly && duration !== '0' ) {
twentytwentyMenuToggle( newTarget, duration );
} else {
newTarget.classList.toggle( classToToggle );
}
// If the toggle target is 'next', only give the clicked toggle the active class
if ( targetString === 'next' ) {
toggle.classList.toggle( activeClass );
} else if ( target.classList.contains( 'sub-menu' ) ) {
toggle.classList.toggle( activeClass );
} else {
// If not, toggle all toggles with this toggle target
document.querySelector( '*[data-toggle-target="' + targetString + '"]' ).classList.toggle( activeClass );
}
// Toggle aria-expanded on the target
twentytwentyToggleAttribute( target, 'aria-expanded', 'true', 'false' );
// Toggle aria-expanded on the toggle
twentytwentyToggleAttribute( toggle, 'aria-expanded', 'true', 'false' );
// Toggle body class
if ( toggle.dataset.toggleBodyClass ) {
document.querySelector( 'body' ).classList.toggle( toggle.dataset.toggleBodyClass );
}
// Check whether to set focus
if ( toggle.dataset.setFocus ) {
focusElement = document.querySelector( toggle.dataset.setFocus );
if ( focusElement ) {
if ( target.classList.contains( activeClass ) ) {
focusElement.focus();
} else {
focusElement.blur();
}
}
}
// Trigger the toggled event on the toggle target
target.dispatchEvent( twentytwenty.createEvent( 'toggled' ) );
// Trigger events on the toggle targets after they are toggled
if ( target.classList.contains( activeClass ) ) {
target.dispatchEvent( twentytwenty.createEvent( 'toggle-target-after-active' ) );
} else {
target.dispatchEvent( twentytwenty.createEvent( 'toggle-target-after-inactive' ) );
}
}, timeOutTime );
},
// Do the toggle
toggle: function() {
var self = this;
document.querySelectorAll( '*[data-toggle-target]' ).forEach( function( element ) {
element.addEventListener( 'click', function() {
var toggle, targetString, target, timeOutTime, classToToggle, activeClass;
// Get our targets
toggle = element;
targetString = toggle.dataset.toggleTarget;
activeClass = 'active';
if ( targetString === 'next' ) {
target = toggle.nextSibling;
} else {
target = document.querySelector( targetString );
}
// Trigger events on the toggle targets before they are toggled
if ( target.classList.contains( activeClass ) ) {
target.dispatchEvent( twentytwenty.createEvent( 'toggle-target-before-active' ) );
} else {
target.dispatchEvent( twentytwenty.createEvent( 'toggle-target-before-inactive' ) );
}
// Get the class to toggle, if specified
classToToggle = toggle.dataset.classToToggle ? toggle.dataset.classToToggle : activeClass;
// For cover modals, set a short timeout duration so the class animations have time to play out
timeOutTime = 0;
if ( target.classList.contains( 'cover-modal' ) ) {
timeOutTime = 10;
}
setTimeout( function() {
var focusElement, duration, newTarget, subMenued;
// Toggle the target of the clicked toggle
if ( toggle.dataset.toggleType === 'slidetoggle' ) {
duration = toggle.dataset.toggleDuration ? toggle.dataset.toggleDuration : 250;
subMenued = target.classList.contains( 'sub-menu' );
newTarget = subMenued ? toggle.closest( '.menu-item' ).querySelector( '.sub-menu' ) : target;
twentytwentySlideToggle( newTarget, duration );
} else {
target.classList.toggle( classToToggle );
}
// If the toggle target is 'next', only give the clicked toggle the active class
if ( targetString === 'next' ) {
toggle.classList.toggle( activeClass );
} else if ( target.classList.contains( 'sub-menu' ) ) {
toggle.classList.toggle( activeClass );
} else {
// If not, toggle all toggles with this toggle target
document.querySelector( '*[data-toggle-target="' + targetString + '"]' ).classList.toggle( activeClass );
}
// Toggle aria-expanded on the target
twentytwentyToggleAttribute( target, 'aria-expanded', 'true', 'false' );
// Toggle aria-expanded on the toggle
twentytwentyToggleAttribute( toggle, 'aria-expanded', 'true', 'false' );
// Toggle body class
if ( toggle.dataset.toggleBodyClass ) {
document.querySelector( 'body' ).classList.toggle( toggle.dataset.toggleBodyClass );
}
// Check whether to set focus
if ( toggle.dataset.setFocus ) {
focusElement = document.querySelector( toggle.dataset.setFocus );
if ( focusElement ) {
if ( target.classList.contains( activeClass ) ) {
focusElement.focus();
} else {
focusElement.blur();
}
}
}
// Trigger the toggled event on the toggle target
target.dispatchEvent( twentytwenty.createEvent( 'toggled' ) );
// Trigger events on the toggle targets after they are toggled
if ( target.classList.contains( activeClass ) ) {
target.dispatchEvent( twentytwenty.createEvent( 'toggle-target-after-active' ) );
} else {
target.dispatchEvent( twentytwenty.createEvent( 'toggle-target-after-inactive' ) );
}
}, timeOutTime );
self.performToggle( element );
} );
} );
},
@ -594,7 +668,7 @@ twentytwentyDomReady( function() {
twentytwenty.intrinsicRatioVideos.init(); // Retain aspect ratio of videos on window resize
twentytwenty.smoothScroll.init(); // Smooth scroll to anchor link or a specific element
twentytwenty.modalMenu.init(); // Modal Menu
twentytwenty.focusManagement.init(); // Focus Management
twentytwenty.primaryMenu.init(); // Primary Menu
} );
/* -----------------------------------------------------------------------------------------------
@ -618,96 +692,100 @@ function twentytwentyToggleAttribute( element, attribute, trueVal, falseVal ) {
}
/**
* twentytwentySlideUp
*
* this implementation is coming from https://w3bits.com/javascript-slidetoggle/
* Toggle a menu item on or off.
*
* @param {HTMLElement} target
* @param {number} duration
*/
function twentytwentySlideUp( target, duration ) {
target.style.transitionProperty = 'height, margin, padding'; /* [1.1] */
target.style.transitionDuration = duration + 'ms'; /* [1.2] */
target.style.boxSizing = 'border-box'; /* [2] */
target.style.height = target.offsetHeight + 'px'; /* [3] */
target.style.height = 0; /* [4] */
target.style.paddingTop = 0; /* [5.1] */
target.style.paddingBottom = 0; /* [5.2] */
target.style.marginTop = 0; /* [6.1] */
target.style.marginBottom = 0; /* [7.2] */
target.style.overflow = 'hidden'; /* [7] */
window.setTimeout( function() {
target.style.display = 'none'; /* [8] */
target.style.removeProperty( 'height' ); /* [9] */
target.style.removeProperty( 'padding-top' ); /* [10.1] */
target.style.removeProperty( 'padding-bottom' ); /* [10.2] */
target.style.removeProperty( 'margin-top' ); /* [11.1] */
target.style.removeProperty( 'margin-bottom' ); /* [11.2] */
target.style.removeProperty( 'overflow' ); /* [12] */
target.style.removeProperty( 'transition-duration' ); /* [13.1] */
target.style.removeProperty( 'transition-property' ); /* [13.2] */
}, duration );
}
function twentytwentyMenuToggle( target, duration ) {
var initialPositions = [];
var finalPositions = [];
var initialParentHeight, finalParentHeight;
var menu, menuItems;
var transitionListener;
/**
* twentytwentySlideDown
*
* this implementation is coming from https://w3bits.com/javascript-slidetoggle/
*
* @param {HTMLElement} target
* @param {number} duration
*/
function twentytwentySlideDown( target, duration ) {
var height, display;
target.style.removeProperty( 'display' ); /* [1] */
display = window.getComputedStyle( target ).display;
if ( display === 'none' ) { /* [2] */
display = 'block';
}
target.style.display = display;
height = target.offsetHeight; /* [3] */
target.style.height = 0; /* [4] */
target.style.paddingTop = 0; /* [5.1] */
target.style.paddingBottom = 0; /* [5.2] */
target.style.marginTop = 0; /* [6.1] */
target.style.marginBottom = 0; /* [6.2] */
target.style.overflow = 'hidden'; /* [7] */
target.style.boxSizing = 'border-box'; /* [8] */
target.style.transitionProperty = 'height, margin, padding'; /* [9.1] */
target.style.transitionDuration = duration + 'ms'; /* [9.2] */
target.style.height = height + 'px'; /* [10] */
target.style.removeProperty( 'padding-top' ); /* [11.1] */
target.style.removeProperty( 'padding-bottom' ); /* [11.2] */
target.style.removeProperty( 'margin-top' ); /* [12.1] */
target.style.removeProperty( 'margin-bottom' ); /* [12.2] */
window.setTimeout( function() {
target.style.removeProperty( 'height' ); /* [13] */
target.style.removeProperty( 'overflow' ); /* [14] */
target.style.removeProperty( 'transition-duration' ); /* [15.1] */
target.style.removeProperty( 'transition-property' ); /* [15.2] */
}, duration );
}
/**
* twentytwentySlideToggle
*
* this implementation is coming from https://w3bits.com/javascript-slidetoggle/
*
* @param {HTMLElement} target
* @param {number} duration
*/
function twentytwentySlideToggle( target, duration ) {
if ( duration === undefined ) {
duration = 500;
if ( ! target ) {
return;
}
if ( window.getComputedStyle( target ).display === 'none' ) {
return twentytwentySlideDown( target, duration );
}
return twentytwentySlideUp( target, duration );
menu = target.closest( '.menu-wrapper' );
// Step 1: look at the initial positions of every menu item.
menuItems = menu.querySelectorAll( '.menu-item' );
menuItems.forEach( function( menuItem, index ) {
initialPositions[ index ] = { x: menuItem.offsetLeft, y: menuItem.offsetTop };
} );
initialParentHeight = target.parentElement.offsetHeight;
target.classList.add( 'toggling-target' );
// Step 2: toggle target menu item and look at the final positions of every menu item.
target.classList.toggle( 'active' );
menuItems.forEach( function( menuItem, index ) {
finalPositions[ index ] = { x: menuItem.offsetLeft, y: menuItem.offsetTop };
} );
finalParentHeight = target.parentElement.offsetHeight;
// Step 3: close target menu item again.
// The whole process happens without giving the browser a chance to render, so it's invisible.
target.classList.toggle( 'active' );
// Step 4: prepare animation.
// Position all the items with absolute offsets, at the same starting position.
// Shouldn't result in any visual changes if done right.
menu.classList.add( 'is-toggling' );
target.classList.toggle( 'active' );
menuItems.forEach( function( menuItem, index ) {
var initialPosition = initialPositions[ index ];
if ( initialPosition.y === 0 && menuItem.parentElement === target ) {
initialPosition.y = initialParentHeight;
}
menuItem.style.transform = 'translate(' + initialPosition.x + 'px, ' + initialPosition.y + 'px)';
} );
// The double rAF is unfortunately needed, since we're toggling CSS classes, and
// the only way to ensure layout completion here across browsers is to wait twice.
// This just delays the start of the animation by 2 frames and is thus not an issue.
requestAnimationFrame( function() {
requestAnimationFrame( function() {
// Step 5: start animation by moving everything to final position.
// All the layout work has already happened, while we were preparing for the animation.
// The animation now runs entirely in CSS, using cheap CSS properties (opacity and transform)
// that don't trigger the layout or paint stages.
menu.classList.add( 'is-animating' );
menuItems.forEach( function( menuItem, index ) {
var finalPosition = finalPositions[ index ];
if ( finalPosition.y === 0 && menuItem.parentElement === target ) {
finalPosition.y = finalParentHeight;
}
if ( duration !== undefined ) {
menuItem.style.transitionDuration = duration + 'ms';
}
menuItem.style.transform = 'translate(' + finalPosition.x + 'px, ' + finalPosition.y + 'px)';
} );
if ( duration !== undefined ) {
target.style.transitionDuration = duration + 'ms';
}
} );
// Step 6: finish toggling.
// Remove all transient classes when the animation ends.
transitionListener = function() {
menu.classList.remove( 'is-animating' );
menu.classList.remove( 'is-toggling' );
target.classList.remove( 'toggling-target' );
menuItems.forEach( function( menuItem ) {
menuItem.style.transform = '';
menuItem.style.transitionDuration = '';
} );
target.style.transitionDuration = '';
target.removeEventListener( 'transitionend', transitionListener );
};
target.addEventListener( 'transitionend', transitionListener );
} );
}
/**

View File

@ -154,36 +154,6 @@ if ( ! class_exists( 'TwentyTwenty_Customize' ) ) {
)
);
/**
* Custom Accent Colors.
*/
$accent_color_options = self::get_color_options();
// Loop over the color options and add them to the customizer.
foreach ( $accent_color_options as $color_option_name => $color_option ) {
$wp_customize->add_setting(
$color_option_name,
array(
'default' => $color_option['default'],
'sanitize_callback' => 'sanitize_hex_color',
)
);
$wp_customize->add_control(
new WP_Customize_Color_Control(
$wp_customize,
$color_option_name,
array(
'label' => $color_option['label'],
'section' => 'colors',
'priority' => 10,
)
)
);
}
// Update background color with postMessage, so inline CSS output is updated as well.
$wp_customize->get_setting( 'background_color' )->transport = 'postMessage';
@ -197,7 +167,7 @@ if ( ! class_exists( 'TwentyTwenty_Customize' ) ) {
'title' => __( 'Theme Options', 'twentytwenty' ),
'priority' => 40,
'capability' => 'edit_theme_options',
'description' => __( 'Settings for this theme.', 'twentytwenty' ),
'description' => __( 'Specific settings for the Twenty Twenty theme.', 'twentytwenty' ),
)
);
@ -207,7 +177,7 @@ if ( ! class_exists( 'TwentyTwenty_Customize' ) ) {
'enable_header_search',
array(
'capability' => 'edit_theme_options',
'default' => false,
'default' => true,
'sanitize_callback' => array( __CLASS__, 'sanitize_checkbox' ),
)
);
@ -215,11 +185,10 @@ if ( ! class_exists( 'TwentyTwenty_Customize' ) ) {
$wp_customize->add_control(
'enable_header_search',
array(
'type' => 'checkbox',
'section' => 'options',
'priority' => 10,
'label' => __( 'Show search in header', 'twentytwenty' ),
'description' => __( 'Uncheck to hide the search in the header.', 'twentytwenty' ),
'type' => 'checkbox',
'section' => 'options',
'priority' => 10,
'label' => __( 'Show search in header', 'twentytwenty' ),
)
);
@ -237,12 +206,11 @@ if ( ! class_exists( 'TwentyTwenty_Customize' ) ) {
$wp_customize->add_control(
'blog_content',
array(
'type' => 'radio',
'section' => 'options',
'priority' => 10,
'label' => __( 'On archive pages, posts show:', 'twentytwenty' ),
'description' => __( 'Search results always show the summary.', 'twentytwenty' ),
'choices' => array(
'type' => 'radio',
'section' => 'options',
'priority' => 10,
'label' => __( 'On archive pages, posts show:', 'twentytwenty' ),
'choices' => array(
'full' => __( 'Full text', 'twentytwenty' ),
'summary' => __( 'Summary', 'twentytwenty' ),
),
@ -270,6 +238,7 @@ if ( ! class_exists( 'TwentyTwenty_Customize' ) ) {
'capability' => 'edit_theme_options',
'default' => true,
'sanitize_callback' => array( __CLASS__, 'sanitize_checkbox' ),
'transport' => 'postMessage',
)
);
@ -283,6 +252,14 @@ if ( ! class_exists( 'TwentyTwenty_Customize' ) ) {
)
);
$wp_customize->selective_refresh->add_partial(
'cover_template_fixed_background',
array(
'selector' => '.cover-header',
'type' => 'cover_fixed',
)
);
/* Separator --------------------- */
$wp_customize->add_setting(
@ -346,51 +323,14 @@ if ( ! class_exists( 'TwentyTwenty_Customize' ) ) {
)
);
/* Overlay Blend Mode ------------ */
$wp_customize->add_setting(
'cover_template_overlay_blend_mode',
array(
'default' => 'multiply',
'sanitize_callback' => array( __CLASS__, 'sanitize_select' ),
)
);
$wp_customize->add_control(
'cover_template_overlay_blend_mode',
array(
'label' => __( 'Image Overlay Blend Mode', 'twentytwenty' ),
'description' => __( 'How the overlay color will blend with the image. Some browsers, like Internet Explorer and Edge, only support the "Normal" mode.', 'twentytwenty' ),
'section' => 'cover_template_options',
'type' => 'select',
'choices' => array(
'normal' => __( 'Normal', 'twentytwenty' ),
'multiply' => __( 'Multiply', 'twentytwenty' ),
'screen' => __( 'Screen', 'twentytwenty' ),
'overlay' => __( 'Overlay', 'twentytwenty' ),
'darken' => __( 'Darken', 'twentytwenty' ),
'lighten' => __( 'Lighten', 'twentytwenty' ),
'color-dodge' => __( 'Color Dodge', 'twentytwenty' ),
'color-burn' => __( 'Color Burn', 'twentytwenty' ),
'hard-light' => __( 'Hard Light', 'twentytwenty' ),
'soft-light' => __( 'Soft Light', 'twentytwenty' ),
'difference' => __( 'Difference', 'twentytwenty' ),
'exclusion' => __( 'Exclusion', 'twentytwenty' ),
'hue' => __( 'Hue', 'twentytwenty' ),
'saturation' => __( 'Saturation', 'twentytwenty' ),
'color' => __( 'Color', 'twentytwenty' ),
'luminosity' => __( 'Luminosity', 'twentytwenty' ),
),
)
);
/* Overlay Color Opacity --------- */
$wp_customize->add_setting(
'cover_template_overlay_opacity',
array(
'default' => '80',
'sanitize_callback' => array( __CLASS__, 'sanitize_select' ),
'default' => 80,
'sanitize_callback' => 'absint',
'transport' => 'postMessage',
)
);
@ -398,25 +338,20 @@ if ( ! class_exists( 'TwentyTwenty_Customize' ) ) {
'cover_template_overlay_opacity',
array(
'label' => __( 'Image Overlay Opacity', 'twentytwenty' ),
'description' => __( 'Make sure that the value is high enough that the text is readable.', 'twentytwenty' ),
'description' => __( 'Make sure that the contrast is high enough so that the text is readable.', 'twentytwenty' ),
'section' => 'cover_template_options',
'type' => 'select',
'choices' => array(
'0' => __( '0%', 'twentytwenty' ),
'10' => __( '10%', 'twentytwenty' ),
'20' => __( '20%', 'twentytwenty' ),
'30' => __( '30%', 'twentytwenty' ),
'40' => __( '40%', 'twentytwenty' ),
'50' => __( '50%', 'twentytwenty' ),
'60' => __( '60%', 'twentytwenty' ),
'70' => __( '70%', 'twentytwenty' ),
'80' => __( '80%', 'twentytwenty' ),
'90' => __( '90%', 'twentytwenty' ),
'100' => __( '100%', 'twentytwenty' ),
),
'type' => 'range',
'input_attrs' => twentytwenty_customize_opacity_range(),
)
);
$wp_customize->selective_refresh->add_partial(
'cover_template_overlay_opacity',
array(
'selector' => '.cover-color-overlay',
'type' => 'cover_opacity',
)
);
}
/**
@ -443,15 +378,6 @@ if ( ! class_exists( 'TwentyTwenty_Customize' ) ) {
return $value;
}
/**
* Return the sitewide color options included.
* Note: These values are shared between the block editor styles and the customizer,
* and abstracted to this function.
*/
public static function get_color_options() {
return apply_filters( 'twentytwenty_accent_color_options', array() );
}
/**
* Sanitize select.
*
@ -511,3 +437,31 @@ if ( ! function_exists( 'twentytwenty_customize_partial_site_logo' ) ) {
twentytwenty_site_logo();
}
}
/**
* Input attributes for cover overlay opacity option.
*
* @return array Array containing attribute names and their values.
*/
function twentytwenty_customize_opacity_range() {
/**
* Filter the input attributes for opacity
*
* @param array $attrs {
* The attributes
*
* @type int $min Minimum value
* @type int $max Maximum value
* @type int $step Interval between numbers
* }
*/
return apply_filters(
'twentytwenty_customize_opacity_range',
array(
'min' => 0,
'max' => 90,
'step' => 5,
)
);
}

View File

@ -1,45 +1,47 @@
<?php
/**
* Javsscript Loader Class
* Javascript Loader Class
*
* Allow `async` and `defer` while enqueuing Javascript.
*
* Based on a soltion in WP Rig.
* Based on a solution in WP Rig.
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
/**
* A class that provides a way to add `async` or `defer` attributes to scripts.
*/
class TwentyTwenty_Script_Loader {
if ( ! class_exists( 'TwentyTwenty_Script_Loader' ) ) {
/**
* Adds async/defer attributes to enqueued / registered scripts.
*
* If #12009 lands in WordPress, this function can no-op since it would be handled in core.
*
* @link https://core.trac.wordpress.org/ticket/12009
*
* @param string $tag The script tag.
* @param string $handle The script handle.
* @return string Script HTML string.
* A class that provides a way to add `async` or `defer` attributes to scripts.
*/
public function filter_script_loader_tag( $tag, $handle ) {
foreach ( array( 'async', 'defer' ) as $attr ) {
if ( ! wp_scripts()->get_data( $handle, $attr ) ) {
continue;
}
// Prevent adding attribute when already added in #12009.
if ( ! preg_match( ":\s$attr(=|>|\s):", $tag ) ) {
$tag = preg_replace( ':(?=></script>):', " $attr", $tag, 1 );
}
// Only allow async or defer, not both.
break;
}
return $tag;
}
class TwentyTwenty_Script_Loader {
/**
* Adds async/defer attributes to enqueued / registered scripts.
*
* If #12009 lands in WordPress, this function can no-op since it would be handled in core.
*
* @link https://core.trac.wordpress.org/ticket/12009
*
* @param string $tag The script tag.
* @param string $handle The script handle.
* @return string Script HTML string.
*/
public function filter_script_loader_tag( $tag, $handle ) {
foreach ( [ 'async', 'defer' ] as $attr ) {
if ( ! wp_scripts()->get_data( $handle, $attr ) ) {
continue;
}
// Prevent adding attribute when already added in #12009.
if ( ! preg_match( ":\s$attr(=|>|\s):", $tag ) ) {
$tag = preg_replace( ':(?=></script>):', " $attr", $tag, 1 );
}
// Only allow async or defer, not both.
break;
}
return $tag;
}
}
}

View File

@ -10,7 +10,7 @@
if ( ! class_exists( 'TwentyTwenty_SVG_Icons' ) ) {
/**
* SVG ICONS CLASS
* Retrieve the SVG code for the specified icon. Based on a solution in TwentyNineteen.
* Retrieve the SVG code for the specified icon. Based on a solution in Twenty Nineteen.
*/
class TwentyTwenty_SVG_Icons {
/**

View File

@ -69,6 +69,11 @@ if ( ! class_exists( 'TwentyTwenty_Walker_Comment' ) ) {
<?php echo esc_html( $comment_timestamp ); ?>
</time>
</a>
<?php
if ( get_edit_comment_link() ) {
echo ' &bull; <a class="comment-edit-link" href="' . esc_url( get_edit_comment_link() ) . '">' . __( 'Edit', 'twentytwenty' ) . '</a>'; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- core trusts translations
}
?>
</div><!-- .comment-metadata -->
</footer><!-- .comment-meta -->
@ -84,6 +89,7 @@ if ( ! class_exists( 'TwentyTwenty_Walker_Comment' ) ) {
<p class="comment-awaiting-moderation"><?php _e( 'Your comment is awaiting moderation.', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></p>
<?php
}
?>
</div><!-- .comment-content -->
@ -105,9 +111,7 @@ if ( ! class_exists( 'TwentyTwenty_Walker_Comment' ) ) {
$by_post_author = twentytwenty_is_comment_by_post_author( $comment );
$edit_comment_link = get_edit_comment_link() ? '<a class="edit-comment-link" href="' . esc_url( get_edit_comment_link() ) . '">' . __( 'Edit', 'twentytwenty' ) . '</a>' : '';
if ( $comment_reply_link || $by_post_author || $edit_comment_link ) {
if ( $comment_reply_link || $by_post_author ) {
?>
<footer class="comment-footer-meta">
@ -116,9 +120,6 @@ if ( ! class_exists( 'TwentyTwenty_Walker_Comment' ) ) {
if ( $comment_reply_link ) {
echo $comment_reply_link; //phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped --Link is escaped in https://developer.wordpress.org/reference/functions/get_comment_reply_link/
}
if ( $edit_comment_link ) {
echo $edit_comment_link; //phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped --Link escaped on line 109.
}
if ( $by_post_author ) {
echo '<span class="by-post-author">' . __( 'By Post Author', 'twentytwenty' ) . '</span>'; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- core trusts translations
}

View File

@ -128,9 +128,10 @@ if ( ! class_exists( 'TwentyTwenty_Walker_Page' ) ) {
if ( isset( $args['pages_with_children'][ $page->ID ] ) ) {
$toggle_target_string = '.menu-modal .page-item-' . $page->ID . ' > ul';
$toggle_duration = twentytwenty_toggle_duration();
// Add the sub menu toggle.
$args['list_item_after'] .= '<button class="toggle sub-menu-toggle fill-children-current-color" data-toggle-target="' . $toggle_target_string . '" data-toggle-type="slidetoggle" data-toggle-duration="250"><span class="screen-reader-text">' . __( 'Show sub menu', 'twentytwenty' ) . '</span>' . twentytwenty_get_theme_svg( 'chevron-down' ) . '</button>';
$args['list_item_after'] .= '<button class="toggle sub-menu-toggle fill-children-current-color" data-toggle-target="' . $toggle_target_string . '" data-toggle-type="slidetoggle" data-toggle-duration="' . absint( $toggle_duration ) . '"><span class="screen-reader-text">' . __( 'Show sub menu', 'twentytwenty' ) . '</span>' . twentytwenty_get_theme_svg( 'chevron-down' ) . '</button>';
}

View File

@ -107,7 +107,7 @@ if ( $comments ) {
if ( comments_open() || pings_open() ) {
if ( $comments ) {
echo '<hr class="is-style-wide" aria-hidden="true" />';
echo '<hr class="styled-separator is-style-wide" aria-hidden="true" />';
}
comment_form(
@ -121,7 +121,7 @@ if ( comments_open() || pings_open() ) {
} elseif ( is_single() ) {
if ( $comments ) {
echo '<hr class="is-style-wide" aria-hidden="true" />';
echo '<hr class="styled-separator is-style-wide" aria-hidden="true" />';
}
?>

View File

@ -12,112 +12,9 @@
*/
?>
<footer id="site-footer" role="contentinfo" class="header-footer-group">
<footer id="site-footer" role="contentinfo" class="header-footer-group">
<div class="footer-inner section-inner">
<?php
$has_footer_menu = has_nav_menu( 'footer' );
$has_social_menu = has_nav_menu( 'social' );
$footer_top_classes = '';
$footer_top_classes .= $has_footer_menu ? ' has-footer-menu' : '';
$footer_top_classes .= $has_social_menu ? ' has-social-menu' : '';
$footer_social_wrapper_class = $has_footer_menu ? 'footer-social-wrapper' : '';
if ( $has_footer_menu || $has_social_menu ) {
?>
<div class="footer-top<?php echo esc_attr( $footer_top_classes ); ?>">
<?php if ( $has_footer_menu ) { ?>
<nav aria-label="<?php esc_attr_e( 'Footer menu', 'twentytwenty' ); ?>">
<ul class="footer-menu reset-list-style">
<?php
wp_nav_menu(
array(
'container' => '',
'depth' => 1,
'items_wrap' => '%3$s',
'theme_location' => 'footer',
)
);
?>
</ul>
</nav><!-- .site-nav -->
<?php } ?>
<?php if ( $has_social_menu ) { ?>
<div class="<?php esc_attr( $footer_social_wrapper_class ); ?>">
<nav aria-label="<?php esc_attr_e( 'Social links', 'twentytwenty' ); ?>">
<ul class="social-menu footer-social reset-list-style social-icons s-icons">
<?php
wp_nav_menu(
array(
'theme_location' => 'social',
'container' => '',
'container_class' => '',
'items_wrap' => '%3$s',
'menu_id' => '',
'menu_class' => '',
'depth' => 1,
'link_before' => '<span class="screen-reader-text">',
'link_after' => '</span>',
'fallback_cb' => '',
)
);
?>
</ul>
</nav><!-- .social-menu -->
</div><!-- .footer-social-wrapper -->
<?php } ?>
</div><!-- .footer-top -->
<?php } ?>
<?php if ( is_active_sidebar( 'sidebar-1' ) || is_active_sidebar( 'sidebar-2' ) ) { ?>
<div class="footer-widgets-outer-wrapper">
<div class="footer-widgets-wrapper">
<?php if ( is_active_sidebar( 'sidebar-1' ) ) { ?>
<div class="footer-widgets column-one grid-item">
<?php dynamic_sidebar( 'sidebar-1' ); ?>
</div>
<?php } ?>
<?php if ( is_active_sidebar( 'sidebar-2' ) ) { ?>
<div class="footer-widgets column-two grid-item">
<?php dynamic_sidebar( 'sidebar-2' ); ?>
</div>
<?php } ?>
</div><!-- .footer-widgets-wrapper -->
</div><!-- .footer-widgets-outer-wrapper -->
<?php } ?>
<div class="footer-bottom">
<div class="section-inner">
<div class="footer-credits">
@ -130,14 +27,15 @@
)
);
?>
<a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php echo bloginfo( 'name' ); ?></a></a>
<a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php echo bloginfo( 'name' ); ?></a>
</p>
<p class="powered-by-wordpress">
<?php
/* Translators: %s = Link to WordPress.org */
printf( _x( 'Powered by %s', 'Translators: %s = Link to WordPress.org', 'twentytwenty' ), '<a href="https://wordpress.org">' . __( 'WordPress', 'twentytwenty' ) . '</a>' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- core trusts translations
?>
<a href="<?php echo esc_url( __( 'https://wordpress.org/', 'twentytwenty' ) ); ?>">
<?php
_e( 'Powered by WordPress', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations
?>
</a>
</p><!-- .theme-credits -->
</div><!-- .footer-credits -->
@ -157,11 +55,9 @@
</span>
</a>
</div><!-- .footer-bottom -->
</div><!-- .section-inner -->
</div><!-- .footer-inner -->
</footer><!-- #site-footer -->
</footer><!-- #site-footer -->
<?php wp_footer(); ?>

File diff suppressed because it is too large Load Diff

View File

@ -16,7 +16,7 @@
<head>
<meta http-equiv="content-type" content="<?php bloginfo( 'html_type' ); ?>" charset="<?php bloginfo( 'charset' ); ?>" />
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1.0" >
<link rel="profile" href="https://gmpg.org/xfn/11">
@ -48,7 +48,9 @@
<button class="toggle search-toggle mobile-search-toggle" data-toggle-target=".search-modal" data-toggle-screen-lock="true" data-toggle-body-class="showing-search-modal" data-set-focus=".search-modal .search-field" aria-expanded="false">
<div class="toggle-inner">
<?php twentytwenty_the_theme_svg( 'search' ); ?>
<div class="toggle-icon">
<?php twentytwenty_the_theme_svg( 'search' ); ?>
</div>
<span class="toggle-text"><?php _e( 'Search', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></span>
</div>
</button><!-- .search-toggle -->
@ -69,7 +71,9 @@
<button class="toggle nav-toggle mobile-nav-toggle" data-toggle-target=".menu-modal" data-toggle-screen-lock="true" data-toggle-body-class="showing-menu-modal" aria-expanded="false" data-set-focus=".close-nav-toggle">
<div class="toggle-inner">
<?php twentytwenty_the_theme_svg( 'ellipsis' ); ?>
<div class="toggle-icon">
<?php twentytwenty_the_theme_svg( 'ellipsis' ); ?>
</div>
<span class="toggle-text"><?php _e( 'Menu', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></span>
</div>
</button><!-- .nav-toggle -->
@ -82,9 +86,7 @@
if ( has_nav_menu( 'primary' ) || ! has_nav_menu( 'expanded' ) ) {
?>
<div class="primary-menu-wrapper">
<nav aria-label="<?php esc_attr_e( 'Primary', 'twentytwenty' ); ?>">
<nav class="primary-menu-wrapper" aria-label="<?php esc_attr_e( 'Horizontal', 'twentytwenty' ); ?>" role="navigation">
<ul class="primary-menu reset-list-style">
@ -115,9 +117,7 @@
</ul>
</nav><!-- .primary-menu -->
</div><!-- .primary-menu-wrapper -->
</nav><!-- .primary-menu-wrapper -->
<?php
}
@ -145,7 +145,9 @@
<button class="toggle nav-toggle" data-toggle-target=".menu-modal" data-toggle-screen-lock="true" data-toggle-body-class="showing-menu-modal" aria-expanded="false" data-set-focus=".close-nav-toggle">
<div class="toggle-inner">
<span class="toggle-text"><?php _e( 'Menu', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></span>
<?php twentytwenty_the_theme_svg( 'ellipsis' ); ?>
<div class="toggle-icon">
<?php twentytwenty_the_theme_svg( 'ellipsis' ); ?>
</div>
</div>
</button><!-- .nav-toggle -->

View File

@ -23,7 +23,10 @@ if ( ! function_exists( 'twentytwenty_generate_css' ) ) {
$return = '';
if ( ! $value ) {
/*
* Bail early if we have no $selector elements or properties and $value.
*/
if ( ! $value || ! $selector ) {
return;
}
@ -52,10 +55,17 @@ if ( ! function_exists( 'twentytwenty_get_customizer_css' ) ) {
function twentytwenty_get_customizer_css( $type = 'front-end' ) {
// Get variables.
$body = sanitize_hex_color( twentytwenty_get_color_for_area( 'content', 'text' ) );
$body_default = '#000000';
$accent = sanitize_hex_color( twentytwenty_get_color_for_area( 'content', 'accent' ) );
$accent_default = '#cd2653';
$body = sanitize_hex_color( twentytwenty_get_color_for_area( 'content', 'text' ) );
$body_default = '#000000';
$accent = sanitize_hex_color( twentytwenty_get_color_for_area( 'content', 'accent' ) );
$accent_default = '#cd2653';
/**
* Filters the CSS selectors targetting button component on frontend to apply common css
*
* @since 1.0.0
*
* @param string $string The comma separated string of all CSS selectors targetting button component
*/
$buttons_targets = apply_filters( 'twentytwenty_buttons_targets_front_end', 'button, .button, .faux-button, .wp-block-button__link, .wp-block-file__button, input[type=\'button\'], input[type=\'reset\'], input[type=\'submit\']' );
// Header.
@ -90,6 +100,13 @@ if ( ! function_exists( 'twentytwenty_get_customizer_css' ) ) {
foreach ( $elements_definitions as $context => $props ) {
foreach ( $props as $key => $definitions ) {
foreach ( $definitions as $property => $elements ) {
/*
* If we don't have an elements array or it is empty
* then skip this itteration early;
*/
if ( ! is_array( $elements ) || empty( $elements ) ) {
continue;
}
$val = twentytwenty_get_color_for_area( $context, $key );
if ( $val ) {
twentytwenty_generate_css( implode( ',', $elements ), $property, $val );
@ -99,6 +116,7 @@ if ( ! function_exists( 'twentytwenty_get_customizer_css' ) ) {
}
if ( $cover && $cover !== $cover_default ) {
twentytwenty_generate_css( '.overlay-header .header-inner', 'color', $cover );
twentytwenty_generate_css( '.cover-header .entry-header *', 'color', $cover );
}

File diff suppressed because it is too large Load Diff

View File

@ -41,7 +41,7 @@ get_header();
}
} elseif ( ! is_home() ) {
$archive_title = get_the_archive_title();
$archive_subtitle = get_the_archive_description( '<div>', '</div>' );
$archive_subtitle = get_the_archive_description();
}
if ( $archive_title || $archive_subtitle ) {
@ -63,47 +63,44 @@ get_header();
</header><!-- .archive-header -->
<?php } ?>
<div class="posts">
<?php
if ( have_posts() ) {
}
$i = 0;
if ( have_posts() ) {
while ( have_posts() ) {
$i++;
if ( $i > 1 ) {
echo '<hr class="post-separator is-style-wide section-inner" aria-hidden="true" />';
}
the_post();
get_template_part( 'template-parts/content', get_post_type() );
$i = 0;
while ( have_posts() ) {
$i++;
if ( $i > 1 ) {
echo '<hr class="post-separator styled-separator is-style-wide section-inner" aria-hidden="true" />';
}
} elseif ( is_search() ) {
?>
the_post();
<div class="no-search-results-form section-inner thin">
get_template_part( 'template-parts/content', get_post_type() );
<?php
get_search_form(
array(
'label' => __( 'search again', 'twentytwenty' ),
)
);
?>
</div><!-- .no-search-results -->
<?php
}
} elseif ( is_search() ) {
?>
</div><!-- .posts -->
<div class="no-search-results-form section-inner thin">
<?php
get_search_form(
array(
'label' => _x( 'search again', 'Label', 'twentytwenty' ),
)
);
?>
</div><!-- .no-search-results -->
<?php
}
?>
<?php get_template_part( 'template-parts/pagination' ); ?>
<?php get_template_part( 'template-parts/footer-menus-widgets' ); ?>
</main><!-- #site-content -->

File diff suppressed because it is too large Load Diff

View File

@ -1,40 +1,47 @@
{
"name": "twentytwenty",
"version": "1.0.0",
"description": "Default WP Theme",
"repository": {
"type": "git",
"url": "git+https://github.com/wordpress/twentytwenty.git"
},
"license": "GPL-2.0+",
"bugs": {
"url": "https://github.com/wordpress/twentytwenty/issues"
},
"homepage": "https://github.com/wordpress/twentytwenty#readme",
"devDependencies": {
"@wordpress/scripts": "^5.0.0",
"concurrently": "^4.1.2",
"rtlcss": "^2.4.0"
},
"rtlcssConfig": {
"options": {
"autoRename": false,
"autoRenameStrict": false,
"blacklist": {},
"clean": true,
"greedy": false,
"processUrls": false,
"stringMap": []
},
"plugins": [],
"map": false
},
"scripts": {
"build:rtl": "concurrently \"npm run build:rtl-style\" \"npm run build:rtl-esb\" \"npm run build:rtl-esc\"",
"build:rtl-style": "rtlcss style.css style-rtl.css",
"build:rtl-esb": "rtlcss assets/css/editor-style-block.css assets/css/editor-style-block-rtl.css",
"build:rtl-esc": "rtlcss assets/css/editor-style-classic.css assets/css/editor-style-classic-rtl.css",
"lint:css": "wp-scripts lint-style 'style.css' 'assets/**/*.css'",
"lint:js": "wp-scripts lint-js 'assets/**/*.js'"
}
"name": "twentytwenty",
"version": "1.0.0",
"description": "Default WP Theme",
"author": "The WordPress Contributors",
"license": "GPL-2.0-or-later",
"keywords": [
"WordPress",
"Theme",
"TwentyTwenty"
],
"homepage": "https://github.com/wordpress/twentytwenty#readme",
"repository": {
"type": "git",
"url": "git+https://github.com/wordpress/twentytwenty.git"
},
"bugs": {
"url": "https://github.com/wordpress/twentytwenty/issues"
},
"devDependencies": {
"@wordpress/scripts": "^5.0.0",
"concurrently": "^4.1.2",
"rtlcss": "^2.4.0"
},
"rtlcssConfig": {
"options": {
"autoRename": false,
"autoRenameStrict": false,
"blacklist": {},
"clean": true,
"greedy": false,
"processUrls": false,
"stringMap": []
},
"plugins": [],
"map": false
},
"scripts": {
"build:rtl": "concurrently \"npm run build:rtl-style\" \"npm run build:rtl-esb\" \"npm run build:rtl-esc\"",
"build:rtl-style": "rtlcss style.css style-rtl.css",
"build:rtl-esb": "rtlcss assets/css/editor-style-block.css assets/css/editor-style-block-rtl.css",
"build:rtl-esc": "rtlcss assets/css/editor-style-classic.css assets/css/editor-style-classic-rtl.css",
"lint:css": "wp-scripts lint-style 'style.css' 'assets/**/*.css'",
"lint:js": "wp-scripts lint-js 'assets/**/*.js'",
"lint:pkg-json": "wp-scripts lint-pkg-json"
}
}

View File

@ -0,0 +1,162 @@
@charset "UTF-8";
/*
Theme Name: Twenty Twenty
Adding print support. The print styles are based on the the great work of
Andreas Hecht in https://www.jotform.com/blog/css-perfect-print-stylesheet-98272/.
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Margins
# Paddings
# Width
# Typography
# Page breaks
# Links
# Visibility
--------------------------------------------------------------*/
@media print {
/* Margins */
@page {
margin: 2cm;
}
.entry-header,
.site-footer {
margin: 0;
}
/* Paddings */
.posts {
padding: 0;
}
/* Width */
.entry-content,
.entry-content p,
.section-inner,
.section-inner.max-percentage,
.section-inner.medium,
.section-inner.small,
.section-inner.thin {
max-width: 100%;
width: 100%;
}
/* Fonts */
body {
background: #fff !important;
color: #000;
font: 13pt Georgia, "Times New Roman", Times, serif;
line-height: 1.3;
}
h1 {
font-size: 20pt;
}
h2,
h2.entry-title,
h3,
h4,
.has-regular-font-size,
.has-large-font-size,
.comments-header {
font-size: 14pt;
margin-top: 1cm;
}
/* Page breaks */
a {
page-break-inside: avoid;
}
blockquote {
page-break-inside: avoid;
}
h1,
h2,
h3,
h4,
h5,
h6 {
page-break-after: avoid;
page-break-inside: avoid;
}
img {
page-break-inside: avoid;
page-break-after: avoid;
}
table,
pre {
page-break-inside: avoid;
}
ul,
ol,
dl {
page-break-before: avoid;
}
/* Links */
a:link,
a:visited,
a {
background: transparent;
font-weight: bold;
text-decoration: underline;
}
a {
page-break-inside: avoid;
}
a[href^="http"]:after {
content: " < " attr(href) "> ";
}
a:after > img {
content: "";
}
article a[href^="#"]:after {
content: "";
}
a:not(:local-link):after {
content: " < " attr(href) "> ";
}
/* Visibility */
#site-header,
.comment-form,
.comments-wrapper,
.comment .comment-metadata,
.footer-social-wrapper,
.footer-widgets-outer-wrapper,
.header-navigation-wrapper,
.pagination-wrapper,
.post-meta-wrapper.post-meta-single-bottom,
.post-separator,
.site-logo img {
display: none;
}
.entry-content .wp-block-button .wp-block-button__link,
.entry-content .wp-block-button .wp-block-file__button,
.entry-content .button {
background: none;
color: #000;
}
}

View File

@ -13,36 +13,52 @@ Default theme for Twenty Twenty
== Changelog ==
== Resources ==
== Copyright ==
Twenty Twenty WordPress Theme, Copyright 2019 WordPress.org
Twenty Twenty is distributed under the terms of the GNU GPL.
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 2 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
Twenty Twenty is derived from the Chaplin Theme, Copyright 2019 Anders Norén
Chaplin Theme is distributed under the terms of the GNU GPL version 2.0
Twenty Twenty bundles the following third-party resources:
Image in screenshot.png from PxHere
License: Creative Commons Zero (CC0), https://creativecommons.org/publicdomain/zero/1.0/
URL: https://pxhere.com/en/photo/18153
Inter Font
Copyright (c) 2016-2019 The Inter Project Authors (me@rsms.me)
License: SIL Open Font License, 1.1, https://opensource.org/licenses/OFL-1.1
Source: https://rsms.me/inter/
FontAwesome Icons
Bespoke Icons Created For Twenty Twenty
License: Creative Commons Zero (CC0), https://creativecommons.org/publicdomain/zero/1.0/
List of bespoke icons:
- Search icon
- Menu icon
Feather Icons
Copyright (c) 2013-2017 Cole Bemis
License: MIT License, https://opensource.org/licenses/MIT
Source: https://feathericons.com
Font Awesome Icons
Copyright (c) 2012-2019 Fonticons, Inc.
License: SIL Open Font License, 1.1, https://opensource.org/licenses/OFL-1.1
Source: https://www.fontawesome.io
FontAwesome Code
Font Awesome Code
Copyright (c) 2012-2019 Fonticons, Inc.
License: MIT License, https://opensource.org/licenses/MIT
Source: https://www.fontawesome.io
Font Noto Sans
License: Apache License (Apache-2.0), https://www.apache.org/licenses/LICENSE-2.0
URL: https://fonts.google.com/specimen/Noto+Sans
Font Noto Sans TC
License: SIL Open Font License (OFL-1.1), https://opensource.org/licenses/OFL-1.1
URL: https://fonts.google.com/specimen/Noto+Sans+TC
Font Noto Sans SC
License: SIL Open Font License (OFL-1.1), https://opensource.org/licenses/OFL-1.1
URL: https://fonts.google.com/specimen/Noto+Sans+TC
Font Noto Sans HK
License: SIL Open Font License (OFL-1.1), https://opensource.org/licenses/OFL-1.1
URL: https://fonts.google.com/specimen/Noto+Sans+TC

View File

@ -25,6 +25,8 @@ get_header();
}
}
get_template_part( 'template-parts/footer-menus-widgets' );
?>
</main><!-- #site-content -->

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@ -42,14 +42,10 @@
$color_overlay_opacity = get_theme_mod( 'cover_template_overlay_opacity' );
$color_overlay_opacity = ( false === $color_overlay_opacity ) ? 80 : $color_overlay_opacity;
$color_overlay_classes .= ' opacity-' . $color_overlay_opacity;
// Get the blend mode of the color overlay (default = multiply).
$color_overlay_opacity = get_theme_mod( 'cover_template_overlay_blend_mode', 'multiply' );
$color_overlay_classes .= ' blend-mode-' . $color_overlay_opacity;
?>
<div class="cover-header screen-height screen-width<?php echo esc_attr( $cover_header_classes ); ?>"<?php echo $cover_header_style; //phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- We need to double check this, but for now, we want to pass PHPCS ;) ?>>
<div class="cover-header-inner-wrapper">
<div class="cover-header <?php echo esc_attr( $cover_header_classes ); ?>"<?php echo $cover_header_style; //phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- We need to double check this, but for now, we want to pass PHPCS ;) ?>>
<div class="cover-header-inner-wrapper screen-height">
<div class="cover-header-inner">
<div class="cover-color-overlay color-accent<?php echo esc_attr( $color_overlay_classes ); ?>"<?php echo $color_overlay_style; //phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- We need to double check this, but for now, we want to pass PHPCS ;) ?>></div>
@ -58,7 +54,13 @@
<?php
// Allow child themes and plugins to filter the display of the categories in the entry header.
/**
* Allow child themes and plugins to filter the display of the categories in the article header.
*
* @since 1.0.0
*
* @param bool Whether to show the categories in article header, Default true.
*/
$show_categories = apply_filters( 'twentytwenty_show_categories_in_entry_header', true );
if ( true === $show_categories && has_category() ) {

View File

@ -25,7 +25,7 @@
?>
<div class="post-inner section-inner thin">
<div class="post-inner section-inner <?php echo is_page_template( 'templates/template-full-width.php' ) ? '' : 'thin'; ?> ">
<div class="entry-content">

View File

@ -17,7 +17,7 @@ if ( (bool) get_the_author_meta( 'description' ) ) : ?>
<?php
printf(
/* Translators: %s: post author */
esc_html( 'By %s', 'twentytwenty' ),
esc_html__( 'By %s', 'twentytwenty' ),
esc_html( get_the_author() )
);
?>

View File

@ -3,7 +3,7 @@
* Displays the post header
*
* @package WordPress
* @subpackage Twenty_Nineteen
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
@ -20,8 +20,13 @@ if ( is_singular() ) {
<div class="entry-header-inner section-inner medium">
<?php
// Allow child themes and plugins to filter the display of the categories in the entry header.
/**
* Allow child themes and plugins to filter the display of the categories in the entry header.
*
* @since 1.0.0
*
* @param bool Whether to show the categories in header, Default true.
*/
$show_categories = apply_filters( 'twentytwenty_show_categories_in_entry_header', true );
if ( true === $show_categories && has_category() ) {

View File

@ -3,7 +3,7 @@
* Displays the featured image
*
* @package WordPress
* @subpackage Twenty_Nineteen
* @subpackage Twenty_Twenty
* @since 1.0.0
*/

View File

@ -0,0 +1,125 @@
<?php
/**
* Displays the menus and widgets at the end of the main element.
* Visually, this output is presented as part of the footer element.
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
$has_footer_menu = has_nav_menu( 'footer' );
$has_social_menu = has_nav_menu( 'social' );
$has_sidebar_1 = is_active_sidebar( 'sidebar-1' );
$has_sidebar_2 = is_active_sidebar( 'sidebar-2' );
// Only output the container if there are elements to display.
if ( $has_footer_menu || $has_social_menu || $has_sidebar_1 || $has_sidebar_2 ) {
?>
<div class="footer-nav-widgets-wrapper header-footer-group">
<div class="footer-inner section-inner">
<?php
$footer_top_classes = '';
$footer_top_classes .= $has_footer_menu ? ' has-footer-menu' : '';
$footer_top_classes .= $has_social_menu ? ' has-social-menu' : '';
$footer_social_wrapper_class = $has_footer_menu ? 'footer-social-wrapper' : '';
if ( $has_footer_menu || $has_social_menu ) {
?>
<div class="footer-top<?php echo esc_attr( $footer_top_classes ); ?>">
<?php if ( $has_footer_menu ) { ?>
<nav aria-label="<?php esc_attr_e( 'Footer', 'twentytwenty' ); ?>" role="navigation">
<ul class="footer-menu reset-list-style">
<?php
wp_nav_menu(
array(
'container' => '',
'depth' => 1,
'items_wrap' => '%3$s',
'theme_location' => 'footer',
)
);
?>
</ul>
</nav><!-- .site-nav -->
<?php } ?>
<?php if ( $has_social_menu ) { ?>
<div class="<?php echo esc_attr( $footer_social_wrapper_class ); ?>">
<nav aria-label="<?php esc_attr_e( 'Social links', 'twentytwenty' ); ?>">
<ul class="social-menu footer-social reset-list-style social-icons s-icons">
<?php
wp_nav_menu(
array(
'theme_location' => 'social',
'container' => '',
'container_class' => '',
'items_wrap' => '%3$s',
'menu_id' => '',
'menu_class' => '',
'depth' => 1,
'link_before' => '<span class="screen-reader-text">',
'link_after' => '</span>',
'fallback_cb' => '',
)
);
?>
</ul>
</nav><!-- .social-menu -->
</div><!-- .footer-social-wrapper -->
<?php } ?>
</div><!-- .footer-top -->
<?php } ?>
<?php if ( $has_sidebar_1 || $has_sidebar_2 ) { ?>
<aside class="footer-widgets-outer-wrapper" role="complementary">
<div class="footer-widgets-wrapper">
<?php if ( $has_sidebar_1 ) { ?>
<div class="footer-widgets column-one grid-item">
<?php dynamic_sidebar( 'sidebar-1' ); ?>
</div>
<?php } ?>
<?php if ( $has_sidebar_2 ) { ?>
<div class="footer-widgets column-two grid-item">
<?php dynamic_sidebar( 'sidebar-2' ); ?>
</div>
<?php } ?>
</div><!-- .footer-widgets-wrapper -->
</aside><!-- .footer-widgets-outer-wrapper -->
<?php } ?>
</div><!-- .footer-inner -->
</div><!-- .footer-nav-widgets-wrapper -->
<?php } ?>

View File

@ -17,20 +17,13 @@
<div class="menu-top">
<button class="toggle close-nav-toggle fill-children-current-color" data-toggle-target=".menu-modal" data-toggle-screen-lock="true" data-toggle-body-class="showing-menu-modal" aria-expanded="false" data-set-focus=".menu-modal">
<span class="toggle-text"><?php esc_html_e( 'Close Menu', 'twentytwenty' ); ?></span>
<?php twentytwenty_the_theme_svg( 'cross' ); ?>
</button><!-- .nav-toggle -->
<?php
// If the expanded menu is set, output the close button.
if ( has_nav_menu( 'expanded' ) ) {
?>
<button class="toggle close-nav-toggle fill-children-current-color" data-toggle-target=".menu-modal" data-toggle-screen-lock="true" data-toggle-body-class="showing-menu-modal" aria-expanded="false" data-set-focus=".menu-modal">
<span class="toggle-text"><?php esc_html_e( 'Close Menu', 'twentytwenty' ); ?></span>
<?php twentytwenty_the_theme_svg( 'cross' ); ?>
</button><!-- .nav-toggle -->
<?php
}
$mobile_menu_location = '';
// If the mobile menu location is not set, use the primary and expanded locations as fallbacks, in that order.

View File

@ -14,15 +14,13 @@
<div class="section-inner">
<?php $unique_id = esc_attr( uniqid( 'search-form-' ) ); ?>
<form role="search" method="get" class="modal-search-form" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<label class="screen-reader-text" for="<?php echo esc_attr( $unique_id ); ?>">
<?php echo _x( 'Search for:', 'Label', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- core trusts translations ?>
</label>
<input type="search" id="<?php echo esc_attr( $unique_id ); ?>" class="search-field" placeholder="<?php echo esc_attr_x( 'Search for&hellip;', 'Placeholder', 'twentytwenty' ); ?>" value="<?php echo get_search_query(); ?>" name="s" />
<button type="submit" class="search-submit"><?php echo _x( 'Search', 'Submit button', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- core trusts translations ?></button>
</form><!-- .search-form -->
<?php
get_search_form(
array(
'label' => _x( 'Search for:', 'Label', 'twentytwenty' ),
)
);
?>
<button class="toggle search-untoggle fill-children-current-color" data-toggle-target=".search-modal" data-toggle-screen-lock="true" data-toggle-body-class="showing-search-modal" data-set-focus=".search-modal .search-field">
<span class="screen-reader-text"><?php _e( 'Close search', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></span>

View File

@ -24,7 +24,7 @@ if ( $next_post || $prev_post ) {
<nav class="pagination-single section-inner<?php echo esc_attr( $pagination_classes ); ?>" aria-label="<?php esc_attr_e( 'Post', 'twentytwenty' ); ?>">
<hr class="is-style-wide" aria-hidden="true" />
<hr class="styled-separator is-style-wide" aria-hidden="true" />
<div class="pagination-single-inner">
@ -53,7 +53,7 @@ if ( $next_post || $prev_post ) {
</div><!-- .pagination-single-inner -->
<hr class="is-style-wide" aria-hidden="true" />
<hr class="styled-separator is-style-wide" aria-hidden="true" />
</nav><!-- .pagination-single -->

View File

@ -48,7 +48,7 @@ if ( $posts_pagination ) { ?>
<div class="pagination-wrapper section-inner">
<hr class="pagination-separator is-style-wide" aria-hidden="true" />
<hr class="styled-separator pagination-separator is-style-wide" aria-hidden="true" />
<?php echo $posts_pagination; //phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- already escaped during generation. ?>

View File

@ -24,6 +24,8 @@ get_header();
}
}
get_template_part( 'template-parts/footer-menus-widgets' );
?>
</main><!-- #site-content -->

View File

@ -13,7 +13,7 @@
*
* @global string $wp_version
*/
$wp_version = '5.3-beta1-46356';
$wp_version = '5.3-beta1-46357';
/**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.