WordPress.org
Get WordPress

Make WordPress Core

Changeset 46712 for branches/5.3


Ignore:
Timestamp:
11/11/2019 09:03:55 PM (7 years ago)
Author:
SergeyBiryukov
Message:

Bundled Themes: Update Twenty Twenty.

This brings Twenty Twenty in sync with GitHub. For a full list of changes since 5.3 RC4, see ​https://github.com/WordPress/twentytwenty/compare/c267289...ab5fa23.

Reviewed by SergeyBiryukov.
Props williampatton, poena, andersnoren, desrosj, schlessera, leprincenoir, alextran, aristath, b-07, allancole, karmatosed, pierlo, joen, ianbelanger.
See #48110, #48386, #48450, #48505.
Merges [46701], [46702], [46711] to the 5.3 branch.
Fixes #48557.

Location:
branches/5.3
Files:
13 edited

Legend:

Unmodified
Added
Removed

  • branches/5.3

  • branches/5.3/src/wp-content/themes/twentytwenty/assets/css/editor-style-block-rtl.css

    r46614 r46712  
    7979}
    8080
    81 .wp-block[data-align="wide"] .wp-block,
    82 .wp-block[data-align="full"] .wp-block {
    83         max-width: none;
    84 }
    85 
    8681.wp-block[data-align="wide"] .wp-block[data-align="wide"],
    8782.wp-block[data-align="full"] .wp-block[data-align="wide"] {
    … …  
    107102
    108103.wp-block[data-align="wide"] {
    109         margin-bottom: 30px;
    110         margin-top: 30px;
    111104        max-width: 1200px;
    112105}
    113106
    114107.wp-block[data-align="full"] {
    115         margin-bottom: 50px;
    116         margin-top: 50px;
    117108        max-width: none;
    118109}
    … …  
    178169.has-accent-background-color {
    179170        background-color: #cd2653;
     171}
     172
     173.has-secondary-color {
     174        color: #6d6d6d;
     175}
     176
     177.has-secondary-background-color {
     178        background-color: #6d6d6d;
     179}
     180
     181.has-subtle-background-color {
     182        color: #dcd7ca;
     183}
     184
     185.has-subtle-background-background-color {
     186        background-color: #dcd7ca;
     187}
     188
     189.has-background-color {
     190        color: #6d6d6d;
     191}
     192
     193.has-background-background-color {
     194        background-color: #6d6d6d;
    180195}
    181196
    … …  
    320335}
    321336
     337.editor-styles-wrapper p.has-normal-font-size,
    322338.editor-styles-wrapper p.has-regular-font-size {
    323339        font-size: 1em;
    … …  
    678694.editor-styles-wrapper .wp-block-cover .wp-block-cover__inner-container {
    679695        margin: 0 auto;
    680         max-width: 1200px;
    681696        width: calc(100% - 40px);
    682697}
    683698
    684 [data-align="left"] .wp-block-cover,
    685 [data-align="left"] .wp-block-cover-image,
    686 [data-align="right"] .wp-block-cover,
    687 [data-align="right"] .wp-block-cover-image {
    688         max-width: 260px;
     699.editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="right"],
     700.editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="left"] {
     701        height: auto;
     702        max-height: none;
     703}
     704
     705.editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="left"] .wp-block-cover {
     706        text-align: right;
     707}
     708
     709.editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="right"] .wp-block-cover {
     710        text-align: left;
     711}
     712
     713.editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="right"] .block-editor-block-list__block-edit,
     714.editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="left"] .block-editor-block-list__block-edit {
     715        float: none;
     716        margin-right: 0;
     717        margin-left: 0;
     718        max-width: 100%;
    689719}
    690720
    … …  
    10521082        }
    10531083
     1084        /* BLOCK: COVER */
     1085
     1086        .wp-block[data-type="core/cover"][data-align="left"] [data-block],
     1087        .wp-block[data-type="core/cover"][data-align="right"] [data-block] {
     1088                margin-top: 0;
     1089        }
     1090
     1091        .editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="right"] .block-editor-block-list__block-edit {
     1092                float: left;
     1093                margin-right: 20px;
     1094                max-width: 260px;
     1095        }
     1096
     1097        .editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="left"] .block-editor-block-list__block-edit {
     1098                float: right;
     1099                margin-left: 20px;
     1100                max-width: 260px;
     1101        }
     1102
     1103        .editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="right"] .wp-block-pullquote::before {
     1104                margin-left: 0;
     1105        }
     1106
     1107        .editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="left"] .wp-block-pullquote::before {
     1108                margin-right: 0;
     1109        }
     1110
    10541111        /* BLOCK: PULL QUOTE */
    10551112
    … …  
    11311188        }
    11321189
    1133         .wp-block[data-align="wide"],
    1134         .wp-block[data-align="full"] {
    1135                 margin-bottom: 60px;
    1136                 margin-top: 60px;
    1137         }
    1138 
    11391190        /* TYPOGRAPHY */
    11401191
    … …  
    12081259        /* BLOCK: GROUP */
    12091260
    1210         .editor-styles-wrapper .wp-block-group.has-background {
     1261        .editor-styles-wrapper .wp-block:not([data-align="wide"]):not([data-align="full"]) div:not([class*="__inner-container"]) .wp-block-group.has-background,
     1262        .editor-styles-wrapper .wp-block div[class*="__inner-container"] .wp-block[data-align="wide"] .wp-block-group.has-background,
     1263        .editor-styles-wrapper .wp-block div[class*="__inner-container"] .wp-block[data-align="full"] .wp-block-group.has-background {
    12111264                padding: 40px;
     1265        }
     1266
     1267        .editor-styles-wrapper .wp-block[data-align="wide"] .wp-block-group.has-background,
     1268        .editor-styles-wrapper .wp-block[data-align="full"] .wp-block-group.has-background {
     1269                padding: 80px;
    12121270        }
    12131271
    … …  
    12831341
    12841342
    1285         /* STRUCTURE */
    1286 
    1287         .wp-block[data-align="wide"],
    1288         .wp-block[data-align="full"] {
    1289                 margin-bottom: 80px;
    1290                 margin-top: 80px;
    1291         }
    1292 
    12931343        /* BLOCK: COLUMNS */
    12941344
    12951345        .wp-block-column {
    12961346                font-size: 18px;
    1297         }
    1298 
    1299         /* BLOCK: GROUP */
    1300 
    1301         .wp-block[data-align="wide"] .wp-block-group.has-background,
    1302         .wp-block[data-align="full"] .wp-block-group.has-background {
    1303                 padding: 80px 40px;
    13041347        }
    13051348
    … …  
    13321375        .editor-styles-wrapper .wp-block h6 {
    13331376                font-size: 18px;
    1334         }
    1335 
    1336         /* STRUCTURE */
    1337 
    1338         .wp-block[data-align="wide"],
    1339         .wp-block[data-align="full"] {
    1340                 margin-bottom: 80px;
    1341                 margin-top: 80px;
    13421377        }
    13431378

  • branches/5.3/src/wp-content/themes/twentytwenty/assets/css/editor-style-block.css

    r46614 r46712  
    7979}
    8080
    81 .wp-block[data-align="wide"] .wp-block,
    82 .wp-block[data-align="full"] .wp-block {
    83         max-width: none;
    84 }
    85 
    8681.wp-block[data-align="wide"] .wp-block[data-align="wide"],
    8782.wp-block[data-align="full"] .wp-block[data-align="wide"] {
    … …  
    107102
    108103.wp-block[data-align="wide"] {
    109         margin-bottom: 30px;
    110         margin-top: 30px;
    111104        max-width: 1200px;
    112105}
    113106
    114107.wp-block[data-align="full"] {
    115         margin-bottom: 50px;
    116         margin-top: 50px;
    117108        max-width: none;
    118109}
    … …  
    178169.has-accent-background-color {
    179170        background-color: #cd2653;
     171}
     172
     173.has-secondary-color {
     174        color: #6d6d6d;
     175}
     176
     177.has-secondary-background-color {
     178        background-color: #6d6d6d;
     179}
     180
     181.has-subtle-background-color {
     182        color: #dcd7ca;
     183}
     184
     185.has-subtle-background-background-color {
     186        background-color: #dcd7ca;
     187}
     188
     189.has-background-color {
     190        color: #6d6d6d;
     191}
     192
     193.has-background-background-color {
     194        background-color: #6d6d6d;
    180195}
    181196
    … …  
    320335}
    321336
     337.editor-styles-wrapper p.has-normal-font-size,
    322338.editor-styles-wrapper p.has-regular-font-size {
    323339        font-size: 1em;
    … …  
    678694.editor-styles-wrapper .wp-block-cover .wp-block-cover__inner-container {
    679695        margin: 0 auto;
    680         max-width: 1200px;
    681696        width: calc(100% - 40px);
    682697}
    683698
    684 [data-align="left"] .wp-block-cover,
    685 [data-align="left"] .wp-block-cover-image,
    686 [data-align="right"] .wp-block-cover,
    687 [data-align="right"] .wp-block-cover-image {
    688         max-width: 260px;
     699.editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="right"],
     700.editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="left"] {
     701        height: auto;
     702        max-height: none;
     703}
     704
     705.editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="left"] .wp-block-cover {
     706        text-align: left;
     707}
     708
     709.editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="right"] .wp-block-cover {
     710        text-align: right;
     711}
     712
     713.editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="right"] .block-editor-block-list__block-edit,
     714.editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="left"] .block-editor-block-list__block-edit {
     715        float: none;
     716        margin-left: 0;
     717        margin-right: 0;
     718        max-width: 100%;
    689719}
    690720
    … …  
    10521082        }
    10531083
     1084        /* BLOCK: COVER */
     1085
     1086        .wp-block[data-type="core/cover"][data-align="left"] [data-block],
     1087        .wp-block[data-type="core/cover"][data-align="right"] [data-block] {
     1088                margin-top: 0;
     1089        }
     1090
     1091        .editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="right"] .block-editor-block-list__block-edit {
     1092                float: right;
     1093                margin-left: 20px;
     1094                max-width: 260px;
     1095        }
     1096
     1097        .editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="left"] .block-editor-block-list__block-edit {
     1098                float: left;
     1099                margin-right: 20px;
     1100                max-width: 260px;
     1101        }
     1102
     1103        .editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="right"] .wp-block-pullquote::before {
     1104                margin-right: 0;
     1105        }
     1106
     1107        .editor-styles-wrapper .wp-block[data-type="core/cover"][data-align="left"] .wp-block-pullquote::before {
     1108                margin-left: 0;
     1109        }
     1110
    10541111        /* BLOCK: PULL QUOTE */
    10551112
    … …  
    11311188        }
    11321189
    1133         .wp-block[data-align="wide"],
    1134         .wp-block[data-align="full"] {
    1135                 margin-bottom: 60px;
    1136                 margin-top: 60px;
    1137         }
    1138 
    11391190        /* TYPOGRAPHY */
    11401191
    … …  
    12081259        /* BLOCK: GROUP */
    12091260
    1210         .editor-styles-wrapper .wp-block-group.has-background {
     1261        .editor-styles-wrapper .wp-block:not([data-align="wide"]):not([data-align="full"]) div:not([class*="__inner-container"]) .wp-block-group.has-background,
     1262        .editor-styles-wrapper .wp-block div[class*="__inner-container"] .wp-block[data-align="wide"] .wp-block-group.has-background,
     1263        .editor-styles-wrapper .wp-block div[class*="__inner-container"] .wp-block[data-align="full"] .wp-block-group.has-background {
    12111264                padding: 40px;
     1265        }
     1266
     1267        .editor-styles-wrapper .wp-block[data-align="wide"] .wp-block-group.has-background,
     1268        .editor-styles-wrapper .wp-block[data-align="full"] .wp-block-group.has-background {
     1269                padding: 80px;
    12121270        }
    12131271
    … …  
    12831341
    12841342
    1285         /* STRUCTURE */
    1286 
    1287         .wp-block[data-align="wide"],
    1288         .wp-block[data-align="full"] {
    1289                 margin-bottom: 80px;
    1290                 margin-top: 80px;
    1291         }
    1292 
    12931343        /* BLOCK: COLUMNS */
    12941344
    12951345        .wp-block-column {
    12961346                font-size: 18px;
    1297         }
    1298 
    1299         /* BLOCK: GROUP */
    1300 
    1301         .wp-block[data-align="wide"] .wp-block-group.has-background,
    1302         .wp-block[data-align="full"] .wp-block-group.has-background {
    1303                 padding: 80px 40px;
    13041347        }
    13051348
    … …  
    13321375        .editor-styles-wrapper .wp-block h6 {
    13331376                font-size: 18px;
    1334         }
    1335 
    1336         /* STRUCTURE */
    1337 
    1338         .wp-block[data-align="wide"],
    1339         .wp-block[data-align="full"] {
    1340                 margin-bottom: 80px;
    1341                 margin-top: 80px;
    13421377        }
    13431378

  • branches/5.3/src/wp-content/themes/twentytwenty/assets/js/customize-controls.js

    r46446 r46712  
    1 /* global twentyTwentyBgColors, twentyTwentyColor, Color, jQuery, wp, _ */
     1/* global twentyTwentyBgColors, twentyTwentyColor, jQuery, wp, _ */
    22/**
    33 * Customizer enhancements for a better user experience.
    … …  
    7575
    7676                        // Get secondary color.
    77                         value[ context ].secondary = Color( {
    78                                 h: colors.bgColorObj.h(),
    79                                 s: colors.bgColorObj.s() / 2,
    80                                 l: ( colors.textColorObj.l() * 0.57 ) + ( colors.bgColorObj.l() * 0.43 )
    81                         } ).toCSS();
     77                        value[ context ].secondary = colors.bgColorObj
     78                                .clone()
     79                                .getReadableContrastingColor( colors.bgColorObj )
     80                                .s( colors.bgColorObj.s() / 2 )
     81                                .toCSS();
    8282                }
    8383

  • branches/5.3/src/wp-content/themes/twentytwenty/assets/js/index.js

    r46669 r46712  
    3131        NodeList.prototype.forEach = function( callback, thisArg ) {
    3232                var i;
     33                var len = this.length;
    3334
    3435                thisArg = thisArg || window;
    3536
    36                 for ( i = 0; i < this.length; i++ ) {
     37                for ( i = 0; i < len; i++ ) {
    3738                        callback.call( thisArg, this[ i ], i, this );
    3839                }
    … …  
    6970}
    7071
     72// Add a class to the body for when touch is enabled for browsers that don't support media queries
     73// for interaction media features. Adapted from <https://codepen.io/Ferie/pen/vQOMmO>
     74( function() {
     75        var matchMedia = function() {
     76                // Include the 'heartz' as a way to have a non matching MQ to help terminate the join. See <https://git.io/vznFH>.
     77                var prefixes = [ '-webkit-', '-moz-', '-o-', '-ms-' ];
     78                var query = [ '(', prefixes.join( 'touch-enabled),(' ), 'heartz', ')' ].join( '' );
     79                return window.matchMedia && window.matchMedia( query ).matches;
     80        };
     81
     82        if ( ( 'ontouchstart' in window ) || ( window.DocumentTouch && document instanceof window.DocumentTouch ) || matchMedia() ) {
     83                document.body.classList.add( 'touch-enabled' );
     84        }
     85}() );
     86
    7187/*      -----------------------------------------------------------------------------------------------
    7288        Cover Modals
    … …  
    524540                        }
    525541                }
    526 
    527                 /**
    528                  * Toggles `focus` class to allow submenu access on tablets.
    529                  */
    530                 ( function( menuObj ) {
    531                         var touchStartFn, j,
    532                                 parentLink = menuObj.querySelectorAll( '.primary-menu .menu-item-has-children > a' );
    533 
    534                         if ( 'ontouchstart' in window ) {
    535                                 touchStartFn = function( e ) {
    536                                         var menuItem = this.parentNode;
    537 
    538                                         if ( ! menuItem.classList.contains( 'focus' ) ) {
    539                                                 e.preventDefault();
    540                                                 for ( j = 0; j < menuItem.parentNode.children.length; ++j ) {
    541                                                         if ( menuItem === menuItem.parentNode.children[j] ) {
    542                                                                 continue;
    543                                                         }
    544                                                         menuItem.parentNode.children[i].classList.remove( 'focus' );
    545                                                 }
    546                                                 menuItem.classList.add( 'focus' );
    547                                         } else {
    548                                                 menuItem.classList.remove( 'focus' );
    549                                         }
    550                                 };
    551 
    552                                 for ( j = 0; j < parentLink.length; ++j ) {
    553                                         parentLink[j].addEventListener( 'touchstart', touchStartFn, false );
    554                                 }
    555                         }
    556                 }( menu ) );
    557542        }
    558543}; // twentytwenty.primaryMenu

  • branches/5.3/src/wp-content/themes/twentytwenty/footer.php

    r46614 r46712  
    2727                                                        ?>
    2828                                                        <a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php echo bloginfo( 'name' ); ?></a>
    29                                                 </p>
     29                                                </p><!-- .footer-copyright -->
    3030
    3131                                                <p class="powered-by-wordpress">

  • branches/5.3/src/wp-content/themes/twentytwenty/functions.php

    r46669 r46712  
    2020 * WP Body Open
    2121 * Register Sidebars
    22  * Enqueue block editor assets
    23  * Enqueue classic editor styles
    24  * Block editor settings
     22 * Enqueue Block Editor Assets
     23 * Enqueue Classic Editor Styles
     24 * Block Editor Settings
    2525 */
    2626
    … …  
    120120        add_theme_support( 'align-wide' );
    121121
    122         // Adds starter content to highlight the theme on fresh sites.
    123         add_theme_support( 'starter-content', twentytwenty_get_starter_content() );
     122        /*
     123         * Adds starter content to highlight the theme on fresh sites.
     124         * This is done conditionally to avoid loading the starter content on every
     125         * page load, as it is a one-off operation only needed once in the customizer.
     126         */
     127        if ( is_customize_preview() ) {
     128                require get_template_directory() . '/inc/starter-content.php';
     129                add_theme_support( 'starter-content', twentytwenty_get_starter_content() );
     130        }
    124131
    125132        // Add theme support for selective refresh for widgets.
    … …  
    167174// Custom CSS.
    168175require get_template_directory() . '/inc/custom-css.php';
    169 
    170 // Custom starter content to highlight the theme on fresh sites.
    171 require get_template_directory() . '/inc/starter-content.php';
    172176
    173177/**
    … …  
    532536                                'shortName' => _x( 'M', 'Short name of the regular font size in the block editor.', 'twentytwenty' ),
    533537                                'size'      => 21,
    534                                 'slug'      => 'regular',
     538                                'slug'      => 'normal',
    535539                        ),
    536540                        array(
    … …  
    693697                'content'       => array(
    694698                        'accent'     => array(
    695                                 'color'        => array( '.color-accent', '.color-accent-hover:hover', '.color-accent-hover:focus', ':root .has-accent-color', '.has-drop-cap:not(:focus):first-letter', '.wp-block-button.is-style-outline', 'a' ),
    696                                 'border-color' => array( 'blockquote', '.border-color-accent', '.border-color-accent-hover:hover', '.border-color-accent-hover:focus' ),
    697                                 'background'  => array( 'button:not(.toggle)', '.button', '.faux-button', '.wp-block-button__link', '.wp-block-file .wp-block-file__button', 'input[type="button"]', 'input[type="reset"]', 'input[type="submit"]', '.bg-accent', '.bg-accent-hover:hover', '.bg-accent-hover:focus', ':root .has-accent-background-color', '.comment-reply-link' ),
    698                                 'fill'         => array( '.fill-children-accent', '.fill-children-accent *' ),
     699                                'color'            => array( '.color-accent', '.color-accent-hover:hover', '.color-accent-hover:focus', ':root .has-accent-color', '.has-drop-cap:not(:focus):first-letter', '.wp-block-button.is-style-outline', 'a' ),
     700                                'border-color'     => array( 'blockquote', '.border-color-accent', '.border-color-accent-hover:hover', '.border-color-accent-hover:focus' ),
     701                                'background-color' => array( 'button:not(.toggle)', '.button', '.faux-button', '.wp-block-button__link', '.wp-block-file .wp-block-file__button', 'input[type="button"]', 'input[type="reset"]', 'input[type="submit"]', '.bg-accent', '.bg-accent-hover:hover', '.bg-accent-hover:focus', ':root .has-accent-background-color', '.comment-reply-link' ),
     702                                'fill'             => array( '.fill-children-accent', '.fill-children-accent *' ),
    699703                        ),
    700704                        'background' => array(
    701                                 'color'      => array( ':root .has-background-color', 'button', '.button', '.faux-button', '.wp-block-button__link', '.wp-block-file__button', 'input[type="button"]', 'input[type="reset"]', 'input[type="submit"]', '.wp-block-button', '.comment-reply-link' ),
    702                                 'background' => array( ':root .has-background-background-color' ),
     705                                'color'            => array( ':root .has-background-color', 'button', '.button', '.faux-button', '.wp-block-button__link', '.wp-block-file__button', 'input[type="button"]', 'input[type="reset"]', 'input[type="submit"]', '.wp-block-button', '.comment-reply-link', '.has-background.has-primary-background-color:not(.has-text-color)', '.has-background.has-primary-background-color *:not(.has-text-color)', '.has-background.has-accent-background-color:not(.has-text-color)', '.has-background.has-accent-background-color *:not(.has-text-color)' ),
     706                                'background-color' => array( ':root .has-background-background-color' ),
    703707                        ),
    704708                        'text'       => array(
    705                                 'color'      => array( 'body', '.entry-title a', ':root .has-primary-color' ),
    706                                 'background' => array( ':root .has-primary-background-color' ),
     709                                'color'            => array( 'body', '.entry-title a', ':root .has-primary-color' ),
     710                                'background-color' => array( ':root .has-primary-background-color' ),
    707711                        ),
    708712                        'secondary'  => array(
    709                                 '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', '.entry-content hr:not(.has-background)', 'hr.styled-separator', ':root .has-secondary-color' ),
    710                                 'background' => array( ':root .has-secondary-background-color' ),
     713                                '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', '.entry-content hr:not(.has-background)', 'hr.styled-separator', ':root .has-secondary-color' ),
     714                                'background-color' => array( ':root .has-secondary-background-color' ),
    711715                        ),
    712716                        'borders'    => array(
    713717                                'border-color'        => array( 'pre', 'fieldset', 'input', 'textarea', 'table', 'table *', 'hr' ),
    714                                 'background'          => array( 'caption', 'code', 'code', 'kbd', 'samp', '.wp-block-table.is-style-stripes tbody tr:nth-child(odd)', ':root .has-subtle-background-background-color' ),
     718                                'background-color'    => array( 'caption', 'code', 'code', 'kbd', 'samp', '.wp-block-table.is-style-stripes tbody tr:nth-child(odd)', ':root .has-subtle-background-background-color' ),
    715719                                'border-bottom-color' => array( '.wp-block-table.is-style-stripes' ),
    716720                                'border-top-color'    => array( '.wp-block-latest-posts.is-grid li' ),
    … …  
    720724                'header-footer' => array(
    721725                        'accent'     => array(
    722                                 '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:not(.overlay-header) .entry-header a', '.archive-header a', '.header-footer-group .color-accent', '.header-footer-group .color-accent-hover:hover' ),
    723                                 '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"]' ),
     726                                '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:not(.overlay-header) .entry-header a', '.archive-header a', '.header-footer-group .color-accent', '.header-footer-group .color-accent-hover:hover' ),
     727                                'background-color' => 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"]' ),
    724728                        ),
    725729                        'background' => array(
    726                                 'color'      => array( '.social-icons a', 'body:not(.overlay-header) .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"]' ),
    727                                 'background' => array( '#site-header', '.footer-nav-widgets-wrapper', '#site-footer', '.menu-modal', '.menu-modal-inner', '.search-modal-inner', '.archive-header', '.singular .entry-header', '.singular .featured-media:before', '.wp-block-pullquote:before' ),
     730                                'color'            => array( '.social-icons a', 'body:not(.overlay-header) .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"]' ),
     731                                'background-color' => array( '#site-header', '.footer-nav-widgets-wrapper', '#site-footer', '.menu-modal', '.menu-modal-inner', '.search-modal-inner', '.archive-header', '.singular .entry-header', '.singular .featured-media:before', '.wp-block-pullquote:before' ),
    728732                        ),
    729733                        'text'       => array(
    730734                                'color'               => array( '.header-footer-group', 'body:not(.overlay-header) #site-header .toggle', '.menu-modal .toggle' ),
    731                                 'background'          => array( 'body:not(.overlay-header) .primary-menu ul' ),
     735                                'background-color'    => array( 'body:not(.overlay-header) .primary-menu ul' ),
    732736                                'border-bottom-color' => array( 'body:not(.overlay-header) .primary-menu > li > ul:after' ),
    733737                                'border-left-color'   => array( 'body:not(.overlay-header) .primary-menu ul ul:after' ),
    … …  
    737741                        ),
    738742                        'borders'    => array(
    739                                 '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 *', '.footer-nav-widgets-wrapper', '#site-footer', '.menu-modal nav *', '.footer-widgets-outer-wrapper', '.footer-top' ),
    740                                 'background'  => array( '.header-footer-group table caption', 'body:not(.overlay-header) .header-inner .toggle-wrapper::before' ),
     743                                '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 *', '.footer-nav-widgets-wrapper', '#site-footer', '.menu-modal nav *', '.footer-widgets-outer-wrapper', '.footer-top' ),
     744                                'background-color' => array( '.header-footer-group table caption', 'body:not(.overlay-header) .header-inner .toggle-wrapper::before' ),
    741745                        ),
    742746                ),

  • branches/5.3/src/wp-content/themes/twentytwenty/inc/custom-css.php

    r46614 r46712  
    130130                        // Background color.
    131131                        if ( $background && $background !== $background_default ) {
    132                                 twentytwenty_generate_css( '.editor-styles-wrapper', 'background', '#' . $background );
     132                                twentytwenty_generate_css( '.editor-styles-wrapper', 'background-color', '#' . $background );
     133                                twentytwenty_generate_css( '.has-background.has-primary-background-color:not(.has-text-color),.has-background.has-primary-background-color *:not(.has-text-color),.has-background.has-accent-background-color:not(.has-text-color),.has-background.has-accent-background-color *:not(.has-text-color)', 'color', '#' . $background );
    133134                        }
    134135
    … …  
    165166                        // Background color.
    166167                        if ( $background && $background !== $background_default ) {
    167                                 twentytwenty_generate_css( 'body#tinymce.wp-editor.content', 'background', '#' . $background );
     168                                twentytwenty_generate_css( 'body#tinymce.wp-editor.content', 'background-color', '#' . $background );
    168169                        }
    169170

  • branches/5.3/src/wp-content/themes/twentytwenty/inc/starter-content.php

    r46571 r46712  
    176176                                'name'  => __( 'Primary', 'twentytwenty' ),
    177177                                'items' => array(
     178                                        'link_home', // Note that the core "home" page is actually a link in case a static front page is not used.
     179                                        'page_about',
     180                                        'page_blog',
    178181                                        'page_contact',
    179182                                ),
    180183                        ),
    181                         // Assign a menu to the "expanded" (modal) menu location.
     184                        // This replicates primary just to demonstrate the expanded menu.
    182185                        'expanded' => array(
    183186                                'name'  => __( 'Primary', 'twentytwenty' ),
    … …  
    186189                                        'page_about',
    187190                                        'page_blog',
     191                                        'page_contact',
    188192                                ),
    189193                        ),

  • branches/5.3/src/wp-content/themes/twentytwenty/print.css

    r46614 r46712  
    6767  h3,
    6868  h4,
     69  .has-normal-font-size,
    6970  .has-regular-font-size,
    7071  .has-large-font-size,

  • branches/5.3/src/wp-content/themes/twentytwenty/style-rtl.css

    r46699 r46712  
    181181        width: 1px;
    182182        word-wrap: normal !important;
     183        word-break: normal;
    183184}
    184185
    … …  
    827828}
    828829
     830input[type="text"]:focus,
     831input[type="email"]:focus,
     832input[type="url"]:focus,
     833input[type="password"]:focus,
     834input[type="number"]:focus,
     835input[type="tel"]:focus,
     836input[type="range"]:focus,
     837input[type="date"]:focus,
     838input[type="month"]:focus,
     839input[type="week"]:focus,
     840input[type="time"]:focus,
     841input[type="datetime"]:focus,
     842input[type="datetime-local"]:focus,
     843input[type="color"]:focus,
     844textarea:focus {
     845        border-color: currentColor;
     846}
     847
     848input[type="search"]:focus {
     849        outline: thin dotted;
     850        outline-offset: -4px;
     851}
     852
    829853/* Tables ------------------------------------ */
    830854
    … …  
    16801704}
    16811705
     1706/*
     1707 * Enable nav submenu expansion with tapping on arrows on large-viewport
     1708 * touch interfaces (e.g. tablets or laptops with touch screens).
     1709 * These rules are supported by all browsers (>IE11) and when JS is disabled.
     1710 */
     1711@media (any-pointer: coarse) {
     1712
     1713        .primary-menu > li.menu-item-has-children > a {
     1714                padding-left: 0;
     1715                margin-left: 2rem;
     1716        }
     1717
     1718        .primary-menu ul li.menu-item-has-children > a {
     1719                margin-left: 4.5rem;
     1720                padding-left: 0;
     1721                width: unset;
     1722        }
     1723
     1724}
     1725
     1726/* Repeat previous rules for IE11 (when JS enabled for polyfill). */
     1727body.touch-enabled .primary-menu > li.menu-item-has-children > a {
     1728        padding-left: 0;
     1729        margin-left: 2rem;
     1730}
     1731
     1732body.touch-enabled .primary-menu ul li.menu-item-has-children > a {
     1733        margin-left: 4.5rem;
     1734        padding-left: 0;
     1735        width: unset;
     1736}
     1737
    16821738/* -------------------------------------------------------------------------- */
    16831739
    … …  
    23172373.post-meta-wrapper {
    23182374        margin-top: 2rem;
     2375        margin-left: auto;
     2376        margin-right: auto;
     2377        max-width: 58rem;
     2378        width: calc(100% - 4rem);
    23192379}
    23202380
    … …  
    24772537.author-bio {
    24782538        margin-top: 4rem;
     2539        margin-left: auto;
     2540        margin-right: auto;
     2541        max-width: 58rem;
     2542        width: calc(100% - 4rem);
    24792543}
    24802544
    … …  
    26862750}
    26872751
     2752.entry-content .has-normal-font-size,
    26882753.entry-content .has-regular-font-size {
    26892754        font-size: 1em;
    … …  
    27162781}
    27172782
    2718 .wp-block-archives,
    2719 .wp-block-categories,
     2783.wp-block-archives:not(.alignwide):not(.alignfull),
     2784.wp-block-categories:not(.alignwide):not(.alignfull),
    27202785.wp-block-code,
    2721 .wp-block-columns,
    2722 .wp-block-cover,
    2723 .wp-block-embed,
    2724 .wp-block-gallery,
    2725 .wp-block-group,
    2726 .wp-block-latest-comments,
    2727 .wp-block-latest-posts,
    2728 .wp-block-media-text,
     2786.wp-block-columns:not(.alignwide):not(.alignfull),
     2787.wp-block-cover:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter),
     2788.wp-block-embed:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter),
     2789.wp-block-gallery:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter),
     2790.wp-block-group:not(.has-background):not(.alignwide):not(.alignfull),
     2791.wp-block-image:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter),
     2792.wp-block-latest-comments:not(.aligncenter):not(.alignleft):not(.alignright),
     2793.wp-block-latest-posts:not(.aligncenter):not(.alignleft):not(.alignright),
     2794.wp-block-media-text:not(.alignwide):not(.alignfull),
    27292795.wp-block-preformatted,
    2730 .wp-block-pullquote,
     2796.wp-block-pullquote:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright),
    27312797.wp-block-quote,
    27322798.wp-block-quote.is-large,
    27332799.wp-block-quote.is-style-large,
    27342800.wp-block-verse,
    2735 .wp-block-video {
     2801.wp-block-video:not(.alignwide):not(.alignfull) {
    27362802        margin-bottom: 3rem;
    27372803        margin-top: 3rem;
    … …  
    28652931/* Block: Columns ---------------------------- */
    28662932
     2933.wp-block-columns.alignfull,
     2934.alignfull:not(.has-background) .wp-block-columns {
     2935        padding-right: 2rem;
     2936        padding-left: 2rem;
     2937}
     2938
    28672939.wp-block-column {
    28682940        margin-bottom: 3.2rem;
    … …  
    29443016/* Block: Gallery ---------------------------- */
    29453017
    2946 ul.wp-block-gallery:not(.alignwide):not(.alignfull):not(.alignright):not(.alignleft) {
    2947         margin-right: 0;
    2948 }
    2949 
    29503018.wp-block-gallery ul {
    29513019        list-style: none;
    … …  
    29903058.entry-content .wp-block-group p {
    29913059        max-width: 100%;
     3060}
     3061
     3062.alignfull:not(.has-background) > .wp-block-group__inner-container > p:not(.has-background-color) {
     3063        padding-right: 2rem;
     3064        padding-left: 2rem;
    29923065}
    29933066
    … …  
    31403213        max-width: calc(100vw - 4rem);
    31413214        position: relative;
    3142         right: calc(50% - 50vw + 2rem);
    3143         width: calc(100vw - 4rem);
     3215        width: 100%;
    31443216}
    31453217
    … …  
    31763248}
    31773249
    3178 .wp-block-table.is-style-stripes {
     3250figure.wp-block-table.is-style-stripes {
    31793251        border-bottom: none;
     3252}
     3253
     3254.wp-block-table.is-style-stripes table {
     3255        border-collapse: inherit;
    31803256}
    31813257
    … …  
    32033279        border: none;
    32043280        padding: 0;
     3281        margin-right: auto;
     3282        margin-left: auto;
    32053283}
    32063284
    … …  
    32253303/* Block: Widget Latest Comments ------------- */
    32263304
    3227 .entry-content .wp-block-latest-comments,
    32283305.entry-content .wp-block-latest-comments li {
    3229         margin-right: 0;
     3306        margin: 2rem 0;
    32303307}
    32313308
    … …  
    32923369.entry-content {
    32933370        line-height: 1.5;
    3294         max-width: 58rem;
     3371}
     3372
     3373.entry-content > * {
     3374        margin-right: auto;
     3375        margin-left: auto;
     3376        margin-bottom: 1.25em;
    32953377}
    32963378
    … …  
    33193401.entry-content h5,
    33203402.entry-content h6 {
    3321         margin: 3.5rem 0 2rem;
     3403        margin: 3.5rem auto 2rem;
    33223404}
    33233405
    … …  
    33303412
    33313413.entry-content hr {
    3332         margin: 4rem 0;
     3414        margin: 4rem auto;
    33333415}
    33343416
    … …  
    33623444/* Alignment Classes ------------------------- */
    33633445
     3446.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {
     3447        max-width: 58rem;
     3448        width: calc(100% - 4rem);
     3449}
     3450
     3451[class*="__inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {
     3452        max-width: 58rem;
     3453        width: 100%;
     3454}
     3455
    33643456.alignnone,
    33653457.aligncenter,
    33663458.alignleft,
    3367 .alignright {
    3368         margin: 3rem 0;
     3459.alignright,
     3460.alignwide {
     3461        margin-top: 4rem;
     3462        margin-left: auto;
     3463        margin-bottom: 4rem;
     3464        margin-right: auto;
     3465}
     3466
     3467[class*="__inner-container"] > *:not(.alignwide):not(.alignfull) {
     3468        margin-right: auto;
     3469        margin-left: auto;
     3470}
     3471
     3472/* Full */
     3473
     3474.alignfull {
     3475        margin-top: 5rem;
     3476        margin-left: auto;
     3477        margin-bottom: 5rem;
     3478        margin-right: auto;
     3479        max-width: 100vw;
     3480        position: relative;
     3481        width: 100%;
     3482}
     3483
     3484[class*="__inner-container"] > .alignfull {
    33693485        max-width: 100%;
    33703486}
     3487
     3488/* Wide */
     3489
     3490.alignwide {
     3491        max-width: 120rem;
     3492        position: relative;
     3493        width: calc(100% - 4rem);
     3494}
     3495
     3496[class*="__inner-container"] > .alignwide {
     3497        width: 100%;
     3498}
     3499
     3500/* Center */
    33713501
    33723502.aligncenter,
    … …  
    33763506}
    33773507
     3508/* Left and right */
     3509
    33783510.alignleft,
    33793511.alignright {
    … …  
    33833515.alignleft {
    33843516        float: left;
    3385         margin: 0.3rem 0 2rem 2rem;
     3517        margin: 0.3rem 2rem 2rem 2rem;
    33863518}
    33873519
    33883520.alignright {
    33893521        float: right;
    3390         margin: 0.3rem 2rem 2rem 0;
    3391 }
    3392 
    3393 .alignwide {
    3394         margin: 4rem auto;
    3395         max-width: 120rem;
    3396 }
    3397 
    3398 .entry-content > .alignwide {
    3399         max-width: calc(100vw - 4rem);
    3400         position: relative;
    3401         right: calc(50% - 50vw + 2rem);
    3402         width: calc(100vw - 4rem);
    3403 }
    3404 
    3405 .alignfull {
    3406         margin: 5rem 0;
    3407 }
    3408 
    3409 .entry-content > .alignfull {
    3410         max-width: 100vw;
    3411         position: relative;
    3412         right: calc(50% - 50vw);
    3413         width: 100vw;
    3414 }
    3415 
     3522        margin: 0.3rem 2rem 2rem 2rem;
     3523}
    34163524
    34173525/* Entry Media ------------------------------- */
    … …  
    34213529        margin-right: auto;
    34223530        margin-left: auto;
    3423         max-width: 120rem;
     3531        max-width: 58rem;
    34243532        width: calc(100% - 4rem);
    34253533}
    … …  
    43504458}
    43514459
    4352 @media ( max-width: 599px ) {
    4353 
    4354         /* Blocks -------------------------------- */
    4355 
    4356         /* BLOCK: COLUMNS */
    4357 
    4358         .alignfull:not(.has-background) .wp-block-column > p:not(.has-background-color),
    4359         .alignfull:not(.has-background) .wp-block-group__inner-container > p:not(.has-background-color) {
    4360                 max-width: calc(100% - 4rem);
    4361                 margin: auto;
    4362         }
    4363 }
    4364 
    4365 @media ( min-width: 600px ) and ( max-width: 781px ) {
    4366 
    4367         /* Blocks -------------------------------- */
    4368 
    4369         /* BLOCK: COLUMNS */
    4370 
    4371         .alignfull:not(.has-background) .wp-block-column:nth-child(odd) > p:not(.has-background-color),
    4372         .alignfull:not(.has-background) .wp-block-group__inner-container > p:not(.has-background-color) {
    4373                 padding-right: 2rem;
    4374         }
    4375 
    4376         .alignfull:not(.has-background) .wp-block-column:nth-child(even) > p:not(.has-background-color),
    4377         .alignfull:not(.has-background) .wp-block-group__inner-container > p:not(.has-background-color) {
    4378                 padding-left: 2rem;
    4379         }
    4380 }
    4381 
    43824460@media ( min-width: 660px ) {
    43834461
    … …  
    44004478        .entry-content > .alignleft,
    44014479        .entry-content > p .alignleft,
    4402         .entry-content > .wp-block-image .alignleft {
     4480        .entry-content > .wp-block-image .alignleft,
     4481        [class*="wp-block"].alignwide [class*="__inner-container"] > .alignleft,
     4482        [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignleft,
     4483        [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignleft,
     4484        [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft,
     4485        [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft,
     4486        [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignleft {
    44034487                margin-left: calc(( 100vw - 58rem - 8rem ) / -2);
     4488        }
     4489
     4490        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > .alignleft,
     4491        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > p .alignleft,
     4492        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > .wp-block-image .alignleft {
     4493                margin-left: 0;
    44044494        }
    44054495
    44064496        .entry-content > .alignright,
    44074497        .entry-content > p .alignright,
    4408         .entry-content > .wp-block-image .alignright {
     4498        .entry-content > .wp-block-image .alignright,
     4499        [class*="wp-block"].alignwide [class*="__inner-container"] > .alignright,
     4500        [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignright,
     4501        [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignright,
     4502        [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright,
     4503        [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright,
     4504        [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignright {
    44094505                margin-right: calc(( 100vw - 58rem - 8rem ) / -2);
     4506        }
     4507
     4508        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > .alignright,
     4509        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > p .alignright,
     4510        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > .wp-block-image .alignright {
     4511                margin-right: 0;
    44104512        }
    44114513
    … …  
    44264528
    44274529        hr {
    4428                 margin: 8rem 0;
     4530                margin: 8rem auto;
    44294531        }
    44304532
    … …  
    44754577        h3,
    44764578        .heading-size-3 {
    4477                 margin: 6rem 0 3rem;
     4579                margin: 6rem auto 3rem;
    44784580        }
    44794581
    … …  
    44844586        h6,
    44854587        .heading-size-6 {
    4486                 margin: 4.5rem 0 2.5rem;
     4588                margin: 4.5rem auto 2.5rem;
    44874589        }
    44884590
    … …  
    48514953        /* BLOCK: BASE MARGINS */
    48524954
    4853         .wp-block-archives,
    4854         .wp-block-categories,
     4955        .wp-block-archives:not(.alignwide):not(.alignfull),
     4956        .wp-block-categories:not(.alignwide):not(.alignfull),
    48554957        .wp-block-code,
    4856         .wp-block-columns,
    4857         .wp-block-cover,
    4858         .wp-block-embed,
    4859         .wp-block-gallery,
    4860         .wp-block-group,
    4861         .wp-block-latest-comments,
    4862         .wp-block-latest-posts,
    4863         .wp-block-media-text,
     4958        .wp-block-columns:not(.alignwide):not(.alignfull),
     4959        .wp-block-cover:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter),
     4960        .wp-block-embed:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter),
     4961        .wp-block-gallery:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter),
     4962        .wp-block-group:not(.has-background):not(.alignwide):not(.alignfull),
     4963        .wp-block-image:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter),
     4964        .wp-block-latest-comments:not(.aligncenter):not(.alignleft):not(.alignright),
     4965        .wp-block-latest-posts:not(.aligncenter):not(.alignleft):not(.alignright),
     4966        .wp-block-media-text:not(.alignwide):not(.alignfull),
    48644967        .wp-block-preformatted,
    4865         .wp-block-pullquote,
     4968        .wp-block-pullquote:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright),
    48664969        .wp-block-quote,
    48674970        .wp-block-quote.is-large,
    48684971        .wp-block-quote.is-style-large,
    48694972        .wp-block-verse,
    4870         .wp-block-video {
    4871                 margin-bottom: 5rem;
    4872                 margin-top: 5rem;
     4973        .wp-block-video:not(.alignwide):not(.alignfull) {
     4974                margin-bottom: 4rem;
     4975                margin-top: 4rem;
    48734976        }
    48744977
    … …  
    49845087
    49855088        hr.wp-block-separator {
    4986                 margin: 6rem 0;
     5089                margin: 6rem auto;
    49875090        }
    49885091
    49895092        .wp-block-separator.is-style-wide {
    49905093                max-width: calc(100vw - 8rem);
    4991                 right: calc(50% - 50vw + 4rem);
    4992                 width: calc(100vw - 8rem);
    49935094        }
    49945095
    … …  
    50075108        .entry-content h2,
    50085109        .entry-content h3 {
    5009                 margin: 6rem 0 3rem;
     5110                margin: 6rem auto 3rem;
    50105111        }
    50115112
    … …  
    50135114        .entry-content h5,
    50145115        .entry-content h6 {
    5015                 margin: 4.5rem 0 2.5rem;
    5016         }
    5017 
    5018         /* ALIGNMENT CLASSES */
     5116                margin: 4.5rem auto 2.5rem;
     5117        }
    50195118
    50205119        .alignnone,
    … …  
    50325131        }
    50335132
    5034         .alignwide,
    5035         .alignfull {
     5133        .entry-content > .alignwide,
     5134        .entry-content > .alignfull {
    50365135                margin-bottom: 6rem;
    50375136                margin-top: 6rem;
    … …  
    50405139        .entry-content > .alignwide {
    50415140                max-width: calc(100vw - 8rem);
    5042                 right: calc(50% - 50vw + 4rem);
    50435141                width: calc(100vw - 8rem);
    50445142        }
    … …  
    52805378        }
    52815379
    5282         .alignfull .wp-block-column:first-child > p,
    5283         .alignfull:not(.has-background) .wp-block-group__inner-container > p:not(.has-background-color) {
    5284                 padding-right: 2rem;
    5285         }
    5286 
    5287         .alignfull:not(.has-background) .wp-block-column:last-child > p,
    5288         .alignfull:not(.has-background) .wp-block-group__inner-container > p:not(.has-background-color) {
    5289                 padding-left: 2rem;
     5380        .wp-block-columns.alignwide + .wp-block-columns.alignwide,
     5381        .wp-block-columns.alignfull + .wp-block-columns.alignfull {
     5382                margin-top: -2.8rem;
    52905383        }
    52915384}
    … …  
    55135606        .wp-block-columns.alignwide + .wp-block-columns.alignwide,
    55145607        .wp-block-columns.alignfull + .wp-block-columns.alignfull {
    5515                 margin-top: -5.2rem;
     5608                margin-top: -4.8rem;
    55165609        }
    55175610
    … …  
    55265619        /* BLOCK: GROUP */
    55275620
    5528         .wp-block-group.alignwide.has-background,
    5529         .wp-block-group.alignfull.has-background {
     5621        .entry-content > .wp-block-group.alignwide.has-background,
     5622        .entry-content > .wp-block-group.alignfull.has-background {
    55305623                padding: 8rem 4rem;
    55315624        }
    … …  
    55345627
    55355628        hr.wp-block-separator {
    5536                 margin: 8rem 0;
     5629                margin: 8rem auto;
    55375630        }
    55385631
    … …  
    55415634        /* ALIGNMENT CLASSES */
    55425635
    5543         .alignwide,
    5544         .alignfull {
     5636        .entry-content > .alignleft,
     5637        .entry-content > p .alignleft,
     5638        .entry-content > .wp-block-image .alignleft {
     5639                position: absolute;
     5640                left: calc((100vw - 58rem) / 2 + 58rem);
     5641                max-width: calc((100% - 58rem) / 2 - 4rem);
     5642        }
     5643
     5644        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > .alignleft,
     5645        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > p .alignleft,
     5646        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > .wp-block-image .alignleft {
     5647                position: relative;
     5648                left: inherit;
     5649                max-width: inherit;
     5650        }
     5651
     5652        [class*="wp-block"].alignwide [class*="__inner-container"] > .alignleft,
     5653        [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignleft,
     5654        [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignleft,
     5655        [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft,
     5656        [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft,
     5657        [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignleft {
     5658                position: absolute;
     5659                left: calc((100% - 58rem) / 2 + 58rem);
     5660                max-width: calc((100% - 58rem) / 2 - 4rem);
     5661        }
     5662
     5663        .entry-content > .alignright,
     5664        .entry-content > p .alignright,
     5665        .entry-content > .wp-block-image .alignright,
     5666        [class*="__inner-container"] > .alignright {
     5667                position: absolute;
     5668                right: calc((100vw - 58rem) / 2 + 58rem);
     5669                max-width: calc((100% - 58rem) / 2 - 4rem);
     5670        }
     5671
     5672        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > .alignright,
     5673        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > p .alignright,
     5674        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > .wp-block-image .alignright {
     5675                position: relative;
     5676                right: inherit;
     5677                max-width: inherit;
     5678        }
     5679
     5680        [class*="wp-block"].alignwide [class*="__inner-container"] > .alignright,
     5681        [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignright,
     5682        [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignright,
     5683        [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright,
     5684        [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright,
     5685        [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignright {
     5686                position: absolute;
     5687                right: calc((100% - 58rem) / 2 + 58rem);
     5688                max-width: calc((100% - 58rem) / 2 - 4rem);
     5689        }
     5690
     5691        .entry-content > .alignwide,
     5692        .entry-content > .alignfull {
    55455693                margin-bottom: 8rem;
    55465694                margin-top: 8rem;
    … …  
    56915839        /* BLOCK: GROUP */
    56925840
    5693         .wp-block-group.alignwide.has-background,
    5694         .wp-block-group.alignfull.has-background {
     5841        .entry-content > .wp-block-group.alignwide.has-background,
     5842        .entry-content > .wp-block-group.alignfull.has-background {
    56955843                padding: 8rem 6rem;
    56965844        }
    … …  
    57125860        /* ALIGNMENT CLASSES */
    57135861
    5714         .alignfull {
     5862        .entry-content > .alignfull {
    57155863                margin-bottom: 10rem;
    57165864                margin-top: 10rem;
    … …  
    58065954        .wp-block-separator.is-style-wide {
    58075955                max-width: 120rem;
    5808                 right: calc(50% - 60rem);
    58095956                width: 120rem;
    58105957        }
    … …  
    58285975        .entry-content > .alignwide {
    58295976                max-width: 120rem;
    5830                 right: calc(50% - 60rem);
    58315977                width: 120rem;
     5978        }
     5979
     5980        [class*="__inner-container"] > .alignwide {
     5981                max-width: 120rem;
     5982                width: 100%;
    58325983        }
    58335984

  • branches/5.3/src/wp-content/themes/twentytwenty/style.css

    r46699 r46712  
    181181        width: 1px;
    182182        word-wrap: normal !important;
     183        word-break: normal;
    183184}
    184185
    … …  
    833834}
    834835
     836input[type="text"]:focus,
     837input[type="email"]:focus,
     838input[type="url"]:focus,
     839input[type="password"]:focus,
     840input[type="number"]:focus,
     841input[type="tel"]:focus,
     842input[type="range"]:focus,
     843input[type="date"]:focus,
     844input[type="month"]:focus,
     845input[type="week"]:focus,
     846input[type="time"]:focus,
     847input[type="datetime"]:focus,
     848input[type="datetime-local"]:focus,
     849input[type="color"]:focus,
     850textarea:focus {
     851        border-color: currentColor;
     852}
     853
     854input[type="search"]:focus {
     855        outline: thin dotted;
     856        outline-offset: -4px;
     857}
     858
    835859/* Tables ------------------------------------ */
    836860
    … …  
    16881712}
    16891713
     1714/*
     1715 * Enable nav submenu expansion with tapping on arrows on large-viewport
     1716 * touch interfaces (e.g. tablets or laptops with touch screens).
     1717 * These rules are supported by all browsers (>IE11) and when JS is disabled.
     1718 */
     1719@media (any-pointer: coarse) {
     1720
     1721        .primary-menu > li.menu-item-has-children > a {
     1722                padding-right: 0;
     1723                margin-right: 2rem;
     1724        }
     1725
     1726        .primary-menu ul li.menu-item-has-children > a {
     1727                margin-right: 4.5rem;
     1728                padding-right: 0;
     1729                width: unset;
     1730        }
     1731
     1732}
     1733
     1734/* Repeat previous rules for IE11 (when JS enabled for polyfill). */
     1735body.touch-enabled .primary-menu > li.menu-item-has-children > a {
     1736        padding-right: 0;
     1737        margin-right: 2rem;
     1738}
     1739
     1740body.touch-enabled .primary-menu ul li.menu-item-has-children > a {
     1741        margin-right: 4.5rem;
     1742        padding-right: 0;
     1743        width: unset;
     1744}
     1745
    16901746/* -------------------------------------------------------------------------- */
    16911747
    … …  
    23292385.post-meta-wrapper {
    23302386        margin-top: 2rem;
     2387        margin-right: auto;
     2388        margin-left: auto;
     2389        max-width: 58rem;
     2390        width: calc(100% - 4rem);
    23312391}
    23322392
    … …  
    24892549.author-bio {
    24902550        margin-top: 4rem;
     2551        margin-right: auto;
     2552        margin-left: auto;
     2553        max-width: 58rem;
     2554        width: calc(100% - 4rem);
    24912555}
    24922556
    … …  
    27002764}
    27012765
     2766.entry-content .has-normal-font-size,
    27022767.entry-content .has-regular-font-size {
    27032768        font-size: 1em;
    … …  
    27302795}
    27312796
    2732 .wp-block-archives,
    2733 .wp-block-categories,
     2797.wp-block-archives:not(.alignwide):not(.alignfull),
     2798.wp-block-categories:not(.alignwide):not(.alignfull),
    27342799.wp-block-code,
    2735 .wp-block-columns,
    2736 .wp-block-cover,
    2737 .wp-block-embed,
    2738 .wp-block-gallery,
    2739 .wp-block-group,
    2740 .wp-block-latest-comments,
    2741 .wp-block-latest-posts,
    2742 .wp-block-media-text,
     2800.wp-block-columns:not(.alignwide):not(.alignfull),
     2801.wp-block-cover:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter),
     2802.wp-block-embed:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter),
     2803.wp-block-gallery:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter),
     2804.wp-block-group:not(.has-background):not(.alignwide):not(.alignfull),
     2805.wp-block-image:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter),
     2806.wp-block-latest-comments:not(.aligncenter):not(.alignleft):not(.alignright),
     2807.wp-block-latest-posts:not(.aligncenter):not(.alignleft):not(.alignright),
     2808.wp-block-media-text:not(.alignwide):not(.alignfull),
    27432809.wp-block-preformatted,
    2744 .wp-block-pullquote,
     2810.wp-block-pullquote:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright),
    27452811.wp-block-quote,
    27462812.wp-block-quote.is-large,
    27472813.wp-block-quote.is-style-large,
    27482814.wp-block-verse,
    2749 .wp-block-video {
     2815.wp-block-video:not(.alignwide):not(.alignfull) {
    27502816        margin-bottom: 3rem;
    27512817        margin-top: 3rem;
    … …  
    28792945/* Block: Columns ---------------------------- */
    28802946
     2947.wp-block-columns.alignfull,
     2948.alignfull:not(.has-background) .wp-block-columns {
     2949        padding-left: 2rem;
     2950        padding-right: 2rem;
     2951}
     2952
    28812953.wp-block-column {
    28822954        margin-bottom: 3.2rem;
    … …  
    29583030/* Block: Gallery ---------------------------- */
    29593031
    2960 ul.wp-block-gallery:not(.alignwide):not(.alignfull):not(.alignright):not(.alignleft) {
    2961         margin-left: 0;
    2962 }
    2963 
    29643032.wp-block-gallery ul {
    29653033        list-style: none;
    … …  
    30043072.entry-content .wp-block-group p {
    30053073        max-width: 100%;
     3074}
     3075
     3076.alignfull:not(.has-background) > .wp-block-group__inner-container > p:not(.has-background-color) {
     3077        padding-left: 2rem;
     3078        padding-right: 2rem;
    30063079}
    30073080
    … …  
    31543227        max-width: calc(100vw - 4rem);
    31553228        position: relative;
    3156         left: calc(50% - 50vw + 2rem);
    3157         width: calc(100vw - 4rem);
     3229        width: 100%;
    31583230}
    31593231
    … …  
    31903262}
    31913263
    3192 .wp-block-table.is-style-stripes {
     3264figure.wp-block-table.is-style-stripes {
    31933265        border-bottom: none;
     3266}
     3267
     3268.wp-block-table.is-style-stripes table {
     3269        border-collapse: inherit;
    31943270}
    31953271
    … …  
    32213297        border: none;
    32223298        padding: 0;
     3299        margin-left: auto;
     3300        margin-right: auto;
    32233301}
    32243302
    … …  
    32433321/* Block: Widget Latest Comments ------------- */
    32443322
    3245 .entry-content .wp-block-latest-comments,
    32463323.entry-content .wp-block-latest-comments li {
    3247         margin-left: 0;
     3324        margin: 2rem 0;
    32483325}
    32493326
    … …  
    33103387.entry-content {
    33113388        line-height: 1.5;
    3312         max-width: 58rem;
     3389}
     3390
     3391.entry-content > * {
     3392        margin-left: auto;
     3393        margin-right: auto;
     3394        margin-bottom: 1.25em;
    33133395}
    33143396
    … …  
    33373419.entry-content h5,
    33383420.entry-content h6 {
    3339         margin: 3.5rem 0 2rem;
     3421        margin: 3.5rem auto 2rem;
    33403422}
    33413423
    … …  
    33483430
    33493431.entry-content hr {
    3350         margin: 4rem 0;
     3432        margin: 4rem auto;
    33513433}
    33523434
    … …  
    33803462/* Alignment Classes ------------------------- */
    33813463
     3464.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {
     3465        max-width: 58rem;
     3466        width: calc(100% - 4rem);
     3467}
     3468
     3469[class*="__inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {
     3470        max-width: 58rem;
     3471        width: 100%;
     3472}
     3473
    33823474.alignnone,
    33833475.aligncenter,
    33843476.alignleft,
    3385 .alignright {
    3386         margin: 3rem 0;
     3477.alignright,
     3478.alignwide {
     3479        margin-top: 4rem;
     3480        margin-right: auto;
     3481        margin-bottom: 4rem;
     3482        margin-left: auto;
     3483}
     3484
     3485[class*="__inner-container"] > *:not(.alignwide):not(.alignfull) {
     3486        margin-left: auto;
     3487        margin-right: auto;
     3488}
     3489
     3490/* Full */
     3491
     3492.alignfull {
     3493        margin-top: 5rem;
     3494        margin-right: auto;
     3495        margin-bottom: 5rem;
     3496        margin-left: auto;
     3497        max-width: 100vw;
     3498        position: relative;
     3499        width: 100%;
     3500}
     3501
     3502[class*="__inner-container"] > .alignfull {
    33873503        max-width: 100%;
    33883504}
     3505
     3506/* Wide */
     3507
     3508.alignwide {
     3509        max-width: 120rem;
     3510        position: relative;
     3511        width: calc(100% - 4rem);
     3512}
     3513
     3514[class*="__inner-container"] > .alignwide {
     3515        width: 100%;
     3516}
     3517
     3518/* Center */
    33893519
    33903520.aligncenter,
    … …  
    33943524}
    33953525
     3526/* Left and right */
     3527
    33963528.alignleft,
    33973529.alignright {
    … …  
    34033535        /*rtl:ignore*/
    34043536        float: left;
    3405         margin: 0.3rem 2rem 2rem 0;
     3537        margin: 0.3rem 2rem 2rem 2rem;
    34063538}
    34073539
    … …  
    34103542        /*rtl:ignore*/
    34113543        float: right;
    3412         margin: 0.3rem 0 2rem 2rem;
    3413 }
    3414 
    3415 .alignwide {
    3416         margin: 4rem auto;
    3417         max-width: 120rem;
    3418 }
    3419 
    3420 .entry-content > .alignwide {
    3421         max-width: calc(100vw - 4rem);
    3422         position: relative;
    3423         left: calc(50% - 50vw + 2rem);
    3424         width: calc(100vw - 4rem);
    3425 }
    3426 
    3427 .alignfull {
    3428         margin: 5rem 0;
    3429 }
    3430 
    3431 .entry-content > .alignfull {
    3432         max-width: 100vw;
    3433         position: relative;
    3434         left: calc(50% - 50vw);
    3435         width: 100vw;
    3436 }
    3437 
     3544        margin: 0.3rem 2rem 2rem 2rem;
     3545}
    34383546
    34393547/* Entry Media ------------------------------- */
    … …  
    34433551        margin-left: auto;
    34443552        margin-right: auto;
    3445         max-width: 120rem;
     3553        max-width: 58rem;
    34463554        width: calc(100% - 4rem);
    34473555}
    … …  
    43724480}
    43734481
    4374 @media ( max-width: 599px ) {
    4375 
    4376         /* Blocks -------------------------------- */
    4377 
    4378         /* BLOCK: COLUMNS */
    4379 
    4380         .alignfull:not(.has-background) .wp-block-column > p:not(.has-background-color),
    4381         .alignfull:not(.has-background) .wp-block-group__inner-container > p:not(.has-background-color) {
    4382                 max-width: calc(100% - 4rem);
    4383                 margin: auto;
    4384         }
    4385 }
    4386 
    4387 @media ( min-width: 600px ) and ( max-width: 781px ) {
    4388 
    4389         /* Blocks -------------------------------- */
    4390 
    4391         /* BLOCK: COLUMNS */
    4392 
    4393         .alignfull:not(.has-background) .wp-block-column:nth-child(odd) > p:not(.has-background-color),
    4394         .alignfull:not(.has-background) .wp-block-group__inner-container > p:not(.has-background-color) {
    4395                 padding-left: 2rem;
    4396         }
    4397 
    4398         .alignfull:not(.has-background) .wp-block-column:nth-child(even) > p:not(.has-background-color),
    4399         .alignfull:not(.has-background) .wp-block-group__inner-container > p:not(.has-background-color) {
    4400                 padding-right: 2rem;
    4401         }
    4402 }
    4403 
    44044482@media ( min-width: 660px ) {
    44054483
    … …  
    44264504        .entry-content > .alignleft,
    44274505        .entry-content > p .alignleft,
    4428         .entry-content > .wp-block-image .alignleft {
     4506        .entry-content > .wp-block-image .alignleft,
     4507        [class*="wp-block"].alignwide [class*="__inner-container"] > .alignleft,
     4508        [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignleft,
     4509        [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignleft,
     4510        [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft,
     4511        [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft,
     4512        [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignleft {
    44294513
    44304514                /*rtl:ignore*/
    … …  
    44324516        }
    44334517
     4518        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > .alignleft,
     4519        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > p .alignleft,
     4520        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > .wp-block-image .alignleft {
     4521
     4522                /*rtl:ignore*/
     4523                margin-left: 0;
     4524        }
     4525
    44344526        .entry-content > .alignright,
    44354527        .entry-content > p .alignright,
    4436         .entry-content > .wp-block-image .alignright {
     4528        .entry-content > .wp-block-image .alignright,
     4529        [class*="wp-block"].alignwide [class*="__inner-container"] > .alignright,
     4530        [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignright,
     4531        [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignright,
     4532        [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright,
     4533        [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright,
     4534        [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignright {
    44374535
    44384536                /*rtl:ignore*/
    44394537                margin-right: calc(( 100vw - 58rem - 8rem ) / -2);
     4538        }
     4539
     4540        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > .alignright,
     4541        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > p .alignright,
     4542        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > .wp-block-image .alignright {
     4543
     4544                /*rtl:ignore*/
     4545                margin-right: 0;
    44404546        }
    44414547
    … …  
    44564562
    44574563        hr {
    4458                 margin: 8rem 0;
     4564                margin: 8rem auto;
    44594565        }
    44604566
    … …  
    45054611        h3,
    45064612        .heading-size-3 {
    4507                 margin: 6rem 0 3rem;
     4613                margin: 6rem auto 3rem;
    45084614        }
    45094615
    … …  
    45144620        h6,
    45154621        .heading-size-6 {
    4516                 margin: 4.5rem 0 2.5rem;
     4622                margin: 4.5rem auto 2.5rem;
    45174623        }
    45184624
    … …  
    48814987        /* BLOCK: BASE MARGINS */
    48824988
    4883         .wp-block-archives,
    4884         .wp-block-categories,
     4989        .wp-block-archives:not(.alignwide):not(.alignfull),
     4990        .wp-block-categories:not(.alignwide):not(.alignfull),
    48854991        .wp-block-code,
    4886         .wp-block-columns,
    4887         .wp-block-cover,
    4888         .wp-block-embed,
    4889         .wp-block-gallery,
    4890         .wp-block-group,
    4891         .wp-block-latest-comments,
    4892         .wp-block-latest-posts,
    4893         .wp-block-media-text,
     4992        .wp-block-columns:not(.alignwide):not(.alignfull),
     4993        .wp-block-cover:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter),
     4994        .wp-block-embed:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter),
     4995        .wp-block-gallery:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter),
     4996        .wp-block-group:not(.has-background):not(.alignwide):not(.alignfull),
     4997        .wp-block-image:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter),
     4998        .wp-block-latest-comments:not(.aligncenter):not(.alignleft):not(.alignright),
     4999        .wp-block-latest-posts:not(.aligncenter):not(.alignleft):not(.alignright),
     5000        .wp-block-media-text:not(.alignwide):not(.alignfull),
    48945001        .wp-block-preformatted,
    4895         .wp-block-pullquote,
     5002        .wp-block-pullquote:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright),
    48965003        .wp-block-quote,
    48975004        .wp-block-quote.is-large,
    48985005        .wp-block-quote.is-style-large,
    48995006        .wp-block-verse,
    4900         .wp-block-video {
    4901                 margin-bottom: 5rem;
    4902                 margin-top: 5rem;
     5007        .wp-block-video:not(.alignwide):not(.alignfull) {
     5008                margin-bottom: 4rem;
     5009                margin-top: 4rem;
    49035010        }
    49045011
    … …  
    50145121
    50155122        hr.wp-block-separator {
    5016                 margin: 6rem 0;
     5123                margin: 6rem auto;
    50175124        }
    50185125
    50195126        .wp-block-separator.is-style-wide {
    50205127                max-width: calc(100vw - 8rem);
    5021                 left: calc(50% - 50vw + 4rem);
    5022                 width: calc(100vw - 8rem);
    50235128        }
    50245129
    … …  
    50375142        .entry-content h2,
    50385143        .entry-content h3 {
    5039                 margin: 6rem 0 3rem;
     5144                margin: 6rem auto 3rem;
    50405145        }
    50415146
    … …  
    50435148        .entry-content h5,
    50445149        .entry-content h6 {
    5045                 margin: 4.5rem 0 2.5rem;
    5046         }
    5047 
    5048         /* ALIGNMENT CLASSES */
     5150                margin: 4.5rem auto 2.5rem;
     5151        }
    50495152
    50505153        .alignnone,
    … …  
    50665169        }
    50675170
    5068         .alignwide,
    5069         .alignfull {
     5171        .entry-content > .alignwide,
     5172        .entry-content > .alignfull {
    50705173                margin-bottom: 6rem;
    50715174                margin-top: 6rem;
    … …  
    50745177        .entry-content > .alignwide {
    50755178                max-width: calc(100vw - 8rem);
    5076                 left: calc(50% - 50vw + 4rem);
    50775179                width: calc(100vw - 8rem);
    50785180        }
    … …  
    53145416        }
    53155417
    5316         .alignfull .wp-block-column:first-child > p,
    5317         .alignfull:not(.has-background) .wp-block-group__inner-container > p:not(.has-background-color) {
    5318                 padding-left: 2rem;
    5319         }
    5320 
    5321         .alignfull:not(.has-background) .wp-block-column:last-child > p,
    5322         .alignfull:not(.has-background) .wp-block-group__inner-container > p:not(.has-background-color) {
    5323                 padding-right: 2rem;
     5418        .wp-block-columns.alignwide + .wp-block-columns.alignwide,
     5419        .wp-block-columns.alignfull + .wp-block-columns.alignfull {
     5420                margin-top: -2.8rem;
    53245421        }
    53255422}
    … …  
    55475644        .wp-block-columns.alignwide + .wp-block-columns.alignwide,
    55485645        .wp-block-columns.alignfull + .wp-block-columns.alignfull {
    5549                 margin-top: -5.2rem;
     5646                margin-top: -4.8rem;
    55505647        }
    55515648
    … …  
    55605657        /* BLOCK: GROUP */
    55615658
    5562         .wp-block-group.alignwide.has-background,
    5563         .wp-block-group.alignfull.has-background {
     5659        .entry-content > .wp-block-group.alignwide.has-background,
     5660        .entry-content > .wp-block-group.alignfull.has-background {
    55645661                padding: 8rem 4rem;
    55655662        }
    … …  
    55685665
    55695666        hr.wp-block-separator {
    5570                 margin: 8rem 0;
     5667                margin: 8rem auto;
    55715668        }
    55725669
    … …  
    55755672        /* ALIGNMENT CLASSES */
    55765673
    5577         .alignwide,
    5578         .alignfull {
     5674        .entry-content > .alignleft,
     5675        .entry-content > p .alignleft,
     5676        .entry-content > .wp-block-image .alignleft {
     5677                position: absolute;
     5678                right: calc((100vw - 58rem) / 2 + 58rem);
     5679                max-width: calc((100% - 58rem) / 2 - 4rem);
     5680        }
     5681
     5682        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > .alignleft,
     5683        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > p .alignleft,
     5684        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > .wp-block-image .alignleft {
     5685                position: relative;
     5686                right: inherit;
     5687                max-width: inherit;
     5688        }
     5689
     5690        [class*="wp-block"].alignwide [class*="__inner-container"] > .alignleft,
     5691        [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignleft,
     5692        [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignleft,
     5693        [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft,
     5694        [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft,
     5695        [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignleft {
     5696                position: absolute;
     5697                right: calc((100% - 58rem) / 2 + 58rem);
     5698                max-width: calc((100% - 58rem) / 2 - 4rem);
     5699        }
     5700
     5701        .entry-content > .alignright,
     5702        .entry-content > p .alignright,
     5703        .entry-content > .wp-block-image .alignright,
     5704        [class*="__inner-container"] > .alignright {
     5705                position: absolute;
     5706                left: calc((100vw - 58rem) / 2 + 58rem);
     5707                max-width: calc((100% - 58rem) / 2 - 4rem);
     5708        }
     5709
     5710        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > .alignright,
     5711        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > p .alignright,
     5712        [class*="wp-block"]:not(.alignwide):not(.alignfull) [class*="__inner-container"] > .wp-block-image .alignright {
     5713                position: relative;
     5714                left: inherit;
     5715                max-width: inherit;
     5716        }
     5717
     5718        [class*="wp-block"].alignwide [class*="__inner-container"] > .alignright,
     5719        [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignright,
     5720        [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignright,
     5721        [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright,
     5722        [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright,
     5723        [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignright {
     5724                position: absolute;
     5725                left: calc((100% - 58rem) / 2 + 58rem);
     5726                max-width: calc((100% - 58rem) / 2 - 4rem);
     5727        }
     5728
     5729        .entry-content > .alignwide,
     5730        .entry-content > .alignfull {
    55795731                margin-bottom: 8rem;
    55805732                margin-top: 8rem;
    … …  
    57255877        /* BLOCK: GROUP */
    57265878
    5727         .wp-block-group.alignwide.has-background,
    5728         .wp-block-group.alignfull.has-background {
     5879        .entry-content > .wp-block-group.alignwide.has-background,
     5880        .entry-content > .wp-block-group.alignfull.has-background {
    57295881                padding: 8rem 6rem;
    57305882        }
    … …  
    57465898        /* ALIGNMENT CLASSES */
    57475899
    5748         .alignfull {
     5900        .entry-content > .alignfull {
    57495901                margin-bottom: 10rem;
    57505902                margin-top: 10rem;
    … …  
    58445996        .wp-block-separator.is-style-wide {
    58455997                max-width: 120rem;
    5846                 left: calc(50% - 60rem);
    58475998                width: 120rem;
    58485999        }
    … …  
    58706021        .entry-content > .alignwide {
    58716022                max-width: 120rem;
    5872                 left: calc(50% - 60rem);
    58736023                width: 120rem;
     6024        }
     6025
     6026        [class*="__inner-container"] > .alignwide {
     6027                max-width: 120rem;
     6028                width: 100%;
    58746029        }
    58756030

  • branches/5.3/src/wp-content/themes/twentytwenty/template-parts/content.php

    r46614 r46712  
    2626        ?>
    2727
    28         <div class="post-inner section-inner <?php echo is_page_template( 'templates/template-full-width.php' ) ? '' : 'thin'; ?> ">
     28        <div class="post-inner <?php echo is_page_template( 'templates/template-full-width.php' ) ? '' : 'thin'; ?> ">
    2929
    3030                <div class="entry-content">
    … …  
    4040                </div><!-- .entry-content -->
    4141
     42        </div><!-- .post-inner -->
     43
     44        <div class="section-inner">
    4245                <?php
    4346                wp_link_pages(
    … …  
    6265                ?>
    6366
    64         </div><!-- .post-inner -->
     67        </div><!-- .section-inner -->
    6568
    6669        <?php
Note: See TracChangeset for help on using the changeset viewer.