IntenseWebs/WordPress
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Bundled Themes: Import Twenty Twenty, the new default theme for WordPress 5.3.

Browse Source 
Welcome to the bundled themes family!

Theme development to this point has taken place on GitHub. See: https://github.com/WordPress/twentytwenty/.

Props anlino, ianbelanger, audrasjb, nielslange, fabiankaegy, mukesh27, poena, joyously, emiluzelac, williampatton, dingo-d, dkarfa, acosmin, rabmalin, kafleg, jeffpaul, hareesh-pillai, burhandodhy, afercia, juanfra, soean, presskopp, justinahinon, jrf, netweb, garyj, pento, flixos90, vbaimas, zebulan, byalextran, mor10, kjellr, allancole, tdh, karmatosed, mapk, matt, andrewtaylor-1, ismailelkorchi, garrett-eclipse, gsayed786, dianeco, celloexpressions, aristath, nadir, cbravobernal, intimez, hometowntrailers, collet, littlebigthing, tobifjellner, kevinkovadia, jarretc.
See #48110.
Built from https://develop.svn.wordpress.org/trunk@46271


git-svn-id: http://core.svn.wordpress.org/trunk@46083 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
desrosj 2019-09-23 20:16:00 +00:00
parent d363d85cce
commit 43b86a246c
79 changed files with 34115 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
wp-content/themes/twentytwenty/.stylelintrc.json Normal file
View File

@ -0,0 +1,7 @@
{
"extends": "stylelint-config-wordpress",
"rules": {
"font-family-no-missing-generic-family-keyword": null,
"no-descending-specificity": null
}
}

34
wp-content/themes/twentytwenty/404.php Normal file
View File

@ -0,0 +1,34 @@
<?php
/**
* The template for displaying the 404 template in the Twenty Twenty theme.
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
get_header();
?>
<main id="site-content" role="main">
<div class="section-inner thin">
<h1 class="entry-title"><?php _e( 'Page Not Found', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></h1>
<div class="intro-text"><p><?php _e( 'The page you were looking for could not be found. It might have been removed, renamed, or did not exist in the first place.', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></p></div>
<?php
get_search_form(
array(
'label' => __( '404 not found', 'twentytwenty' ),
)
);
?>
</div><!-- .section-inner -->
</main><!-- #site-content -->
<?php
get_footer();

836
wp-content/themes/twentytwenty/assets/css/editor-style-block-rtl.css Normal file
View File

@ -0,0 +1,836 @@
/* -------------------------------------------------------------------------- */
/* Twenty Twenty Editor Styles — Block Editor
/* -------------------------------------------------------------------------- */
.editor-styles-wrapper {
background: #f5efe0;
color: #1a1b1f;
-webkit-font-smoothing: antialiased;
}
.editor-styles-wrapper > * {
font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
font-size: 17px;
}
.block-editor-default-block-appender textarea.block-editor-default-block-appender__content {
font-family: inherit;
font-size: inherit;
}
/* Structure --------------------------------- */
.wp-block {
max-width: 610px;
}
.editor-block-list__block[data-align="wide"] .wp-block-group .wp-block {
max-width: calc(100% - 40px);
}
.editor-block-list__block[data-align="full"] .wp-block-group .wp-block {
max-width: 100%;
}
*[data-align="right"] .editor-block-list__block-edit,
*[data-align="left"] .editor-block-list__block-edit {
max-width: 50%;
}
.editor-block-list__block[data-align="wide"],
.editor-block-list__block[data-align="full"] {
margin-bottom: 30px;
margin-top: 30px;
}
.editor-block-list__block[data-align="wide"] {
max-width: 1120px;
}
.editor-block-list__block[data-align="full"] {
max-width: none;
}
.editor-styles-wrapper .editor-rich-text__tinymce,
.editor-styles-wrapper .editor-rich-text__tinymce.mce-content-body {
line-height: 1.5;
}
/* Colors ------------------------------------ */
/* CUSTOM COLORS */
.has-accent-color {
color: #cd2653;
}
.has-accent-background-color {
background-color: #cd2653;
}
/* GENERAL COLORS */
.has-black-background-color {
background-color: #000;
}
.has-white-background-color {
background-color: #fff;
}
.has-black-color {
color: #000;
}
.has-white-color {
color: #fff;
}
/* Typography -------------------------------- */
.editor-styles-wrapper a {
color: #cd2653;
text-decoration: underline;
}
.editor-styles-wrapper .wp-block h1,
.editor-styles-wrapper .wp-block h2,
.editor-styles-wrapper .wp-block h3,
.editor-styles-wrapper .wp-block h4,
.editor-styles-wrapper .wp-block h5,
.editor-styles-wrapper .wp-block h6,
.editor-post-title__block .editor-post-title__input {
font-family: inherit;
font-feature-settings: "lnum";
font-variant-numeric: lining-nums;
font-weight: 700;
letter-spacing: -0.005em;
line-height: 1.25;
margin: 40px 0 25px;
}
.editor-post-title__block .editor-post-title__input,
.editor-styles-wrapper .wp-block h1 {
font-size: 32px;
}
.editor-styles-wrapper .wp-block h2 {
font-size: 28px;
}
.editor-styles-wrapper .wp-block h3 {
font-size: 24px;
}
.editor-styles-wrapper .wp-block h4 {
font-size: 21px;
}
.editor-styles-wrapper .wp-block h5 {
font-size: 19px;
}
.editor-styles-wrapper .wp-block h6 {
font-size: 1em;
}
.editor-styles-wrapper p,
.editor-styles-wrapper p.wp-block-paragraph {
line-height: 1.5;
}
/* Monospace --------------------------------- */
.editor-styles-wrapper code,
.editor-styles-wrapper kbd,
.editor-styles-wrapper pre,
.editor-styles-wrapper samp {
font-family: monospace;
}
.editor-styles-wrapper kbd,
.editor-styles-wrapper pre,
.editor-styles-wrapper samp {
border-radius: 0;
font-size: 0.75em;
padding: 4px 6px;
}
.editor-styles-wrapper pre {
border-radius: 0;
line-height: 1.5;
padding: 1em;
}
/* Custom Text Sizes ------------------------- */
.editor-styles-wrapper p.has-large-font-size.editor-rich-text__tinymce,
.editor-styles-wrapper p.has-large-font-size.editor-rich-text__tinymce.mce-content-body,
.editor-styles-wrapper p.has-larger-font-size.editor-rich-text__tinymce,
.editor-styles-wrapper p.has-larger-font-size.editor-rich-text__tinymce.mce-content-body {
line-height: 1.4;
}
.editor-styles-wrapper p.has-small-font-size {
font-size: 0.842em;
}
.editor-styles-wrapper p.has-regular-font-size {
font-size: 1em;
}
.editor-styles-wrapper p.has-medium-font-size {
font-size: 1.1em;
}
.editor-styles-wrapper p.has-large-font-size {
font-size: 1.25em;
}
.editor-styles-wrapper p.has-larger-font-size {
font-size: 1.5em;
}
/* Post Media -------------------------------- */
.editor-styles-wrapper figure {
margin: 0;
}
.editor-styles-wrapper .alignleft,
.editor-styles-wrapper .alignright {
margin-bottom: 1.2em;
max-width: 50%;
}
.editor-styles-wrapper .wp-caption .alignleft,
.editor-styles-wrapper .wp-caption .alignright {
margin-bottom: 0;
}
.editor-styles-wrapper .alignleft {
margin-left: 1em;
}
.editor-styles-wrapper .alignright {
margin-right: 1em;
}
.editor-styles-wrapper figcaption {
color: inherit;
font-size: 14px;
font-weight: 500;
margin-top: 10px;
text-align: right;
}
.editor-styles-wrapper .editor-block-list__block[data-align="full"] figcaption {
padding: 0 15px;
}
/* Forms ------------------------------------- */
.editor-styles-wrapper fieldset {
border: 2px solid #e1e1e3;
padding: 20px;
}
.editor-styles-wrapper legend {
font-size: 0.85em;
font-weight: 700;
padding: 0 10px;
}
.editor-styles-wrapper label {
font-size: 15px;
font-weight: 600;
}
/* Block: _Shared Lists ---------------------- */
.editor-styles-wrapper ul.wp-block-archives,
.editor-styles-wrapper ul.wp-block-categories,
.editor-styles-wrapper ul.wp-block-latest-posts {
list-style: none;
margin: 40px 0;
padding-right: 0;
}
.editor-styles-wrapper ul.wp-block-categories__list {
list-style: none;
margin-right: 0;
padding-right: 0;
}
.editor-styles-wrapper ul.wp-block-archives li,
.editor-styles-wrapper ul.wp-block-categories li,
.editor-styles-wrapper ul.wp-block-latest-posts li {
line-height: 1.2;
margin: 20px 0 0 0;
}
.editor-styles-wrapper ul.wp-block-archives li li,
.editor-styles-wrapper ul.wp-block-categories li li,
.editor-styles-wrapper ul.wp-block-categories__list li li,
.editor-styles-wrapper ul.wp-block-latest-posts li li {
margin-right: 20px;
}
.editor-styles-wrapper .wp-block-archives li > a,
.editor-styles-wrapper .wp-block-categories li > a,
.editor-styles-wrapper .wp-block-latest-posts li > a {
font-size: 1.25em;
font-weight: 700;
text-decoration: none;
}
.editor-styles-wrapper .wp-block-archives.aligncenter,
.editor-styles-wrapper .wp-block-categories.aligncenter {
text-align: center;
}
/* Block: Table ------------------------------ */
.editor-styles-wrapper table.wp-block-table {
border-color: #e1e1e3;
border-collapse: collapse;
border-spacing: 0;
empty-cells: show;
font-size: 0.85em;
margin-bottom: 1.1em;
width: 100%;
}
.editor-styles-wrapper table.wp-block-table caption,
.editor-styles-wrapper table.wp-block-table th,
.editor-styles-wrapper table.wp-block-table td {
border-color: inherit;
color: inherit;
}
.editor-styles-wrapper .wp-block-table caption {
padding: 0;
text-align: center;
}
.editor-styles-wrapper .wp-block-table th,
.editor-styles-wrapper .wp-block-table td {
line-height: 1.4;
margin: 0;
overflow: visible;
padding: 0;
}
.editor-styles-wrapper .wp-block-table .wp-block-table__cell-content {
padding: 12px;
}
.editor-styles-wrapper .wp-block-table thead {
vertical-align: bottom;
white-space: nowrap;
}
.editor-styles-wrapper .wp-block-table th {
font-weight: 700;
}
.editor-styles-wrapper .wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
background: #f1f1f3;
}
/* Block: Separator -------------------------- */
.editor-styles-wrapper hr.wp-block-separator {
border: none;
border-top: 1px solid #e1e1e3;
margin: 2em auto;
width: 100%;
}
.editor-styles-wrapper .wp-block-separator.is-style-dots {
border: none;
}
.editor-styles-wrapper .wp-block-separator.is-style-dots::before {
color: inherit;
}
.editor-styles-wrapper .wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
margin-right: 0;
width: 100%;
}
.editor-styles-wrapper .wp-block-separator:not(.is-style-wide):not(.is-style-dots),
.editor-styles-wrapper .wp-block-separator.is-style-wide {
max-width: none;
}
/* Block: Quote ------------------------------ */
.editor-styles-wrapper blockquote {
margin: 0;
}
.editor-styles-wrapper .wp-block-quote {
border-color: #cd2653 !important;
border-style: solid;
border-width: 0 4px 0 0;
color: inherit;
margin: 20px 0;
padding: 5px 20px 5px 0;
}
.editor-styles-wrapper .wp-block-quote[style*="text-align:center"],
.editor-styles-wrapper .wp-block-quote[style*="text-align: center"] {
border-width: 0;
padding: 5px 0;
}
.editor-styles-wrapper .wp-block-quote[style*="text-align:right"],
.editor-styles-wrapper .wp-block-quote[style*="text-align: right"] {
border-width: 0 0 0 4px;
padding: 5px 0 5px 20px;
}
.editor-styles-wrapper cite,
.editor-styles-wrapper .wp-block-quote__citation,
.editor-styles-wrapper .wp-block-quote cite,
.editor-styles-wrapper .wp-block-quote footer {
color: inherit;
font-size: 14px;
font-weight: 600;
}
.editor-styles-wrapper .wp-block-quote p {
color: inherit;
font-weight: 400;
margin: 0 0 20px 0;
}
.editor-styles-wrapper .wp-block-quote.is-style-large {
border: none;
padding: 0;
}
.editor-styles-wrapper .wp-block-quote.is-style-large p {
font-size: 1.75em;
font-style: italic;
font-weight: 700;
line-height: 1.25;
}
/* Block: Cover ------------------------------ */
.editor-styles-wrapper .wp-block-cover-image .wp-block-cover__inner-container,
.editor-styles-wrapper .wp-block-cover .wp-block-cover__inner-container {
margin: 0 auto;
max-width: 1120px;
width: calc(100% - 50px);
}
.editor-styles-wrapper .wp-block-cover-image .wp-block,
.editor-styles-wrapper .wp-block-cover .wp-block,
.wp-block-cover-image .wp-block-cover-image-text,
.wp-block-cover-image .wp-block-cover-text,
.wp-block-cover-image h2,
.wp-block-cover .wp-block-cover-image-text,
.wp-block-cover .wp-block-cover-text,
.wp-block-cover h2 {
max-width: 100%;
padding: 0;
}
.editor-styles-wrapper .wp-block-cover {
min-height: 75vh;
}
.editor-styles-wrapper .wp-block-cover p {
font-weight: 500;
}
.editor-styles-wrapper .wp-block-cover a {
color: inherit;
}
/* Block: Paragraph -------------------------- */
/* Block: Pullquote -------------------------- */
.editor-styles-wrapper .wp-block-pullquote {
border: none;
color: inherit;
padding: 0;
}
.editor-styles-wrapper .wp-block-pullquote,
.editor-styles-wrapper .wp-block-pullquote.is-style-solid-color blockquote {
text-align: center;
}
.editor-styles-wrapper .wp-block-pullquote.alignleft,
.editor-styles-wrapper .wp-block-pullquote.alignright {
max-width: 50%;
}
.editor-styles-wrapper .editor-block-list__block .wp-block-pullquote p {
font-weight: 700;
line-height: 1.25;
margin-bottom: 20px;
}
.editor-styles-wrapper .editor-block-list__block .wp-block-pullquote p,
.editor-styles-wrapper .wp-block-pullquote.is-style-solid-color blockquote > .block-editor-rich-text p,
.editor-styles-wrapper .editor-block-list__block[data-type="core/pullquote"][data-align="right"] .editor-rich-text p,
.editor-styles-wrapper .editor-block-list__block[data-type="core/pullquote"][data-align="left"] .editor-rich-text p {
font-size: 1.75em;
}
.editor-styles-wrapper .wp-block-pullquote__citation,
.editor-styles-wrapper .wp-block-pullquote cite,
.editor-styles-wrapper .wp-block-pullquote footer {
font-size: 14px;
font-weight: 600;
text-transform: none;
}
/* STYLE: SOLID COLOR */
.editor-styles-wrapper .wp-block-pullquote.is-style-solid-color {
padding: 30px 20px;
}
.editor-styles-wrapper .wp-block-pullquote.is-style-solid-color blockquote {
max-width: 100%;
}
/* Block: Verse ------------------------------ */
.editor-styles-wrapper .wp-block-verse pre,
.editor-styles-wrapper pre.wp-block-verse {
font-size: 0.75em;
}
/* Block: Button ----------------------------- */
.editor-styles-wrapper .wp-block-button__link,
.editor-styles-wrapper .wp-block-file__button {
background: #cd2653;
border-radius: 3px;
color: #fff;
font-size: 16px;
font-weight: 600;
line-height: 1;
padding: 1.175em 1.75em;
}
.editor-styles-wrapper .wp-block-button .wp-block-button__link.mce-content-body {
line-height: 1.1;
}
/* BUTTON STYLE: OUTLINE */
.editor-styles-wrapper .is-style-outline .wp-block-button__link {
background: none;
border-color: currentColor;
color: #1a1b1f;
padding: calc(1.175em - 2px) calc(1.75em - 2px);
}
/* BUTTON STYLE: SQUARED */
.editor-styles-wrapper .is-style-squared .wp-block-button__link {
border-radius: 0;
}
/* Block: Latest Comments -------------------- */
.editor-styles-wrapper .wp-block-latest-comments li.wp-block-latest-comments__comment {
font-size: inherit;
margin-bottom: 20px;
}
.editor-styles-wrapper .wp-block-latest-comments li.wp-block-latest-comments__comment:last-child {
margin-bottom: 0;
}
.editor-styles-wrapper .wp-block-latest-comments__comment-meta,
.editor-styles-wrapper .wp-block-latest-comments__comment-excerpt {
margin-right: 0 !important;
}
.editor-styles-wrapper .wp-block-latest-comments__comment-meta {
font-weight: 700;
}
.editor-styles-wrapper .wp-block-latest-comments__comment-meta a {
text-decoration: none;
}
.editor-styles-wrapper .wp-block-latest-comments time {
display: block;
font-size: 1em;
font-weight: 400;
margin-top: 5px;
}
/* HAS AVATAR */
.editor-styles-wrapper .wp-block-latest-comments.has-avatars .wp-block-latest-comments__comment {
display: flex;
}
.editor-styles-wrapper .wp-block-latest-comments.has-avatars img.avatar {
border-radius: 0;
flex-shrink: 0;
height: 60px;
margin-left: 15px;
width: 60px;
}
/* HAS EXCERPT */
.editor-styles-wrapper .wp-block-latest-comments__comment-excerpt {
font-size: 0.9em;
margin-top: 10px;
}
.editor-styles-wrapper .wp-block-latest-comments__comment-excerpt p:last-child {
margin-bottom: 0;
}
/* Block: Latest Posts ----------------------- */
/* STYLE: GRID */
.editor-styles-wrapper .wp-block-latest-posts.is-grid li {
border-color: #e1e1e3;
}
.editor-styles-wrapper ul.wp-block-latest-posts.is-grid li {
border-style: solid;
border-width: 1px 0 0;
margin: 0 0 24px 16px;
padding-top: 12px;
}
.editor-styles-wrapper ul.wp-block-latest-posts .wp-block-latest-posts__post-date {
color: inherit;
display: block;
font-size: 1em;
margin: 8px 0 0;
}
.editor-styles-wrapper .wp-block-latest-posts__post-excerpt {
font-size: 0.95em;
line-height: 1.4;
margin-top: 15px;
}
/* Block: Embed ------------------------------ */
.editor-styles-wrapper .wp-block-embed {
margin-bottom: 3rem;
margin-top: 3rem;
}
.editor-styles-wrapper .editor-block-list__block[data-type*="core-embed"][data-align="center"] * {
margin-right: auto;
margin-left: auto;
}
/* Block: File ------------------------------- */
.editor-styles-wrapper .wp-block-file {
background: none;
padding: 0;
}
.editor-styles-wrapper .wp-block-file__content-wrapper {
align-items: center;
display: flex;
justify-content: space-between;
}
.editor-styles-wrapper .wp-block-file .wp-block-file__textlink {
color: #cd2653;
font-weight: 700;
text-decoration: none;
}
.editor-styles-wrapper .wp-block-file .wp-block-file__button {
font-size: 14px;
padding: 1em 1.25em;
}
/* Block: Image ------------------------------ */
.editor-styles-wrapper .wp-block-image {
margin-bottom: 3rem;
margin-top: 3rem;
}
/* Block: Group ------------------------------ */
.wp-block-group p[style*="text-align: center"],
.wp-block-group p[style*="text-align:center"] {
margin-right: auto;
margin-left: auto;
}
.wp-block-group p[style*="text-align: right"],
.wp-block-group p[style*="text-align:right"] {
margin-right: auto;
}
/* Block: Paragraph -------------------------- */
.wp-block[data-type="core/paragraph"] p {
max-width: 580px;
}
/* -------------------------------------------------------------------------- */
/* X. Media Queries
/* -------------------------------------------------------------------------- */
@media ( min-width: 700px ) {
/* STRUCTURE */
.editor-styles-wrapper > * {
font-size: 18px;
}
.editor-block-list__block[data-align="wide"],
.editor-block-list__block[data-align="full"] {
margin-bottom: 60px;
margin-top: 60px;
}
/* TYPOGRAPHY */
.editor-post-title__block .editor-post-title__input,
.editor-styles-wrapper .wp-block h1 {
font-size: 48px;
}
.editor-styles-wrapper .wp-block h2 {
font-size: 40px;
}
.editor-styles-wrapper .wp-block h3 {
font-size: 32px;
}
.editor-styles-wrapper .wp-block h4 {
font-size: 24px;
}
.editor-styles-wrapper .wp-block h5 {
font-size: 21px;
}
/* FORMS */
.editor-styles-wrapper fieldset {
padding: 30px;
}
.editor-styles-wrapper legend {
padding: 0 15px;
}
/* BLOCK: PULLQUOTE */
.editor-styles-wrapper .wp-block-pullquote.is-style-solid-color {
padding: 40px 30px;
}
.editor-styles-wrapper .editor-block-list__block[data-type="core/pullquote"][data-align="wide"] blockquote > .block-editor-rich-text p,
.editor-styles-wrapper .editor-block-list__block[data-type="core/pullquote"][data-align="full"] blockquote > .block-editor-rich-text p {
font-size: 2.5em;
}
/* BLOCK: COLUMNS */
.wp-block-column {
font-size: 16px;
}
/* BLOCK: COVER */
.editor-styles-wrapper .wp-block-cover-image .wp-block-cover__inner-container,
.editor-styles-wrapper .wp-block-cover .wp-block-cover__inner-container {
width: calc(100% - 80px);
}
/* BLOCK: LATEST POSTS */
.editor-styles-wrapper ul.wp-block-latest-posts.is-grid li {
margin: 0 0 40px 16px;
padding-top: 24px;
}
}
@media ( min-width: 1000px ) {
/* STRUCTURE */
.editor-block-list__block[data-align="wide"],
.editor-block-list__block[data-align="full"] {
margin-bottom: 80px;
margin-top: 80px;
}
/* BLOCK: COLUMNS */
.wp-block-column {
font-size: 18px;
}
/* BLOCK: COVER */
.editor-styles-wrapper .wp-block-cover-image .wp-block-cover__inner-container,
.editor-styles-wrapper .wp-block-cover .wp-block-cover__inner-container {
width: calc(100% - 100px);
}
}
@media ( min-width: 1220px ) {
/* STRUCTURE */
.editor-block-list__block[data-align="wide"],
.editor-block-list__block[data-align="full"] {
margin-bottom: 80px;
margin-top: 80px;
}
}

1402
wp-content/themes/twentytwenty/assets/css/editor-style-block.css Normal file
View File

File diff suppressed because it is too large Load Diff

695
wp-content/themes/twentytwenty/assets/css/editor-style-classic-rtl.css Normal file
View File

@ -0,0 +1,695 @@
/* -------------------------------------------------------------------------- */
/* Twenty Twenty Editor Styles — Classic Editor
/* -------------------------------------------------------------------------- */
/* Fonts ------------------------------------- */
/*
* Chrome renders extra-wide &nbsp; characters for the Hoefler Text font.
* This results in a jumping cursor when typing in both the Classic and block
* editors. The following font-face override fixes the issue by manually
* inserting a custom font that includes just a Hoefler Text space replacement
* for that character instead.
*/
@font-face {
font-family: NonBreakingSpaceOverride;
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:
html { font-family: Inter, sans-serif; }
@supports (font-variation-settings: normal) {
html { font-family: "Inter var", sans-serif; }
}
---------------------------------------------- */
@font-face {
font-family: "Inter var";
font-weight: 100 900; /* stylelint-disable-line font-weight-notation */
font-style: normal;
src: url(../fonts/inter/Inter-upright.var.woff2) format("woff2");
}
@font-face {
font-family: "Inter var";
font-weight: 100 900; /* stylelint-disable-line font-weight-notation */
font-style: italic;
src: url(../fonts/inter/Inter-italic.var.woff2) format("woff2");
}
/* Structure --------------------------------- */
body#tinymce.wp-editor { /* stylelint-disable-line no-duplicate-selectors */
font-family: Inter, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
}
@supports ( font-variation-settings: normal ) {
body#tinymce.wp-editor { /* stylelint-disable-line no-duplicate-selectors */
font-family: "Inter var", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
}
}
body#tinymce.wp-editor { /* stylelint-disable-line no-duplicate-selectors */
background: #f5efe0;
color: #000;
font-size: 21px;
letter-spacing: -0.015em;
margin: 0 auto;
max-width: calc(100% - 40px);
width: 580px;
}
body#tinymce.wp-editor * {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
}
body#tinymce.wp-editor p,
body#tinymce.wp-editor ol,
body#tinymce.wp-editor ul,
body#tinymce.wp-editor dl,
body#tinymce.wp-editor dt {
font-family: NonBreakingSpaceOverride, "Hoefler Text", Garamond, "Times New Roman", serif;
letter-spacing: normal;
}
body#tinymce.wp-editor p,
body#tinymce.wp-editor ul,
body#tinymce.wp-editor ol,
body#tinymce.wp-editor blockquote {
line-height: 1.5;
margin-bottom: 1.5em;
}
body#tinymce.wp-editor code,
body#tinymce.wp-editor kbd,
body#tinymce.wp-editor samp {
background: rgba(0, 0, 0, 0.075);
}
body#tinymce.wp-editor code,
body#tinymce.wp-editor kbd,
body#tinymce.wp-editor pre,
body#tinymce.wp-editor samp {
font-family: monospace;
color: inherit;
font-size: 15px;
}
body#tinymce.wp-editor pre {
border: 1px solid #dcd7ca;
line-height: 1.5;
margin: 40px 0;
overflow: auto;
padding: 30px;
text-align: right;
}
body#tinymce.wp-editor a,
body#tinymce.wp-editor a:hover {
color: #cd2653;
text-decoration: underline;
}
body#tinymce.wp-editor img {
height: auto;
max-width: 100%;
}
body#tinymce.wp-editor img[data-wp-more] {
height: 16px;
}
body#tinymce.wp-editor hr {
border: none;
border-top: 1px solid #dcd7ca;
margin: 2em auto;
width: 100%;
}
body#tinymce.wp-editor hr:not(.is-style-dots) {
background: linear-gradient(to right, 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));
border: none;
color: rgba(0, 0, 0, 0.42);
height: 1px;
margin: 80px 0;
overflow: visible;
position: relative;
}
body#tinymce.wp-editor hr:not(.is-style-dots)::before,
body#tinymce.wp-editor hr:not(.is-style-dots)::after {
background: currentColor;
content: "";
display: block;
height: 16px;
position: absolute;
top: calc(50% - 8px);
transform: rotate(-22.5deg);
width: 1px;
}
body#tinymce.wp-editor hr::before {
right: calc(50% - 5px);
}
body#tinymce.wp-editor hr::after {
left: calc(50% - 5px);
}
body#tinymce.wp-editor dt {
font-weight: 600;
}
body#tinymce.wp-editor dd {
line-height: 1.5;
}
body#tinymce.wp-editor dd + dt {
margin-top: 1.5rem;
}
/* Font Families ----------------------------- */
body#tinymce.wp-editor figcaption,
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;
line-height: 1;
}
@supports ( font-variation-settings: normal ) {
body#tinymce.wp-editor figcaption,
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 var", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
}
}
/* Titles ------------------------------------ */
body#tinymce.wp-editor h1,
body#tinymce.wp-editor h2,
body#tinymce.wp-editor h3,
body#tinymce.wp-editor h4,
body#tinymce.wp-editor h5,
body#tinymce.wp-editor h6 {
font-feature-settings: "lnum";
font-variant-numeric: lining-nums;
font-weight: 700;
letter-spacing: -0.0415625em;
line-height: 1.25;
margin: 40px 0 25px;
}
body#tinymce.wp-editor h1 {
font-size: 84px;
font-weight: 800;
line-height: 1.138888889;
}
body#tinymce.wp-editor h2 {
font-size: 48px;
}
body#tinymce.wp-editor h3 {
font-size: 40px;
}
body#tinymce.wp-editor h4 {
font-size: 32px;
}
body#tinymce.wp-editor h5 {
font-size: 24px;
}
body#tinymce.wp-editor h6 {
font-size: 18px;
letter-spacing: 0.03125em;
text-transform: uppercase;
}
/* Blockquote -------------------------------- */
body#tinymce.wp-editor blockquote {
border-style: solid;
border: none;
border-right: 2px solid #cd2653;
margin: 0 0 1.6em 0;
padding: 0.25em 1em 0.25em 0;
}
body#tinymce.wp-editor blockquote p {
font-style: normal;
font-weight: 400;
margin: 0;
}
body#tinymce.wp-editor cite {
color: #6d6d6d;
font-size: 16px;
font-weight: 500;
font-style: normal;
}
body#tinymce.wp-editor blockquote cite {
display: block;
margin-top: 20px;
}
/* Lists ------------------------------------- */
body#tinymce.wp-editor ul {
margin-right: 1.5em;
padding-right: 0;
list-style: disc;
}
body#tinymce.wp-editor ol {
margin-right: 1.5em;
padding-right: 0;
list-style: square;
}
body#tinymce.wp-editor ul ul {
list-style: circle;
}
body#tinymce.wp-editor ul ul ul {
list-style: square;
}
body#tinymce.wp-editor ol ol {
list-style: lower-alpha;
}
body#tinymce.wp-editor ol ol ol {
list-style: lower-roman;
}
body#tinymce.wp-editor ul ul,
body#tinymce.wp-editor ul ol,
body#tinymce.wp-editor ol ul,
body#tinymce.wp-editor ol ol {
margin-bottom: 0;
}
body#tinymce.wp-editor li {
line-height: 1.5;
margin-bottom: 0.5em;
}
body#tinymce.wp-editor ol > li:last-child,
body#tinymce.wp-editor ul > li:last-child {
margin-bottom: 0;
}
body#tinymce.wp-editor ol > li:first-child,
body#tinymce.wp-editor ul > li:first-child {
margin-top: 0.5em;
}
/* Post Media -------------------------------- */
body#tinymce.wp-editor figure,
body#tinymce.wp-editor video {
display: block;
margin: 0;
}
body#tinymce.wp-editor .wp-caption {
margin-bottom: 1.5em;
}
body#tinymce.wp-editor img.alignleft,
body#tinymce.wp-editor .alignleft img,
body#tinymce.wp-editor img.aligncenter,
body#tinymce.wp-editor .aligncenter img,
body#tinymce.wp-editor img.alignright,
body#tinymce.wp-editor .alignright img,
body#tinymce.wp-editor img.alignnone,
body#tinymce.wp-editor .alignnone img {
display: block;
}
body#tinymce.wp-editor .aligncenter,
body#tinymce.wp-editor .alignnone,
body#tinymce.wp-editor .alignwide,
body#tinymce.wp-editor .alignfull {
margin: 50px auto;
}
body#tinymce.wp-editor .alignleft,
body#tinymce.wp-editor .alignright {
margin-bottom: 25px;
max-width: 50%;
}
body#tinymce.wp-editor .wp-caption img {
display: block;
}
body#tinymce.wp-editor .wp-caption .alignleft,
body#tinymce.wp-editor .wp-caption .alignright {
margin-bottom: 0;
}
body#tinymce.wp-editor .alignleft {
float: right;
margin-left: 25px;
max-width: 260px;
}
body#tinymce.wp-editor .alignright {
float: left;
margin-right: 25px;
max-width: 260px;
}
body#tinymce.wp-editor .wpview[data-wpview-type="gallery"] + .wpview[data-wpview-type="gallery"] {
margin-top: -34px;
}
body#tinymce.wp-editor figcaption,
body#tinymce.wp-editor .wp-caption-text,
body#tinymce.wp-editor .wp-caption-dd,
body#tinymce.wp-editor .gallery-caption {
color: #6d6d6d;
display: block;
font-size: 15px;
font-weight: 500;
line-height: 1.2;
margin: 18px 0 0;
}
body#tinymce.wp-editor figcaption a,
body#tinymce.wp-editor .wp-caption-text a,
body#tinymce.wp-editor .wp-caption-dd a,
body#tinymce.wp-editor .gallery-caption a {
color: inherit;
}
/* Tables ------------------------------------ */
body#tinymce.wp-editor table {
border-collapse: collapse;
border-spacing: 0;
empty-cells: show;
font-size: 18px;
width: 100%;
}
body#tinymce.wp-editor th,
body#tinymce.wp-editor td {
border-bottom: 1px solid #dcd7ca;
line-height: 1.2;
margin: 0;
overflow: visible;
padding: 2%;
}
body#tinymce.wp-editor caption {
text-align: center;
padding: 2%;
}
body#tinymce.wp-editor thead {
vertical-align: bottom;
white-space: nowrap;
}
body#tinymce.wp-editor th {
text-align: right;
}
/* Forms ------------------------------------- */
body#tinymce.wp-editor fieldset {
border: 2px solid #dcd7ca;
padding: 30px;
}
body#tinymce.wp-editor fieldset legend {
font-size: 0.85em;
font-weight: 700;
padding: 0 15px;
}
body#tinymce.wp-editor label {
display: block;
font-size: 15px;
font-weight: 600;
margin: 0 0 5px 0;
}
body#tinymce.wp-editor input,
body#tinymce.wp-editor textarea {
border-color: #dcd7ca;
color: inherit;
font-family: inherit;
font-size: inherit;
}
body#tinymce.wp-editor input[type="text"],
body#tinymce.wp-editor input[type="password"],
body#tinymce.wp-editor input[type="email"],
body#tinymce.wp-editor input[type="url"],
body#tinymce.wp-editor input[type="date"],
body#tinymce.wp-editor input[type="month"],
body#tinymce.wp-editor input[type="time"],
body#tinymce.wp-editor input[type="datetime"],
body#tinymce.wp-editor input[type="datetime-local"],
body#tinymce.wp-editor input[type="week"],
body#tinymce.wp-editor input[type="number"],
body#tinymce.wp-editor input[type="search"],
body#tinymce.wp-editor input[type="tel"],
body#tinymce.wp-editor input[type="color"],
body#tinymce.wp-editor textarea {
-webkit-appearance: none;
-moz-appearance: none;
background: transparent;
border-radius: 3px;
border-style: solid;
border-width: 0.1rem;
box-shadow: none;
display: block;
font-size: inherit;
font-weight: 400;
margin: 0;
max-width: 100%;
padding: 13.5px 18px;
width: 100%;
word-break: normal;
}
body#tinymce.wp-editor textarea {
height: 200px;
line-height: 1.5;
width: 100%;
}
body#tinymce.wp-editor button,
body#tinymce.wp-editor .faux-button,
body#tinymce.wp-editor .wp-block-button__link,
body#tinymce.wp-editor .wp-block-file__button,
body#tinymce.wp-editor input[type="button"],
body#tinymce.wp-editor input[type="reset"],
body#tinymce.wp-editor input[type="submit"] {
-webkit-appearance: none;
-moz-appearance: none;
background: #cd2653;
border: none;
border-radius: 0;
color: #fff;
cursor: pointer;
display: inline-block;
font-size: 17px;
font-weight: 600;
letter-spacing: 0.0333em;
line-height: 1.25;
margin: 0;
padding: 1.1em 1.44em;
text-align: center;
text-decoration: none;
text-transform: uppercase;
}
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-file__button:focus,
body#tinymce.wp-editor input[type="button"]:focus,
body#tinymce.wp-editor input[type="reset"]:focus,
body#tinymce.wp-editor input[type="submit"]:focus {
color: #fff;
text-decoration: underline;
}
.wp-block-button:not(.alignleft):not(.alignright) {
margin-bottom: 30px;
margin-top: 30px;
}
/* BUTTON ALIGN: CENTER */
.wp-block-button.aligncenter {
text-align: center;
}
/* 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:hover {
color: #cd2653;
}
body#tinymce.wp-editor .is-style-outline .wp-block-button__link {
background: none;
border: 2px solid currentColor;
padding: calc(1.1em - 2px) calc(1.44em - 2px);
}
/* BUTTON STYLE: SQUARED */
body#tinymce.wp-editor .is-style-squared .wp-block-button__link {
border-radius: 0;
}
/* Blocks ------------------------------------ */
/* BLOCK: HELPER CLASSES */
body#tinymce.wp-editor .has-background {
padding: 20px;
}
/* BLOCK: GALLERY */
body#tinymce.wp-editor ul.wp-block-gallery {
list-style: none;
margin-right: 0;
}
body#tinymce.wp-editor ul.wp-block-gallery li {
margin-right: 0;
}

695
wp-content/themes/twentytwenty/assets/css/editor-style-classic.css Normal file
View File

@ -0,0 +1,695 @@
/* -------------------------------------------------------------------------- */
/* Twenty Twenty Editor Styles — Classic Editor
/* -------------------------------------------------------------------------- */
/* Fonts ------------------------------------- */
/*
* Chrome renders extra-wide &nbsp; characters for the Hoefler Text font.
* This results in a jumping cursor when typing in both the Classic and block
* editors. The following font-face override fixes the issue by manually
* inserting a custom font that includes just a Hoefler Text space replacement
* for that character instead.
*/
@font-face {
font-family: NonBreakingSpaceOverride;
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:
html { font-family: Inter, sans-serif; }
@supports (font-variation-settings: normal) {
html { font-family: "Inter var", sans-serif; }
}
---------------------------------------------- */
@font-face {
font-family: "Inter var";
font-weight: 100 900; /* stylelint-disable-line font-weight-notation */
font-style: normal;
src: url(../fonts/inter/Inter-upright.var.woff2) format("woff2");
}
@font-face {
font-family: "Inter var";
font-weight: 100 900; /* stylelint-disable-line font-weight-notation */
font-style: italic;
src: url(../fonts/inter/Inter-italic.var.woff2) format("woff2");
}
/* Structure --------------------------------- */
body#tinymce.wp-editor { /* stylelint-disable-line no-duplicate-selectors */
font-family: Inter, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
}
@supports ( font-variation-settings: normal ) {
body#tinymce.wp-editor { /* stylelint-disable-line no-duplicate-selectors */
font-family: "Inter var", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
}
}
body#tinymce.wp-editor { /* stylelint-disable-line no-duplicate-selectors */
background: #f5efe0;
color: #000;
font-size: 21px;
letter-spacing: -0.015em;
margin: 0 auto;
max-width: calc(100% - 40px);
width: 580px;
}
body#tinymce.wp-editor * {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
}
body#tinymce.wp-editor p,
body#tinymce.wp-editor ol,
body#tinymce.wp-editor ul,
body#tinymce.wp-editor dl,
body#tinymce.wp-editor dt {
font-family: NonBreakingSpaceOverride, "Hoefler Text", Garamond, "Times New Roman", serif;
letter-spacing: normal;
}
body#tinymce.wp-editor p,
body#tinymce.wp-editor ul,
body#tinymce.wp-editor ol,
body#tinymce.wp-editor blockquote {
line-height: 1.5;
margin-bottom: 1.5em;
}
body#tinymce.wp-editor code,
body#tinymce.wp-editor kbd,
body#tinymce.wp-editor samp {
background: rgba(0, 0, 0, 0.075);
}
body#tinymce.wp-editor code,
body#tinymce.wp-editor kbd,
body#tinymce.wp-editor pre,
body#tinymce.wp-editor samp {
font-family: monospace;
color: inherit;
font-size: 15px;
}
body#tinymce.wp-editor pre {
border: 1px solid #dcd7ca;
line-height: 1.5;
margin: 40px 0;
overflow: auto;
padding: 30px;
text-align: left;
}
body#tinymce.wp-editor a,
body#tinymce.wp-editor a:hover {
color: #cd2653;
text-decoration: underline;
}
body#tinymce.wp-editor img {
height: auto;
max-width: 100%;
}
body#tinymce.wp-editor img[data-wp-more] {
height: 16px;
}
body#tinymce.wp-editor hr {
border: none;
border-top: 1px solid #dcd7ca;
margin: 2em auto;
width: 100%;
}
body#tinymce.wp-editor hr: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));
border: none;
color: rgba(0, 0, 0, 0.42);
height: 1px;
margin: 80px 0;
overflow: visible;
position: relative;
}
body#tinymce.wp-editor hr:not(.is-style-dots)::before,
body#tinymce.wp-editor hr:not(.is-style-dots)::after {
background: currentColor;
content: "";
display: block;
height: 16px;
position: absolute;
top: calc(50% - 8px);
transform: rotate(22.5deg);
width: 1px;
}
body#tinymce.wp-editor hr::before {
left: calc(50% - 5px);
}
body#tinymce.wp-editor hr::after {
right: calc(50% - 5px);
}
body#tinymce.wp-editor dt {
font-weight: 600;
}
body#tinymce.wp-editor dd {
line-height: 1.5;
}
body#tinymce.wp-editor dd + dt {
margin-top: 1.5rem;
}
/* Font Families ----------------------------- */
body#tinymce.wp-editor figcaption,
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;
line-height: 1;
}
@supports ( font-variation-settings: normal ) {
body#tinymce.wp-editor figcaption,
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 var", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
}
}
/* Titles ------------------------------------ */
body#tinymce.wp-editor h1,
body#tinymce.wp-editor h2,
body#tinymce.wp-editor h3,
body#tinymce.wp-editor h4,
body#tinymce.wp-editor h5,
body#tinymce.wp-editor h6 {
font-feature-settings: "lnum";
font-variant-numeric: lining-nums;
font-weight: 700;
letter-spacing: -0.0415625em;
line-height: 1.25;
margin: 40px 0 25px;
}
body#tinymce.wp-editor h1 {
font-size: 84px;
font-weight: 800;
line-height: 1.138888889;
}
body#tinymce.wp-editor h2 {
font-size: 48px;
}
body#tinymce.wp-editor h3 {
font-size: 40px;
}
body#tinymce.wp-editor h4 {
font-size: 32px;
}
body#tinymce.wp-editor h5 {
font-size: 24px;
}
body#tinymce.wp-editor h6 {
font-size: 18px;
letter-spacing: 0.03125em;
text-transform: uppercase;
}
/* Blockquote -------------------------------- */
body#tinymce.wp-editor blockquote {
border-style: solid;
border: none;
border-left: 2px solid #cd2653;
margin: 0 0 1.6em 0;
padding: 0.25em 0 0.25em 1em;
}
body#tinymce.wp-editor blockquote p {
font-style: normal;
font-weight: 400;
margin: 0;
}
body#tinymce.wp-editor cite {
color: #6d6d6d;
font-size: 16px;
font-weight: 500;
font-style: normal;
}
body#tinymce.wp-editor blockquote cite {
display: block;
margin-top: 20px;
}
/* Lists ------------------------------------- */
body#tinymce.wp-editor ul {
margin-left: 1.5em;
padding-left: 0;
list-style: disc;
}
body#tinymce.wp-editor ol {
margin-left: 1.5em;
padding-left: 0;
list-style: square;
}
body#tinymce.wp-editor ul ul {
list-style: circle;
}
body#tinymce.wp-editor ul ul ul {
list-style: square;
}
body#tinymce.wp-editor ol ol {
list-style: lower-alpha;
}
body#tinymce.wp-editor ol ol ol {
list-style: lower-roman;
}
body#tinymce.wp-editor ul ul,
body#tinymce.wp-editor ul ol,
body#tinymce.wp-editor ol ul,
body#tinymce.wp-editor ol ol {
margin-bottom: 0;
}
body#tinymce.wp-editor li {
line-height: 1.5;
margin-bottom: 0.5em;
}
body#tinymce.wp-editor ol > li:last-child,
body#tinymce.wp-editor ul > li:last-child {
margin-bottom: 0;
}
body#tinymce.wp-editor ol > li:first-child,
body#tinymce.wp-editor ul > li:first-child {
margin-top: 0.5em;
}
/* Post Media -------------------------------- */
body#tinymce.wp-editor figure,
body#tinymce.wp-editor video {
display: block;
margin: 0;
}
body#tinymce.wp-editor .wp-caption {
margin-bottom: 1.5em;
}
body#tinymce.wp-editor img.alignleft,
body#tinymce.wp-editor .alignleft img,
body#tinymce.wp-editor img.aligncenter,
body#tinymce.wp-editor .aligncenter img,
body#tinymce.wp-editor img.alignright,
body#tinymce.wp-editor .alignright img,
body#tinymce.wp-editor img.alignnone,
body#tinymce.wp-editor .alignnone img {
display: block;
}
body#tinymce.wp-editor .aligncenter,
body#tinymce.wp-editor .alignnone,
body#tinymce.wp-editor .alignwide,
body#tinymce.wp-editor .alignfull {
margin: 50px auto;
}
body#tinymce.wp-editor .alignleft,
body#tinymce.wp-editor .alignright {
margin-bottom: 25px;
max-width: 50%;
}
body#tinymce.wp-editor .wp-caption img {
display: block;
}
body#tinymce.wp-editor .wp-caption .alignleft,
body#tinymce.wp-editor .wp-caption .alignright {
margin-bottom: 0;
}
body#tinymce.wp-editor .alignleft {
float: left;
margin-right: 25px;
max-width: 260px;
}
body#tinymce.wp-editor .alignright {
float: right;
margin-left: 25px;
max-width: 260px;
}
body#tinymce.wp-editor .wpview[data-wpview-type="gallery"] + .wpview[data-wpview-type="gallery"] {
margin-top: -34px;
}
body#tinymce.wp-editor figcaption,
body#tinymce.wp-editor .wp-caption-text,
body#tinymce.wp-editor .wp-caption-dd,
body#tinymce.wp-editor .gallery-caption {
color: #6d6d6d;
display: block;
font-size: 15px;
font-weight: 500;
line-height: 1.2;
margin: 18px 0 0;
}
body#tinymce.wp-editor figcaption a,
body#tinymce.wp-editor .wp-caption-text a,
body#tinymce.wp-editor .wp-caption-dd a,
body#tinymce.wp-editor .gallery-caption a {
color: inherit;
}
/* Tables ------------------------------------ */
body#tinymce.wp-editor table {
border-collapse: collapse;
border-spacing: 0;
empty-cells: show;
font-size: 18px;
width: 100%;
}
body#tinymce.wp-editor th,
body#tinymce.wp-editor td {
border-bottom: 1px solid #dcd7ca;
line-height: 1.2;
margin: 0;
overflow: visible;
padding: 2%;
}
body#tinymce.wp-editor caption {
text-align: center;
padding: 2%;
}
body#tinymce.wp-editor thead {
vertical-align: bottom;
white-space: nowrap;
}
body#tinymce.wp-editor th {
text-align: left;
}
/* Forms ------------------------------------- */
body#tinymce.wp-editor fieldset {
border: 2px solid #dcd7ca;
padding: 30px;
}
body#tinymce.wp-editor fieldset legend {
font-size: 0.85em;
font-weight: 700;
padding: 0 15px;
}
body#tinymce.wp-editor label {
display: block;
font-size: 15px;
font-weight: 600;
margin: 0 0 5px 0;
}
body#tinymce.wp-editor input,
body#tinymce.wp-editor textarea {
border-color: #dcd7ca;
color: inherit;
font-family: inherit;
font-size: inherit;
}
body#tinymce.wp-editor input[type="text"],
body#tinymce.wp-editor input[type="password"],
body#tinymce.wp-editor input[type="email"],
body#tinymce.wp-editor input[type="url"],
body#tinymce.wp-editor input[type="date"],
body#tinymce.wp-editor input[type="month"],
body#tinymce.wp-editor input[type="time"],
body#tinymce.wp-editor input[type="datetime"],
body#tinymce.wp-editor input[type="datetime-local"],
body#tinymce.wp-editor input[type="week"],
body#tinymce.wp-editor input[type="number"],
body#tinymce.wp-editor input[type="search"],
body#tinymce.wp-editor input[type="tel"],
body#tinymce.wp-editor input[type="color"],
body#tinymce.wp-editor textarea {
-webkit-appearance: none;
-moz-appearance: none;
background: transparent;
border-radius: 3px;
border-style: solid;
border-width: 0.1rem;
box-shadow: none;
display: block;
font-size: inherit;
font-weight: 400;
margin: 0;
max-width: 100%;
padding: 13.5px 18px;
width: 100%;
word-break: normal;
}
body#tinymce.wp-editor textarea {
height: 200px;
line-height: 1.5;
width: 100%;
}
body#tinymce.wp-editor button,
body#tinymce.wp-editor .faux-button,
body#tinymce.wp-editor .wp-block-button__link,
body#tinymce.wp-editor .wp-block-file__button,
body#tinymce.wp-editor input[type="button"],
body#tinymce.wp-editor input[type="reset"],
body#tinymce.wp-editor input[type="submit"] {
-webkit-appearance: none;
-moz-appearance: none;
background: #cd2653;
border: none;
border-radius: 0;
color: #fff;
cursor: pointer;
display: inline-block;
font-size: 17px;
font-weight: 600;
letter-spacing: 0.0333em;
line-height: 1.25;
margin: 0;
padding: 1.1em 1.44em;
text-align: center;
text-decoration: none;
text-transform: uppercase;
}
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-file__button:focus,
body#tinymce.wp-editor input[type="button"]:focus,
body#tinymce.wp-editor input[type="reset"]:focus,
body#tinymce.wp-editor input[type="submit"]:focus {
color: #fff;
text-decoration: underline;
}
.wp-block-button:not(.alignleft):not(.alignright) {
margin-bottom: 30px;
margin-top: 30px;
}
/* BUTTON ALIGN: CENTER */
.wp-block-button.aligncenter {
text-align: center;
}
/* 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:hover {
color: #cd2653;
}
body#tinymce.wp-editor .is-style-outline .wp-block-button__link {
background: none;
border: 2px solid currentColor;
padding: calc(1.1em - 2px) calc(1.44em - 2px);
}
/* BUTTON STYLE: SQUARED */
body#tinymce.wp-editor .is-style-squared .wp-block-button__link {
border-radius: 0;
}
/* Blocks ------------------------------------ */
/* BLOCK: HELPER CLASSES */
body#tinymce.wp-editor .has-background {
padding: 20px;
}
/* BLOCK: GALLERY */
body#tinymce.wp-editor ul.wp-block-gallery {
list-style: none;
margin-left: 0;
}
body#tinymce.wp-editor ul.wp-block-gallery li {
margin-left: 0;
}

25
wp-content/themes/twentytwenty/assets/css/font-awesome.css vendored Normal file
View File

@ -0,0 +1,25 @@
@font-face {
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");
}
@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");
}

BIN
wp-content/themes/twentytwenty/assets/fonts/font-awesome/fa-brands-400.eot Normal file
View File

Binary file not shown.

1154
wp-content/themes/twentytwenty/assets/fonts/font-awesome/fa-brands-400.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 633 KiB

BIN
wp-content/themes/twentytwenty/assets/fonts/font-awesome/fa-brands-400.ttf Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/font-awesome/fa-brands-400.woff Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/font-awesome/fa-brands-400.woff2 Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/font-awesome/fa-fallback.eot Normal file
View File

Binary file not shown.

16
wp-content/themes/twentytwenty/assets/fonts/font-awesome/fa-fallback.svg Normal file
View File

@ -0,0 +1,16 @@
<?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>
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
wp-content/themes/twentytwenty/assets/fonts/font-awesome/fa-fallback.ttf Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/font-awesome/fa-fallback.woff Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/font-awesome/fa-fallback.woff2 Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-Bold.woff Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-Bold.woff2 Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-BoldItalic.woff Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-BoldItalic.woff2 Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-ExtraBold.woff Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-ExtraBold.woff2 Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-ExtraBoldItalic.woff Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-ExtraBoldItalic.woff2 Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-Italic.woff Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-Italic.woff2 Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-Medium.woff Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-Medium.woff2 Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-MediumItalic.woff Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-MediumItalic.woff2 Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-Regular.woff Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-Regular.woff2 Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-SemiBold.woff Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-SemiBold.woff2 Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-SemiBoldItalic.woff Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-SemiBoldItalic.woff2 Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-italic.var.woff2 Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter-upright.var.woff2 Normal file
View File

Binary file not shown.

BIN
wp-content/themes/twentytwenty/assets/fonts/inter/Inter.var.woff2 Normal file
View File

Binary file not shown.

140
wp-content/themes/twentytwenty/assets/js/color-calculations.js Normal file
View File

@ -0,0 +1,140 @@
/* global Color */
/* eslint no-unused-vars: off */
/**
* Color Calculations.
*
* @since 1.0.0
*
* @param {string} backgroundColor - The background color.
* @param {number} accentHue - The hue for our accent color.
*
* @return {Object} - this
*/
function _twentyTwentyColor( backgroundColor, accentHue ) {
// Set the object properties.
this.backgroundColor = backgroundColor;
this.accentHue = accentHue;
this.bgColorObj = new Color( backgroundColor );
this.textColorObj = this.bgColorObj.getMaxContrastColor();
this.textColor = this.textColorObj.toCSS();
this.isDark = 0.5 > this.bgColorObj.toLuminosity();
this.isLight = ! this.isDark;
// Return the object.
return this;
}
/**
* Builds an array of Color objects based on the accent hue.
* For improved performance we only build half the array
* depending on dark/light background-color.
*
* @since 1.0.0
*
* @return {Object} - this
*/
_twentyTwentyColor.prototype.setAccentColorsArray = function() {
var self = this,
minSaturation = 55,
maxSaturation = 90,
minLightness = 25,
maxLighness = 75,
stepSaturation = 2.5,
stepLightness = 2.5,
pushColor = function() {
var colorObj = new Color( {
h: self.accentHue,
s: s,
l: l,
} ),
item;
item = {
color: colorObj,
contrastBackground: colorObj.getDistanceLuminosityFrom( self.bgColorObj ),
contrastText: colorObj.getDistanceLuminosityFrom( self.textColorObj ),
};
// Check a minimum of 4.5:1 contrast with the background and 3:1 with surrounding text.
if ( 4.5 > item.contrastBackground || 3 > item.contrastText ) {
return;
}
// Get a score for this color by multiplying the 2 contrasts.
// We'll use that to sort the array.
item.score = item.contrastBackground * item.contrastText;
self.accentColorsArray.push( item );
},
s, l, aaa;
this.accentColorsArray = [];
// We're using `for` loops here because they perform marginally better than other loops.
for ( s = minSaturation; s <= maxSaturation; s += stepSaturation ) {
for ( l = minLightness; l <= maxLighness; l += stepLightness ) {
pushColor( s, l );
}
}
// Check if we have colors that are AAA compliant.
aaa = this.accentColorsArray.filter( function( color ) {
return 7 <= color.contrastBackground;
} );
// If we have AAA-compliant colors, alpways prefer them.
if ( aaa.length ) {
this.accentColorsArray = aaa;
}
// Sort colors by contrast.
this.accentColorsArray.sort( function( a, b ) {
return b.score - a.score;
} );
return this;
};
/**
* Get accessible text-color.
*
* @since 1.0.0
*
* @return {Color} - Returns a Color object.
*/
_twentyTwentyColor.prototype.getTextColor = function() {
return this.textColor;
};
/**
* Get accessible color for the defined accent-hue and background-color.
*
* @since 1.0.0
*
* @return {Color} - Returns a Color object.
*/
_twentyTwentyColor.prototype.getAccentColor = function() {
var fallback;
// If we have colors returns the 1st one - it has the highest score.
if ( this.accentColorsArray[0] ) {
return this.accentColorsArray[0].color;
}
// Fallback.
fallback = new Color( 'hsl(' + this.accentHue + ',75%,50%)' );
return fallback.getReadableContrastingColor( this.bgColorObj, 4.5 );
};
/**
* Return a new instance of the _twentyTwentyColor object.
*
* @since 1.0.0
* @param {string} backgroundColor - The background color.
* @param {number} accentHue - The hue for our accent color.
* @return {Object} - this
*/
function twentyTwentyColor( backgroundColor, accentHue ) {
var color = new _twentyTwentyColor( backgroundColor, accentHue );
color.setAccentColorsArray();
return color;
}

91
wp-content/themes/twentytwenty/assets/js/customize-controls.js Normal file
View File

@ -0,0 +1,91 @@
/* global backgroundColors, twentyTwentyColor, Color, jQuery, wp, _ */
/**
* Customizer enhancements for a better user experience.
*
* Contains extra logic for our Customizer controls & settings.
*
* @since 1.0.0
*/
( function() {
// Wait until the customizer has finished loading.
wp.customize.bind( 'ready', function() {
// Add a listener for accent-color changes.
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 ) {
var backgroundColorValue;
if ( backgroundColors[ context ].color ) {
backgroundColorValue = backgroundColors[ context ].color;
} else {
backgroundColorValue = wp.customize( backgroundColors[ context ].setting ).get();
}
twentyTwentySetAccessibleColorsValue( context, backgroundColorValue, to );
} );
} );
} );
// Add a listener for background-color changes.
Object.keys( backgroundColors ).forEach( function( context ) {
wp.customize( backgroundColors[ 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 );
} );
} );
} );
} );
/**
* Updates the value of the "accent_accessible_colors" setting.
*
* @since 1.0.0
*
* @param {string} context The area for which we want to get colors. Can be for example "content", "header" etc.
* @param {string} backgroundColor The background color (HEX value).
* @param {number} accentHue Numeric representation of the selected hue (0 - 359).
*
* @return {void}
*/
function twentyTwentySetAccessibleColorsValue( context, backgroundColor, accentHue ) {
var value, colors;
// Get the current value for our accessible colors, and make sure it's an object.
value = wp.customize( 'accent_accessible_colors' ).get();
value = ( _.isObject( value ) && ! _.isArray( value ) ) ? value : {};
// Get accessible colors for the defined background-color and hue.
colors = twentyTwentyColor( backgroundColor, accentHue );
// Sanity check.
if ( colors.getAccentColor() && 'function' === typeof colors.getAccentColor().toCSS ) {
// Update the value for this context.
value[ context ] = {
text: colors.getTextColor(),
accent: colors.getAccentColor().toCSS(),
background: backgroundColor,
};
// 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();
// Get secondary color.
value[ context ].secondary = Color( {
h: colors.bgColorObj.h(),
s: colors.bgColorObj.s() / 2,
l: ( colors.textColorObj.l() * 0.57 ) + ( colors.bgColorObj.l() * 0.43 ),
} ).toCSS();
}
// Change the value.
wp.customize( 'accent_accessible_colors' ).set( value );
// Small hack to save the option.
wp.customize( 'accent_accessible_colors' )._dirty = true;
}
}( jQuery ) );

85
wp-content/themes/twentytwenty/assets/js/customize-preview.js Normal file
View File

@ -0,0 +1,85 @@
/* global backgroundColors, previewElements, jQuery, _, wp */
/**
* Customizer enhancements for a better user experience.
*
* Contains handlers to make Theme Customizer preview reload changes asynchronously.
*
* @since 1.0.0
*/
( function() {
// Add listener for the "header_footer_background_color" control.
wp.customize( '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 );
} );
} );
// Add listener for the accent color.
wp.customize( '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 ) {
twentyTwentyGenerateColorA11yPreviewStyles( context );
} );
}, 50 );
} );
} );
// Add listeners for background-color settings.
Object.keys( backgroundColors ).forEach( function( context ) {
wp.customize( backgroundColors[ context ].setting, function( value ) {
value.bind( function() {
// Generate the styles.
// Add a small delay to be sure the accessible colors were generated.
setTimeout( function() {
twentyTwentyGenerateColorA11yPreviewStyles( context );
}, 50 );
} );
} );
} );
/**
* Add styles to elements in the preview pane.
*
* @since 1.0.0
*
* @param {string} context The area for which we want to generate styles. Can be for example "content", "header" etc.
*
* @return {void}
*/
function twentyTwentyGenerateColorA11yPreviewStyles( context ) {
// Get the accessible colors option.
var a11yColors = window.parent.wp.customize( 'accent_accessible_colors' ).get(),
stylesheedID = 'twentytwenty-customizer-styles-' + context,
stylesheet = jQuery( '#' + 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 );
}
if ( ! _.isUndefined( a11yColors[ context ] ) ) {
// Check if we have elements defined.
if ( previewElements[ context ] ) {
_.each( previewElements[ context ], function( items, setting ) {
_.each( items, function( elements, property ) {
if ( ! _.isUndefined( a11yColors[ context ][ setting ] ) ) {
styles += elements.join( ',' ) + '{' + property + ':' + a11yColors[ context ][ setting ] + ';}';
}
} );
} );
}
}
// Add styles.
stylesheet.html( styles );
}
// Generate styles on load. Handles page-changes on the preview pane.
jQuery( document ).ready( function() {
twentyTwentyGenerateColorA11yPreviewStyles( 'content' );
twentyTwentyGenerateColorA11yPreviewStyles( 'header-footer' );
} );
}() );

783
wp-content/themes/twentytwenty/assets/js/index.js Normal file
View File

@ -0,0 +1,783 @@
/* -----------------------------------------------------------------------------------------------
Namespace
--------------------------------------------------------------------------------------------------- */
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;
do {
if ( el.matches( s ) ) {
return el;
}
el = el.parentElement || el.parentNode;
} while ( el !== null && el.nodeType === 1 );
return null;
};
}
// polyfill forEach
// https://developer.mozilla.org/en-US/docs/Web/API/NodeList/forEach#Polyfill
if ( window.NodeList && ! NodeList.prototype.forEach ) {
NodeList.prototype.forEach = function( callback, thisArg ) {
var i;
thisArg = thisArg || window;
for ( i = 0; i < this.length; i++ ) {
callback.call( thisArg, this[ i ], i, this );
}
};
}
// event "polyfill"
twentytwenty.createEvent = function( eventName ) {
var event;
if ( typeof window.Event === 'function' ) {
event = new Event( eventName );
} else {
event = document.createEvent( 'Event' );
event.initEvent( eventName, true, false );
}
return event;
};
/* -----------------------------------------------------------------------------------------------
Cover Modals
--------------------------------------------------------------------------------------------------- */
twentytwenty.coverModals = {
init: function() {
if ( document.querySelector( '.cover-modal' ) ) {
// Handle cover modals when they're toggled
this.onToggle();
// When toggled, untoggle if visitor clicks on the wrapping element of the modal
this.outsideUntoggle();
// Close on escape key press
this.closeOnEscape();
// Hide and show modals before and after their animations have played out
this.hideAndShowModals();
}
},
// Handle cover modals when they're toggled
onToggle: function() {
document.querySelector( '.cover-modal' ).addEventListener( 'toggled', function( event ) {
var modal, body;
modal = event.target;
body = document.body;
if ( modal.classList.contains( 'active' ) ) {
body.classList.add( 'showing-modal' );
} else {
body.classList.remove( 'showing-modal' );
body.classList.add( 'hiding-modal' );
// Remove the hiding class after a delay, when animations have been run
setTimeout( function() {
body.classList.remove( 'hiding-modal' );
}, 500 );
}
} );
},
// Close modal on outside click
outsideUntoggle: function() {
document.addEventListener( 'click', function( event ) {
var target = event.target;
var modal = document.querySelector( '.cover-modal.active' );
if ( target === modal ) {
this.untoggleModal( target );
}
}.bind( this ) );
},
// Close modal on escape key press
closeOnEscape: function() {
document.addEventListener( 'keydown', function( event ) {
if ( event.keyCode === 27 ) {
event.preventDefault();
document.querySelectorAll( '.cover-modal.active' ).forEach( function( element ) {
this.untoggleModal( element );
}.bind( this ) );
}
}.bind( this ) );
},
// Hide and show modals before and after their animations have played out
hideAndShowModals: function() {
var modals = document.querySelectorAll( '.cover-modal' ),
htmlStyle = document.documentElement.style;
var getAdminBarHeight = function( negativeValue ) {
var adminBar = document.querySelector( '#wpadminbar' );
if ( adminBar ) {
return ( negativeValue ? '-' : '' ) + adminBar.getBoundingClientRect().height + 'px';
}
return 0;
};
function htmlStyles() {
return {
'overflow-y': 'scroll',
position: 'fixed',
width: '100%',
top: getAdminBarHeight( true ),
left: 0,
};
}
// Show the modal
modals.forEach( function( modal ) {
modal.addEventListener( 'toggle-target-before-inactive', function( event ) {
if ( event.target !== modal ) {
return;
}
window.scrollTo( { top: 0 } );
Object.keys( htmlStyles() ).forEach( function( styleKey ) {
htmlStyle.setProperty( styleKey, htmlStyles()[ styleKey ] );
} );
document.body.style.setProperty( 'padding-top', getAdminBarHeight() );
modal.classList.add( 'show-modal' );
} );
// Hide the modal after a delay, so animations have time to play out
modal.addEventListener( 'toggle-target-after-inactive', function( event ) {
if ( event.target !== modal ) {
return;
}
setTimeout( function() {
modal.classList.remove( 'show-modal' );
Object.keys( htmlStyles() ).forEach( function( styleKey ) {
htmlStyle.removeProperty( styleKey );
} );
document.body.style.removeProperty( 'padding-top' );
}, 500 );
} );
} );
},
// Untoggle a modal
untoggleModal: function( modal ) {
var modalToggle, modalTargetClass;
modalToggle = false;
// If the modal has specified the string (ID or class) used by toggles to target it, untoggle the toggles with that target string
// The modal-target-string must match the string toggles use to target the modal
if ( modal.dataset.modalTargetString ) {
modalTargetClass = modal.dataset.modalTargetString;
modalToggle = document.querySelector( '*[data-toggle-target="' + modalTargetClass + '"]' );
}
// If a modal toggle exists, trigger it so all of the toggle options are included
if ( modalToggle ) {
modalToggle.click();
// If one doesn't exist, just hide the modal
} else {
modal.classList.remove( 'active' );
}
},
}; // 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
--------------------------------------------------------------------------------------------------- */
twentytwenty.intrinsicRatioVideos = {
init: function() {
this.makeFit();
window.addEventListener( 'fit-videos', function() {
this.makeFit();
}.bind( this ) );
window.addEventListener( 'resize', function() {
this.makeFit();
}.bind( this ) );
},
makeFit: function() {
document.querySelectorAll( 'iframe, object, video' ).forEach( function( video ) {
var container, ratio, iTargetWidth;
container = video.parentNode;
// Skip videos we want to ignore
if ( video.classList.contains( 'intrinsic-ignore' ) || video.parentNode.classList.contains( 'intrinsic-ignore' ) ) {
return true;
}
if ( ! video.dataset.origwidth ) {
// Get the video element proportions
video.setAttribute( 'data-origwidth', video.width );
video.setAttribute( 'data-origheight', video.height );
}
iTargetWidth = container.offsetWidth;
// Get ratio from proportions
ratio = iTargetWidth / video.dataset.origwidth;
// Scale based on ratio, thus retaining proportions
video.style.width = iTargetWidth + 'px';
video.style.height = ( video.dataset.origheight * ratio ) + 'px';
} );
},
}; // twentytwenty.instrinsicRatioVideos
/* -----------------------------------------------------------------------------------------------
Smooth Scroll
--------------------------------------------------------------------------------------------------- */
twentytwenty.smoothScroll = {
init: function() {
// Scroll to anchor
this.scrollToAnchor();
// Scroll to element
this.scrollToElement();
},
// Scroll to anchor
scrollToAnchor: function() {
var anchorElements = document.querySelectorAll( 'a[href*="#"]' );
var anchorElementsList = Array.prototype.slice.call( anchorElements );
anchorElementsList.filter( function( element ) {
if ( element.href === '#' || element.href === '#0' || element.classList.contains( '.do-not-scroll' ) || element.classList.contains( 'skip-link' ) ) {
return false;
}
return true;
} ).forEach( function( element ) {
element.addEventListener( 'click', function( event ) {
var target, scrollOffset, originalOffset, adminBar, scrollSpeed, additionalOffset;
// On-page links
if ( window.location.hostname === event.target.hostname ) {
// Figure out element to scroll to
target = window.location.hash !== '' && document.querySelector( window.location.hash );
target = target ? target : event.target.hash !== '' && document.querySelector( event.target.hash );
// Does a scroll target exist?
if ( target ) {
// Only prevent default if animation is actually gonna happen
event.preventDefault();
// Get options
additionalOffset = event.target.dataset.additionalOffset;
scrollSpeed = event.target.dataset.scrollSpeed ? event.target.dataset.scrollSpeed : 500;
// Determine offset
adminBar = document.querySelector( '#wpadminbar' );
originalOffset = target.getBoundingClientRect().top + window.pageYOffset;
scrollOffset = additionalOffset ? originalOffset + additionalOffset : originalOffset;
if ( adminBar && event.target.className === 'to-the-top' ) {
scrollOffset = scrollOffset - adminBar.getBoundingClientRect().height;
}
twentytwentyScrollTo( scrollOffset, null, scrollSpeed );
window.location.hash = event.target.hash.slice( 1 );
}
}
} );
} );
},
// Scroll to element
scrollToElement: function() {
var scrollToElement = document.querySelector( '*[data-scroll-to]' );
if ( scrollToElement ) {
scrollToElement.addEventListener( 'click', function( event ) {
var target, originalOffset, additionalOffset, scrollOffset, scrollSpeed;
// Figure out element to scroll to
target = event.target.dataset.twentytwentyScrollTo;
// Make sure said element exists
if ( target ) {
event.preventDefault();
// Get options
additionalOffset = event.target.dataset.additionalOffset;
scrollSpeed = event.target.dataset.scrollSpeed ? event.target.dataset.scrollSpeed : 500;
// Determine offset
originalOffset = target.getBoundingClientRect().top + window.pageYOffset;
scrollOffset = additionalOffset ? originalOffset + additionalOffset : originalOffset;
twentytwentyScrollTo( scrollOffset, null, scrollSpeed );
}
} );
}
},
}; // twentytwenty.smoothScroll
/* -----------------------------------------------------------------------------------------------
Main 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();
},
expandLevel: function() {
var modalMenu = document.querySelector( '.modal-menu' );
var activeMenuItem = modalMenu.querySelector( '.current-menu-item' );
if ( activeMenuItem ) {
twentytwentyFindParents( activeMenuItem, 'li' ).forEach( function( element ) {
var subMenuToggle = element.querySelector( '.sub-menu-toggle' );
if ( subMenuToggle ) {
subMenuToggle.click();
}
} );
}
},
}; // twentytwenty.modalMenu
/* -----------------------------------------------------------------------------------------------
Toggles
--------------------------------------------------------------------------------------------------- */
twentytwenty.toggles = {
init: function() {
// Do the toggle
this.toggle();
// Check for toggle/untoggle on resize
this.resizeCheck();
// Check for untoggle on escape key press
this.untoggleOnEscapeKeyPress();
},
// Do the toggle
toggle: function() {
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 );
} );
} );
},
// Check for toggle/untoggle on screen resize
resizeCheck: function() {
if ( document.querySelectorAll( '*[data-untoggle-above], *[data-untoggle-below], *[data-toggle-above], *[data-toggle-below]' ).length ) {
window.addEventListener( 'resize', function() {
var winWidth = window.innerWidth,
toggles = document.querySelectorAll( '.toggle' );
toggles.forEach( function( toggle ) {
var unToggleAbove = toggle.dataset.untoggleAbove,
unToggleBelow = toggle.dataset.untoggleBelow,
toggleAbove = toggle.dataset.toggleAbove,
toggleBelow = toggle.dataset.toggleBelow;
// If no width comparison is set, continue
if ( ! unToggleAbove && ! unToggleBelow && ! toggleAbove && ! toggleBelow ) {
return;
}
// If the toggle width comparison is true, toggle the toggle
if (
( ( ( unToggleAbove && winWidth > unToggleAbove ) ||
( unToggleBelow && winWidth < unToggleBelow ) ) &&
toggle.classList.contains( 'active' ) ) ||
( ( ( toggleAbove && winWidth > toggleAbove ) ||
( toggleBelow && winWidth < toggleBelow ) ) &&
! toggle.classList.contains( 'active' ) )
) {
toggle.click();
}
} );
} );
}
},
// Close toggle on escape key press
untoggleOnEscapeKeyPress: function() {
document.addEventListener( 'keyup', function( event ) {
if ( event.key === 'Escape' ) {
document.querySelectorAll( '*[data-untoggle-on-escape].active' ).forEach( function( element ) {
if ( element.classList.contains( 'active' ) ) {
element.click();
}
} );
}
} );
},
}; // twentytwenty.toggles
/**
* Is the DOM ready
*
* this implementation is coming from https://gomakethings.com/a-native-javascript-equivalent-of-jquerys-ready-method/
*
* @param {Function} fn Callback function to run.
*/
function twentytwentyDomReady( fn ) {
if ( typeof fn !== 'function' ) {
return;
}
if ( document.readyState === 'interactive' || document.readyState === 'complete' ) {
return fn();
}
document.addEventListener( 'DOMContentLoaded', fn, false );
}
twentytwentyDomReady( function() {
twentytwenty.toggles.init(); // Handle toggles
twentytwenty.coverModals.init(); // Handle cover modals
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
} );
/* -----------------------------------------------------------------------------------------------
Helper functions
--------------------------------------------------------------------------------------------------- */
/* Toggle an attribute ----------------------- */
function twentytwentyToggleAttribute( element, attribute, trueVal, falseVal ) {
if ( trueVal === undefined ) {
trueVal = true;
}
if ( falseVal === undefined ) {
falseVal = false;
}
if ( element[ attribute ] !== trueVal ) {
element.setAttribute( attribute, trueVal );
} else {
element.setAttribute( attribute, falseVal );
}
}
/**
* twentytwentySlideUp
*
* this implementation is coming from https://w3bits.com/javascript-slidetoggle/
*
* @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 );
}
/**
* 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 ( window.getComputedStyle( target ).display === 'none' ) {
return twentytwentySlideDown( target, duration );
}
return twentytwentySlideUp( target, duration );
}
/**
* traverses the DOM up to find elements matching the query
*
* @param {HTMLElement} target
* @param {string} query
* @return {NodeList} parents matching query
*/
function twentytwentyFindParents( target, query ) {
var parents = [];
// recursively go up the DOM adding matches to the parents array
function traverse( item ) {
var parent = item.parentNode;
if ( parent instanceof HTMLElement ) {
if ( parent.matches( query ) ) {
parents.push( parent );
}
traverse( parent );
}
}
traverse( target );
return parents;
}
// twentytwentyEaseInOutQuad functions http://goo.gl/5HLl8
function twentytwentyEaseInOutQuad( t, b, c, d ) {
t /= d / 2;
if ( t < 1 ) {
return ( ( ( c / 2 ) * t ) * t ) + b;
}
t--;
return ( ( -c / 2 ) * ( ( t * ( t - 2 ) ) - 1 ) ) + b;
}
function twentytwentyScrollTo( to, callback, duration ) {
var start, change, increment, currentTime;
function move( amount ) {
document.documentElement.scrollTop = amount;
document.body.parentNode.scrollTop = amount;
document.body.scrollTop = amount;
}
start = document.documentElement.scrollTop || document.body.parentNode.scrollTop || document.body.scrollTop;
change = to - start;
increment = 20;
currentTime = 0;
duration = ( typeof ( duration ) === 'undefined' ) ? 500 : duration;
function animateScroll() {
var val;
// increment the time
currentTime += increment;
// find the value with the quadratic in-out twentytwentyEaseInOutQuad function
val = twentytwentyEaseInOutQuad( currentTime, start, change, duration );
// move the document.body
move( val );
// do the animation unless its over
if ( currentTime < duration ) {
window.requestAnimationFrame( animateScroll );
} else if ( callback && typeof ( callback ) === 'function' ) {
// the animation is done so lets callback
callback();
}
}
animateScroll();
}

513
wp-content/themes/twentytwenty/classes/class-twentytwenty-customize.php Normal file
View File

@ -0,0 +1,513 @@
<?php
/**
* Customizer settings for this theme.
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
if ( ! class_exists( 'TwentyTwenty_Customize' ) ) {
/**
* CUSTOMIZER SETTINGS
*/
class TwentyTwenty_Customize {
/**
* Register customizer options.
*
* @param WP_Customize_Manager $wp_customize Theme Customizer object.
*/
public static function register( $wp_customize ) {
/**
* Site Title & Description.
* */
$wp_customize->get_setting( 'blogname' )->transport = 'postMessage';
$wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage';
$wp_customize->selective_refresh->add_partial(
'blogname',
array(
'selector' => '.site-title a',
'render_callback' => 'twentytwenty_customize_partial_blogname',
)
);
$wp_customize->selective_refresh->add_partial(
'blogdescription',
array(
'selector' => '.site-description',
'render_callback' => 'twentytwenty_customize_partial_blogdescription',
)
);
$wp_customize->selective_refresh->add_partial(
'custom_logo',
array(
'selector' => '.header-titles [class*=site-]:not(.site-description)',
'render_callback' => 'twentytwenty_customize_partial_site_logo',
)
);
/**
* Site Identity
*/
/* 2X Header Logo ---------------- */
$wp_customize->add_setting(
'retina_logo',
array(
'capability' => 'edit_theme_options',
'sanitize_callback' => array( __CLASS__, 'sanitize_checkbox' ),
'transport' => 'postMessage',
)
);
$wp_customize->add_control(
'retina_logo',
array(
'type' => 'checkbox',
'section' => 'title_tagline',
'priority' => 10,
'label' => __( 'Retina logo', 'twentytwenty' ),
'description' => __( 'Scales the logo to half its uploaded size, making it sharp on high-res screens.', 'twentytwenty' ),
)
);
// Header & Footer Background Color.
$wp_customize->add_setting(
'header_footer_background_color',
array(
'default' => '#ffffff',
'sanitize_callback' => 'sanitize_hex_color',
'transport' => 'postMessage',
)
);
$wp_customize->add_control(
new WP_Customize_Color_Control(
$wp_customize,
'header_footer_background_color',
array(
'label' => esc_html__( 'Header & Footer Background Color', 'twentytwenty' ),
'section' => 'colors',
)
)
);
/**
* Implementation for the accent color.
* This is different to all other color options because of the accessibility enhancements.
* The control is a hue-only colorpicker, and there is a separate setting that holds values
* for other colors calculated based on the selected hue and various background-colors on the page.
*
* @since 1.0.0
*/
// Add the setting for the hue colorpicker.
$wp_customize->add_setting(
'accent_hue',
array(
'default' => 344,
'type' => 'theme_mod',
'sanitize_callback' => 'absint',
'transport' => 'postMessage',
)
);
// Add setting to hold colors derived from the accent hue.
$wp_customize->add_setting(
'accent_accessible_colors',
array(
'default' => array(
'content' => array(
'text' => '#000000',
'accent' => '#cd2653',
'secondary' => '#6d6d6d',
'borders' => '#dcd7ca',
),
'header-footer' => array(
'text' => '#000000',
'accent' => '#cd2653',
'secondary' => '#6d6d6d',
'borders' => '#dcd7ca',
),
),
'type' => 'theme_mod',
'transport' => 'postMessage',
'sanitize_callback' => array( 'TwentyTwenty_Customize', 'sanitize_accent_accessible_colors' ),
)
);
// Add the hue-only colorpicker for the accent color.
$wp_customize->add_control(
new WP_Customize_Color_Control(
$wp_customize,
'accent_hue',
array(
'label' => esc_html__( 'Accent Color Hue', 'twentytwenty' ),
'section' => 'colors',
'settings' => 'accent_hue',
'mode' => 'hue',
)
)
);
/**
* 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';
/**
* Theme Options
*/
$wp_customize->add_section(
'options',
array(
'title' => __( 'Theme Options', 'twentytwenty' ),
'priority' => 40,
'capability' => 'edit_theme_options',
'description' => __( 'Settings for this theme.', 'twentytwenty' ),
)
);
/* Enable Header Search --------- */
$wp_customize->add_setting(
'enable_header_search',
array(
'capability' => 'edit_theme_options',
'default' => false,
'sanitize_callback' => array( __CLASS__, 'sanitize_checkbox' ),
)
);
$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' ),
)
);
/* Display full content or excerpts on the blog and archives --------- */
$wp_customize->add_setting(
'blog_content',
array(
'capability' => 'edit_theme_options',
'default' => 'full',
'sanitize_callback' => array( __CLASS__, 'sanitize_select' ),
)
);
$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(
'full' => __( 'Full text', 'twentytwenty' ),
'summary' => __( 'Summary', 'twentytwenty' ),
),
)
);
/**
* Template: Cover Template.
*/
$wp_customize->add_section(
'cover_template_options',
array(
'title' => __( 'Cover Template', 'twentytwenty' ),
'capability' => 'edit_theme_options',
'description' => __( 'Settings for the "Cover Template" page template.', 'twentytwenty' ),
'priority' => 42,
)
);
/* Overlay Fixed Background ------ */
$wp_customize->add_setting(
'cover_template_fixed_background',
array(
'capability' => 'edit_theme_options',
'default' => true,
'sanitize_callback' => array( __CLASS__, 'sanitize_checkbox' ),
)
);
$wp_customize->add_control(
'cover_template_fixed_background',
array(
'type' => 'checkbox',
'section' => 'cover_template_options',
'label' => __( 'Fixed Background Image', 'twentytwenty' ),
'description' => __( 'Creates a parallax effect when the visitor scrolls.', 'twentytwenty' ),
)
);
/* Separator --------------------- */
$wp_customize->add_setting(
'cover_template_separator_1',
array(
'sanitize_callback' => 'wp_filter_nohtml_kses',
)
);
$wp_customize->add_control(
new TwentyTwenty_Separator_Control(
$wp_customize,
'cover_template_separator_1',
array(
'section' => 'cover_template_options',
)
)
);
/* Overlay Background Color ------ */
$wp_customize->add_setting(
'cover_template_overlay_background_color',
array(
'default' => twentytwenty_get_color_for_area( 'content', 'accent' ),
'sanitize_callback' => 'sanitize_hex_color',
)
);
$wp_customize->add_control(
new WP_Customize_Color_Control(
$wp_customize,
'cover_template_overlay_background_color',
array(
'label' => __( 'Image Overlay Background Color', 'twentytwenty' ),
'description' => __( 'The color used for the featured image overlay. Defaults to the accent color.', 'twentytwenty' ),
'section' => 'cover_template_options',
)
)
);
/* Overlay Text Color ------------ */
$wp_customize->add_setting(
'cover_template_overlay_text_color',
array(
'default' => '#ffffff',
'sanitize_callback' => 'sanitize_hex_color',
)
);
$wp_customize->add_control(
new WP_Customize_Color_Control(
$wp_customize,
'cover_template_overlay_text_color',
array(
'label' => __( 'Image Overlay Text Color', 'twentytwenty' ),
'description' => __( 'The color used for the text in the featured image overlay.', 'twentytwenty' ),
'section' => 'cover_template_options',
)
)
);
/* 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' ),
)
);
$wp_customize->add_control(
'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' ),
'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' ),
),
)
);
}
/**
* Sanitization callback for the "accent_accessible_colors" setting.
*
* @static
* @access public
* @since 1.0.0
* @param array $value The value we want to sanitize.
* @return array Returns sanitized value. Each item in the array gets sanitized separately.
*/
public static function sanitize_accent_accessible_colors( $value ) {
// Make sure the value is an array. Do not typecast, use empty array as fallback.
$value = is_array( $value ) ? $value : array();
// Loop values.
foreach ( $value as $area => $values ) {
foreach ( $values as $context => $color_val ) {
$value[ $area ][ $context ] = sanitize_hex_color( $color_val );
}
}
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.
*
* @param string $input The input from the setting.
* @param object $setting The selected setting.
*/
public static function sanitize_select( $input, $setting ) {
$input = sanitize_key( $input );
$choices = $setting->manager->get_control( $setting->id )->choices;
return ( array_key_exists( $input, $choices ) ? $input : $setting->default );
}
/**
* Sanitize boolean for checkbox.
*
* @param bool $checked Wethere or not a blox is checked.
*/
public static function sanitize_checkbox( $checked ) {
return ( ( isset( $checked ) && true === $checked ) ? true : false );
}
}
// Setup the Theme Customizer settings and controls.
add_action( 'customize_register', array( 'TwentyTwenty_Customize', 'register' ) );
}
/**
* PARTIAL REFRESH FUNCTIONS
* */
if ( ! function_exists( 'twentytwenty_customize_partial_blogname' ) ) {
/**
* Render the site title for the selective refresh partial.
*/
function twentytwenty_customize_partial_blogname() {
bloginfo( 'name' );
}
}
if ( ! function_exists( 'twentytwenty_customize_partial_blogdescription' ) ) {
/**
* Render the site description for the selective refresh partial.
*/
function twentytwenty_customize_partial_blogdescription() {
bloginfo( 'description' );
}
}
if ( ! function_exists( 'twentytwenty_customize_partial_site_logo' ) ) {
/**
* Render the site logo for the selective refresh partial.
*
* Doing it this way so we don't have issues with `render_callback`'s arguments.
*/
function twentytwenty_customize_partial_site_logo() {
twentytwenty_site_logo();
}
}

45
wp-content/themes/twentytwenty/classes/class-twentytwenty-script-loader.php Normal file
View File

@ -0,0 +1,45 @@
<?php
/**
* Javsscript Loader Class
*
* Allow `async` and `defer` while enqueuing Javascript.
*
* Based on a soltion 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 {
/**
* 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 ( 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;
}
}

26
wp-content/themes/twentytwenty/classes/class-twentytwenty-separator-control.php Normal file
View File

@ -0,0 +1,26 @@
<?php
/**
* Customizer Separator Control settings for this theme.
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
if ( class_exists( 'WP_Customize_Control' ) ) {
if ( ! class_exists( 'TwentyTwenty_Separator_Control' ) ) {
/**
* Separator Control.
*/
class TwentyTwenty_Separator_Control extends WP_Customize_Control {
/**
* Render the hr.
*/
public function render_content() {
echo '<hr/>';
}
}
}
}

86
wp-content/themes/twentytwenty/classes/class-twentytwenty-svg-icons.php Normal file
View File

@ -0,0 +1,86 @@
<?php
/**
* Custom icons for this theme.
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
if ( ! class_exists( 'TwentyTwenty_SVG_Icons' ) ) {
/**
* SVG ICONS CLASS
* Retrieve the SVG code for the specified icon. Based on a solution in TwentyNineteen.
*/
class TwentyTwenty_SVG_Icons {
/**
* GET SVG CODE
* Get the SVG code for the specified icon
*
* @param string $icon Icon name.
* @param string $color Color.
*/
public static function get_svg( $icon, $color = '#1A1A1B' ) {
$arr = apply_filters( 'twentytwenty_svg_icons', self::$icons );
if ( array_key_exists( $icon, $arr ) ) {
$repl = '<svg class="svg-icon" aria-hidden="true" role="img" focusable="false" ';
$svg = preg_replace( '/^<svg /', $repl, trim( $arr[ $icon ] ) ); // Add extra attributes to SVG code.
$svg = str_replace( '#1A1A1B', $color, $svg ); // Replace the color.
$svg = str_replace( '#', '%23', $svg ); // Urlencode hashes.
$svg = preg_replace( "/([\n\t]+)/", ' ', $svg ); // Remove newlines & tabs.
$svg = preg_replace( '/>\s*</', '><', $svg ); // Remove white space between SVG tags.
return $svg;
}
return null;
}
/**
* ICON STORAGE
* Store the code for all SVGs in an array.
*
* @var array
*/
public static $icons = array(
'arrow-down' => '<svg xmlns="http://www.w3.org/2000/svg" width="22" height="24" viewBox="0 0 22 24">
<polygon fill="#FFF" points="721.105 856 721.105 874.315 728.083 867.313 730.204 869.41 719.59 880 709 869.41 711.074 867.313 718.076 874.315 718.076 856" transform="translate(-709 -856)"/>
</svg>',
'arrow-down-circled ' => '<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
<path fill="#FFF" fill-rule="evenodd" d="M16,32 C7.163444,32 0,24.836556 0,16 C0,7.163444 7.163444,0 16,0 C24.836556,0 32,7.163444 32,16 C32,24.836556 24.836556,32 16,32 Z M16.7934656,8 L15.4886113,8 L15.4886113,21.5300971 L10.082786,16.1242718 L9.18181515,17.0407767 L16.1410384,24 L23.1157957,17.0407767 L22.1915239,16.1242718 L16.7934656,21.5300971 L16.7934656,8 Z"/>
</svg>',
'bookmark' => '<svg xmlns="http://www.w3.org/2000/svg" width="15" height="18" viewBox="0 0 15 18">
<path d="M12.598889,2.699762 C12.598889,2.20275 12.195981,1.799841 11.698969,1.799841 L2.699762,1.799841 C2.20275,1.799841 1.799841,2.20275 1.799841,2.699762 L1.799841,15.349777 L6.676297,11.866594 C6.989197,11.643094 7.409533,11.643094 7.722434,11.866594 L12.598889,15.349777 L12.598889,2.699762 Z M1.422989,17.830788 C0.82736,18.256238 0,17.830464 0,17.098493 L0,2.699762 C0,1.208725 1.208725,0 2.699762,0 L11.698969,0 C13.190006,0 14.398731,1.208725 14.398731,2.699762 L14.398731,17.098493 C14.398731,17.830464 13.571371,18.256238 12.975742,17.830788 L7.199365,13.704805 L1.422989,17.830788 Z"/>
</svg>',
'calendar' => '<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19">
<path fill="#1A1A1B" d="M4.60069444,4.09375 L3.25,4.09375 C2.47334957,4.09375 1.84375,4.72334957 1.84375,5.5 L1.84375,7.26736111 L16.15625,7.26736111 L16.15625,5.5 C16.15625,4.72334957 15.5266504,4.09375 14.75,4.09375 L13.3993056,4.09375 L13.3993056,4.55555556 C13.3993056,5.02154581 13.0215458,5.39930556 12.5555556,5.39930556 C12.0895653,5.39930556 11.7118056,5.02154581 11.7118056,4.55555556 L11.7118056,4.09375 L6.28819444,4.09375 L6.28819444,4.55555556 C6.28819444,5.02154581 5.9104347,5.39930556 5.44444444,5.39930556 C4.97845419,5.39930556 4.60069444,5.02154581 4.60069444,4.55555556 L4.60069444,4.09375 Z M6.28819444,2.40625 L11.7118056,2.40625 L11.7118056,1 C11.7118056,0.534009742 12.0895653,0.15625 12.5555556,0.15625 C13.0215458,0.15625 13.3993056,0.534009742 13.3993056,1 L13.3993056,2.40625 L14.75,2.40625 C16.4586309,2.40625 17.84375,3.79136906 17.84375,5.5 L17.84375,15.875 C17.84375,17.5836309 16.4586309,18.96875 14.75,18.96875 L3.25,18.96875 C1.54136906,18.96875 0.15625,17.5836309 0.15625,15.875 L0.15625,5.5 C0.15625,3.79136906 1.54136906,2.40625 3.25,2.40625 L4.60069444,2.40625 L4.60069444,1 C4.60069444,0.534009742 4.97845419,0.15625 5.44444444,0.15625 C5.9104347,0.15625 6.28819444,0.534009742 6.28819444,1 L6.28819444,2.40625 Z M1.84375,8.95486111 L1.84375,15.875 C1.84375,16.6516504 2.47334957,17.28125 3.25,17.28125 L14.75,17.28125 C15.5266504,17.28125 16.15625,16.6516504 16.15625,15.875 L16.15625,8.95486111 L1.84375,8.95486111 Z"/>
</svg>',
'chevron-down' => '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="12" viewBox="0 0 20 12">
<polygon fill="#1A1A1B" fill-rule="evenodd" points="1319.899 365.778 1327.678 358 1329.799 360.121 1319.899 370.021 1310 360.121 1312.121 358" transform="translate(-1310 -358)"/>
</svg>',
'comment' => '<svg xmlns="http://www.w3.org/2000/svg" width="19" height="19" viewBox="0 0 19 19">
<path d="M9.43016863,13.2235931 C9.58624731,13.094699 9.7823475,13.0241935 9.98476849,13.0241935 L15.0564516,13.0241935 C15.8581553,13.0241935 16.5080645,12.3742843 16.5080645,11.5725806 L16.5080645,3.44354839 C16.5080645,2.64184472 15.8581553,1.99193548 15.0564516,1.99193548 L3.44354839,1.99193548 C2.64184472,1.99193548 1.99193548,2.64184472 1.99193548,3.44354839 L1.99193548,11.5725806 C1.99193548,12.3742843 2.64184472,13.0241935 3.44354839,13.0241935 L5.76612903,13.0241935 C6.24715123,13.0241935 6.63709677,13.4141391 6.63709677,13.8951613 L6.63709677,15.5301903 L9.43016863,13.2235931 Z M3.44354839,14.766129 C1.67980032,14.766129 0.25,13.3363287 0.25,11.5725806 L0.25,3.44354839 C0.25,1.67980032 1.67980032,0.25 3.44354839,0.25 L15.0564516,0.25 C16.8201997,0.25 18.25,1.67980032 18.25,3.44354839 L18.25,11.5725806 C18.25,13.3363287 16.8201997,14.766129 15.0564516,14.766129 L10.2979143,14.766129 L6.32072889,18.0506004 C5.75274472,18.5196577 4.89516129,18.1156602 4.89516129,17.3790323 L4.89516129,14.766129 L3.44354839,14.766129 Z"/>
</svg>',
'cross' => '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<polygon fill="#1A1A1B" fill-rule="evenodd" points="6.852 7.649 .399 1.195 1.445 .149 7.899 6.602 14.352 .149 15.399 1.195 8.945 7.649 15.399 14.102 14.352 15.149 7.899 8.695 1.445 15.149 .399 14.102"/>
</svg>',
'ellipsis' => '<svg xmlns="http://www.w3.org/2000/svg" width="26" height="7" viewBox="0 0 26 7">
<path fill-rule="evenodd" d="M332.5,45 C330.567003,45 329,43.4329966 329,41.5 C329,39.5670034 330.567003,38 332.5,38 C334.432997,38 336,39.5670034 336,41.5 C336,43.4329966 334.432997,45 332.5,45 Z M342,45 C340.067003,45 338.5,43.4329966 338.5,41.5 C338.5,39.5670034 340.067003,38 342,38 C343.932997,38 345.5,39.5670034 345.5,41.5 C345.5,43.4329966 343.932997,45 342,45 Z M351.5,45 C349.567003,45 348,43.4329966 348,41.5 C348,39.5670034 349.567003,38 351.5,38 C353.432997,38 355,39.5670034 355,41.5 C355,43.4329966 353.432997,45 351.5,45 Z" transform="translate(-329 -38)"/>
</svg>',
'edit' => '<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
<path fill="#1A1A1B" d="M14.7272727,11.1763636 C14.7272727,10.7244943 15.0935852,10.3581818 15.5454545,10.3581818 C15.9973239,10.3581818 16.3636364,10.7244943 16.3636364,11.1763636 L16.3636364,15.5454545 C16.3636364,16.9010626 15.2646989,18 13.9090909,18 L2.45454545,18 C1.09893743,18 0,16.9010626 0,15.5454545 L0,4.09090909 C0,2.73530107 1.09893743,1.63636364 2.45454545,1.63636364 L6.82363636,1.63636364 C7.2755057,1.63636364 7.64181818,2.00267611 7.64181818,2.45454545 C7.64181818,2.9064148 7.2755057,3.27272727 6.82363636,3.27272727 L2.45454545,3.27272727 C2.00267611,3.27272727 1.63636364,3.63903975 1.63636364,4.09090909 L1.63636364,15.5454545 C1.63636364,15.9973239 2.00267611,16.3636364 2.45454545,16.3636364 L13.9090909,16.3636364 C14.3609602,16.3636364 14.7272727,15.9973239 14.7272727,15.5454545 L14.7272727,11.1763636 Z M6.54545455,9.33890201 L6.54545455,11.4545455 L8.66109799,11.4545455 L16.0247344,4.09090909 L13.9090909,1.97526564 L6.54545455,9.33890201 Z M14.4876328,0.239639906 L17.7603601,3.51236718 C18.07988,3.83188705 18.07988,4.34993113 17.7603601,4.669451 L9.57854191,12.8512692 C9.42510306,13.004708 9.21699531,13.0909091 9,13.0909091 L5.72727273,13.0909091 C5.27540339,13.0909091 4.90909091,12.7245966 4.90909091,12.2727273 L4.90909091,9 C4.90909091,8.78300469 4.99529196,8.57489694 5.14873082,8.42145809 L13.330549,0.239639906 C13.6500689,-0.0798799688 14.1681129,-0.0798799688 14.4876328,0.239639906 Z"/>
</svg>',
'folder' => '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="19" viewBox="0 0 20 19">
<path fill="#1A1A1B" d="M2.8,1.85 C2.275329,1.85 1.85,2.27532949 1.85,2.8 L1.85,15.4 C1.85,15.9246705 2.275329,16.35 2.8,16.35 L17.2,16.35 C17.724671,16.35 18.15,15.9246705 18.15,15.4 L18.15,5.5 C18.15,4.97532949 17.724671,4.55 17.2,4.55 L9.1,4.55 C8.8158,4.55 8.550403,4.40796403 8.392757,4.17149517 L6.845094,1.85 L2.8,1.85 Z M17.2,2.85 C18.663555,2.85 19.85,4.03644541 19.85,5.5 L19.85,15.4 C19.85,16.8635546 18.663555,18.05 17.2,18.05 L2.8,18.05 C1.336445,18.05 0.15,16.8635546 0.15,15.4 L0.15,2.8 C0.15,1.33644541 1.336445,0.15 2.8,0.15 L7.3,0.15 C7.5842,0.15 7.849597,0.292035965 8.007243,0.528504833 L9.554906,2.85 L17.2,2.85 Z"/>
</svg>',
'search' => '<svg xmlns="http://www.w3.org/2000/svg" width="23" height="23" viewBox="0 0 23 23">
<path d="M38.710696,48.0601792 L43,52.3494831 L41.3494831,54 L37.0601792,49.710696 C35.2632422,51.1481185 32.9839107,52.0076499 30.5038249,52.0076499 C24.7027226,52.0076499 20,47.3049272 20,41.5038249 C20,35.7027226 24.7027226,31 30.5038249,31 C36.3049272,31 41.0076499,35.7027226 41.0076499,41.5038249 C41.0076499,43.9839107 40.1481185,46.2632422 38.710696,48.0601792 Z M36.3875844,47.1716785 C37.8030221,45.7026647 38.6734666,43.7048964 38.6734666,41.5038249 C38.6734666,36.9918565 35.0157934,33.3341833 30.5038249,33.3341833 C25.9918565,33.3341833 22.3341833,36.9918565 22.3341833,41.5038249 C22.3341833,46.0157934 25.9918565,49.6734666 30.5038249,49.6734666 C32.7048964,49.6734666 34.7026647,48.8030221 36.1716785,47.3875844 C36.2023931,47.347638 36.2360451,47.3092237 36.2726343,47.2726343 C36.3092237,47.2360451 36.347638,47.2023931 36.3875844,47.1716785 Z" transform="translate(-20 -31)"/>
</svg>',
'tag' => '<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
<path fill="#1A1A1B" d="M15.4496399,8.42490555 L8.66109799,1.63636364 L1.63636364,1.63636364 L1.63636364,8.66081885 L8.42522727,15.44178 C8.57869221,15.5954158 8.78693789,15.6817418 9.00409091,15.6817418 C9.22124393,15.6817418 9.42948961,15.5954158 9.58327627,15.4414581 L15.4486339,9.57610048 C15.7651495,9.25692435 15.7649133,8.74206554 15.4496399,8.42490555 Z M16.6084423,10.7304545 L10.7406818,16.59822 C10.280287,17.0591273 9.65554997,17.3181054 9.00409091,17.3181054 C8.35263185,17.3181054 7.72789481,17.0591273 7.26815877,16.5988788 L0.239976954,9.57887876 C0.0863319284,9.4254126 0,9.21716044 0,9 L0,0.818181818 C0,0.366312477 0.366312477,0 0.818181818,0 L9,0 C9.21699531,0 9.42510306,0.0862010512 9.57854191,0.239639906 L16.6084423,7.26954545 C17.5601275,8.22691012 17.5601275,9.77308988 16.6084423,10.7304545 Z M5,6 C4.44771525,6 4,5.55228475 4,5 C4,4.44771525 4.44771525,4 5,4 C5.55228475,4 6,4.44771525 6,5 C6,5.55228475 5.55228475,6 5,6 Z"/>
</svg>',
'user' => '<svg xmlns="http://www.w3.org/2000/svg" width="18" height="20" viewBox="0 0 18 20">
<path fill="#1A1A1B" d="M18,19 C18,19.5522847 17.5522847,20 17,20 C16.4477153,20 16,19.5522847 16,19 L16,17 C16,15.3431458 14.6568542,14 13,14 L5,14 C3.34314575,14 2,15.3431458 2,17 L2,19 C2,19.5522847 1.55228475,20 1,20 C0.44771525,20 0,19.5522847 0,19 L0,17 C0,14.2385763 2.23857625,12 5,12 L13,12 C15.7614237,12 18,14.2385763 18,17 L18,19 Z M9,10 C6.23857625,10 4,7.76142375 4,5 C4,2.23857625 6.23857625,0 9,0 C11.7614237,0 14,2.23857625 14,5 C14,7.76142375 11.7614237,10 9,10 Z M9,8 C10.6568542,8 12,6.65685425 12,5 C12,3.34314575 10.6568542,2 9,2 C7.34314575,2 6,3.34314575 6,5 C6,6.65685425 7.34314575,8 9,8 Z"/>
</svg>',
);
}
}

138
wp-content/themes/twentytwenty/classes/class-twentytwenty-walker-comment.php Normal file
View File

@ -0,0 +1,138 @@
<?php
/**
* Custom comment walker for this theme.
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
if ( ! class_exists( 'TwentyTwenty_Walker_Comment' ) ) {
/**
* CUSTOM COMMENT WALKER
* A custom walker for comments, based on the walker in Twenty Nineteen.
*/
class TwentyTwenty_Walker_Comment extends Walker_Comment {
/**
* Outputs a comment in the HTML5 format.
*
* @see wp_list_comments()
* @see https://developer.wordpress.org/reference/functions/get_comment_author_url/
* @see https://developer.wordpress.org/reference/functions/get_comment_author/
* @see https://developer.wordpress.org/reference/functions/get_avatar/
* @see https://developer.wordpress.org/reference/functions/get_comment_reply_link/
* @see https://developer.wordpress.org/reference/functions/get_edit_comment_link/
*
* @param WP_Comment $comment Comment to display.
* @param int $depth Depth of the current comment.
* @param array $args An array of arguments.
*/
protected function html5_comment( $comment, $depth, $args ) {
$tag = ( 'div' === $args['style'] ) ? 'div' : 'li';
?>
<<?php echo esc_html( $tag ); ?> id="comment-<?php comment_ID(); ?>" <?php comment_class( $this->has_children ? 'parent' : '', $comment ); ?>>
<article id="div-comment-<?php comment_ID(); ?>" class="comment-body">
<footer class="comment-meta">
<div class="comment-author vcard">
<?php
$comment_author_url = get_comment_author_url( $comment );
$comment_author = get_comment_author( $comment );
$avatar = get_avatar( $comment, $args['avatar_size'] );
if ( 0 !== $args['avatar_size'] ) {
if ( empty( $comment_author_url ) ) {
echo wp_kses_post( $avatar );
} else {
printf( '<a href="%s" rel="external nofollow" class="url">', $comment_author_url ); //phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped --Escaped in https://developer.wordpress.org/reference/functions/get_comment_author_url/
echo wp_kses_post( $avatar );
}
}
/* Translators: '%1$s = comment author name */
printf( '<span class="fn">%1$s</span><span class="screen-reader-text says">%2$s</span>', esc_html( $comment_author ), __( 'says:', 'twentytwenty' ) ); // phpcs:ignore
if ( ! empty( $comment_author_url ) ) {
echo '</a>';
}
?>
</div><!-- .comment-author -->
<div class="comment-metadata">
<a href="<?php echo esc_url( get_comment_link( $comment, $args ) ); ?>">
<?php
/* Translators: 1 = comment date, 2 = comment time */
$comment_timestamp = sprintf( __( '%1$s at %2$s', 'twentytwenty' ), get_comment_date( '', $comment ), get_comment_time() );
?>
<time datetime="<?php comment_time( 'c' ); ?>" title="<?php echo esc_attr( $comment_timestamp ); ?>">
<?php echo esc_html( $comment_timestamp ); ?>
</time>
</a>
</div><!-- .comment-metadata -->
</footer><!-- .comment-meta -->
<div class="comment-content">
<?php
comment_text();
if ( '0' === $comment->comment_approved ) {
?>
<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 -->
<?php
$comment_reply_link = get_comment_reply_link(
array_merge(
$args,
array(
'add_below' => 'div-comment',
'depth' => $depth,
'max_depth' => $args['max_depth'],
'before' => '<span class="comment-reply">',
'after' => '</span>',
)
)
);
$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 ) {
?>
<footer class="comment-footer-meta">
<?php
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
}
?>
</footer>
<?php
}
?>
</article><!-- .comment-body -->
<?php
}
}
}

172
wp-content/themes/twentytwenty/classes/class-twentytwenty-walker-page.php Normal file
View File

@ -0,0 +1,172 @@
<?php
/**
* Custom page walker for this theme.
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
if ( ! class_exists( 'TwentyTwenty_Walker_Page' ) ) {
/**
* CUSTOM PAGE WALKER
* A custom walker for pages.
*/
class TwentyTwenty_Walker_Page extends Walker_Page {
/**
* Outputs the beginning of the current element in the tree.
*
* @see Walker::start_el()
* @since 2.1.0
*
* @param string $output Used to append additional content. Passed by reference.
* @param WP_Post $page Page data object.
* @param int $depth Optional. Depth of page. Used for padding. Default 0.
* @param array $args Optional. Array of arguments. Default empty array.
* @param int $current_page Optional. Page ID. Default 0.
*/
public function start_el( &$output, $page, $depth = 0, $args = array(), $current_page = 0 ) {
if ( isset( $args['item_spacing'] ) && 'preserve' === $args['item_spacing'] ) {
$t = "\t";
$n = "\n";
} else {
$t = '';
$n = '';
}
if ( $depth ) {
$indent = str_repeat( $t, $depth );
} else {
$indent = '';
}
$css_class = array( 'page_item', 'page-item-' . $page->ID );
if ( isset( $args['pages_with_children'][ $page->ID ] ) ) {
$css_class[] = 'page_item_has_children';
}
if ( ! empty( $current_page ) ) {
$_current_page = get_post( $current_page );
if ( $_current_page && in_array( $page->ID, $_current_page->ancestors, true ) ) {
$css_class[] = 'current_page_ancestor';
}
if ( $page->ID === $current_page ) {
$css_class[] = 'current_page_item';
} elseif ( $_current_page && $page->ID === $_current_page->post_parent ) {
$css_class[] = 'current_page_parent';
}
} elseif ( get_option( 'page_for_posts' ) === $page->ID ) {
$css_class[] = 'current_page_parent';
}
/**
* Filters the list of CSS classes to include with each page item in the list.
*
* @since 2.8.0
*
* @see wp_list_pages()
*
* @param string[] $css_class An array of CSS classes to be applied to each list item.
* @param WP_Post $page Page data object.
* @param int $depth Depth of page, used for padding.
* @param array $args An array of arguments.
* @param int $current_page ID of the current page.
*/
$css_classes = implode( ' ', apply_filters( 'page_css_class', $css_class, $page, $depth, $args, $current_page ) );
$css_classes = $css_classes ? ' class="' . esc_attr( $css_classes ) . '"' : '';
if ( '' === $page->post_title ) {
/* translators: %d: ID of a post */
$page->post_title = sprintf( __( '#%d (no title)', 'twentytwenty' ), $page->ID );
}
$args['link_before'] = empty( $args['link_before'] ) ? '' : $args['link_before'];
$args['link_after'] = empty( $args['link_after'] ) ? '' : $args['link_after'];
$atts = array();
$atts['href'] = get_permalink( $page->ID );
$atts['aria-current'] = ( $page->ID === $current_page ) ? 'page' : '';
/**
* Filters the HTML attributes applied to a page menu item's anchor element.
*
* @since 4.8.0
*
* @param array $atts {
* The HTML attributes applied to the menu item's `<a>` element, empty strings are ignored.
*
* @type string $href The href attribute.
* @type string $aria_current The aria-current attribute.
* }
* @param WP_Post $page Page data object.
* @param int $depth Depth of page, used for padding.
* @param array $args An array of arguments.
* @param int $current_page ID of the current page.
*/
$atts = apply_filters( 'page_menu_link_attributes', $atts, $page, $depth, $args, $current_page );
$attributes = '';
foreach ( $atts as $attr => $value ) {
if ( ! empty( $value ) ) {
$value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value );
$attributes .= ' ' . $attr . '="' . $value . '"';
}
}
$args['list_item_before'] = '';
$args['list_item_after'] = '';
// Wrap the link in a div and append a sub menu toggle.
if ( isset( $args['show_toggles'] ) && true === $args['show_toggles'] ) {
// Wrap the menu item link contents in a div, used for positioning.
$args['list_item_before'] = '<div class="ancestor-wrapper">';
$args['list_item_after'] = '';
// Add a toggle to items with children.
if ( isset( $args['pages_with_children'][ $page->ID ] ) ) {
$toggle_target_string = '.menu-modal .page-item-' . $page->ID . ' > ul';
// 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>';
}
// Close the wrapper.
$args['list_item_after'] .= '</div><!-- .ancestor-wrapper -->';
}
// Add icons to menu items with children.
if ( isset( $args['show_sub_menu_icons'] ) && true === $args['show_sub_menu_icons'] ) {
if ( isset( $args['pages_with_children'][ $page->ID ] ) ) {
$args['list_item_after'] = '<span class="icon"></span>';
}
}
$output .= $indent . sprintf(
'<li%s>%s<a%s>%s%s%s</a>%s',
$css_classes,
$args['list_item_before'],
$attributes,
$args['link_before'],
/** This filter is documented in wp-includes/post-template.php */
apply_filters( 'the_title', $page->post_title, $page->ID ),
$args['link_after'],
$args['list_item_after']
);
if ( ! empty( $args['show_date'] ) ) {
if ( 'modified' === $args['show_date'] ) {
$time = $page->post_modified;
} else {
$time = $page->post_date;
}
$date_format = empty( $args['date_format'] ) ? '' : $args['date_format'];
$output .= ' ' . mysql2date( $date_format, $time );
}
}
}
}

136
wp-content/themes/twentytwenty/comments.php Normal file
View File

@ -0,0 +1,136 @@
<?php
/**
* The template file for displaying the comments and comment form for the
* Twenty Twenty theme.
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
/*
* If the current post is protected by a password and
* the visitor has not yet entered the password we will
* return early without loading the comments.
*/
if ( post_password_required() ) {
return;
}
if ( $comments ) {
?>
<div class="comments" id="comments">
<?php
$comments_number = absint( get_comments_number() );
?>
<div class="comments-header section-inner small max-percentage">
<h2 class="comment-reply-title">
<?php
if ( ! have_comments() ) {
esc_html_e( 'Leave a comment', 'twentytwenty' );
} elseif ( '1' === $comments_number ) {
/* translators: %s: post title */
printf( esc_html_x( 'One reply on &ldquo;%s&rdquo;', 'comments title', 'twentytwenty' ), esc_html( get_the_title() ) );
} else {
echo esc_html(
sprintf(
/* translators: 1: number of comments, 2: post title */
_nx(
'%1$s reply on &ldquo;%2$s&rdquo;',
'%1$s replies on &ldquo;%2$s&rdquo;',
$comments_number,
'comments title',
'twentytwenty'
),
number_format_i18n( $comments_number ),
get_the_title()
)
);
}
?>
</h2><!-- .comments-title -->
</div><!-- .comments-header -->
<div class="comments-inner section-inner thin max-percentage">
<?php
wp_list_comments(
array(
'walker' => new TwentyTwenty_Walker_Comment(),
'avatar_size' => 120,
'style' => 'div',
)
);
$comment_pagination = paginate_comments_links(
array(
'echo' => false,
'end_size' => 0,
'mid_size' => 0,
'next_text' => __( 'Newer Comments', 'twentytwenty' ) . ' &rarr;',
'prev_text' => '&larr; ' . __( 'Older Comments', 'twentytwenty' ),
)
);
if ( $comment_pagination ) {
// If we're only showing the "Next" link, add a class indicating so.
if ( strpos( $comment_pagination, 'prev page-numbers' ) === false ) {
$pagination_classes = ' only-next';
} else {
$pagination_classes = '';
}
?>
<nav class="comments-pagination pagination<?php echo esc_attr( $pagination_classes ); ?>" aria-label="<?php esc_attr_e( 'Comments', 'twentytwenty' ); ?>">
<?php echo wp_kses_post( $comment_pagination ); ?>
</nav>
<?php
}
?>
</div><!-- .comments-inner -->
</div><!-- comments -->
<?php
}
if ( comments_open() || pings_open() ) {
if ( $comments ) {
echo '<hr class="is-style-wide" aria-hidden="true" />';
}
comment_form(
array(
'class_form' => 'section-inner thin max-percentage',
'title_reply_before' => '<h2 id="reply-title" class="comment-reply-title">',
'title_reply_after' => '</h2>',
)
);
} elseif ( is_single() ) {
if ( $comments ) {
echo '<hr class="is-style-wide" aria-hidden="true" />';
}
?>
<div class="comment-respond" id="respond">
<p class="comments-closed"><?php _e( 'Comments are closed.', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></p>
</div><!-- #respond -->
<?php
}

169
wp-content/themes/twentytwenty/footer.php Normal file
View File

@ -0,0 +1,169 @@
<?php
/**
* The template for displaying the footer
*
* Contains the opening of the #site-footer div and all content after.
*
* @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
?>
<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( 'footer-one' ) || is_active_sidebar( 'footer-two' ) ) { ?>
<div class="footer-widgets-outer-wrapper">
<div class="footer-widgets-wrapper">
<?php if ( is_active_sidebar( 'footer-one' ) ) { ?>
<div class="footer-widgets column-one grid-item">
<?php dynamic_sidebar( 'footer-one' ); ?>
</div>
<?php } ?>
<?php if ( is_active_sidebar( 'footer-two' ) ) { ?>
<div class="footer-widgets column-two grid-item">
<?php dynamic_sidebar( 'footer-two' ); ?>
</div>
<?php } ?>
</div><!-- .footer-widgets-wrapper -->
</div><!-- .footer-widgets-outer-wrapper -->
<?php } ?>
<div class="footer-bottom">
<div class="footer-credits">
<p class="footer-copyright">&copy;
<?php
echo esc_html(
date_i18n(
/* Translators: Y = Format parameter for date() https://php.net/manual/en/function.date.php */
_x( 'Y', 'Translators: Y = Current year', 'twentytwenty' )
)
);
?>
<a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php echo bloginfo( 'name' ); ?></a></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
?>
</p><!-- .theme-credits -->
</div><!-- .footer-credits -->
<a class="to-the-top" href="#site-header">
<span class="to-the-top-long">
<?php
// Translators: %s = HTML character for an arrow.
printf( esc_html( _x( 'To the top %s', '%s = HTML character for an arrow', 'twentytwenty' ) ), '<span class="arrow">&uarr;</span>' );
?>
</span>
<span class="to-the-top-short">
<?php
// Translators: %s = HTML character for an arrow.
printf( esc_html( _x( 'Up %s', '%s = HTML character for an arrow', 'twentytwenty' ) ), '<span class="arrow">&uarr;</span>' );
?>
</span>
</a>
</div><!-- .footer-bottom -->
</div><!-- .footer-inner -->
</footer><!-- #site-footer -->
<?php wp_footer(); ?>
</body>
</html>

720
wp-content/themes/twentytwenty/functions.php Normal file
View File

@ -0,0 +1,720 @@
<?php
/**
* Twenty Twenty functions and definitions
*
* @link https://developer.wordpress.org/themes/basics/theme-functions/
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
/**
* Table of Contents:
* Theme Support
* Required Files
* Register Styles
* Register Scripts
* Register Menus
* Custom Logo
* WP Body Open
* Register Sidebars
* Enqueue Block editor assets
* Classic Editor Style
* Block editor settings
*/
if ( ! function_exists( 'twentytwenty_theme_support' ) ) {
/**
* Sets up theme defaults and registers support for various WordPress features.
*
* Note that this function is hooked into the after_setup_theme hook, which
* runs before the init hook. The init hook is too late for some features, such
* as indicating support for post thumbnails.
*/
function twentytwenty_theme_support() {
// Add default posts and comments RSS feed links to head.
add_theme_support( 'automatic-feed-links' );
// Custom background color.
add_theme_support(
'custom-background',
array(
'default-color' => 'f5efe0',
)
);
// Set content-width.
global $content_width;
if ( ! isset( $content_width ) ) {
$content_width = 580;
}
/*
* Enable support for Post Thumbnails on posts and pages.
*
* @link https://developer.wordpress.org/themes/functionality/featured-images-post-thumbnails/
*/
add_theme_support( 'post-thumbnails' );
// Set post thumbnail size.
set_post_thumbnail_size( 1200, 9999 );
// Add custom image sizes.
add_image_size( 'twentytwenty-fullscreen', 1980, 9999 );
// Custom logo.
$logo_id = get_theme_mod( 'custom_logo' );
$logo_width = 120;
$logo_height = 90;
// If the retina setting is active, double the recommended width and height.
if ( get_theme_mod( 'twentytwenty_retina_logo', false ) ) {
$logo_width = floor( $logo_width * 2 );
$logo_height = floor( $logo_height * 2 );
}
add_theme_support(
'custom-logo',
array(
'height' => $logo_height,
'width' => $logo_width,
'flex-height' => true,
'flex-width' => true,
'header-text' => array( 'site-title', 'site-description' ),
)
);
/*
* Let WordPress manage the document title.
* By adding theme support, we declare that this theme does not use a
* hard-coded <title> tag in the document head, and expect WordPress to
* provide it for us.
*/
add_theme_support( 'title-tag' );
/*
* Switch default core markup for search form, comment form, and comments
* to output valid HTML5.
*/
add_theme_support(
'html5',
array(
'search-form',
'comment-form',
'comment-list',
'gallery',
'caption',
'script',
'style',
)
);
/*
* Make theme available for translation.
* Translations can be filed in the /languages/ directory.
* If you're building a theme based on Twenty Nineteen, use a find and replace
* to change 'twentynineteen' to the name of your theme in all the template files.
*/
load_theme_textdomain( 'twentytwenty' );
// Add support for full and wide align images.
add_theme_support( 'align-wide' );
// Adds starter content to highlight the theme on fresh sites.
add_theme_support( 'starter-content', twentytwenty_get_starter_content() );
// Add theme support for selective refresh for widgets.
add_theme_support( 'customize-selective-refresh-widgets' );
/*
* Adds `async` and `defer` support for scripts registered or enqueued
* by the theme.
*/
$loader = new TwentyTwenty_Script_Loader();
add_filter( 'script_loader_tag', [ $loader, 'filter_script_loader_tag' ], 10, 2 );
}
add_action( 'after_setup_theme', 'twentytwenty_theme_support' );
}
/**
* REQUIRED FILES
* Include required files.
*/
require get_template_directory() . '/inc/template-tags.php';
// Handle SVG icons.
require get_template_directory() . '/classes/class-twentytwenty-svg-icons.php';
require get_template_directory() . '/inc/svg-icons.php';
// Handle Customizer settings.
require get_template_directory() . '/classes/class-twentytwenty-customize.php';
// Require Separator Control class.
require get_template_directory() . '/classes/class-twentytwenty-separator-control.php';
// Custom comment walker.
require get_template_directory() . '/classes/class-twentytwenty-walker-comment.php';
// Custom page walker.
require get_template_directory() . '/classes/class-twentytwenty-walker-page.php';
// Custom script loader class.
require get_template_directory() . '/classes/class-twentytwenty-script-loader.php';
// Custom CSS.
require get_template_directory() . '/inc/custom-css.php';
// Custom starter content to highlight the theme on fresh sites.
require get_template_directory() . '/inc/starter-content.php';
if ( ! function_exists( 'twentytwenty_register_styles' ) ) {
/**
* Register and Enqueue Styles.
*/
function twentytwenty_register_styles() {
$theme_version = wp_get_theme()->get( 'Version' );
$css_dependencies = array();
// By default, only load the Font Awesome fonts if the social menu is in use.
$load_font_awesome = apply_filters( 'twentytwenty_load_font_awesome', has_nav_menu( 'social' ) );
if ( $load_font_awesome ) {
wp_register_style( 'font-awesome', get_template_directory_uri() . '/assets/css/font-awesome.css', false, '5.10.2', 'all' );
$css_dependencies[] = 'font-awesome';
}
wp_enqueue_style( 'twentytwenty-style', get_template_directory_uri() . '/style.css', $css_dependencies, $theme_version );
wp_style_add_data( 'twentytwenty-style', 'rtl', 'replace' );
// Add output of Customizer settings as inline style.
wp_add_inline_style( 'twentytwenty-style', twentytwenty_get_customizer_css( 'front-end' ) );
}
add_action( 'wp_enqueue_scripts', 'twentytwenty_register_styles' );
}
if ( ! function_exists( 'twentytwenty_register_scripts' ) ) {
/**
* Register and Enqueue Scripts.
*/
function twentytwenty_register_scripts() {
$theme_version = wp_get_theme()->get( 'Version' );
if ( ( ! is_admin() ) && is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
wp_enqueue_script( 'comment-reply' );
}
wp_enqueue_script( 'twentytwenty-js', get_template_directory_uri() . '/assets/js/index.js', array(), $theme_version, false );
wp_script_add_data( 'twentytwenty-js', 'async', true );
}
add_action( 'wp_enqueue_scripts', 'twentytwenty_register_scripts' );
}
if ( ! function_exists( 'twentytwenty_menus' ) ) {
/**
* Register navigation menus uses wp_nav_menu in five places.
*/
function twentytwenty_menus() {
$locations = array(
'primary' => __( 'Desktop Horizontal Menu', 'twentytwenty' ),
'expanded' => __( 'Desktop Expanded Menu', 'twentytwenty' ),
'mobile' => __( 'Mobile Menu', 'twentytwenty' ),
'footer' => __( 'Footer Menu', 'twentytwenty' ),
'social' => __( 'Social Menu', 'twentytwenty' ),
);
register_nav_menus( $locations );
}
add_action( 'init', 'twentytwenty_menus' );
}
/**
* Get the information about the logo.
*
* @param string $html The HTML output from get_custom_logo (core function).
*/
function twentytwenty_get_custom_logo( $html ) {
$logo_id = get_theme_mod( 'custom_logo' );
if ( ! $logo_id ) {
return $html;
}
$logo = wp_get_attachment_image_src( $logo_id, 'full' );
if ( $logo ) {
// For clarity.
$logo_width = esc_attr( $logo[1] );
$logo_height = esc_attr( $logo[2] );
// If the retina logo setting is active, reduce the width/height by half.
if ( get_theme_mod( 'retina_logo', false ) ) {
$logo_width = floor( $logo_width / 2 );
$logo_height = floor( $logo_height / 2 );
$search = array(
'/width=\"\d+\"/iU',
'/height=\"\d+\"/iU',
);
$replace = array(
"width=\"{$logo_width}\"",
"height=\"{$logo_height}\"",
);
$html = preg_replace( $search, $replace, $html );
}
}
return $html;
}
add_filter( 'get_custom_logo', 'twentytwenty_get_custom_logo' );
if ( ! function_exists( 'wp_body_open' ) ) {
/**
* Shim for wp_body_open, ensuring backwards compatibility with versions of WordPress older than 5.2.
*/
function wp_body_open() {
do_action( 'wp_body_open' );
}
}
if ( ! function_exists( 'twentytwenty_skip_link' ) ) {
/**
* Include a skip to content link at the top of the page so that users can bypass the menu.
*/
function twentytwenty_skip_link() {
echo '<a class="skip-link faux-button screen-reader-text" href="#site-content">' . __( 'Skip to the content', 'twentytwenty' ) . '</a>'; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- core trusts translations
}
add_action( 'wp_body_open', 'twentytwenty_skip_link', 5 );
}
if ( ! function_exists( 'twentytwenty_sidebar_registration' ) ) {
/**
* Register widget areas.
*
* @link https://developer.wordpress.org/themes/functionality/sidebars/#registering-a-sidebar
*/
function twentytwenty_sidebar_registration() {
// Arguments used in all register_sidebar() calls.
$shared_args = array(
'before_title' => '<h2 class="widget-title subheading heading-size-3">',
'after_title' => '</h2>',
'before_widget' => '<div class="widget %2$s"><div class="widget-content">',
'after_widget' => '</div></div>',
);
// Footer #1.
register_sidebar(
array_merge(
$shared_args,
array(
'name' => __( 'Footer #1', 'twentytwenty' ),
'id' => 'footer-one',
'description' => __( 'Widgets in this area will be displayed in the first column in the footer.', 'twentytwenty' ),
)
)
);
// Footer #2.
register_sidebar(
array_merge(
$shared_args,
array(
'name' => __( 'Footer #2', 'twentytwenty' ),
'id' => 'footer-two',
'description' => __( 'Widgets in this area will be displayed in the second column in the footer.', 'twentytwenty' ),
)
)
);
}
add_action( 'widgets_init', 'twentytwenty_sidebar_registration' );
}
if ( ! function_exists( 'twentytwenty_block_editor_styles' ) ) {
/**
* Enqueue supplemental block editor styles.
*/
function twentytwenty_block_editor_styles() {
$css_dependencies = array();
// Enqueue the editor styles.
wp_enqueue_style( 'twentytwenty-block-editor-styles', get_theme_file_uri( '/assets/css/editor-style-block.css' ), $css_dependencies, wp_get_theme()->get( 'Version' ), 'all' );
wp_style_add_data( 'twentytwenty-block-editor-styles', 'rtl', 'replace' );
// Add inline style from the Customizer.
wp_add_inline_style( 'twentytwenty-block-editor-styles', twentytwenty_get_customizer_css( 'block-editor' ) );
}
add_action( 'enqueue_block_editor_assets', 'twentytwenty_block_editor_styles', 1, 1 );
}
if ( ! function_exists( 'twentytwenty_classic_editor_styles' ) ) {
/**
* Enqueue classic editor styles.
*/
function twentytwenty_classic_editor_styles() {
$classic_editor_styles = array(
'/assets/css/editor-style-classic.css',
);
add_editor_style( $classic_editor_styles );
}
add_action( 'init', 'twentytwenty_classic_editor_styles' );
}
if ( ! function_exists( 'twentytwenty_add_classic_editor_customizer_styles' ) ) {
/**
* Output Customizer Settings in the Classic Editor.
* Adds styles to the head of the TinyMCE iframe. Kudos to @Otto42 for the original solution.
*
* @param array $mce_init TinyMCE styles.
*/
function twentytwenty_add_classic_editor_customizer_styles( $mce_init ) {
$styles = twentytwenty_get_customizer_css( 'classic-editor' );
if ( ! isset( $mce_init['content_style'] ) ) {
$mce_init['content_style'] = $styles . ' ';
} else {
$mce_init['content_style'] .= ' ' . $styles . ' ';
}
return $mce_init;
}
add_filter( 'tiny_mce_before_init', 'twentytwenty_add_classic_editor_customizer_styles' );
}
if ( ! function_exists( 'twentytwenty_block_editor_settings' ) ) {
/**
* Block Editor Settings.
* Add custom colors and font sizes to the block editor.
*/
function twentytwenty_block_editor_settings() {
// Block Editor Palette.
$editor_color_palette = array(
array(
'name' => esc_html__( 'Accent Color', 'twentytwenty' ),
'slug' => 'accent',
'color' => twentytwenty_get_color_for_area( 'content', 'accent' ),
),
array(
'name' => esc_html__( 'Secondary', 'twentytwenty' ),
'slug' => 'secondary',
'color' => twentytwenty_get_color_for_area( 'content', 'secondary' ),
),
array(
'name' => esc_html__( 'Subtle Background', 'twentytwenty' ),
'slug' => 'subtle-background',
'color' => twentytwenty_get_color_for_area( 'content', 'borders' ),
),
);
// Get the color options.
$accent_color_options = TwentyTwenty_Customize::get_color_options();
// Loop over them and construct an array for the editor-color-palette.
if ( $accent_color_options ) {
foreach ( $accent_color_options as $color_option_name => $color_option ) {
$editor_color_palette[] = array(
'name' => $color_option['label'],
'slug' => $color_option['slug'],
'color' => get_theme_mod( $color_option_name, $color_option['default'] ),
);
}
}
// Add the background option.
$background_color = get_theme_mod( 'background_color' );
if ( ! $background_color ) {
$background_color_arr = get_theme_support( 'custom-background' );
$background_color = $background_color_arr[0]['default-color'];
}
$editor_color_palette[] = array(
'name' => __( 'Background Color', 'twentytwenty' ),
'slug' => 'background',
'color' => '#' . $background_color,
);
// If we have accent colors, add them to the block editor palette.
if ( $editor_color_palette ) {
add_theme_support( 'editor-color-palette', $editor_color_palette );
}
// the block editor Font Sizes.
add_theme_support(
'editor-font-sizes',
array(
array(
'name' => _x( 'Small', 'Name of the small font size in the block editor', 'twentytwenty' ),
'shortName' => _x( 'S', 'Short name of the small font size in the block editor.', 'twentytwenty' ),
'size' => 16,
'slug' => 'small',
),
array(
'name' => _x( 'Regular', 'Name of the regular font size in the block editor', 'twentytwenty' ),
'shortName' => _x( 'M', 'Short name of the regular font size in the block editor.', 'twentytwenty' ),
'size' => 18,
'slug' => 'regular',
),
array(
'name' => _x( 'Large', 'Name of the large font size in the block editor', 'twentytwenty' ),
'shortName' => _x( 'L', 'Short name of the large font size in the block editor.', 'twentytwenty' ),
'size' => 24,
'slug' => 'large',
),
array(
'name' => _x( 'Larger', 'Name of the larger font size in the block editor', 'twentytwenty' ),
'shortName' => _x( 'XL', 'Short name of the larger font size in the block editor.', 'twentytwenty' ),
'size' => 32,
'slug' => 'larger',
),
)
);
// If we have a dark background color then add support for dark editor style.
// We can determine if the background color is dark by checking if the text-color is white.
if ( '#ffffff' === strtolower( twentytwenty_get_color_for_area( 'content', 'text' ) ) ) {
add_theme_support( 'dark-editor-style' );
}
}
add_action( 'after_setup_theme', 'twentytwenty_block_editor_settings' );
}
if ( ! function_exists( 'twentytwenty_read_more_tag' ) ) {
/**
* Read More Link
* Overwrite default (more ...) tag
*/
function twentytwenty_read_more_tag() {
return sprintf(
'<a href="%1$s" class="more-link faux-button">%2$s <span class="screen-reader-text">"%3$s"</span></a>',
esc_url( get_permalink( get_the_ID() ) ),
esc_html__( 'Continue reading', 'twentytwenty' ),
get_the_title( get_the_ID() )
);
}
add_filter( 'the_content_more_link', 'twentytwenty_read_more_tag' );
}
if ( ! function_exists( 'twentytwenty_customize_controls_enqueue_scripts' ) ) {
/**
* Enqueues scripts for customizer controls & settings.
*
* @since 1.0.0
*
* @return void
*/
function twentytwenty_customize_controls_enqueue_scripts() {
$theme_version = wp_get_theme()->get( 'Version' );
// Add script for color calculations.
wp_enqueue_script( 'twentytwenty-color-calculations', get_template_directory_uri() . '/assets/js/color-calculations.js', array( 'wp-color-picker' ), $theme_version, false );
// Add script for controls.
wp_enqueue_script( 'twentytwenty-customize-controls', get_template_directory_uri() . '/assets/js/customize-controls.js', array( 'twentytwenty-color-calculations', 'customize-controls', 'underscore', 'jquery' ), $theme_version, false );
wp_localize_script( 'twentytwenty-customize-controls', 'backgroundColors', twentytwenty_get_customizer_color_vars() );
}
add_action( 'customize_controls_enqueue_scripts', 'twentytwenty_customize_controls_enqueue_scripts' );
}
if ( ! function_exists( 'twentytwenty_customize_preview_init' ) ) {
/**
* Enqueue scripts for the customizer preview.
*
* @since 1.0.0
*
* @return void
*/
function twentytwenty_customize_preview_init() {
$theme_version = wp_get_theme()->get( 'Version' );
wp_enqueue_script( 'twentytwenty-customize-preview', get_theme_file_uri( '/assets/js/customize-preview.js' ), array( 'customize-preview', 'jquery' ), $theme_version, true );
wp_localize_script( 'twentytwenty-customize-preview', 'backgroundColors', twentytwenty_get_customizer_color_vars() );
wp_localize_script( 'twentytwenty-customize-preview', 'previewElements', twentytwenty_get_elements_array() );
}
add_action( 'customize_preview_init', 'twentytwenty_customize_preview_init' );
}
if ( ! function_exists( 'twentytwenty_get_color_for_area' ) ) {
/**
* Get accessible color for an area.
*
* @since 1.0.0
*
* @param string $area The area we want to get the colors for.
* @param string $context Can be 'text' or 'accent'.
* @return string Returns a HEX color.
*/
function twentytwenty_get_color_for_area( $area = 'content', $context = 'text' ) {
// Get the value from the theme-mod.
$settings = get_theme_mod(
'accent_accessible_colors',
array(
'content' => array(
'text' => '#000000',
'accent' => '#cd2653',
'secondary' => '#6d6d6d',
'borders' => '#dcd7ca',
),
'header-footer' => array(
'text' => '#000000',
'accent' => '#cd2653',
'secondary' => '#6d6d6d',
'borders' => '#dcd7ca',
),
)
);
// If we have a value return it.
if ( isset( $settings[ $area ] ) && isset( $settings[ $area ][ $context ] ) ) {
return $settings[ $area ][ $context ];
}
// Return false if the option doesn't exist.
return false;
}
}
if ( ! function_exists( 'twentytwenty_get_customizer_color_vars' ) ) {
/**
* Returns an array of variables for the customizer preview.
*
* @since 1.0.0
*
* @return array
*/
function twentytwenty_get_customizer_color_vars() {
$colors = array(
'content' => array(
'setting' => 'background_color',
),
'header-footer' => array(
'setting' => 'header_footer_background_color',
),
);
return $colors;
}
}
if ( ! function_exists( 'twentytwenty_get_elements_array' ) ) {
/**
* Get an array of elements.
*
* @since 1.0
*
* @return array
*/
function twentytwenty_get_elements_array() {
// The array is formatted like this:
// [key-in-saved-setting][sub-key-in-setting][css-property] = [elements].
$elements = array(
'content' => array(
'accent' => array(
'color' => array( '.color-accent', '.color-accent-hover:hover', '.has-accent-color', '.has-drop-cap:not(:focus):first-letter', '.wp-block-button.is-style-outline', 'a' ),
'border-color' => array( 'blockquote', '.border-color-accent', '.border-color-accent-hover:hover' ),
'background' => array( 'button:not(.toggle)', '.button', '.faux-button', '.wp-block-button__link', '.wp-block-file__button', 'input[type="button"]', 'input[type="reset"]', 'input[type="submit"]' ),
'background-color' => array( '.bg-accent', '.bg-accent-hover:hover', '.has-accent-background-color', '.comment-reply-link', '.edit-comment-link' ),
'fill' => array( '.fill-children-accent', '.fill-children-accent *' ),
),
'background' => array(
'color' => array( 'button', '.button', '.faux-button', '.wp-block-button__link', '.wp-block-file__button', 'input[type="button"]', 'input[type="reset"]', 'input[type="submit"]', '.comment-reply-link', '.edit-comment-link' ),
'background' => array(),
),
'text' => array(
'color' => array( 'body', '.entry-title a' ),
),
'secondary' => array(
'color' => array( 'cite', 'figcaption', '.wp-caption-text', '.post-meta', '.entry-content .wp-block-archives li', '.entry-content .wp-block-categories li', '.entry-content .wp-block-latest-posts li', '.wp-block-latest-comments__comment-date', '.wp-block-latest-posts__post-date', '.wp-block-embed figcaption', '.wp-block-image figcaption', '.wp-block-pullquote cite', '.comment-metadata', '.comment-respond .comment-notes', '.comment-respond .logged-in-as', '.pagination .dots' ),
),
'borders' => array(
'border-color' => array( 'pre', 'fieldset', 'input', 'textarea', 'table', 'table *' ),
'background' => array( 'caption', 'code', 'code', 'kbd', 'samp' ),
'border-bottom-color' => array( '.wp-block-table.is-style-stripes' ),
'border-top-color' => array( '.wp-block-latest-posts.is-grid li' ),
'color' => array( 'hr:not(.is-style-dots):not(.reset-hr)' ),
),
),
'header-footer' => array(
'accent' => array(
'color' => array( 'body:not(.overlay-header) .primary-menu > li > a', 'body:not(.overlay-header) .primary-menu > li > .icon', '.modal-menu a', '.footer-menu a, .footer-widgets a', '#site-footer .wp-block-button.is-style-outline', '.wp-block-pullquote:before', '.singular .entry-header a', '.archive-header a', '.header-footer-group .color-accent', '.header-footer-group .color-accent-hover:hover' ),
'background' => array( '.social-icons a', '#site-footer button:not(.toggle)', '#site-footer .button', '#site-footer .faux-button', '#site-footer .wp-block-button__link', '#site-footer .wp-block-file__button', '#site-footer input[type="button"]', '#site-footer input[type="reset"]', '#site-footer input[type="submit"]' ),
),
'background' => array(
'color' => array( '.social-icons a', '.overlay-header:not(.showing-menu-modal) .header-inner', '.primary-menu ul', '.header-footer-group button', '.header-footer-group .button', '.header-footer-group .faux-button', '.header-footer-group .wp-block-button:not(.is-style-outline) .wp-block-button__link', '.header-footer-group .wp-block-file__button', '.header-footer-group input[type="button"]', '.header-footer-group input[type="reset"]', '.header-footer-group input[type="submit"]' ),
'background' => array( '#site-header', '#site-footer', '.menu-modal', '.menu-modal-inner', '.search-modal-inner', '.archive-header', '.singular .entry-header', '.singular .featured-media:before', '.wp-block-pullquote:before' ),
),
'text' => array(
'color' => array( '.header-footer-group', 'body:not(.overlay-header) #site-header .toggle', '.menu-modal .toggle' ),
'background' => array( 'body:not(.overlay-header) .primary-menu ul' ),
'border-bottom-color' => array( 'body:not(.overlay-header) .primary-menu > li > ul:after' ),
'border-left-color' => array( 'body:not(.overlay-header) .primary-menu ul ul:after' ),
),
'secondary' => array(
'color' => array( '.site-description', '.toggle-inner .toggle-text', '.widget .post-date', '.widget .rss-date', '.widget_archive li', '.widget_categories li', '.widget cite', '.widget_pages li', '.widget_meta li', '.widget_nav_menu li', '.powered-by-wordpress', '.to-the-top', '.singular .entry-header .post-meta', '.singular .entry-header .post-meta a' ),
),
'borders' => array(
'border-color' => array( '.header-footer-group pre', '.header-footer-group fieldset', '.header-footer-group input', '.header-footer-group textarea', '.header-footer-group table', '.header-footer-group table *', '.menu-modal nav *', '.footer-widgets-outer-wrapper', '.footer-top' ),
'background' => array( '.header-footer-group table caption', 'body:not(.overlay-header) .header-inner .toggle-wrapper::before' ),
'border-bottom-color' => array( '.wp-block-table.is-style-stripes' ),
'border-top-color' => array( '.wp-block-latest-posts.is-grid li' ),
),
),
);
return apply_filters( 'twentytwenty_get_elements_array', $elements );
}
}

190
wp-content/themes/twentytwenty/header.php Normal file
View File

@ -0,0 +1,190 @@
<?php
/**
* Header file for the Twenty Twenty WordPress default theme.
*
* @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
?>
<!DOCTYPE html>
<html class="no-js" <?php language_attributes(); ?>>
<head>
<meta http-equiv="content-type" content="<?php bloginfo( 'html_type' ); ?>" charset="<?php bloginfo( 'charset' ); ?>" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" >
<link rel="profile" href="https://gmpg.org/xfn/11">
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<?php
wp_body_open();
?>
<header id="site-header" class="header-footer-group">
<div class="header-inner section-inner">
<div class="header-titles-wrapper">
<?php
// Check whether the header search is activated in the customizer.
$enable_header_search = get_theme_mod( 'enable_header_search', true );
if ( true === $enable_header_search ) {
?>
<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' ); ?>
<span class="toggle-text"><?php _e( 'Search', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></span>
</div>
</button><!-- .search-toggle -->
<?php } ?>
<div class="header-titles">
<?php
// Site title or logo.
twentytwenty_site_logo();
// Site description.
twentytwenty_site_description();
?>
</div><!-- .header-titles -->
<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' ); ?>
<span class="toggle-text"><?php _e( 'Menu', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></span>
</div>
</button><!-- .nav-toggle -->
</div><!-- .header-titles-wrapper -->
<div class="header-navigation-wrapper">
<?php
if ( has_nav_menu( 'primary' ) || ! has_nav_menu( 'expanded' ) ) {
?>
<div class="primary-menu-wrapper">
<nav aria-label="<?php esc_attr_e( 'Primary', 'twentytwenty' ); ?>">
<ul class="primary-menu reset-list-style">
<?php
if ( has_nav_menu( 'primary' ) ) {
wp_nav_menu(
array(
'container' => '',
'items_wrap' => '%3$s',
'theme_location' => 'primary',
)
);
} elseif ( ! has_nav_menu( 'expanded' ) ) {
wp_list_pages(
array(
'match_menu_classes' => true,
'show_sub_menu_icons' => true,
'title_li' => false,
'walker' => new TwentyTwenty_Walker_Page(),
)
);
}
?>
</ul>
</nav><!-- .primary-menu -->
</div><!-- .primary-menu-wrapper -->
<?php
}
$header_toggles_classes = '';
if ( ! has_nav_menu( 'expanded' ) && false === $enable_header_search ) {
$header_toggles_classes .= ' hide-on-desktop';
}
?>
<div class="header-toggles hide-no-js<?php echo esc_attr( $header_toggles_classes ); ?>">
<?php
$nav_toggle_wrapper_classes = '';
// Add a class indicating whether the navigation toggle wrapper can be hidden on desktop.
if ( has_nav_menu( 'expanded' ) ) {
$nav_toggle_wrapper_classes .= ' has-expanded-menu';
}
?>
<div class="toggle-wrapper nav-toggle-wrapper<?php echo esc_attr( $nav_toggle_wrapper_classes ); ?>">
<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>
</button><!-- .nav-toggle -->
</div><!-- .nav-toggle-wrapper -->
<?php
if ( true === $enable_header_search ) {
?>
<div class="toggle-wrapper search-toggle-wrapper">
<button class="toggle 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' ); ?>
<span class="toggle-text"><?php _e( 'Search', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></span>
</div>
</button><!-- .search-toggle -->
</div>
<?php
}
?>
</div><!-- .header-toggles -->
</div><!-- .header-navigation-wrapper -->
</div><!-- .header-inner -->
<?php
// Output the search modal (if it is activated in the customizer).
if ( true === $enable_header_search ) {
get_template_part( 'template-parts/modal-search' );
}
?>
</header><!-- #site-header -->
<?php
// Output the menu modal.
get_template_part( 'template-parts/modal-menu' );

156
wp-content/themes/twentytwenty/inc/custom-css.php Normal file
View File

@ -0,0 +1,156 @@
<?php
/**
* Twenty Twenty Custom CSS
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
if ( ! function_exists( 'twentytwenty_generate_css' ) ) {
/**
* Generate CSS.
*
* @param string $selector The CSS selector.
* @param string $style The CSS style.
* @param string $value The CSS value.
* @param string $prefix The CSS prefix.
* @param string $suffix The CSS suffix.
* @param bool $echo Echo the styles.
*/
function twentytwenty_generate_css( $selector, $style, $value, $prefix = '', $suffix = '', $echo = true ) {
$return = '';
if ( ! $value ) {
return;
}
$return = sprintf( '%s { %s: %s; }', $selector, $style, $prefix . $value . $suffix );
if ( $echo ) {
echo $return; //phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- We need to double check this, but for now, we want to pass PHPCS ;)
}
return $return;
}
}
if ( ! function_exists( 'twentytwenty_get_customizer_css' ) ) {
/**
* Get CSS Built from Customizer Options.
* Build CSS reflecting colors, fonts and other options set in the Customizer, and return them for output.
*
* @param string $type Whether to return CSS for the "front-end", "block-editor" or "classic-editor".
*/
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';
$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.
$header_footer_text = sanitize_hex_color( twentytwenty_get_color_for_area( 'header-footer', 'text' ) );
$header_footer_accent = sanitize_hex_color( twentytwenty_get_color_for_area( 'header-footer', 'accent' ) );
// Cover.
$cover = sanitize_hex_color( get_theme_mod( 'cover_template_overlay_text_color' ) );
$cover_default = '#ffffff';
// Background.
$background = sanitize_hex_color_no_hash( get_theme_mod( 'background_color' ) );
$background_default = 'f5efe0';
ob_start();
/**
* Note – Styles are applied in this order:
* 1. Element specific
* 2. Helper classes
*
* This enables all helper classes to overwrite base element styles,
* meaning that any color classes applied in the block editor will
* have a higher priority than the base element styles.
*/
// Front-End Styles.
if ( 'front-end' === $type ) {
// Auto-calculated colors.
$elements_definitions = twentytwenty_get_elements_array();
foreach ( $elements_definitions as $context => $props ) {
foreach ( $props as $key => $definitions ) {
foreach ( $definitions as $property => $elements ) {
$val = twentytwenty_get_color_for_area( $context, $key );
if ( $val ) {
twentytwenty_generate_css( implode( ',', $elements ), $property, $val );
}
}
}
}
if ( $cover && $cover !== $cover_default ) {
twentytwenty_generate_css( '.cover-header .entry-header *', 'color', $cover );
}
// Helper Classes.
if ( $accent && $accent !== $accent_default ) {
twentytwenty_generate_css( '.color-accent, .color-accent-hover:hover, .has-accent-color', 'color', $accent );
twentytwenty_generate_css( '.bg-accent, .bg-accent-hover:hover, .has-accent-background-color', 'background-color', $accent );
twentytwenty_generate_css( '.border-color-accent, .border-color-accent-hover:hover', 'border-color', $accent );
twentytwenty_generate_css( '.fill-children-accent, .fill-children-accent *', 'fill', $accent );
}
// Block Editor Styles.
} elseif ( 'block-editor' === $type ) {
// Colors.
// Accent color.
if ( $accent && $accent !== $accent_default ) {
twentytwenty_generate_css( '.editor-styles-wrapper a, .editor-styles-wrapper .has-drop-cap:not(:focus):first-letter', 'color', $accent );
twentytwenty_generate_css( '.editor-styles-wrapper blockquote, .editor-styles-wrapper .wp-block-quote', 'border-color', $accent, '', ' !important' );
twentytwenty_generate_css( '.editor-styles-wrapper .wp-block-file .wp-block-file__textlink', 'color', $accent );
twentytwenty_generate_css( $buttons_targets, 'background', $accent );
twentytwenty_generate_css( '.editor-styles-wrapper .wp-block-button.is-style-outline .wp-block-button__link', 'border-color', $accent );
twentytwenty_generate_css( '.editor-styles-wrapper .wp-block-button.is-style-outline .wp-block-button__link', 'color', $accent );
}
// Background color.
if ( $background && $background !== $background_default ) {
twentytwenty_generate_css( '.editor-styles-wrapper', 'background', '#' . $background );
}
// Text color.
if ( $body && $body !== $body_default ) {
twentytwenty_generate_css( 'body .editor-styles-wrapper, body .editor-post-title__block, body .editor-post-title__input, body textarea, .editor-post-title__block .editor-post-title__input', 'color', $body );
}
} elseif ( 'classic-editor' === $type ) {
// Colors.
// Accent color.
if ( $accent && $accent !== $accent_default ) {
twentytwenty_generate_css( 'body#tinymce.wp-editor a', 'color', $accent );
twentytwenty_generate_css( 'body#tinymce.wp-editor blockquote, body#tinymce.wp-editor .wp-block-quote', 'border-color', $accent, '', ' !important' );
twentytwenty_generate_css( $buttons_targets, 'background-color', $accent );
}
// Background color.
if ( $background && $background !== $background_default ) {
twentytwenty_generate_css( 'body#tinymce.wp-editor', 'background', '#' . $background );
}
}
// Return the results.
return ob_get_clean();
}
}

91
wp-content/themes/twentytwenty/inc/starter-content.php Normal file
View File

@ -0,0 +1,91 @@
<?php
/**
* Twenty Twenty Starter Content
*
* @link https://make.wordpress.org/core/2016/11/30/starter-content-for-themes-in-4-7/
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
/**
* Function to return the array of starter content for the theme.
*
* Passes it through the `twentytwenty_starter_content` filter before returning.
*
* @since Twenty Twenty 1.0.0
* @return array a filtered array of args for the starter_content.
*/
function twentytwenty_get_starter_content() {
// Define and register starter content to showcase the theme on new sites.
$starter_content = array(
'widgets' => array(
// Place one core-defined widgets in the first tooter widget area.
'footer-one' => array(
'text_about',
),
// Place one core-defined widgets in the second tooter widget area.
'footer-two' => array(
'text_business_info',
),
),
// Specify the core-defined pages to create and add custom thumbnails to some of them.
'posts' => array(
'home',
'about',
'contact',
'blog',
),
// Default to a static front page and assign the front and posts pages.
'options' => array(
'show_on_front' => 'page',
'page_on_front' => '{{home}}',
'page_for_posts' => '{{blog}}',
),
// Set up nav menus for each of the two areas registered in the theme.
'nav_menus' => array(
// Assign a menu to the "primary" location.
'primary' => array(
'name' => __( 'Primary', 'twentytwenty' ),
'items' => array(
'page_contact',
),
),
// Assign a menu to the "expanded" (modal) menu location.
'expanded' => array(
'name' => __( 'Primary', 'twentytwenty' ),
'items' => array(
'link_home', // Note that the core "home" page is actually a link in case a static front page is not used.
'page_about',
'page_blog',
),
),
// Assign a menu to the "social" location.
'social' => array(
'name' => __( 'Social Links Menu', 'twentytwenty' ),
'items' => array(
'link_yelp',
'link_facebook',
'link_twitter',
'link_instagram',
'link_email',
),
),
),
);
/**
* Filters Twenty Twenty array of starter content.
*
* @since Twenty Twenty 1.0.0
*
* @param array $starter_content Array of starter content.
*/
return apply_filters( 'twentytwenty_starter_content', $starter_content );
}

68
wp-content/themes/twentytwenty/inc/svg-icons.php Normal file
View File

@ -0,0 +1,68 @@
<?php
/**
* Twenty Twenty SVG Icon helper functions
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
if ( ! function_exists( 'twentytwenty_the_theme_svg' ) ) {
/**
* Output and Get Theme SVG.
* Output and get the SVG markup for an icon in the TwentyTwenty_SVG_Icons class.
*
* @param string $svg_name The name of the icon.
* @param string $color Color code.
*/
function twentytwenty_the_theme_svg( $svg_name, $color = '' ) {
echo twentytwenty_get_theme_svg( $svg_name, $color ); //phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Escaped in twentytwenty_get_theme_svg();.
}
}
if ( ! function_exists( 'twentytwenty_get_theme_svg' ) ) {
/**
* Get information about the SVG icon.
*
* @param string $svg_name The name of the icon.
* @param string $color Color code.
*/
function twentytwenty_get_theme_svg( $svg_name, $color = '' ) {
// Make sure that only our allowed tags and attributes are included.
$svg = wp_kses(
TwentyTwenty_SVG_Icons::get_svg( $svg_name, $color ),
array(
'svg' => array(
'class' => true,
'xmlns' => true,
'width' => true,
'height' => true,
'viewbox' => true,
'aria-hidden' => true,
'role' => true,
'focusable' => true,
),
'path' => array(
'fill' => true,
'fill-rule' => true,
'd' => true,
'transform' => true,
),
'polygon' => array(
'fill' => true,
'fill-rule' => true,
'points' => true,
'transform' => true,
'focusable' => true,
),
)
);
if ( ! $svg ) {
return false;
}
return $svg;
}
}

608
wp-content/themes/twentytwenty/inc/template-tags.php Normal file
View File

@ -0,0 +1,608 @@
<?php
/**
* Custom template tags for this theme.
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
/**
* Table of Contents:
* Comments
* Post Meta
* Menus
* Classes
*/
if ( ! function_exists( 'twentytwenty_site_logo' ) ) {
/**
* Displays the site logo, either text or image.
*
* @param array $args Arguments for displaying the site logo either as an image or text.
* @param boolean $echo Echo or return the html.
*/
function twentytwenty_site_logo( $args = array(), $echo = true ) {
$logo = get_custom_logo();
$site_title = get_bloginfo( 'name' );
$contents = '';
$classname = '';
$defaults = array(
'logo' => '%1$s<span class="screen-reader-text">%2$s</span>',
'logo_class' => 'site-logo',
'title' => '<a href="%1$s">%2$s</a>',
'title_class' => 'site-title',
'home_wrap' => '<h1 class="%1$s">%2$s</h1>',
'single_wrap' => '<div class="%1$s faux-heading">%2$s</div>',
'condition' => is_front_page() || is_home(),
);
$args = wp_parse_args( $args, $defaults );
/**
* Filters the arguments for `twentytwenty_site_logo()`.
*
* @param array $args Parsed arguments.
* @param array $defaults Function's default arguments.
*/
$args = apply_filters( 'twentytwenty_site_logo_args', $args, $defaults );
if ( has_custom_logo() ) {
$contents = sprintf( $args['logo'], $logo, esc_html( $site_title ) );
$classname = $args['logo_class'];
} else {
$contents = sprintf( $args['title'], esc_url( get_home_url( null, '/' ) ), esc_html( $site_title ) );
$classname = $args['title_class'];
}
$wrap = $args['condition'] ? 'home_wrap' : 'single_wrap';
$html = sprintf( $args[ $wrap ], $classname, $contents );
/**
* Filters the arguments for `twentytwenty_site_logo()`.
*
* @param string $html Compiled html based on our arguments.
* @param array $args Parsed arguments.
* @param string $classname Class name based on current view, home or single.
* @param string $contents HTML for site title or logo.
*/
$html = apply_filters( 'twentytwenty_site_logo', $html, $args, $classname, $contents );
if ( ! $echo ) {
return $html;
}
echo $html; //phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
}
}
if ( ! function_exists( 'twentytwenty_site_description' ) ) {
/**
* Displays the site description.
*
* @param boolean $echo Echo or return the html.
*/
function twentytwenty_site_description( $echo = true ) {
$description = get_bloginfo( 'description' );
if ( ! $description ) {
return;
}
$wrapper = '<div class="site-description">%s</div><!-- .site-description -->';
$html = sprintf( $wrapper, esc_html( $description ) );
/**
* Filters the html for the site description.
*
* @param string $html The HTML to display.
* @param string $description Site description via `bloginfo()`.
* @param string $wrapper The format used in case you want to reuse it in a `sprintf()`.
*/
$html = apply_filters( 'twentytwenty_site_description', $html, $description, $wrapper );
if ( ! $echo ) {
return $html;
}
echo $html; //phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
}
}
/**
* Comments
*/
if ( ! function_exists( 'twentytwenty_is_comment_by_post_author' ) ) {
/**
* Check if the specified comment is written by the author of the post commented on.
*
* @param object $comment Comment data.
*/
function twentytwenty_is_comment_by_post_author( $comment = null ) {
if ( is_object( $comment ) && $comment->user_id > 0 ) {
$user = get_userdata( $comment->user_id );
$post = get_post( $comment->comment_post_ID );
if ( ! empty( $user ) && ! empty( $post ) ) {
return $comment->user_id === $post->post_author;
}
}
return false;
}
}
if ( ! function_exists( 'twentytwenty_filter_comment_reply_link' ) ) {
/**
* Filter comment reply link to not JS scroll.
* Filter the comment reply link to add a class indicating it should not use JS slow-scroll, as it
* makes it scroll to the wrong position on the page.
*
* @param string $link Link to the top of the page.
*/
function twentytwenty_filter_comment_reply_link( $link ) {
$link = str_replace( 'class=\'', 'class=\'do-not-scroll ', $link );
return $link;
}
add_filter( 'comment_reply_link', 'twentytwenty_filter_comment_reply_link' );
}
/**
* Post Meta
*/
if ( ! function_exists( 'twentytwenty_the_post_meta' ) ) {
/**
* Get and Output Post Meta.
* If it's a single post, output the post meta values specified in the Customizer settings.
*
* @param int $post_id The ID of the post for which the post meta should be output.
* @param string $location Which post meta location to output – single or preview.
*/
function twentytwenty_the_post_meta( $post_id = null, $location = 'single-top' ) {
echo twentytwenty_get_post_meta( $post_id, $location ); //phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Escaped in twentytwenty_get_post_meta().
}
}
if ( ! function_exists( 'twentytwenty_get_post_meta' ) ) {
/**
* Get the post meta.
*
* @param int $post_id The iD of the post.
* @param string $location The location where the meta is shown.
*/
function twentytwenty_get_post_meta( $post_id = null, $location = 'single-top' ) {
// Require post ID.
if ( ! $post_id ) {
return;
}
$page_template = get_page_template_slug( $post_id );
// Check whether the post type is allowed to output post meta.
$disallowed_post_types = apply_filters( 'twentytwenty_disallowed_post_types_for_meta_output', array( 'page' ) );
if ( in_array( get_post_type( $post_id ), $disallowed_post_types, true ) ) {
return;
}
$post_meta_wrapper_classes = '';
$post_meta_classes = '';
// Get the post meta settings for the location specified.
if ( 'single-top' === $location ) {
$post_meta = apply_filters(
'twentytwenty_post_meta_location_single_top',
array(
'author',
'post-date',
'comments',
'sticky',
)
);
$post_meta_wrapper_classes = ' post-meta-single post-meta-single-top';
} elseif ( 'single-bottom' === $location ) {
$post_meta = apply_filters(
'twentytwenty_post_meta_location_single_bottom',
array(
'tags',
)
);
$post_meta_wrapper_classes = ' post-meta-single post-meta-single-bottom';
}
// If the post meta setting has the value 'empty', it's explicitly empty and the default post meta shouldn't be output.
if ( $post_meta && ! in_array( 'empty', $post_meta, true ) ) {
// Make sure we don't output an empty container.
$has_meta = false;
global $post;
$the_post = get_post( $post_id );
setup_postdata( $the_post );
ob_start();
?>
<div class="post-meta-wrapper<?php echo esc_attr( $post_meta_wrapper_classes ); ?>">
<ul class="post-meta<?php echo esc_attr( $post_meta_classes ); ?>">
<?php
// Allow output of additional meta items to be added by child themes and plugins.
do_action( 'twentytwenty_start_of_post_meta_list', $post_meta, $post_id );
// Author.
if ( in_array( 'author', $post_meta, true ) ) {
$has_meta = true;
?>
<li class="post-author meta-wrapper">
<span class="meta-icon">
<span class="screen-reader-text"><?php _e( 'Post author', 'twentytwenty' );// phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></span>
<?php twentytwenty_the_theme_svg( 'user' ); ?>
</span>
<span class="meta-text">
<?php
printf(
// Translators: %s = the author name.
_x( 'By %s', '%s = author name', 'twentytwenty' ), // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- core trusts translations
'<a href="' . esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ) . '">' . esc_html( get_the_author_meta( 'display_name' ) ) . '</a>'
);
?>
</span>
</li>
<?php
}
// Post date.
if ( in_array( 'post-date', $post_meta, true ) ) {
$has_meta = true;
?>
<li class="post-date">
<a class="meta-wrapper" href="<?php the_permalink(); ?>">
<span class="meta-icon">
<span class="screen-reader-text"><?php _e( 'Post date', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></span>
<?php twentytwenty_the_theme_svg( 'calendar' ); ?>
</span>
<span class="meta-text">
<?php the_time( get_option( 'date_format' ) ); ?>
</span>
</a>
</li>
<?php
}
// Categories.
if ( in_array( 'categories', $post_meta, true ) && has_category() ) {
$has_meta = true;
?>
<li class="post-categories meta-wrapper">
<span class="meta-icon">
<span class="screen-reader-text"><?php _e( 'Categories', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></span>
<?php twentytwenty_the_theme_svg( 'folder' ); ?>
</span>
<span class="meta-text">
<?php _e( 'In', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?> <?php the_category( ', ' ); ?>
</span>
</li>
<?php
}
// Tags.
if ( in_array( 'tags', $post_meta, true ) && has_tag() ) {
$has_meta = true;
?>
<li class="post-tags meta-wrapper">
<span class="meta-icon">
<span class="screen-reader-text"><?php _e( 'Tags', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></span>
<?php twentytwenty_the_theme_svg( 'tag' ); ?>
</span>
<span class="meta-text">
<?php the_tags( '', ', ', '' ); ?>
</span>
</li>
<?php
}
// Comments link.
if ( in_array( 'comments', $post_meta, true ) && ! post_password_required() && ( comments_open() || get_comments_number() ) ) {
$has_meta = true;
?>
<li class="post-comment-link meta-wrapper">
<span class="meta-icon">
<?php twentytwenty_the_theme_svg( 'comment' ); ?>
</span>
<span class="meta-text">
<?php comments_popup_link(); ?>
</span>
</li>
<?php
}
// Sticky.
if ( in_array( 'sticky', $post_meta, true ) && is_sticky() ) {
$has_meta = true;
?>
<li class="post-sticky meta-wrapper">
<span class="meta-icon">
<?php twentytwenty_the_theme_svg( 'bookmark' ); ?>
</span>
<span class="meta-text">
<?php _e( 'Sticky post', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?>
</span>
</li>
<?php
}
// Allow output of additional post meta types to be added by child themes and plugins.
do_action( 'twentytwenty_end_of_post_meta_list', $post_meta, $post_id );
?>
</ul><!-- .post-meta -->
</div><!-- .post-meta-wrapper -->
<?php
wp_reset_postdata();
$meta_output = ob_get_clean();
// If there is meta to output, return it.
if ( $has_meta && $meta_output ) {
return $meta_output;
}
}
}
}
/**
* Menus
*/
if ( ! function_exists( 'twentytwenty_filter_wp_list_pages_item_classes' ) ) {
/**
* Filter Classes of wp_list_pages items to match menu items.
* Filter the class applied to wp_list_pages() items with children to match the menu class, to simplify.
* styling of sub levels in the fallback. Only applied if the match_menu_classes argument is set.
*
* @param string $css_class CSS Class names.
* @param string $item Comment.
* @param int $depth Depth of the current comment.
* @param array $args An array of arguments.
* @param string $current_page Wether or not the item is the current item.
*/
function twentytwenty_filter_wp_list_pages_item_classes( $css_class, $item, $depth, $args, $current_page ) {
// Only apply to wp_list_pages() calls with match_menu_classes set to true.
$match_menu_classes = isset( $args['match_menu_classes'] );
if ( ! $match_menu_classes ) {
return $css_class;
}
// Add current menu item class.
if ( in_array( 'current_page_item', $css_class, true ) ) {
$css_class[] = 'current-menu-item';
}
// Add menu item has children class.
if ( in_array( 'page_item_has_children', $css_class, true ) ) {
$css_class[] = 'menu-item-has-children';
}
return $css_class;
}
add_filter( 'page_css_class', 'twentytwenty_filter_wp_list_pages_item_classes', 10, 5 );
}
if ( ! function_exists( 'twentytwenty_add_sub_toggles_to_main_menu' ) ) {
/**
* Add a Sub Nav Toggle to the Expanded Menu and Mobile Menu.
*
* @param array $args An array of arguments.
* @param string $item Menu item.
* @param int $depth Depth of the current menu item.
*/
function twentytwenty_add_sub_toggles_to_main_menu( $args, $item, $depth ) {
// Add sub menu toggles to the Expanded Menu with toggles.
if ( isset( $args->show_toggles ) && $args->show_toggles ) {
// Wrap the menu item link contents in a div, used for positioning.
$args->before = '<div class="ancestor-wrapper">';
$args->after = '';
// Add a toggle to items with children.
if ( in_array( 'menu-item-has-children', $item->classes, true ) ) {
$toggle_target_string = '.menu-modal .menu-item-' . $item->ID . ' > .sub-menu';
// Add the sub menu toggle.
$args->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>';
}
// Close the wrapper.
$args->after .= '</div><!-- .ancestor-wrapper -->';
// Add sub menu icons to the primary menu without toggles.
} elseif ( 'primary' === $args->theme_location ) {
if ( in_array( 'menu-item-has-children', $item->classes, true ) ) {
$args->after = '<span class="icon"></span>';
} else {
$args->after = '';
}
}
return $args;
}
add_filter( 'nav_menu_item_args', 'twentytwenty_add_sub_toggles_to_main_menu', 10, 3 );
}
/**
* Classes
*/
if ( ! function_exists( 'twentytwenty_no_js_class' ) ) {
/**
* Add No-JS Class.
* If we're missing JavaScript support, the HTML element will have a no-js class.
*/
function twentytwenty_no_js_class() {
?>
<script>document.documentElement.className = document.documentElement.className.replace( 'no-js', 'js' );</script>
<?php
}
add_action( 'wp_head', 'twentytwenty_no_js_class' );
}
if ( ! function_exists( 'twentytwenty_get_the_archive_title' ) ) {
/**
* Filters the archive title and styles the word before the first colon.
*
* @param string $title Current archive title.
*/
function twentytwenty_get_the_archive_title( $title ) {
$regex = apply_filters(
'twentytwenty_get_the_archive_title_regex',
array(
'pattern' => '/(\A[^\:]+\:)/',
'replacement' => '<span class="color-accent">$1</span>',
)
);
if ( empty( $regex ) ) {
return $title;
}
return preg_replace( $regex['pattern'], $regex['replacement'], $title );
}
add_filter( 'get_the_archive_title', 'twentytwenty_get_the_archive_title' );
}
if ( ! function_exists( 'twentytwenty_body_classes' ) ) {
/**
* Add conditional body classes.
*
* @param string $classes Classes added to the body tag.
*/
function twentytwenty_body_classes( $classes ) {
global $post;
$post_type = isset( $post ) ? $post->post_type : false;
// Check whether we're singular.
if ( is_singular() ) {
$classes[] = 'singular';
}
// Check whether the current page should have an overlay header.
if ( is_page_template( array( 'templates/template-cover.php' ) ) ) {
$classes[] = 'overlay-header';
}
// Check whether the current page has full-width content.
if ( is_page_template( array( 'templates/template-full-width.php' ) ) ) {
$classes[] = 'has-full-width-content';
}
// Check for enabled search.
if ( true === get_theme_mod( 'enable_header_search', true ) ) {
$classes[] = 'enable-search-modal';
}
// Check for post thumbnail.
if ( is_singular() && has_post_thumbnail() ) {
$classes[] = 'has-post-thumbnail';
} elseif ( is_singular() ) {
$classes[] = 'missing-post-thumbnail';
}
// Check whether we're in the customizer preview.
if ( is_customize_preview() ) {
$classes[] = 'customizer-preview';
}
// Check if posts have single pagination.
if ( is_single() && ( get_next_post() || get_previous_post() ) ) {
$classes[] = 'has-single-pagination';
} else {
$classes[] = 'has-no-pagination';
}
// Check if we're showing comments.
if ( $post && ( ( 'post' === $post_type || comments_open() || get_comments_number() ) && ! post_password_required() ) ) {
$classes[] = 'showing-comments';
} else {
$classes[] = 'not-showing-comments';
}
// Check if avatars are visible.
$classes[] = get_option( 'show_avatars' ) ? 'show-avatars' : 'hide-avatars';
// Slim page template class names (class = name - file suffix).
if ( is_page_template() ) {
$classes[] = basename( get_page_template_slug(), '.php' );
}
return $classes;
}
add_filter( 'body_class', 'twentytwenty_body_classes' );
}

111
wp-content/themes/twentytwenty/index.php Normal file
View File

@ -0,0 +1,111 @@
<?php
/**
* The main template file
*
* This is the most generic template file in a WordPress theme
* and one of the two required files for a theme (the other being style.css).
* It is used to display a page when nothing more specific matches a query.
* E.g., it puts together the home page when no home.php file exists.
*
* @link https://developer.wordpress.org/themes/basics/template-hierarchy/
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
get_header();
?>
<main id="site-content" role="main">
<?php
$archive_title = '';
$archive_subtitle = '';
if ( is_search() ) {
global $wp_query;
$archive_title = sprintf(
'%1$s %2$s',
'<span class="color-accent">' . __( 'Search:', 'twentytwenty' ) . '</span>',
'&ldquo;' . get_search_query() . '&rdquo;'
);
if ( $wp_query->found_posts ) {
/* Translators: %s = Number of results */
$archive_subtitle = sprintf( _nx( 'We found %s result for your search.', 'We found %s results for your search.', $wp_query->found_posts, '%s = Number of results', 'twentytwenty' ), $wp_query->found_posts );
} else {
$archive_subtitle = __( 'We could not find any results for your search. You can give it another try through the search form below.', 'twentytwenty' );
}
} elseif ( ! is_home() ) {
$archive_title = get_the_archive_title();
$archive_subtitle = get_the_archive_description( '<div>', '</div>' );
}
if ( $archive_title || $archive_subtitle ) {
?>
<header class="archive-header has-text-align-center header-footer-group">
<div class="archive-header-inner section-inner medium">
<?php if ( $archive_title ) { ?>
<h1 class="archive-title"><?php echo wp_kses_post( $archive_title ); ?></h1>
<?php } ?>
<?php if ( $archive_subtitle ) { ?>
<div class="archive-subtitle section-inner thin max-percentage intro-text"><?php echo wp_kses_post( wpautop( $archive_subtitle ) ); ?></div>
<?php } ?>
</div><!-- .archive-header-inner -->
</header><!-- .archive-header -->
<?php } ?>
<div class="posts">
<?php
if ( have_posts() ) {
$i = 0;
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() );
}
} elseif ( is_search() ) {
?>
<div class="no-search-results-form section-inner thin">
<?php
get_search_form(
array(
'label' => __( 'search again', 'twentytwenty' ),
)
);
?>
</div><!-- .no-search-results -->
<?php
}
?>
</div><!-- .posts -->
<?php get_template_part( 'template-parts/pagination' ); ?>
</main><!-- #site-content -->
<?php
get_footer();

12678
wp-content/themes/twentytwenty/package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

40
wp-content/themes/twentytwenty/package.json Normal file
View File

@ -0,0 +1,40 @@
{
"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'"
}
}

48
wp-content/themes/twentytwenty/readme.txt Normal file
View File

@ -0,0 +1,48 @@
=== Twenty Twenty ===
Contributors: the WordPress team
Requires at least: 4.7
Tested up to: WordPress 5.3
Requires PHP: 5.2.4
Stable tag: 1.0
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Default theme for Twenty Twenty
== Description ==
== Changelog ==
== 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
License: SIL Open Font License, 1.1, https://opensource.org/licenses/OFL-1.1
Source: https://rsms.me/inter/
FontAwesome Icons
License: SIL Open Font License, 1.1, https://opensource.org/licenses/OFL-1.1
Source: https://www.fontawesome.io
FontAwesome Code
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

BIN
wp-content/themes/twentytwenty/screenshot.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 181 KiB

27
wp-content/themes/twentytwenty/searchform.php Normal file
View File

@ -0,0 +1,27 @@
<?php
/**
* The searchform.php template.
*
* Used any time that get_search_form() is called.
*
* @link https://developer.wordpress.org/themes/basics/template-hierarchy/
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
/*
* Generate a unique ID for each form and a string containing an aria-label if
* one was passed to get_search_form() in the args array.
*/
$unique_id = uniqid( 'search-form-' );
$aria_label = ( isset( $args['label'] ) && ! empty( $args['label'] ) ) ? 'aria-label="' . esc_attr( $args['label'] ) . '"' : '';
?>
<form role="search" <?php echo $aria_label; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Escaped above. ?> method="get" class="search-form" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<label for="<?php echo esc_attr( $unique_id ); ?>">
<span class="screen-reader-text"><?php echo _x( 'Search for:', 'label', 'twentytwenty' ); // phpcs:ignore: WordPress.Security.EscapeOutput.OutputNotEscaped -- core trusts translations ?></span>
<input type="search" id="<?php echo esc_attr( $unique_id ); ?>" class="search-field" placeholder="<?php echo esc_attr_x( 'Search &hellip;', 'placeholder', 'twentytwenty' ); ?>" value="<?php get_search_query(); ?>" name="s" />
</label>
<input type="submit" class="search-submit" value="<?php echo esc_attr_x( 'Search', 'submit button', 'twentytwenty' ); ?>" />
</form>

32
wp-content/themes/twentytwenty/singular.php Normal file
View File

@ -0,0 +1,32 @@
<?php
/**
* The template for displaying single posts and pages.
*
* @link https://developer.wordpress.org/themes/basics/template-hierarchy/
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
get_header();
?>
<main id="site-content" role="main">
<?php
if ( have_posts() ) {
while ( have_posts() ) {
the_post();
get_template_part( 'template-parts/content', get_post_type() );
}
}
?>
</main><!-- #site-content -->
<?php get_footer(); ?>

5664
wp-content/themes/twentytwenty/style-rtl.css Normal file
View File

File diff suppressed because it is too large Load Diff

5666
wp-content/themes/twentytwenty/style.css Normal file
View File

File diff suppressed because it is too large Load Diff

179
wp-content/themes/twentytwenty/template-parts/content-cover.php Normal file
View File

@ -0,0 +1,179 @@
<?php
/**
* Displays the content when the cover template is used.
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
?>
<article <?php post_class(); ?> id="post-<?php the_ID(); ?>">
<?php
// On the cover page template, output the cover header.
$cover_header_style = '';
$cover_header_classes = '';
$color_overlay_style = '';
$color_overlay_classes = '';
$image_url = ! post_password_required() ? get_the_post_thumbnail_url( get_the_ID(), 'twentytwenty-fullscreen' ) : '';
if ( $image_url ) {
$cover_header_style = ' style="background-image: url( ' . esc_url( $image_url ) . ' );"';
$cover_header_classes = ' bg-image';
}
// Get the color used for the color overlay.
$color_overlay_color = get_theme_mod( 'cover_template_overlay_background_color' );
if ( $color_overlay_color ) {
$color_overlay_style = ' style="color: ' . esc_attr( $color_overlay_color ) . ';"';
} else {
$color_overlay_style = '';
}
// Get the fixed background attachment option.
if ( get_theme_mod( 'cover_template_fixed_background', true ) ) {
$cover_header_classes .= ' bg-attachment-fixed';
}
// Get the opacity of the color overlay.
$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-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>
<header class="entry-header has-text-align-center">
<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.
$show_categories = apply_filters( 'twentytwenty_show_categories_in_entry_header', true );
if ( true === $show_categories && has_category() ) {
?>
<div class="entry-categories">
<span class="screen-reader-text"><?php esc_html_e( 'Categories', 'twentytwenty' ); ?></span>
<div class="entry-categories-inner">
<?php the_category( ' ' ); ?>
</div><!-- .entry-categories-inner -->
</div><!-- .entry-categories -->
<?php
}
the_title( '<h1 class="entry-title">', '</h1>' );
if ( is_page() ) {
?>
<div class="to-the-content-wrapper">
<a href="#post-inner" class="to-the-content fill-children-current-color">
<?php twentytwenty_the_theme_svg( 'arrow-down' ); ?>
<div class="screen-reader-text"><?php _e( 'Scroll Down', 'twentytwenty' ); // phpcs:ignore WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></div>
</a><!-- .to-the-content -->
</div><!-- .to-the-content-wrapper -->
<?php
} else {
$intro_text_width = '';
if ( is_singular() ) {
$intro_text_width = ' small';
} else {
$intro_text_width = ' thin';
}
if ( has_excerpt() ) {
?>
<div class="intro-text section-inner max-percentage<?php echo esc_attr( $intro_text_width ); ?>">
<?php the_excerpt(); ?>
</div>
<?php
}
twentytwenty_the_post_meta( get_the_ID(), 'single-top' );
}
?>
</div><!-- .entry-header-inner -->
</header><!-- .entry-header -->
</div><!-- .cover-header-inner -->
</div><!-- .cover-header-inner-wrapper -->
</div><!-- .cover-header -->
<div class="post-inner section-inner thin" id="post-inner">
<div class="entry-content">
<?php
the_content();
?>
</div><!-- .entry-content -->
<?php
wp_link_pages(
array(
'before' => '<nav class="post-nav-links bg-light-background" aria-label="' . esc_attr__( 'Page', 'twentytwenty' ) . '"><span class="label">' . __( 'Pages:', 'twentytwenty' ) . '</span>',
'after' => '</nav>',
)
);
edit_post_link();
// Single bottom post meta.
twentytwenty_the_post_meta( get_the_ID(), 'single-bottom' );
if ( is_single() ) {
get_template_part( 'template-parts/entry-author-bio' );
}
?>
</div><!-- .post-inner -->
<?php
if ( is_single() ) {
get_template_part( 'template-parts/navigation' );
}
/**
* Output comments wrapper if it's a post, or if comments are open,
* or if there's a comment number – and check for password.
* */
if ( ( 'post' === $post->post_type || comments_open() || get_comments_number() ) && ! post_password_required() ) {
?>
<div class="comments-wrapper section-inner">
<?php comments_template(); ?>
</div><!-- .comments-wrapper -->
<?php
}
?>
</article><!-- .post -->

90
wp-content/themes/twentytwenty/template-parts/content.php Normal file
View File

@ -0,0 +1,90 @@
<?php
/**
* The default template for displaying content
*
* Used for both singular and index.
*
* @link https://developer.wordpress.org/themes/basics/template-hierarchy/
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
?>
<article <?php post_class(); ?> id="post-<?php the_ID(); ?>">
<?php
get_template_part( 'template-parts/entry-header' );
if ( ! is_search() ) {
get_template_part( 'template-parts/featured-image' );
}
?>
<div class="post-inner section-inner thin">
<div class="entry-content">
<?php
if ( is_search() || ! is_singular() && 'summary' === get_theme_mod( 'blog_content', 'full' ) ) {
the_excerpt();
} else {
the_content();
}
?>
</div><!-- .entry-content -->
<?php
wp_link_pages(
array(
'before' => '<nav class="post-nav-links bg-light-background" aria-label="' . esc_attr__( 'Page', 'twentytwenty' ) . '"><span class="label">' . __( 'Pages:', 'twentytwenty' ) . '</span>',
'after' => '</nav>',
)
);
edit_post_link();
// Single bottom post meta.
twentytwenty_the_post_meta( get_the_ID(), 'single-bottom' );
if ( is_single() ) {
get_template_part( 'template-parts/entry-author-bio' );
}
?>
</div><!-- .post-inner -->
<?php
if ( is_single() ) {
get_template_part( 'template-parts/navigation' );
}
/**
* Output comments wrapper if it's a post, or if comments are open,
* or if there's a comment number – and check for password.
* */
if ( ( 'post' === $post->post_type || comments_open() || get_comments_number() ) && ! post_password_required() ) {
?>
<div class="comments-wrapper section-inner">
<?php comments_template(); ?>
</div><!-- .comments-wrapper -->
<?php
}
?>
</article><!-- .post -->

33
wp-content/themes/twentytwenty/template-parts/entry-author-bio.php Normal file
View File

@ -0,0 +1,33 @@
<?php
/**
* The template for displaying Author info
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
if ( (bool) get_the_author_meta( 'description' ) ) : ?>
<div class="author-bio">
<h2 class="author-title heading-size-4">
<div class="author-avatar vcard">
<?php echo get_avatar( get_the_author_meta( 'ID' ), 160 ); ?>
</div>
<span class="author-name">
<?php
printf(
/* Translators: %s: post author */
esc_html( 'By %s', 'twentytwenty' ),
esc_html( get_the_author() )
);
?>
</span>
</h2>
<p class="author-description">
<?php the_author_meta( 'description' ); ?>
<a class="author-link" href="<?php echo esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ); ?>" rel="author">
<?php esc_html_e( 'View Archive &rarr;', 'twentytwenty' ); ?>
</a>
</p><!-- .author-description -->
</div><!-- .author-bio -->
<?php endif; ?>

70
wp-content/themes/twentytwenty/template-parts/entry-header.php Normal file
View File

@ -0,0 +1,70 @@
<?php
/**
* Displays the post header
*
* @package WordPress
* @subpackage Twenty_Nineteen
* @since 1.0.0
*/
$entry_header_classes = '';
if ( is_singular() ) {
$entry_header_classes .= ' header-footer-group';
}
?>
<header class="entry-header has-text-align-center<?php echo esc_attr( $entry_header_classes ); ?>">
<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.
$show_categories = apply_filters( 'twentytwenty_show_categories_in_entry_header', true );
if ( true === $show_categories && has_category() ) {
?>
<div class="entry-categories">
<span class="screen-reader-text"><?php esc_html_e( 'Categories', 'twentytwenty' ); ?></span>
<div class="entry-categories-inner">
<?php the_category( ' ' ); ?>
</div><!-- .entry-categories-inner -->
</div><!-- .entry-categories -->
<?php
}
if ( is_singular() ) {
the_title( '<h1 class="entry-title">', '</h1>' );
} else {
the_title( '<h2 class="entry-title heading-size-1"><a href="' . esc_url( get_permalink() ) . '">', '</a></h2>' );
}
$intro_text_width = '';
if ( is_singular() ) {
$intro_text_width = ' small';
} else {
$intro_text_width = ' thin';
}
if ( has_excerpt() && is_singular() ) {
?>
<div class="intro-text section-inner max-percentage<?php echo esc_attr( $intro_text_width ); ?>">
<?php the_excerpt(); ?>
</div>
<?php
}
// Default to displaying the post meta.
twentytwenty_the_post_meta( get_the_ID(), 'single-top' );
?>
</div><!-- .entry-header-inner -->
</header><!-- .entry-header -->

43
wp-content/themes/twentytwenty/template-parts/featured-image.php Normal file
View File

@ -0,0 +1,43 @@
<?php
/**
* Displays the featured image
*
* @package WordPress
* @subpackage Twenty_Nineteen
* @since 1.0.0
*/
if ( has_post_thumbnail() && ! post_password_required() ) {
$featured_media_inner_classes = '';
// Make the featured media thinner on archive pages.
if ( ! is_singular() ) {
$featured_media_inner_classes .= ' medium';
}
?>
<figure class="featured-media">
<div class="featured-media-inner section-inner<?php echo esc_attr( $featured_media_inner_classes ); ?>">
<?php
the_post_thumbnail();
$caption = get_the_post_thumbnail_caption();
if ( $caption ) {
?>
<figcaption class="wp-caption-text"><?php echo esc_html( $caption ); ?></figcaption>
<?php
}
?>
</div><!-- .featured-media-inner -->
</figure><!-- .featured-media -->
<?php
}

155
wp-content/themes/twentytwenty/template-parts/modal-menu.php Normal file
View File

@ -0,0 +1,155 @@
<?php
/**
* Displays the menu icon and modal
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
?>
<div class="menu-modal cover-modal header-footer-group" data-modal-target-string=".menu-modal" aria-expanded="false">
<div class="menu-modal-inner modal-inner">
<div class="menu-wrapper section-inner">
<div class="menu-top">
<?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.
if ( has_nav_menu( 'mobile' ) ) {
$mobile_menu_location = 'mobile';
} elseif ( has_nav_menu( 'primary' ) ) {
$mobile_menu_location = 'primary';
} elseif ( has_nav_menu( 'expanded' ) ) {
$mobile_menu_location = 'expanded';
}
if ( has_nav_menu( 'expanded' ) ) {
$expanded_nav_classes = '';
if ( 'expanded' === $mobile_menu_location ) {
$expanded_nav_classes .= ' mobile-menu';
}
?>
<nav class="expanded-menu<?php echo esc_attr( $expanded_nav_classes ); ?>" aria-label="<?php esc_attr_e( 'Expanded', 'twentytwenty' ); ?>">
<ul class="modal-menu reset-list-style">
<?php
if ( has_nav_menu( 'expanded' ) ) {
wp_nav_menu(
array(
'container' => '',
'items_wrap' => '%3$s',
'show_toggles' => true,
'theme_location' => 'expanded',
)
);
}
?>
</ul>
</nav>
<?php
}
if ( 'expanded' !== $mobile_menu_location ) {
?>
<nav class="mobile-menu" aria-label="<?php esc_attr_e( 'Mobile', 'twentytwenty' ); ?>">
<ul class="modal-menu reset-list-style">
<?php
if ( $mobile_menu_location ) {
wp_nav_menu(
array(
'container' => '',
'items_wrap' => '%3$s',
'show_toggles' => true,
'theme_location' => $mobile_menu_location,
)
);
} else {
wp_list_pages(
array(
'match_menu_classes' => true,
'show_toggles' => true,
'title_li' => false,
'walker' => new TwentyTwenty_Walker_Page(),
)
);
}
?>
</ul>
</nav>
<?php
}
?>
</div><!-- .menu-top -->
<div class="menu-bottom">
<?php if ( has_nav_menu( 'social' ) ) { ?>
<nav aria-label="<?php esc_attr_e( 'Expanded Social links', 'twentytwenty' ); ?>">
<ul class="social-menu 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 -->
<?php } ?>
</div><!-- .menu-bottom -->
</div><!-- .menu-wrapper -->
</div><!-- .menu-modal-inner -->
</div><!-- .menu-modal -->

36
wp-content/themes/twentytwenty/template-parts/modal-search.php Normal file
View File

@ -0,0 +1,36 @@
<?php
/**
* Displays the search icon and modal
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
?>
<div class="search-modal cover-modal header-footer-group" data-modal-target-string=".search-modal" aria-expanded="false">
<div class="search-modal-inner modal-inner">
<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 -->
<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>
<?php twentytwenty_the_theme_svg( 'cross' ); ?>
</button><!-- .search-toggle -->
</div><!-- .section-inner -->
</div><!-- .search-modal-inner -->
</div><!-- .menu-modal -->

61
wp-content/themes/twentytwenty/template-parts/navigation.php Normal file
View File

@ -0,0 +1,61 @@
<?php
/**
* Displays the next and previous post navigation in single posts.
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
$next_post = get_next_post();
$prev_post = get_previous_post();
if ( $next_post || $prev_post ) {
$pagination_classes = '';
if ( ! $next_post ) {
$pagination_classes = ' only-one only-prev';
} elseif ( ! $prev_post ) {
$pagination_classes = ' only-one only-next';
}
?>
<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" />
<div class="pagination-single-inner">
<?php
if ( $prev_post ) {
?>
<a class="previous-post" href="<?php echo esc_url( get_permalink( $prev_post->ID ) ); ?>">
<span class="arrow">&larr;</span>
<span class="title"><span class="title-inner"><?php echo wp_kses_post( get_the_title( $prev_post->ID ) ); ?></span></span>
</a>
<?php
}
if ( $next_post ) {
?>
<a class="next-post" href="<?php echo esc_url( get_permalink( $next_post->ID ) ); ?>">
<span class="arrow">&rarr;</span>
<span class="title"><span class="title-inner"><?php echo wp_kses_post( get_the_title( $next_post->ID ) ); ?></span></span>
</a>
<?php
}
?>
</div><!-- .pagination-single-inner -->
<hr class="is-style-wide" aria-hidden="true" />
</nav><!-- .pagination-single -->
<?php
}

58
wp-content/themes/twentytwenty/template-parts/pagination.php Normal file
View File

@ -0,0 +1,58 @@
<?php
/**
* A template partial to output pagination for the Twenty Twenty default theme.
*
* @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0.0
*/
/**
* Translators:
* This text contains HTML to allow the text to be shorter on small screens.
* The text inside the span with the class nav-short will be hidden on small screens.
*/
$prev_text = sprintf(
'%s <span class="nav-prev-text">%s</span>',
'&larr;',
__( 'Newer <span class="nav-short">Posts</span>', 'twentytwenty' )
);
$next_text = sprintf(
'<span class="nav-next-text">%s</span> %s',
__( 'Older <span class="nav-short">Posts</span>', 'twentytwenty' ),
'&rarr;'
);
$posts_pagination = get_the_posts_pagination(
array(
'mid_size' => 1,
'prev_text' => $prev_text,
'next_text' => $next_text,
)
);
// If we're not outputting the previous page link, prepend a placeholder with visisibility: hidden to take its place.
if ( strpos( $posts_pagination, 'prev page-numbers' ) === false ) {
$posts_pagination = str_replace( '<div class="nav-links">', '<div class="nav-links"><span class="prev page-numbers placeholder" aria-hidden="true">' . $prev_text . '</span>', $posts_pagination );
}
// If we're not outputting the next page link, append a placeholder with visisibility: hidden to take its place.
if ( strpos( $posts_pagination, 'next page-numbers' ) === false ) {
$posts_pagination = str_replace( '</div>', '<span class="next page-numbers placeholder" aria-hidden="true">' . $next_text . '</span></div>', $posts_pagination );
}
if ( $posts_pagination ) { ?>
<div class="pagination-wrapper section-inner">
<hr class="pagination-separator is-style-wide" aria-hidden="true" />
<?php echo $posts_pagination; //phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- already escaped during generation. ?>
</div><!-- .pagination-wrapper -->
<?php
}

31
wp-content/themes/twentytwenty/templates/template-cover.php Normal file
View File

@ -0,0 +1,31 @@
<?php
/**
* Template Name: Cover Template
* Template Post Type: post, page
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0
*/
get_header();
?>
<main id="site-content" role="main">
<?php
if ( have_posts() ) {
while ( have_posts() ) {
the_post();
get_template_part( 'template-parts/content-cover' );
}
}
?>
</main><!-- #site-content -->
<?php get_footer(); ?>

11
wp-content/themes/twentytwenty/templates/template-full-width.php Normal file
View File

@ -0,0 +1,11 @@
<?php
/**
* Template Name: Full Width Template
* Template Post Type: post, page
*
* @package WordPress
* @subpackage Twenty_Twenty
* @since 1.0
*/
get_template_part( 'singular' );

2
wp-includes/version.php
View File

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