Make WordPress Core

Changeset 43842


Ignore:
Timestamp:
10/30/2018 02:13:07 AM (8 years ago)
Author:
allancole
Message:

Importing Twenty Nineteen, our new default theme for 2019, set for 5.0.

Let Gutenberg shine with this simple, fast, and powerful theme. Initial development occurred on GitHub. See: ​https://github.com/WordPress/twentynineteen

Props allancole, karmatosed, kjellr, yingling017, mrasharirfan, milana_cap, fabiankaegy, westonruter, aaronjorbin, netweb, b-07, khleomix, blowery, dereksmart, jasmussen, audrasjb, nielslange, mmaumio, dimadin, joyously, anevins12, peterwilsoncc, dannycooper, icaleb, siriokun, technosiren, travel_girl, azchughtai, ianbelanger, nadim1992, ismailelkorchi, nativeinside, chetan200891, icaleb, grapplerulrich, ocean90, joshfeck, frankew, abdulwahab610, mendezcode, eliorivero, melchoyce, joen, laurelfulford, mdawaffe, kraftbj, dsmart.

Location:
branches/5.0/src/wp-content/themes/twentynineteen
Files:
12 added
4 deleted
50 edited

Legend:

Unmodified
Added
Removed
  • branches/5.0/src/wp-content/themes/twentynineteen/404.php

    r43808 r43842  
    77 * @package WordPress
    88 * @subpackage Twenty_Nineteen
     9 * @since 1.0.0
    910 */
    1011
    … …  
    1213?>
    1314
    14         <div id="primary" class="content-area">
     15        <section id="primary" class="content-area">
    1516                <main id="main" class="site-main">
    1617
    17                         <section class="error-404 not-found">
     18                        <div class="error-404 not-found">
    1819                                <header class="page-header">
    1920                                        <h1 class="page-title"><?php _e( 'Oops! That page can&rsquo;t be found.', 'twentynineteen' ); ?></h1>
    … …  
    2223                                <div class="page-content">
    2324                                        <p><?php _e( 'It looks like nothing was found at this location. Maybe try a search?', 'twentynineteen' ); ?></p>
    24 
    2525                                        <?php get_search_form(); ?>
    2626                                </div><!-- .page-content -->
    27                         </section><!-- .error-404 -->
     27                        </div><!-- .error-404 -->
    2828
    2929                </main><!-- #main -->
    30         </div><!-- #primary -->
     30        </section><!-- #primary -->
    3131
    3232<?php
  • branches/5.0/src/wp-content/themes/twentynineteen/archive.php

    r43808 r43842  
    77 * @package WordPress
    88 * @subpackage Twenty_Nineteen
     9 * @since 1.0.0
    910 */
    1011
    … …  
    1213?>
    1314
    14         <div id="primary" class="content-area">
     15        <section id="primary" class="content-area">
    1516                <main id="main" class="site-main">
    1617
    … …  
    2021                                <?php
    2122                                        the_archive_title( '<h1 class="page-title">', '</h1>' );
    22                                         the_archive_description( '<div class="page-description">', '</div>' );
     23                                        // Remove for now @TODO
     24                                        // the_archive_description( '<div class="page-description">', '</div>' );
    2325                                ?>
    2426                        </header><!-- .page-header -->
    … …  
    3436                                 * called content-___.php (where ___ is the Post Format name) and that will be used instead.
    3537                                 */
    36                                 get_template_part( 'template-parts/content/content' );
     38                                get_template_part( 'template-parts/content/content', 'excerpt' );
    3739
    3840                                // End the loop.
    … …  
    5052
    5153                </main><!-- .site-main -->
    52         </div><!-- .content-area -->
     54        </section><!-- .content-area -->
    5355
    5456<?php
  • branches/5.0/src/wp-content/themes/twentynineteen/classes/class-twentynineteen-svg-icons.php

    r43808 r43842  
    55 * @package WordPress
    66 * @subpackage Twenty_Nineteen
     7 * @since 1.0.0
    78 */
    89
    … …  
    3334                }
    3435                if ( array_key_exists( $icon, $arr ) ) {
    35                         $repl = sprintf( '<svg id="%s-icon-%s" class="svg-icon" width="%d" height="%d" aria-hidden="true" role="img" ', $group, $icon, $size, $size );
     36                        $repl = sprintf( '<svg class="svg-icon" width="%d" height="%d" aria-hidden="true" role="img" focusable="false" ', $size, $size );
    3637                        $svg  = preg_replace( '/^<svg /', $repl, trim( $arr[ $icon ] ) ); // Add extra attributes to SVG code.
    3738                        $svg  = preg_replace( "/([\n\t]+)/", ' ', $svg ); // Remove newlines & tabs.
    … …  
    7172         */
    7273        static $ui_icons = array(
    73                 'link'          => /* material-design – link */ '
    74 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
     74                'link'                   => /* material-design – link */ '
     75<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
    7576    <path d="M0 0h24v24H0z" fill="none"/>
    7677    <path d="M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z"/>
    7778</svg>',
    7879
    79                 'watch'         => /* material-design – watch-later */ '
    80 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
     80                'watch'                  => /* material-design – watch-later */ '
     81<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
    8182    <defs>
    8283        <path id="a" d="M0 0h24v24H0V0z"/>
    … …  
    8889</svg>',
    8990
    90                 'archive'       => /* material-design – folder */ '
    91 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
     91                'archive'                => /* material-design – folder */ '
     92<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
    9293    <path d="M10 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z"/>
    9394    <path d="M0 0h24v24H0z" fill="none"/>
    9495</svg>',
    9596
    96                 'tag' => /* material-design – local_offer */ '
    97 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
     97                'tag'                    => /* material-design – local_offer */ '
     98<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
    9899        <path d="M21.41 11.58l-9-9C12.05 2.22 11.55 2 11 2H4c-1.1 0-2 .9-2 2v7c0 .55.22 1.05.59 1.42l9 9c.36.36.86.58 1.41.58.55 0 1.05-.22 1.41-.59l7-7c.37-.36.59-.86.59-1.41 0-.55-.23-1.06-.59-1.42zM5.5 7C4.67 7 4 6.33 4 5.5S4.67 4 5.5 4 7 4.67 7 5.5 6.33 7 5.5 7z"/>
    99100        <path d="M0 0h24v24H0z" fill="none"/>
    100101</svg>',
    101102
    102                 'comment' => /* material-design – comment */ '
     103                'comment'                => /* material-design – comment */ '
    103104<svg viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    104105    <path d="M21.99 4c0-1.1-.89-2-1.99-2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h14l4 4-.01-18z"/>
    … …  
    106107</svg>',
    107108
    108                 'person'        => /* material-design – person */ '
     109                'person'                 => /* material-design – person */ '
    109110<svg viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    110111    <path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/>
    … …  
    112113</svg>',
    113114
    114                 'edit'          => /* material-design – edit */ '
     115                'edit'                   => /* material-design – edit */ '
    115116<svg viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    116117    <path d="M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"/>
    … …  
    118119</svg>',
    119120
    120                 'chevron_left'  => /* material-design – chevron_left */ '
     121                'chevron_left'           => /* material-design – chevron_left */ '
    121122<svg viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    122123    <path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"/>
    … …  
    124125</svg>',
    125126
    126                 'chevron_right' => /* material-design – chevron_right */ '
    127 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
     127                'chevron_right'          => /* material-design – chevron_right */ '
     128<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
    128129    <path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"/>
    129130    <path d="M0 0h24v24H0z" fill="none"/>
    130131</svg>',
    131132
    132                 'check'         => /* material-design – check */ '
    133 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
     133                'check'                  => /* material-design – check */ '
     134<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
    134135    <path d="M0 0h24v24H0z" fill="none"/>
    135136    <path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/>
    … …  
    137138
    138139                'arrow_drop_down_circle' => /* material-design – arrow_drop_down_circle */ '
    139 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
     140<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
    140141        <path d="M0 0h24v24H0z" fill="none"/>
    141142        <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 12l-4-4h8l-4 4z"/>
    142143</svg>',
    143144
    144                 'keyboard_arrow_down' => /* material-design – keyboard_arrow_down */ '
    145 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
     145                'keyboard_arrow_down'    => /* material-design – keyboard_arrow_down */ '
     146<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
    146147        <path d="M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z"/>
    147148        <path fill="none" d="M0 0h24v24H0V0z"/>
    148149</svg>',
    149150
    150                 'keyboard_arrow_right' => /* material-design – keyboard_arrow_right */ '
    151 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
     151                'keyboard_arrow_right'   => /* material-design – keyboard_arrow_right */ '
     152<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
    152153        <path d="M10 17l5-5-5-5v10z"/>
    153154        <path fill="none" d="M0 24V0h24v24H0z"/>
     155</svg>',
     156
     157                'keyboard_arrow_left'   => /* material-design – keyboard_arrow_left */ '
     158<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
     159        <path d="M14 7l-5 5 5 5V7z"/>
     160        <path fill="none" d="M24 0v24H0V0h24z"/>
    154161</svg>',
    155162
  • branches/5.0/src/wp-content/themes/twentynineteen/classes/class-twentynineteen-walker-comment.php

    r43808 r43842  
    55 * @package WordPress
    66 * @subpackage Twenty_Nineteen
     7 * @since 1.0.0
    78 */
    89
    … …  
    5556                                                        /* translators: %s: comment author link */
    5657                                                        printf(
    57                                                                 __( '%s <span class="screen-reader-text says">says:</span>' ),
     58                                                                __( '%s <span class="screen-reader-text says">says:</span>', 'twentynineteen' ),
    5859                                                                sprintf( '<b class="fn">%s</b>', get_comment_author_link( $comment ) )
    5960                                                        );
    … …  
    7071                                                <?php
    7172                                                        $edit_comment_icon = twentynineteen_get_icon_svg( 'edit', 16 );
    72                                                         edit_comment_link( __( 'Edit' ), '<span class="edit-link-sep">&mdash;</span> <span class="edit-link">' . $edit_comment_icon, '</span>' );
     73                                                        edit_comment_link( __( 'Edit', 'twentynineteen' ), '<span class="edit-link-sep">&mdash;</span> <span class="edit-link">' . $edit_comment_icon, '</span>' );
    7374                                                ?>
    7475                                        </div><!-- .comment-metadata -->
    7576
    7677                                        <?php if ( '0' == $comment->comment_approved ) : ?>
    77                                         <p class="comment-awaiting-moderation"><?php _e( 'Your comment is awaiting moderation.' ); ?></p>
     78                                        <p class="comment-awaiting-moderation"><?php _e( 'Your comment is awaiting moderation.', 'twentynineteen' ); ?></p>
    7879                                        <?php endif; ?>
    7980                                </footer><!-- .comment-meta -->
  • branches/5.0/src/wp-content/themes/twentynineteen/comments.php

    r43808 r43842  
    1010 * @package WordPress
    1111 * @subpackage Twenty_Nineteen
     12 * @since 1.0.0
    1213 */
    1314
    … …  
    2930                        if ( comments_open() ) {
    3031                                if ( have_comments() ) {
    31                                         echo esc_html_e( 'Join the Conversation', 'twentynineteen' );
     32                                        esc_html_e( 'Join the Conversation', 'twentynineteen' );
    3233                                } else {
    33                                         echo esc_html_e( 'Leave a comment', 'twentynineteen' );
     34                                        esc_html_e( 'Leave a comment', 'twentynineteen' );
    3435                                }
    3536                        } else {
    … …  
    8586                <?php
    8687
    87                 // Show comment form at bottom if showing newest comments at the bottom.
    88                 if ( comments_open() && 'asc' === strtolower( get_option( 'comment_order', 'asc' ) ) ) :
    89                         ?>
    90                         <div class="comment-form-flex">
    91                                 <span class="screen-reader-text"><?php esc_html_e( 'Leave a comment', 'twentynineteen' ); ?></span>
    92                                 <?php twentynineteen_comment_form( 'asc' ); ?>
    93                                 <h2 class="comments-title" aria-hidden="true"><?php esc_html_e( 'Leave a comment', 'twentynineteen' ); ?></h2>
    94                         </div>
    95                         <?php
    96                 endif;
    97 
    9888                // Show comment navigation
    9989                if ( have_comments() ) :
    … …  
    10797                                )
    10898                        );
     99                endif;
     100
     101                // Show comment form at bottom if showing newest comments at the bottom.
     102                if ( comments_open() && 'asc' === strtolower( get_option( 'comment_order', 'asc' ) ) ) :
     103                        ?>
     104                        <div class="comment-form-flex">
     105                                <span class="screen-reader-text"><?php esc_html_e( 'Leave a comment', 'twentynineteen' ); ?></span>
     106                                <?php twentynineteen_comment_form( 'asc' ); ?>
     107                                <h2 class="comments-title" aria-hidden="true"><?php esc_html_e( 'Leave a comment', 'twentynineteen' ); ?></h2>
     108                        </div>
     109                        <?php
    109110                endif;
    110111
  • branches/5.0/src/wp-content/themes/twentynineteen/footer.php

    r43808 r43842  
    99 * @package WordPress
    1010 * @subpackage Twenty_Nineteen
     11 * @since 1.0.0
    1112 */
    1213
    … …  
    1617
    1718        <footer id="colophon" class="site-footer">
     19                <?php get_template_part( 'template-parts/footer/footer', 'widgets' ); ?>
    1820                <div class="site-info">
    19                         <a class="site-name" href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a>,
     21                        <?php if ( ! empty( get_bloginfo( 'name' ) ) ) : ?>
     22                                <a class="site-name" href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a>,
     23                        <?php endif; ?>
    2024                        <a href="<?php echo esc_url( __( 'https://wordpress.org/', 'twentynineteen' ) ); ?>" class="imprint">
    2125                                <?php printf( __( 'Proudly powered by %s', 'twentynineteen' ), 'WordPress' ); ?>.
  • branches/5.0/src/wp-content/themes/twentynineteen/functions.php

    r43808 r43842  
    77 * @package WordPress
    88 * @subpackage Twenty_Nineteen
     9 * @since 1.0.0
    910 */
    1011
    … …  
    6869                );
    6970
    70                 // Set up the WordPress core custom background feature.
    71                 add_theme_support(
    72                         'custom-background',
    73                         apply_filters(
    74                                 'twentynineteen_custom_background_args',
    75                                 array(
    76                                         'default-color' => 'ffffff',
    77                                         'default-image' => '',
    78                                 )
    79                         )
    80                 );
    81 
    8271                /**
    8372                 * Add support for core custom logo.
    … …  
    10796                add_editor_style( 'style-editor.css' );
    10897
     98                // Add custom color to the editor color palette
     99                add_theme_support(
     100                'editor-color-palette',
     101                        array(
     102                                array(
     103                                        'name'  => esc_html__( 'Primary Color', 'twentynineteen' ),
     104                                        'slug'  => 'primary',
     105                                        'color' => twentynineteen_hsl_hex( absint( get_theme_mod( 'colorscheme_hue', 199 ) ), 100, 33 ),
     106                                ),
     107                        )
     108                );
     109
    109110        }
    110111endif;
    111112add_action( 'after_setup_theme', 'twentynineteen_setup' );
     113
     114/**
     115 * Register widget area.
     116 *
     117 * @link https://developer.wordpress.org/themes/functionality/sidebars/#registering-a-sidebar
     118 */
     119function twentynineteen_widgets_init() {
     120
     121        register_sidebar(
     122                array(
     123                        'name'          => __( 'Footer 1', 'twentynineteen' ),
     124                        'id'            => 'sidebar-1',
     125                        'description'   => __( 'Add widgets here to appear in your footer.', 'twentynineteen' ),
     126                        'before_widget' => '<section id="%1$s" class="widget %2$s">',
     127                        'after_widget'  => '</section>',
     128                        'before_title'  => '<h2 class="widget-title">',
     129                        'after_title'   => '</h2>',
     130                )
     131        );
     132
     133}
     134add_action( 'widgets_init', 'twentynineteen_widgets_init' );
    112135
    113136/**
    … …  
    136159        wp_enqueue_script( 'twentynineteen-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array(), '20151215', true );
    137160
     161        if ( has_nav_menu( 'menu-1' ) ) {
     162                wp_enqueue_script( 'twentynineteen-touch-navigation', get_theme_file_uri( '/js/touch-navigation.js' ), array(), '1.0', true );
     163                $twentynineteen_l10n['expand']   = __( 'Expand child menu', 'twentynineteen' );
     164                $twentynineteen_l10n['collapse'] = __( 'Collapse child menu', 'twentynineteen' );
     165        }
     166
     167        wp_localize_script( 'twentynineteen-skip-link-focus-fix', 'twentynineteenScreenReaderText', $twentynineteen_l10n );
     168
    138169        wp_enqueue_style( 'twentynineteen-print-style', get_template_directory_uri() . '/print.css', array(), wp_get_theme()->get( 'Version' ), 'print' );
    139170
    … …  
    152183 */
    153184function twentynineteen_editor_frame_styles() {
     185
     186        // Include color patterns
     187        require_once( get_parent_theme_file_path( '/inc/color-patterns.php' ) );
     188
    154189        wp_enqueue_style( 'twentynineteen-editor-frame-styles', get_theme_file_uri( '/style-editor-frame.css' ), false, '1.0', 'all' );
    155 }
    156 
     190        wp_add_inline_style( 'twentynineteen-editor-frame-styles', twentynineteen_custom_colors_css() );
     191}
    157192add_action( 'enqueue_block_editor_assets', 'twentynineteen_editor_frame_styles' );
    158193
    159194/**
     195 * Display custom color CSS in customizer and on frontend.
     196 */
     197function twentynineteen_colors_css_wrap() {
     198        if ( 'custom' !== get_theme_mod( 'colorscheme' ) && ! is_customize_preview() ) {
     199                return;
     200        }
     201
     202        require_once( get_parent_theme_file_path( '/inc/color-patterns.php' ) );
     203        $hue = absint( get_theme_mod( 'colorscheme_hue', 250 ) );
     204        ?>
     205
     206        <style type="text/css" id="custom-theme-colors" <?php echo is_customize_preview() ? 'data-hue="' . $hue . '"' : ''; ?>>
     207                <?php echo twentynineteen_custom_colors_css(); ?>
     208        </style>
     209<?php
     210}
     211add_action( 'wp_head', 'twentynineteen_colors_css_wrap' );
     212
     213/**
    160214 * SVG Icons class.
    161215 */
  • branches/5.0/src/wp-content/themes/twentynineteen/header.php

    r43808 r43842  
    99 * @package WordPress
    1010 * @subpackage Twenty_Nineteen
     11 * @since 1.0.0
    1112 */
    1213?><!doctype html>
    … …  
    2425
    2526                <header id="masthead" class="<?php echo is_singular() && twentynineteen_can_show_post_thumbnail() ? 'site-header featured-image' : 'site-header'; ?>">
     27
    2628                        <div class="site-branding-container">
    2729                                <?php get_template_part( 'template-parts/header/site', 'branding' ); ?>
    … …  
    2931
    3032                        <?php if ( is_singular() && twentynineteen_can_show_post_thumbnail() ) : ?>
    31                                 <div class="hentry">
     33                                <div class="site-featured-image">
    3234                                        <?php the_post(); ?>
    33                                         <div class="entry-header">
    34                                                 <?php if ( ! is_page() ) : ?>
    35                                                 <?php $discussion = twentynineteen_can_show_post_thumbnail() ? twentynineteen_get_discussion_data() : null; ?>
    36                                                 <?php endif; ?>
    37                                                 <?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>
    38                                                 <?php if ( ! is_page() ) : ?>
    39                                                 <div class="<?php echo ( ! empty( $discussion ) && count( $discussion->authors ) > 0 ) ? 'entry-meta has-discussion' : 'entry-meta'; ?>">
    40                                                         <?php twentynineteen_posted_by(); ?>
    41                                                         <?php twentynineteen_posted_on(); ?>
    42                                                         <span class="comment-count">
    43                                                                 <?php
    44                                                                 if ( ! empty( $discussion ) ) {
    45                                                                 twentynineteen_discussion_avatars_list( $discussion->authors );}
    46                                                                 ?>
    47                                                                 <?php twentynineteen_comment_count(); ?>
    48                                                         </span>
    49                                                         <?php
    50                                                         // Edit post link.
    51                                                                 edit_post_link(
    52                                                                         sprintf(
    53                                                                                 wp_kses(
    54                                                                                         /* translators: %s: Name of current post. Only visible to screen readers. */
    55                                                                                         __( 'Edit <span class="screen-reader-text">%s</span>', 'twentynineteen' ),
    56                                                                                         array(
    57                                                                                                 'span' => array(
    58                                                                                                         'class' => array(),
    59                                                                                                 ),
    60                                                                                         )
    61                                                                                 ),
    62                                                                                 get_the_title()
    63                                                                         ),
    64                                                                         '<span class="edit-link">' . twentynineteen_get_icon_svg( 'edit', 16 ),
    65                                                                         '</span>'
    66                                                                 );
    67                                                         ?>
    68                                                 </div><!-- .meta-info -->
    69                                                 <?php endif; ?>
     35                                        <?php $discussion = ! is_page() && twentynineteen_can_show_post_thumbnail() ? twentynineteen_get_discussion_data() : null; ?>
     36                                        <div class="<?php echo ( ! empty( $discussion ) && count( $discussion->authors ) > 0 ) ? 'entry-header has-discussion' : 'entry-header'; ?>">
     37                                                <?php get_template_part( 'template-parts/header/entry', 'header' ); ?>
    7038                                        </div><!-- .entry-header -->
    7139                                        <?php rewind_posts(); ?>
  • branches/5.0/src/wp-content/themes/twentynineteen/inc/customizer.php

    r43808 r43842  
    55 * @package WordPress
    66 * @subpackage Twenty_Nineteen
     7 * @since 1.0.0
    78 */
    89
    … …  
    3334                );
    3435        }
     36
     37        /**
     38         * Custom colors.
     39         */
     40        $wp_customize->add_setting(
     41                'colorscheme',
     42                array(
     43                        'default'           => 'default',
     44                        'transport'         => 'postMessage',
     45                        'sanitize_callback' => 'twentynineteen_sanitize_color_option',
     46                )
     47        );
     48
     49        $wp_customize->add_control(
     50                'colorscheme',
     51                array(
     52                        'type'    => 'radio',
     53                        'label'    => __( 'Color Scheme', 'twentynineteen' ),
     54                        'choices'  => array(
     55                                'default'  => __( 'Default', 'twentynineteen' ),
     56                                'custom' => __( 'Custom', 'twentynineteen' ),
     57                        ),
     58                        'section'  => 'colors',
     59                        'priority' => 5,
     60                )
     61        );
     62
     63        // Add primary color setting and control.
     64        $wp_customize->add_setting(
     65                'colorscheme_hue',
     66                array(
     67                        'default'           => 199,
     68                        'transport'         => 'postMessage',
     69                        'sanitize_callback' => 'absint',
     70                )
     71        );
     72
     73        $wp_customize->add_control(
     74                new WP_Customize_Color_Control(
     75                        $wp_customize,
     76                        'colorscheme_hue',
     77                        array(
     78                                'label'       => __( 'Primary Color' ),
     79                                'description' => __( 'Changes the Color of the Featured Image overlay, Buttons, Links etc.' ),
     80                                'section'     => 'colors',
     81                                'mode'        => 'hue',
     82                        )
     83                )
     84        );
     85
     86        $wp_customize->add_setting(
     87                'image_filter',
     88                array(
     89                        'default'           => 'active',
     90                        'sanitize_callback' => 'twentynineteen_sanitize_image_filter',
     91                        'transport'         => 'postMessage',
     92                )
     93        );
     94
     95        $wp_customize->add_control(
     96                'image_filter',
     97                array(
     98                        'label'       => __( 'Featured Image Color Filter', 'twentynineteen' ),
     99                        'section'     => 'colors',
     100                        'type'        => 'radio',
     101                        'description' => __( "Twenty Nineteen adds a color filter to featured images using your site's primary color. If you disable this effect, the theme will use a black filter in individual posts to keep text readable when it appears on top of the featured image.", 'twentynineteen' ) . '<br/><span style="font-style: normal; display: block; margin-top: 16px;">' . __( 'On Featured Images, apply', 'twentynineteen' ) . '</span>',
     102                        'choices'     => array(
     103                                'active'   => __( 'A color filter', 'twentynineteen' ),
     104                                'inactive' => __( 'A black filter', 'twentynineteen' ),
     105                        ),
     106                )
     107        );
    35108}
    36109add_action( 'customize_register', 'twentynineteen_customize_register' );
    … …  
    55128
    56129/**
    57  * Binds JS handlers to make Theme Customizer preview reload changes asynchronously.
     130 * Bind JS handlers to instantly live-preview changes.
    58131 */
    59132function twentynineteen_customize_preview_js() {
    60         wp_enqueue_script( 'twentynineteen-customizer', get_template_directory_uri() . '/js/customizer.js', array( 'customize-preview' ), '20151215', true );
     133        wp_enqueue_script( 'twentynineteen-customize-preview', get_theme_file_uri( '/js/customize-preview.js' ), array( 'customize-preview' ), '20151215', true );
    61134}
    62135add_action( 'customize_preview_init', 'twentynineteen_customize_preview_js' );
     136
     137/**
     138 * Load dynamic logic for the customizer controls area.
     139 */
     140function twentynineteen_panels_js() {
     141        wp_enqueue_script( 'twentynineteen-customize-controls', get_theme_file_uri( '/js/customize-controls.js' ), array(), '1.0', true );
     142}
     143add_action( 'customize_controls_enqueue_scripts', 'twentynineteen_panels_js' );
     144
     145/**
     146 * Sanitize image filter choice.
     147 *
     148 * @param string $choice Whether image filter is active.
     149 *
     150 * @return string
     151 */
     152function twentynineteen_sanitize_color_option( $choice ) {
     153        $valid = array(
     154                'default',
     155                'custom',
     156        );
     157
     158        if ( in_array( $choice, $valid, true ) ) {
     159                return $choice;
     160        }
     161
     162        return 'default';
     163}
     164/**
     165 * Sanitize image filter choice.
     166 *
     167 * @param string $choice Whether image filter is active.
     168 *
     169 * @return string
     170 */
     171function twentynineteen_sanitize_image_filter( $choice ) {
     172        $valid = array(
     173                'active',
     174                'inactive',
     175        );
     176
     177        if ( in_array( $choice, $valid, true ) ) {
     178                return $choice;
     179        }
     180
     181        return 'active';
     182}
  • branches/5.0/src/wp-content/themes/twentynineteen/inc/icon-functions.php

    r43808 r43842  
    55 * @package WordPress
    66 * @subpackage Twenty_Nineteen
     7 * @since 1.0.0
    78 */
    89
  • branches/5.0/src/wp-content/themes/twentynineteen/inc/template-functions.php

    r43808 r43842  
    55 * @package WordPress
    66 * @subpackage Twenty_Nineteen
     7 * @since 1.0.0
    78 */
    89
    … …  
    3334
    3435/**
     36 * Adds custom class to the array of posts classes.
     37 */
     38function twentynineteen_post_classes( $classes, $class, $post_id ) {
     39        $classes[] = 'entry';
     40
     41        return $classes;
     42}
     43add_filter( 'post_class', 'twentynineteen_post_classes', 10, 3 );
     44
     45
     46/**
    3547 * Add a pingback url auto-discovery header for single posts, pages, or attachments.
    3648 */
    … …  
    6072function twentynineteen_get_the_archive_title() {
    6173        if ( is_category() ) {
    62                 $title = esc_html__( 'Category Archives:', 'twentynineteen' );
     74                $title = esc_html__( 'Category Archives: ', 'twentynineteen' ) . '<span class="page-description">' . single_term_title( '', false ) . '</span>';
    6375        } elseif ( is_tag() ) {
    64                 $title = esc_html__( 'Tag Archives:', 'twentynineteen' );
     76                $title = esc_html__( 'Tag Archives: ', 'twentynineteen' ) . '<span class="page-description">' . single_term_title( '', false ) . '</span>';
    6577        } elseif ( is_author() ) {
    66                 $title = esc_html__( 'Author Archives:', 'twentynineteen' );
     78                $title = esc_html__( 'Author Archives: ', 'twentynineteen' ) . '<span class="page-description">' . get_the_author_meta( 'display_name' ) . '</span>';
    6779        } elseif ( is_year() ) {
    68                 $title = esc_html__( 'Yearly Archives:', 'twentynineteen' );
     80                $title = esc_html__( 'Yearly Archives: ', 'twentynineteen' ) . '<span class="page-description">' . get_the_date( _x( 'Y', 'yearly archives date format', 'twentynineteen' ) ) . '</span>';
    6981        } elseif ( is_month() ) {
    70                 $title = esc_html__( 'Monthly Archives:', 'twentynineteen' );
     82                $title = esc_html__( 'Monthly Archives: ', 'twentynineteen' ) . '<span class="page-description">' . get_the_date( _x( 'F Y', 'monthly archives date format', 'twentynineteen' ) ) . '</span>';
    7183        } elseif ( is_day() ) {
    72                 $title = esc_html__( 'Daily Archives:', 'twentynineteen' );
     84                $title = esc_html__( 'Daily Archives: ', 'twentynineteen' ) . '<span class="page-description">' . get_the_date() . '</span>';
    7385        } elseif ( is_post_type_archive() ) {
    74                 $title = esc_html__( 'Post Type Archives:', 'twentynineteen' );
     86                $title = esc_html__( 'Post Type Archives: ', 'twentynineteen' ) . '<span class="page-description">' . post_type_archive_title( '', false ) . '</span>';
    7587        } elseif ( is_tax() ) {
    7688                $tax = get_taxonomy( get_queried_object()->taxonomy );
    77                 /* translators: 1: Taxonomy singular name */
    78                 $title = sprintf( __( '%s Archives: ' ), $tax->labels->singular_name );
     89                /* translators: %s: Taxonomy singular name */
     90                $title = sprintf( esc_html__( '%s Archives:', 'twentynineteen' ), $tax->labels->singular_name );
    7991        } else {
    8092                $title = esc_html__( 'Archives:', 'twentynineteen' );
    … …  
    8597
    8698/**
    87  * Filters the default archive descriptions.
    88  */
    89 function twentynineteen_get_the_archive_description() {
    90         if ( is_category() || is_tag() || is_tax() ) {
    91                 $description = single_term_title( '', false );
    92         } elseif ( is_author() ) {
    93                 $description = get_the_author_meta( 'display_name' );
    94         } elseif ( is_post_type_archive() ) {
    95                 $description = post_type_archive_title( '', false );
    96         } elseif ( is_year() ) {
    97                 $description = get_the_date( _x( 'Y', 'yearly archives date format', 'twentynineteen' ) );
    98         } elseif ( is_month() ) {
    99                 $description = get_the_date( _x( 'F Y', 'monthly archives date format', 'twentynineteen' ) );
    100         } elseif ( is_day() ) {
    101                 $description = get_the_date();
    102         } else {
    103                 $description = null;
    104         }
    105         return $description;
    106 }
    107 add_filter( 'get_the_archive_description', 'twentynineteen_get_the_archive_description' );
    108 
    109 /**
    11099 * Determines if post thumbnail can be displayed.
    111100 */
    112101function twentynineteen_can_show_post_thumbnail() {
    113         return ! post_password_required() && ! is_attachment() && has_post_thumbnail();
     102        return apply_filters( 'twentynineteen_can_show_post_thumbnail', ! post_password_required() && ! is_attachment() && has_post_thumbnail() );
    114103}
    115104
    … …  
    118107 */
    119108function twentynineteen_image_filters_enabled() {
     109        if ( 'inactive' === get_theme_mod( 'image_filter' ) ) {
     110                return false;
     111        }
    120112        return true;
    121113}
    … …  
    155147        $authors    = array();
    156148        $commenters = array();
    157         $user_id    = is_user_logged_in() ? get_current_user_id() : -1;
     149        $user_id    = -1; // is_user_logged_in() ? get_current_user_id() : -1;
    158150        $comments   = get_comments(
    159151                array(
    … …  
    205197
    206198/**
     199 * Add a dropdown icon to top-level menu items.
     200 *
     201 * @param string $output Nav menu item start element.
     202 * @param object $item   Nav menu item.
     203 * @param int    $depth  Depth.
     204 * @param object $args   Nav menu args.
     205 * @return string Nav menu item start element.
    207206 * Add a dropdown icon to top-level menu items
    208207 */
    … …  
    210209
    211210        // Only add class to 'top level' items on the 'primary' menu.
    212         if ( 'menu-1' == $args->theme_location && 0 === $depth ) {
    213 
    214                 if ( in_array( 'menu-item-has-children', $item->classes ) ) {
    215                         $output .= twentynineteen_get_icon_svg( 'arrow_drop_down_circle', 16 );
    216                 }
    217         } else if ( 'menu-1' == $args->theme_location && $depth >= 1 ) {
    218 
    219                 if ( in_array( 'menu-item-has-children', $item->classes ) ) {
    220                         $output .= twentynineteen_get_icon_svg( 'keyboard_arrow_right', 24 );
    221                 }
     211        if ( ! isset( $args->theme_location ) || 'menu-1' !== $args->theme_location ) {
     212                return $output;
     213        }
     214
     215        if ( in_array( 'mobile-parent-nav-menu-item', $item->classes, true ) && isset( $item->original_id ) ) {
     216                // Inject the keyboard_arrow_left SVG inside the parent nav menu item, and let the item link to the parent item.
     217                // @todo Only do this for nested submenus? If on a first-level submenu, then really the link could be "#" since the desire is to remove the target entirely.
     218                $link = sprintf(
     219                        '<a class="menu-item-link-return" id="%1$s" href="%2$s" onclick="%3$s" tabindex="-1">%4$s',
     220                        esc_attr( "menu-item-link-return-{$item->original_id}" ),
     221                        esc_attr( "#menu-item-link-{$item->original_id}" ),
     222                        esc_attr( 'event.preventDefault();' ),
     223                        twentynineteen_get_icon_svg( 'chevron_left', 24 )
     224                );
     225
     226                $output = preg_replace(
     227                        '/<a\s.*?>/',
     228                        $link,
     229                        $output,
     230                        1 // Limit.
     231                );
     232        } elseif ( in_array( 'menu-item-has-children', $item->classes, true ) ) {
     233                // Add an ID to the link element itself to facilitate navigation from submenu back to parent.
     234                $output = preg_replace( '/(?<=<a\s)/', sprintf( ' id="%s" ', esc_attr( "menu-item-link-{$item->ID}" ) ), $output );
     235
     236                // Add SVG icon to parent items.
     237                if ( 0 === $depth ) {
     238                        $icon = twentynineteen_get_icon_svg( 'keyboard_arrow_down', 24 );
     239                } else {
     240                        $icon = twentynineteen_get_icon_svg( 'chevron_right', 24 );
     241                }
     242
     243                // @todo We might as well just go back to using the SVG element if the link approach is not suitable for no-JS environments.
     244                $link = sprintf(
     245                        '<a class="mobile-submenu-expand" href="%s" onclick="%s" tabindex="-1">%s</a>',
     246                        esc_attr( "#menu-item-link-return-{$item->ID}" ),
     247                        esc_attr( 'event.preventDefault();' ),
     248                        $icon
     249                );
     250
     251                $output .= $link;
     252                $output .= "<span class='desktop-submenu-expand'>$icon</span>";
    222253        }
    223254
    … …  
    225256}
    226257add_filter( 'walker_nav_menu_start_el', 'twentynineteen_add_dropdown_icons', 10, 4 );
     258
     259/**
     260 * Create a nav menu item to be displayed on mobile to navigate from submenu back to the parent.
     261 *
     262 * This duplicates each parent nav menu item and makes it the first child of itself.
     263 *
     264 * @param array  $sorted_menu_items Sorted nav menu items.
     265 * @param object $args              Nav menu args.
     266 * @return array Amended nav menu items.
     267 */
     268function twentynineteen_add_mobile_parent_nav_menu_items( $sorted_menu_items, $args ) {
     269        static $pseudo_id = 0;
     270        if ( ! isset( $args->theme_location ) || 'menu-1' !== $args->theme_location ) {
     271                return $sorted_menu_items;
     272        }
     273
     274        $amended_menu_items = array();
     275        foreach ( $sorted_menu_items as $nav_menu_item ) {
     276                $amended_menu_items[] = $nav_menu_item;
     277                if ( in_array( 'menu-item-has-children', $nav_menu_item->classes, true ) ) {
     278                        $parent_menu_item                   = clone $nav_menu_item;
     279                        $parent_menu_item->original_id      = $nav_menu_item->ID;
     280                        $parent_menu_item->ID               = --$pseudo_id;
     281                        $parent_menu_item->db_id            = $parent_menu_item->ID;
     282                        $parent_menu_item->object_id        = $parent_menu_item->ID;
     283                        $parent_menu_item->classes          = array( 'mobile-parent-nav-menu-item' );
     284                        $parent_menu_item->menu_item_parent = $nav_menu_item->ID;
     285
     286                        $amended_menu_items[] = $parent_menu_item;
     287                }
     288        }
     289
     290        return $amended_menu_items;
     291}
     292add_filter( 'wp_nav_menu_objects', 'twentynineteen_add_mobile_parent_nav_menu_items', 10, 2 );
     293
     294/**
     295 * Convert HSL to HEX colors
     296 */
     297function twentynineteen_hsl_hex( $h, $s, $l, $to_hex = true ) {
     298
     299        $h /= 360;
     300        $s /= 100;
     301        $l /= 100;
     302
     303        $r = $l;
     304        $g = $l;
     305        $b = $l;
     306        $v = ( $l <= 0.5 ) ? ( $l * ( 1.0 + $s ) ) : ( $l + $s - $l * $s );
     307        if ( $v > 0 ) {
     308                $m;
     309                $sv;
     310                $sextant;
     311                $fract;
     312                $vsf;
     313                $mid1;
     314                $mid2;
     315
     316                $m = $l + $l - $v;
     317                $sv = ( $v - $m ) / $v;
     318                $h *= 6.0;
     319                $sextant = floor( $h );
     320                $fract = $h - $sextant;
     321                $vsf = $v * $sv * $fract;
     322                $mid1 = $m + $vsf;
     323                $mid2 = $v - $vsf;
     324
     325                switch ( $sextant ) {
     326                        case 0:
     327                                $r = $v;
     328                                $g = $mid1;
     329                                $b = $m;
     330                                break;
     331                        case 1:
     332                                $r = $mid2;
     333                                $g = $v;
     334                                $b = $m;
     335                                break;
     336                        case 2:
     337                                $r = $m;
     338                                $g = $v;
     339                                $b = $mid1;
     340                                break;
     341                        case 3:
     342                                $r = $m;
     343                                $g = $mid2;
     344                                $b = $v;
     345                                break;
     346                        case 4:
     347                                $r = $mid1;
     348                                $g = $m;
     349                                $b = $v;
     350                                break;
     351                        case 5:
     352                                $r = $v;
     353                                $g = $m;
     354                                $b = $mid2;
     355                                break;
     356                }
     357        }
     358        $r = round( $r * 255, 0 );
     359        $g = round( $g * 255, 0 );
     360        $b = round( $b * 255, 0 );
     361
     362        if ( $to_hex ) {
     363
     364                $r = ( $r < 15 ) ? '0' . dechex( $r ) : dechex( $r );
     365                $g = ( $g < 15 ) ? '0' . dechex( $g ) : dechex( $g );
     366                $b = ( $b < 15 ) ? '0' . dechex( $b ) : dechex( $b );
     367
     368                return "#$r$g$b";
     369
     370        } else {
     371
     372                return "rgb($r, $g, $b)";
     373        }
     374}
  • branches/5.0/src/wp-content/themes/twentynineteen/inc/template-tags.php

    r43808 r43842  
    55 * @package WordPress
    66 * @subpackage Twenty_Nineteen
     7 * @since 1.0.0
    78 */
    89
    … …  
    2627
    2728                printf(
    28                         '<span class="posted-on">%1$s<a href="%2$s" rel="bookmark">' . $time_string . '</a></span>',
     29                        '<span class="posted-on">%1$s<a href="%2$s" rel="bookmark">%3$s</a></span>',
    2930                        twentynineteen_get_icon_svg( 'watch', 16 ),
    3031                        esc_url( get_permalink() ),
    … …  
    7576                // Posted by
    7677                twentynineteen_posted_by();
     78
     79                // Posted on
     80                twentynineteen_posted_on();
    7781
    7882                // Hide category and tag text for pages.
    … …  
    186190         */
    187191        function twentynineteen_get_user_avatar_markup( $id_or_email = null ) {
     192
    188193                if ( ! isset( $id_or_email ) ) {
    189194                        $id_or_email = get_current_user_id();
    190195                }
    191 
    192                 $classes = array( 'comment-author', 'vcard' );
    193196
    194197                return sprintf( '<div class="comment-user-avatar comment-author vcard">%s</div>', get_avatar( $id_or_email, twentynineteen_get_avatar_size() ) );
    … …  
    219222        function twentynineteen_comment_form( $order ) {
    220223                if ( true === $order || strtolower( $order ) === strtolower( get_option( 'comment_order', 'asc' ) ) ) {
     224
    221225                        comment_form(
    222226                                array(
    223                                         'title_reply_before' => twentynineteen_get_user_avatar_markup(),
    224227                                        'logged_in_as'       => null,
    225228                                        'title_reply'        => null,
  • branches/5.0/src/wp-content/themes/twentynineteen/index.php

    r43808 r43842  
    1212 * @package WordPress
    1313 * @subpackage Twenty_Nineteen
     14 * @since 1.0.0
    1415 */
    1516
    … …  
    1718?>
    1819
    19         <div id="primary" class="content-area">
     20        <section id="primary" class="content-area">
    2021                <main id="main" class="site-main">
    2122
    … …  
    4041?>
    4142                </main><!-- .site-main -->
    42         </div><!-- .content-area -->
     43        </section><!-- .content-area -->
    4344
    4445<?php
  • branches/5.0/src/wp-content/themes/twentynineteen/page.php

    r43808 r43842  
    77 * @package WordPress
    88 * @subpackage Twenty_Nineteen
     9 * @since 1.0.0
    910 */
    1011
    … …  
    1213?>
    1314
    14         <div id="primary" class="content-area">
     15        <section id="primary" class="content-area">
    1516                <main id="main" class="site-main">
    1617
    … …  
    3233
    3334                </main><!-- #main -->
    34         </div><!-- #primary -->
     35        </section><!-- #primary -->
    3536
    3637<?php
  • branches/5.0/src/wp-content/themes/twentynineteen/print.css

    r43808 r43842  
    2020    margin: 2cm;
    2121  }
    22   .hentry .entry-header, .site-footer .site-info {
     22  .entry .entry-header, .site-footer .site-info {
    2323    margin: 0;
    2424  }
    … …  
    9797  .social-navigation,
    9898  .site-branding-container:before,
    99   .hentry .entry-title:before,
     99  .entry .entry-title:before,
    100100  .entry-meta, .entry-footer,
    101101  .author-description:before,
  • branches/5.0/src/wp-content/themes/twentynineteen/print.scss

    r43808 r43842  
    2424  }
    2525
    26   .hentry .entry-header, .site-footer .site-info {
     26  .entry .entry-header, .site-footer .site-info {
    2727    margin: 0;
    2828  }
    … …  
    120120  .social-navigation,
    121121  .site-branding-container:before,
    122   .hentry .entry-title:before,
     122  .entry .entry-title:before,
    123123  .entry-meta, .entry-footer,
    124124  .author-description:before,
  • branches/5.0/src/wp-content/themes/twentynineteen/readme.txt

    r43808 r43842  
    24245. Navigate to Appearance > Customize in your admin panel and customize to taste.
    2525
    26  
     26
    2727## Copyright
    2828
    2929Twenty Nineteen WordPress Theme, Copyright 2018 WordPress.org
    30 Twenty Nineteen is distributed under the terms of the GNU GPL
     30Twenty Nineteen is distributed under the terms of the GNU GPL.
    3131
    3232This program is free software: you can redistribute it and/or modify
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/blocks/_blocks.scss

    r43808 r43842  
    4242
    4343                @include media(tablet) {
    44                         margin-left: calc(1 * (100vw / 12));
    45                         margin-right: calc(1 * (100vw / 12));
    46                         max-width: calc(10 * (100vw / 12));
     44                        margin-left: calc(2 * (100vw / 12));
     45                        margin-right: calc(2 * (100vw / 12));
     46                        max-width: calc(8 * (100vw / 12));
    4747                }
    4848        }
    … …  
    8282                        margin-left: calc(2 * #{$size__spacing-unit});
    8383                        margin-right: calc(2 * (100vw / 12));
     84                }
     85        }
     86        &.aligncenter {
     87
     88                margin-left: auto;
     89                margin-right: auto;
     90
     91                @include media(desktop) {
     92                        margin-left: calc(2 * (100vw / 12));
     93                        margin-right: calc(2 * (100vw / 12));
     94                        max-width: calc(10 * (100vw / 12));
     95                        position: relative;
     96                        left: 25%;
     97                        transform: translate(-50%);
    8498                }
    8599        }
    … …  
    132146                        box-sizing: border-box;
    133147                        font-weight: bold;
    134                         padding: ($size__spacing-unit * .66) $size__spacing-unit;
     148                        text-decoration: none;
     149                        padding: ($size__spacing-unit * .76) $size__spacing-unit;
    135150                        outline: none;
    136151                        color: white;
    … …  
    161176                        @include button-all-transition;
    162177                        background: transparent;
    163                         border: 2px solid $color__background-button;
    164 
    165                         &:not(.has-text-color) {
    166                                 color: $color__background-button;
    167                         }
     178                        border: 2px solid currentColor;
     179                        color: $color__background-button;
    168180                }
    169181
    170182                &.is-style-outline .wp-block-button__link:hover {
    171                         border-color: $color__background-button-hover;
    172183                        color: $color__background-button-hover;
    173184                }
    … …  
    187198                        font-weight: bold;
    188199                        line-height: $font__line-height-heading;
    189 
    190                         a:after {
    191                                 color: $color__text-light;
    192                                 content: ",";
    193                         }
    194 
    195                         &:last-child a:after {
    196                                 color: $color__text-light;
    197                                 content: ".";
     200                       
     201                        &:not(.menu-item-has-children) {
     202                                padding-bottom: ( .75 * $size__spacing-unit );
     203                        }
     204
     205                        a {
     206                                text-decoration: none;
     207                        }
     208                       
     209                        ul {
     210                                padding-left: $size__spacing-unit;
    198211                        }
    199212                }
    … …  
    234247        }
    235248
    236         // !Paragraphs
     249        //! Paragraphs
    237250        .has-drop-cap {
    238251                &:not(:focus):first-letter {
    … …  
    245258        }
    246259
    247         // !Pullquote
     260        //! Pullquote
    248261        .wp-block-pullquote {
    249262                border: none;
    … …  
    251264
    252265                blockquote {
     266                        color: $color__text-main;
    253267                        border: none;
    254268                        padding-bottom: calc(2 * #{$size__spacing-unit});
    … …  
    262276                        margin-bottom: 0.5em;
    263277                        margin-top: 0.5em;
    264                         color: $color__text-main;
    265278
    266279                        em {
    … …  
    279292                        line-height: 1.6;
    280293                        text-transform: none;
    281                         color: $color__text-light;
    282294                }
    283295
    … …  
    296308                &.is-style-solid-color {
    297309
     310                        background-color: $color__link;
     311
    298312                        p {
    299313                                font-size: $font__size-lg;
    … …  
    307321                        }
    308322
     323                        a {
     324                                color: $color__background-body;
     325                        }
     326
    309327                        blockquote {
     328                                color: $color__background-body;
    310329                                margin: 0 auto;
    311330                        }
    312331
    313                         blockquote:not(.has-text-color) p,
    314                         cite {
    315                                 color: white;
    316                         }
    317 
    318                         &:not(.has-background-color) {
     332                        .has-primary-background-color {
    319333                                background-color: $color__link;
    320334                        }
    … …  
    406420
    407421        //! Cover Image
    408         .wp-block-cover-image {
     422        .wp-block-cover-image,
     423        .wp-block-cover {
    409424
    410425                .wp-block-cover-image-text,
     426                .wp-block-cover-text,
    411427                h2 {
    412428                        font-family: $font__heading;
    … …  
    433449                &.aligncenter {
    434450                        h2,
    435                         .wp-block-cover-image-text {
     451                        .wp-block-cover-image-text,
     452                        .wp-block-cover-text {
    436453                                width: 100%;
    437454                                z-index: 1;
    … …  
    447464
    448465                        h2,
    449                         .wp-block-cover-image-text {
     466                        .wp-block-cover-image-text,
     467                        .wp-block-cover-text {
    450468                                padding: $size__spacing-unit;
    451469                        }
    … …  
    456474
    457475                        h2,
    458                         .wp-block-cover-image-text {
     476                        .wp-block-cover-image-text,
     477                        .wp-block-cover-text {
    459478                                padding: $size__spacing-unit;
    460479                        }
    … …  
    629648                }
    630649        }
     650
     651        //! Custom colors
     652        .has-primary-background-color {
     653                background-color: $color__link;
     654
     655                p,
     656                h1,
     657                h2,
     658                h3,
     659                h4,
     660                h5,
     661                h6,
     662                a {
     663                        color: $color__background-body;
     664                }
     665        }
    631666}
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/elements/_elements.scss

    r43808 r43842  
    3737
    3838a:focus {
    39         outline: 0;
     39        outline: thin;
     40        outline-style: dotted;
    4041        text-decoration: underline;
    4142}
    … …  
    6263        max-width: 100%;
    6364        position: relative;
    64         &:before {
    65                 background-color: $color__background-pre;
    66                 border: 1px dashed $color__background-hr;
    67                 border-radius: 3px;
    68                 content: " ";
    69                 display: block;
    70                 height: 100%;
    71                 left: 0;
    72                 position: absolute;
    73                 top: 0;
    74                 width: 100%;
    75         }
    76 
    77         &:after {
    78                 color: $color__text-input;
    79                 content: "This image is broken :-/ ( "attr(alt)" )";
    80                 display: block;
    81                 left: 50%;
    82                 position: absolute;
    83                 text-align: center;
    84                 top: 50%;
    85                 transform: translate(-50%, -50%);
    86                 width: 100%;
    87         }
    8865}
    8966
    … …  
    9370
    9471blockquote {
    95 
    9672        border-left: 2px solid $color__link;
    9773        margin-left: -($size__spacing-unit * 2);
    98         padding: $size__spacing-unit 0 ($size__spacing-unit * .5) ($size__spacing-unit * 2);
     74        padding: 0 0 0 $size__spacing-unit;
    9975
    10076        > p {
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/forms/_buttons.scss

    r43808 r43842  
    1616        line-height: $font__line-height-heading;
    1717        outline: none;
    18         padding: ( $size__spacing-unit * .66 ) $size__spacing-unit;
     18        padding: ( $size__spacing-unit * .76 ) $size__spacing-unit;
     19        vertical-align: bottom;
    1920
    2021        &:hover {
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/forms/_fields.scss

    r43808 r43842  
    2020        box-sizing: border-box;
    2121        outline: none;
    22         padding: #{.5 * $size__spacing-unit} #{.66 * $size__spacing-unit};
     22        padding: #{.36 * $size__spacing-unit} #{.66 * $size__spacing-unit};
    2323
    2424        &:focus {
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/media/_galleries.scss

    r43808 r43842  
    11.gallery {
    22        display: flex;
     3        flex-flow: row wrap;
     4        justify-content: center;
    35        margin-bottom: calc(1.5 * #{$size__spacing-unit});
    46}
    … …  
    68.gallery-item {
    79        display: inline-block;
    8         margin-right: $size__spacing-unit;
     10        padding-right: $size__spacing-unit;
    911        margin-bottom: $size__spacing-unit;
    1012        text-align: center;
    … …  
    2022
    2123        &:last-of-type {
    22                 margin-right: 0;
     24                padding-right: 0;
    2325        }
    2426}
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/mixins/_mixins-master.scss

    r43808 r43842  
    4141                background: $color__link;
    4242                mix-blend-mode: multiply;
    43                 opacity: 1;
     43                opacity: .8;
    4444                z-index: 3;
     45               
     46                /* Browsers supporting mix-blend-mode don't need opacity < 1 */
     47                @supports (mix-blend-mode: multiply) {
     48                        opacity: 1;
     49                }
    4550        }
    4651}
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/navigation/_links.scss

    r43808 r43842  
    1616
    1717        &:focus {
    18                 outline: 0;
     18                outline: thin dotted;
    1919                text-decoration: underline;
    2020        }
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/navigation/_navigation.scss

    r43808 r43842  
    77## Menus
    88--------------------------------------------------------------*/
    9 @import "menus";
     9@import "menu-main-navigation";
     10@import "menu-social-navigation";
    1011
    1112/*--------------------------------------------------------------
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/navigation/_next-previous.scss

    r43808 r43842  
    55
    66        margin: calc(3 * 1rem) 0;
     7       
     8        @include media(tablet) {
     9                margin: calc(3 * 1rem) calc(2 * (100vw / 12));
     10                max-width: calc(6 * (100vw / 12));
     11        }
     12       
     13        @include media(desktop) {
     14                margin: calc(3 * 1rem) 0;
     15                max-width: 100%;
     16        }
    717
    818        .nav-links {
    … …  
    1222                display: flex;
    1323                flex-direction: column;
     24               
     25                @include media(tablet) {
     26                        margin: 0;
     27                }
    1428
    1529                @include media(desktop) {
    … …  
    7488                        @include media(desktop) {
    7589                                order: 2;
     90                                padding-left: $size__spacing-unit;
    7691                        }
    7792
    … …  
    139154
    140155        .nav-links {
    141 
    142156                display: flex;
    143157                flex-direction: row;
     158                margin: 0 $size__spacing-unit;
     159
     160                @include media(desktop) {
     161                        margin: 0 calc(2 * (100vw / 12));
     162                        max-width: calc(8 * (100vw / 12));
     163                }
    144164        }
    145165
    … …  
    148168                min-width: 50%;
    149169                width: 100%;
     170                font-family: $font__heading;
     171                font-weight: bold;
    150172
    151173                .secondary-text {
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/site/footer/_site-footer.scss

    r43808 r43842  
    11/* Site footer */
    22
    3 .site-footer {
     3#colophon {
    44
    5         color: $color__text-light;
    6 
     5        .widget-area,
    76        .site-info {
    87
    … …  
    1918        }
    2019
    21         a {
     20        .site-info a {
    2221                color: inherit;
    2322
    … …  
    2726                }
    2827        }
     28
     29        .widget-column {
     30                display: flex;
     31                flex-wrap: wrap;
     32                .widget {
     33                        width: 100%;
     34                        @include media(desktop) {
     35                                margin-right: calc(3 * #{$size__spacing-unit});
     36                                width: calc(50% - (3 * #{$size__spacing-unit}));
     37                        }
     38                }
     39        }
     40
     41        .site-info {
     42                color: $color__text-light;
     43        }
    2944}
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/site/header/_site-featured-image.scss

    r43808 r43842  
    1818        .entry-meta,
    1919        .entry-title {
    20                 color: white;
     20                color: $color__background-body;
    2121        }
    2222
    2323        .main-navigation a,
     24        .main-navigation a + svg,
    2425        .social-navigation a,
    2526        .site-title a,
    26         .hentry a {
    27                 color: white;
     27        .site-featured-image a {
     28                color: $color__background-body;
    2829                transition: opacity $link_transition ease-in-out;
    2930
    3031                &:hover,
    31                 &:active {
    32                         color: white;
     32                &:active,
     33                &:hover + svg,
     34                &:active + svg {
     35                        color: $color__background-body;
    3336                        opacity: 0.6;
    3437                }
    3538
    36                 &:focus {
    37                         color: white;
    38                 }
    39         }
    40 
    41         // add focus state to social media icons
     39                &:focus,
     40                &:focus + svg {
     41                        color: $color__background-body;
     42                }
     43        }
     44
     45        /* add focus state to social media icons */
    4246        .social-navigation a {
    4347                &:focus {
    44                         color: white;
     48                        color: $color__background-body;
    4549                        opacity: 1;
    46                         border-bottom: 1px solid white;
     50                        border-bottom: 1px solid $color__background-body;
    4751                }
    4852        }
    4953
    5054        .social-navigation svg,
    51         .hentry svg {
     55        .site-featured-image svg {
    5256                /* Use -webkit- only if supporting: Chrome < 54, iOS < 9.3, Android < 4.4.4 */
    5357                -webkit-filter: drop-shadow(0 1px 2px rgba(black, 0.35) );
    54                         filter: drop-shadow(0 1px 2px rgba(black, 0.35) );
    55         }
    56 
    57         /* Post header styles */
    58         .hentry .entry-header {
    59 
     58                                filter: drop-shadow(0 1px 2px rgba(black, 0.35) );
     59        }
     60
     61        /* Entry header */
     62
     63        .site-featured-image .entry-header {
     64
     65                margin-bottom: 0;
    6066                margin-left: 0;
    6167                margin-right: 0;
    … …  
    7076
    7177                        &:before {
    72                                 background: white;
     78                                background: $color__background-body;
     79                        }
     80                }
     81
     82                /* Entry meta */
     83
     84                .entry-meta {
     85
     86                        font-weight: 500;
     87
     88                        > span {
     89
     90                                margin-right: $size__spacing-unit;
     91                                display: inline-block;
     92
     93                                &:last-child {
     94                                        margin-right: 0;
     95                                }
     96                        }
     97
     98                        a {
     99
     100                                @include link-transition;
     101                                color: currentColor;
     102
     103                                &:hover {
     104                                        text-decoration: none;
     105                                }
     106                        }
     107
     108                        .svg-icon {
     109                                position: relative;
     110                                display: inline-block;
     111                                vertical-align: middle;
     112                                margin-right: 0.5em;
     113                        }
     114
     115                        .discussion-avatar-list {
     116                                display: none;
     117                        }
     118                }
     119
     120                &.has-discussion {
     121
     122                        @include media (tablet) {
     123
     124                                .entry-meta {
     125                                        display: flex;
     126                                        position: relative;
     127                                }
     128
     129                                .entry-title {
     130                                        padding-right: calc(1 * (100vw / 12) + #{$size__spacing-unit});
     131                                }
     132
     133                                .entry-meta .comment-count {
     134                                        position: absolute;
     135                                        right: 0;
     136                                }
     137
     138                                .entry-meta .discussion-avatar-list {
     139                                        display: block;
     140                                        position: absolute;
     141                                        bottom: 100%;
     142                                }
    73143                        }
    74144                }
    … …  
    79149        .custom-logo-link {
    80150
    81                 background: white;
    82                 box-shadow: 0 0 0 0 rgba(white, 0);
     151                background: $color__background-body;
     152                box-shadow: 0 0 0 0 rgba($color__background-body, 0);
    83153
    84154                &:hover,
    85155                &:active,
    86156                &:focus {
    87                         box-shadow: 0 0 0 2px rgba(white, 1);
     157                        box-shadow: 0 0 0 2px rgba($color__background-body, 1);
    88158                }
    89159        }
    90160
    91161        /* Make sure important elements are above pseudo elements used for effects. */
    92         .site-branding,
    93         .hentry .entry-header {
     162        .site-branding {
     163                position: relative;
    94164                z-index: 10;
     165        }
     166
     167        .site-featured-image .entry-header {
     168                position: relative;
     169                z-index: 9;
    95170        }
    96171
    … …  
    98173        .site-branding-container:before,
    99174        .site-branding-container:after,
    100         .hentry:before,
    101         .hentry:after,
     175        .site-featured-image:before,
     176        .site-featured-image:after,
    102177        &:after {
    103178                display: block;
    … …  
    118193
    119194        /* First layer: grayscale. */
    120         .site-branding-container:before {
     195        .site-branding-container:before {
    121196                background-position: center;
    122197                background-repeat: no-repeat;
    123198                background-size: cover;
    124                 filter: grayscale(100%);
    125199                z-index: 1;
     200
     201                /* When image filters are active, make it grayscale to colorize it blue. */
     202                .image-filters-enabled & {
     203                        filter: grayscale(100%);
     204                }
    126205        }
    127206
    128207        /* Second layer: screen. */
    129         .hentry:before {
     208        .image-filters-enabled & .site-featured-image:before {
    130209                background: $color__link;
    131210                mix-blend-mode: screen;
    132211                opacity: 0.1;
    133                 z-index: 2;
    134212        }
    135213
    136214        /* Third layer: multiply. */
    137         .hentry:after {
    138                 background: $color__link;
     215        /* When image filters are inactive, a black overlay is added. */
     216        .site-featured-image:after {
     217                background: #000;
    139218                mix-blend-mode: multiply;
    140                 opacity: 1;
    141                 z-index: 3;
     219                opacity: .7;
     220
     221                /* When image filters are active, a blue overlay is added. */
     222                .image-filters-enabled & {
     223                        background: $color__link;
     224                        opacity: .8;
     225                        z-index: 3;
     226
     227                        /* Browsers supporting mix-blend-mode don't need opacity < 1 */
     228                        @supports (mix-blend-mode: multiply) {
     229                                opacity: 1;
     230                        }
     231                }
    142232        }
    143233
    144234        /* Fourth layer: overlay. */
    145         .site-branding-container:after {
    146                 background: rgba(white, 0.35);
     235        .image-filters-enabled & .site-branding-container:after {
     236                background: rgba(#000, 0.35);
    147237                mix-blend-mode: overlay;
    148238                opacity: 0.5;
    149239                z-index: 4;
     240
     241                /* Browsers supporting mix-blend-mode can have a light overlay */
     242                @supports (mix-blend-mode: overlay) {
     243                        background: rgba($color__background-body, 0.35);
     244                }
    150245        }
    151246
    152247        /* Fifth layer: readability overlay */
    153248        &:after {
    154                 background: mix($color__link, black, 12%);
    155 
     249                background: #000;
    156250                /**
    157251                 * Add a transition to the readability overlay, to add a subtle
    … …  
    159253                 */
    160254                transition: opacity 1200ms ease-in-out;
    161 
     255                opacity: 0.7;
    162256                z-index: 5;
    163                 opacity: 0.38;
    164 
    165                 @include media(tablet) {
    166                         opacity: 0.18;
    167                 }
    168 
    169                 @include media(desktop) {
    170                         opacity: 0.1;
    171                 }
    172         }
     257
     258                /* When image filters are active, a blue overlay is added. */
     259                .image-filters-enabled & {
     260                        background: mix($color__link, black, 12%);
     261                        opacity: 0.38;
     262
     263                        @include media(tablet) {
     264                                opacity: 0.18;
     265                        }
     266                }
     267        }
     268
    173269
    174270        ::-moz-selection {
    175                 background: rgba(white, 0.17);
     271                background: rgba($color__background-body, 0.17);
    176272        }
    177273
    178274        ::selection {
    179                 background: rgba(white, 0.17);
     275                background: rgba($color__background-body, 0.17);
    180276        }
    181277}
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/site/header/_site-header.scss

    r43808 r43842  
    3232        @include media(tablet) {
    3333                margin: 0 calc(2 * (100vw / 12));
    34                 max-width: 22em;
    3534        }
    3635}
    … …  
    4746                margin-bottom: 0;
    4847                position: absolute;
    49                 right: calc(100% + (0.5 * calc(100vw / 12)));
     48                right: calc(100% + (0.5 * 100vw / 12));
    5049                top: 4px; // Accounts for box-shadow widths
    5150                z-index: 999;
    … …  
    8281
    8382.site-title {
    84 
    8583        margin: auto;
    8684        display: inline;
    87         color: $color__text-main;
     85       
     86
     87        a:link,
     88        a:visited {
     89                color: $color__text-main;
     90        }
    8891
    8992        .featured-image & {
    … …  
    111114                display: inline;
    112115        }
     116
     117        &:not(:empty) + .site-description:not(:empty):before {
     118                content: "\2014";
     119                margin: 0 .2em;
     120        }
    113121}
    114122
    … …  
    121129        font-weight: normal;
    122130        margin: 0;
    123 
    124         &:not(:empty):before {
    125                 content: "\2014";
    126                 margin: 0 .2em;
    127         }
    128131}
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/site/primary/_archives.scss

    r43808 r43842  
    3434}
    3535
    36 .hfeed .hentry .entry-header {
     36.archive .page-header .page-description {
     37        display: block;
     38        color: $color__text-main;
     39        font-size: 1em;
     40}
     41
     42.hfeed .entry .entry-header {
    3743
    3844        @include media(tablet) {
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/site/primary/_comments.scss

    r43808 r43842  
    1010
    1111        /* Add extra margin when the comments section is located immediately after the
    12          * post itself (this happens on pages). 
     12         * post itself (this happens on pages).
    1313         */
    14         .hentry + & {
     14        .entry + & {
    1515                margin-top: calc(3 * #{$size__spacing-unit});
    1616        }
    1717
    18         .comments-title-wrap,
    1918        .comment-list,
     19        .comment-navigation,
    2020        > .comment-respond,
    2121        .comment-form-flex,
    2222        .no-comments {
    23 
    2423                margin: calc(2 * #{$size__spacing-unit}) $size__spacing-unit;
    2524
    … …  
    3231        .comments-title-wrap {
    3332
    34                 align-items: baseline;
    35                 display: flex;
    36                 justify-content: space-between;
     33                margin: calc(2 * #{$size__spacing-unit}) $size__spacing-unit;
     34
     35                @include media(tablet) {
     36                        align-items: baseline;
     37                        display: flex;
     38                        justify-content: space-between;
     39                        margin: calc(3 * #{$size__spacing-unit}) calc(2 * (100vw / 12));
     40                        max-width: calc(8 * (100vw / 12));
     41                }
    3742
    3843                .comments-title {
    3944                        @include post-section-dash;
    4045                        margin: 0;
     46
     47                        @include media(tablet) {
     48                                flex: 1 0 calc(3 * (100vw / 12));
     49                        }
     50                }
     51
     52                .discussion-meta {
     53                        @include media(tablet) {
     54                                flex: 0 0 calc(2 * (100vw / 12));
     55                                margin-left: #{$size__spacing-unit};
     56                        }
    4157                }
    4258        }
    … …  
    4965
    5066#respond {
    51 
    5267        position: relative;
    5368
    5469        .comment-user-avatar {
    55                 display: none;
     70                margin: $size__spacing-unit 0 -#{$size__spacing-unit};
    5671        }
    5772
    … …  
    7590                display: none;
    7691        }
    77 
    78         > #respond {
    79                 @include media(desktop) {
    80 
    81                         .comment-user-avatar {
    82                                 position: absolute;
    83                                 display: block;
    84                                 top: 0;
    85                                 left: 0;
    86 
    87                                 .avatar {
    88                                         display: block;
    89                                 }
    90                         }
    91                 }
    92         }
    9392}
    9493
    9594.comment-form-flex {
    96 
    9795        display: flex;
    9896        flex-direction: column;
    … …  
    105103
    106104        #respond {
    107 
    108105                order: 2;
     106
    109107                + .comments-title {
    110108                        display: block;
    … …  
    114112
    115113.comment-list {
    116 
    117114        list-style: none;
    118115        padding: 0;
    … …  
    126123                margin-top: 0;
    127124        }
    128 
    129125}
    130126
    131127.comment-reply {
    132 
    133128        left: calc(#{$size__spacing-unit} + 100%);
    134129        bottom: 0;
    … …  
    145140
    146141.comment {
    147 
    148142        list-style: none;
    149143        position: relative;
    150144
    151145        @include media(tablet) {
    152 
    153146                padding-left: calc(.5 * (#{$size__spacing-unit} + calc(100vw / 12 )));
    154147
    … …  
    218211                        position: absolute;
    219212                        background: lighten( $color__link, 8% );
    220                         right: calc(100% + #{$size__spacing-unit * .25});
     213                        right: calc(100% - #{$size__spacing-unit * 2.5});
    221214                        top: -3px;
    222215                        width: 18px;
     216
     217                        @include media(tablet) {
     218                                right: calc(100% + #{$size__spacing-unit * .75});
     219                        }
    223220
    224221                        svg {
    … …  
    283280
    284281                .comment-edit-link {
    285 
    286282                        position: relative;
    287283                        padding-left: $size__spacing-unit;
    … …  
    346342                        width: calc(1.5 * #{$size__spacing-unit});
    347343                }
    348 
    349                 @include media(tablet) {
    350 
    351                 }
    352344        }
    353345}
    354346
    355347.discussion-meta {
    356 
    357         .discussion-avatar-list {
    358                 display: inline-block;
    359                 margin-right: 8px;
    360         }
    361348
    362349        .discussion-meta-info {
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/site/primary/_posts-and-pages.scss

    r43808 r43842  
    2525}
    2626
    27 .hentry {
     27.entry {
    2828
    2929        margin-top: calc(6 * #{$size__spacing-unit});
    … …  
    4040                @include media(tablet) {
    4141                        margin: calc(3 * #{ $size__spacing-unit}) calc(2 * (100vw / 12 ) ) $size__spacing-unit;
    42 
    43                         .featured-image & {
    44                                 margin-bottom: 0;
    45                         }
    4642                }
    4743        }
    … …  
    7066
    7167                        margin-right: $size__spacing-unit;
     68                        display: inline-block;
    7269
    7370                        &:last-child {
    … …  
    9693
    9794        .entry-meta {
    98 
    9995                margin: $size__spacing-unit 0;
    100 
    101                 &.has-discussion .comment-count {
    102 
    103                         @include media(desktop) {
    104                                 float: right;
    105                                 position: relative;
    106                         }
    107 
    108                         .discussion-avatar-list {
    109                                 display: none;
    110 
    111                                 @include media(desktop) {
    112                                         bottom: 100%;
    113                                         display: block;
    114                                         position: absolute;
    115                                 }
    116                         }
    117                 }
    11896        }
    11997
    … …  
    123101
    124102                @include media(tablet) {
    125                         margin: calc(3 * #{$size__spacing-unit}) calc(2 * (100vw / 12));
     103                        margin: $size__spacing-unit calc(2 * (100vw / 12)) calc(3 * #{$size__spacing-unit});
    126104                        max-width: calc(8 * (100vw / 12));
    127105                }
    … …  
    163141
    164142                        .post-thumbnail-inner {
    165                                 @include filter-grayscale;
     143                                filter: grayscale(100%);
     144                               
     145                                &:after {
     146                                        background: rgba(#000, 0.35);
     147                                        content: "";
     148                                        display: block;
     149                                        height: 100%;
     150                                        opacity: .5;
     151                                        pointer-events: none;
     152                                        position: absolute;
     153                                        top: 0;
     154                                        width: 100%;
     155                                        z-index: 4;
     156
     157                                        @supports (mix-blend-mode: multiply) {
     158                                                display: none;
     159                                        }
     160                                }
    166161                        }
    167162
    … …  
    173168                                top: 0; left: 0;
    174169                                content: "\020";
    175                                 display: block;
    176170                                pointer-events: none;
    177171                        }
    178172
    179173                        @include filter-duotone;
    180 
    181                 }
    182 
     174                       
     175                }
    183176        }
    184177
    185178        .entry-content {
     179
     180                p {
     181                        word-wrap: break-word;
     182                }
    186183
    187184                .more-link {
    … …  
    191188
    192189                        &:after {
    193                                 content: "»";
     190                                content: "\02192";
    194191                                margin-left: 0.5em;
    195192                        }
    … …  
    239236        }
    240237}
     238
     239/* Author description */
     240
     241.author-bio {
     242
     243        margin: calc(2 * #{$size__spacing-unit}) $size__spacing-unit $size__spacing-unit;
     244
     245        @include media(tablet) {
     246                margin: calc(3 * #{$size__spacing-unit}) calc(2 * (100vw / 12));
     247                max-width: calc(8 * (100vw / 12));
     248        }
     249
     250        @include media(tablet) {
     251                max-width: calc(6 * (100vw / 12));
     252        }
     253
     254        .author-title {
     255                @include post-section-dash;
     256                display: inline;
     257        }
     258
     259        .author-description {
     260
     261                display: inline;
     262                color: $color__text-light;
     263                font-size: $font__size-md;
     264                line-height: $font__line-height-heading;
     265
     266                .author-link {
     267                        display: inline-block;
     268
     269                        &:hover {
     270                                color: $color__link-hover;
     271                                text-decoration: none;
     272                        }
     273                }
     274        }
     275}
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/site/secondary/_widgets.scss

    r43808 r43842  
    66                max-width: 100%;
    77        }
     8
     9        a {
     10                color: $color__link;
     11
     12                &:hover {
     13                        color: $color__link-hover;
     14                }
     15        }
    816}
     17
     18.widget_archive,
     19.widget_nav_menu,
     20.widget_meta,
     21.widget_recent_entries,
     22.widget_rss {
     23
     24        ul {
     25                padding: 0;
     26                list-style: none;
     27
     28                li {
     29                        color: $color__text-light;
     30                        font-family: $font__heading;
     31                        font-size: calc(#{$font__size_base} * #{$font__size-lg / 1em} );
     32                        font-weight: bold;
     33                        line-height: $font__line-height-heading;
     34
     35                        &:not(.menu-item-has-children) {
     36                                padding-bottom: ( .75 * $size__spacing-unit );
     37                        }
     38
     39                        ul {
     40                                padding-left: $size__spacing-unit;
     41                        }
     42                }
     43
     44                &.sub-menu {
     45                        padding-top: ( .75 * $size__spacing-unit );
     46                }
     47        }
     48}
     49
     50.widget_search {
     51
     52        .search-submit {
     53                display: block;
     54                margin-top: $size__spacing-unit;
     55        }
     56}
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/typography/_copy.scss

    r43808 r43842  
    1010blockquote {
    1111
    12         > p {
    13                 font-size: $font__size-lg;
    14                 font-style: italic;
    15                 line-height: $font__line-height-heading;
    16         }
    17 
    1812        cite {
    19                 font-size: $font__size-sm;
     13                font-size: $font__size-xs;
    2014                font-style: normal;
    2115                font-family: $font__heading;
  • branches/5.0/src/wp-content/themes/twentynineteen/sass/typography/_headings.scss

    r43808 r43842  
    22.page-description,
    33h2.author-title,
     4.author-description .author-link,
    45.not-found .page-title,
    56.error-404 .page-title,
    … …  
    4142.main-navigation ul.main-menu > li,
    4243.social-navigation,
    43 .author-description p.author-bio,
     44.author-description .author-bio,
    4445.nav-links {
    4546        line-height: 1.25;
  • branches/5.0/src/wp-content/themes/twentynineteen/search.php

    r43808 r43842  
    77 * @package WordPress
    88 * @subpackage Twenty_Nineteen
     9 * @since 1.0.0
    910 */
    1011
    … …  
    2122                                        <?php esc_html_e( 'Search results for:', 'twentynineteen' ); ?>
    2223                                </h1>
    23                                 <div class="page-description">
    24                                         <?php echo get_search_query(); ?>
    25                                 </div>
     24                                <div class="page-description"><?php echo get_search_query(); ?></div>
    2625                        </header><!-- .page-header -->
    2726
    … …  
    3635                                 * called content-___.php (where ___ is the Post Format name) and that will be used instead.
    3736                                 */
    38                                 get_template_part( 'template-parts/content/content' );
     37                                get_template_part( 'template-parts/content/content', 'excerpt' );
    3938
    4039                                // End the loop.
  • branches/5.0/src/wp-content/themes/twentynineteen/single.php

    r43808 r43842  
    77 * @package WordPress
    88 * @subpackage Twenty_Nineteen
     9 * @since 1.0.0
    910 */
    1011
    … …  
    1213?>
    1314
    14         <div id="primary" class="content-area">
     15        <section id="primary" class="content-area">
    1516                <main id="main" class="site-main">
    1617
    … …  
    2728                                        the_post_navigation(
    2829                                                array(
    29                                                         'prev_text' => _x( '<span class="meta-nav">Published in</span><span class="post-title">%title</span>', 'Parent post link', 'twentynineteen' ),
     30                                                        'prev_text' => _x( '<span class="meta-nav">Published in</span><br/><span class="post-title">%title</span>', 'Parent post link', 'twentynineteen' ),
    3031                                                )
    3132                                        );
    … …  
    5354
    5455                </main><!-- #main -->
    55         </div><!-- #primary -->
     56        </section><!-- #primary -->
    5657
    5758<?php get_template_part( 'template-parts/post/post', 'navigation' ); ?>
  • branches/5.0/src/wp-content/themes/twentynineteen/style-editor-frame.css

    r43808 r43842  
    99 * layers of box-shadow to add the border visually, which will render the border smoother. */
    1010/** === Title === */
    11 body.gutenberg-editor-page .gutenberg .editor-post-title__block:before {
     11body.block-editor-page .block-editor .editor-post-title__block:before {
    1212  background: #767676;
    1313  content: "\020";
    … …  
    1818}
    1919
    20 body.gutenberg-editor-page .gutenberg .editor-post-title__block:before {
     20body.block-editor-page .block-editor .editor-post-title__block:before {
    2121  width: 2.8125em;
    2222  margin-top: 0;
    … …  
    2727}
    2828
    29 body.gutenberg-editor-page .gutenberg .editor-post-title__block .editor-post-title__input {
     29body.block-editor-page .block-editor .editor-post-title__block .editor-post-title__input {
    3030  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
    3131  font-size: 2.8125em;
    … …  
    3333
    3434/** === Default Appender === */
    35 body.gutenberg-editor-page .gutenberg .editor-default-block-appender__content {
     35body.block-editor-page .block-editor .editor-default-block-appender__content {
    3636  font-family: "Hoefler Text", "Baskerville Old Face", Garamond, "Times New Roman", serif;
    3737  font-size: 22px;
    … …  
    4040/** === Off-Center Content === */
    4141@media only screen and (min-width: 768px) {
    42   body.gutenberg-editor-page .gutenberg .edit-post-layout .editor-writing-flow {
     42  body.block-editor-page .block-editor .edit-post-layout .editor-writing-flow {
    4343    max-width: 80%;
    4444    margin: 0 10%;
    4545  }
    46   body.gutenberg-editor-page .gutenberg .edit-post-layout .editor-post-title__block,
    47   body.gutenberg-editor-page .gutenberg .edit-post-layout .editor-default-block-appender,
    48   body.gutenberg-editor-page .gutenberg .edit-post-layout .editor-block-list__block {
     46  body.block-editor-page .block-editor .edit-post-layout .editor-post-title__block,
     47  body.block-editor-page .block-editor .edit-post-layout .editor-default-block-appender,
     48  body.block-editor-page .block-editor .edit-post-layout .editor-block-list__block {
    4949    margin-left: 0;
    5050    margin-right: 0;
    5151  }
    52   body.gutenberg-editor-page .gutenberg .edit-post-layout .editor-block-list__block[data-align="full"] {
     52  body.block-editor-page .block-editor .edit-post-layout .editor-block-list__block[data-align="full"] {
    5353    width: calc( 125% + 88px + 28px);
    5454    position: relative;
    5555    left: calc( -12.5% - 46px - 14px);
    5656  }
    57   body.gutenberg-editor-page .gutenberg .edit-post-layout .editor-block-list__block[data-align="right"] {
     57  body.block-editor-page .block-editor .edit-post-layout .editor-block-list__block[data-align="right"] {
    5858    max-width: 125%;
    5959  }
  • branches/5.0/src/wp-content/themes/twentynineteen/style-editor-frame.scss

    r43808 r43842  
    1313/** === Title === */
    1414
    15 body.gutenberg-editor-page .gutenberg .editor-post-title__block {
     15body.block-editor-page .block-editor .editor-post-title__block {
    1616        @include post-section-dash;
    1717
    … …  
    3333/** === Default Appender === */
    3434
    35 body.gutenberg-editor-page .gutenberg .editor-default-block-appender__content {
     35body.block-editor-page .block-editor .editor-default-block-appender__content {
    3636        font-family: $font__body;
    3737        font-size: $font__size_base;
    … …  
    4040/** === Off-Center Content === */
    4141
    42 body.gutenberg-editor-page .gutenberg .edit-post-layout {
     42body.block-editor-page .block-editor .edit-post-layout {
    4343
    4444        @include media(tablet) {
  • branches/5.0/src/wp-content/themes/twentynineteen/style-editor.css

    r43808 r43842  
    117117}
    118118
     119.has-primary-background-color p,
     120.has-primary-background-color h1,
     121.has-primary-background-color h2,
     122.has-primary-background-color h3,
     123.has-primary-background-color h4,
     124.has-primary-background-color h5,
     125.has-primary-background-color h6,
     126.has-primary-background-color a,
     127.has-primary-background-color a:hover {
     128  color: #fff;
     129}
     130
    119131figcaption,
    120132.gallery-caption {
    … …  
    134146}
    135147
    136 /** === Cover Image === */
    137 .wp-block-cover-image h2,
    138 .wp-block-cover-image .wp-block-cover-image-text {
     148/** === Cover === */
     149.wp-block-cover h2,
     150.wp-block-cover .wp-block-cover-text {
    139151  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
    140152  font-size: 2.25em;
    … …  
    143155}
    144156
    145 .wp-block-cover-image.has-left-content {
     157.wp-block-cover.has-left-content {
    146158  justify-content: center;
    147159}
    148160
    149 .wp-block-cover-image.has-left-content h2,
    150 .wp-block-cover-image.has-left-content .wp-block-cover-image-text {
     161.wp-block-cover.has-left-content h2,
     162.wp-block-cover.has-left-content .wp-block-cover-text {
    151163  padding: 1em;
    152164}
    153165
    154 .wp-block-cover-image.has-right-content {
     166.wp-block-cover.has-right-content {
    155167  justify-content: center;
    156168}
    157169
    158 .wp-block-cover-image.has-right-content h2,
    159 .wp-block-cover-image.has-right-content .wp-block-cover-image-text {
     170.wp-block-cover.has-right-content h2,
     171.wp-block-cover.has-right-content .wp-block-cover-text {
    160172  padding: 1em;
    161173}
    162174
    163 body[data-type="core/cover-image"][data-align="left"] h2,
    164 body[data-type="core/cover-image"][data-align="left"] .wp-block-cover-image-text,
    165 body[data-type="core/cover-image"][data-align="right"] h2,
    166 body[data-type="core/cover-image"][data-align="right"] .wp-block-cover-image-text {
     175body[data-type="core/cover"][data-align="left"] h2,
     176body[data-type="core/cover"][data-align="left"] .wp-block-cover-text,
     177body[data-type="core/cover"][data-align="right"] h2,
     178body[data-type="core/cover"][data-align="right"] .wp-block-cover-text {
    167179  width: 100%;
    168180  max-width: 305px;
    … …  
    170182
    171183@media only screen and (min-width: 1168px) {
    172   body[data-type="core/cover-image"][data-align="wide"] h2,
    173   body[data-type="core/cover-image"][data-align="wide"] .wp-block-cover-image-text,
    174   body[data-type="core/cover-image"][data-align="full"] h2,
    175   body[data-type="core/cover-image"][data-align="full"] .wp-block-cover-image-text {
     184  body[data-type="core/cover"][data-align="wide"] h2,
     185  body[data-type="core/cover"][data-align="wide"] .wp-block-cover-text,
     186  body[data-type="core/cover"][data-align="full"] h2,
     187  body[data-type="core/cover"][data-align="full"] .wp-block-cover-text {
    176188    padding: 0;
    177189    width: calc(6 * (100vw / 12));
    … …  
    196208}
    197209
    198 .wp-block-button .wp-block-button__link:not(.has-background),
    199 .wp-block-button .wp-block-button__link:not(.has-background) {
     210.wp-block-button:not(.is-style-outline) .wp-block-button__link {
    200211  background: #0073aa;
    201212}
    … …  
    205216}
    206217
    207 .wp-block-button.is-style-outline .wp-block-button__link,
    208 .wp-block-button.is-style-outline .wp-block-button__link:hover,
    209 .wp-block-button.is-style-outline .wp-block-button__link:focus,
    210 .wp-block-button.is-style-outline .wp-block-button__link:active {
     218.wp-block-button.is-style-outline, .wp-block-button.is-style-outline:hover, .wp-block-button.is-style-outline:focus, .wp-block-button.is-style-outline:active {
    211219  background: transparent;
    212   border-color: #0073aa;
    213 }
    214 
    215 .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color),
    216 .wp-block-button.is-style-outline .wp-block-button__link:hover:not(.has-text-color),
    217 .wp-block-button.is-style-outline .wp-block-button__link:focus:not(.has-text-color),
    218 .wp-block-button.is-style-outline .wp-block-button__link:active:not(.has-text-color) {
     220  color: #0073aa;
     221}
     222
     223.wp-block-button.is-style-outline .wp-block-button__link, .wp-block-button.is-style-outline:hover .wp-block-button__link, .wp-block-button.is-style-outline:focus .wp-block-button__link, .wp-block-button.is-style-outline:active .wp-block-button__link {
     224  background: transparent;
     225}
     226
     227.wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color), .wp-block-button.is-style-outline:hover .wp-block-button__link:not(.has-text-color), .wp-block-button.is-style-outline:focus .wp-block-button__link:not(.has-text-color), .wp-block-button.is-style-outline:active .wp-block-button__link:not(.has-text-color) {
    219228  color: #0073aa;
    220229}
    … …  
    269278}
    270279
    271 .wp-block-pullquote.is-style-solid-color blockquote:not(.has-text-color) p,
    272 .wp-block-pullquote.is-style-solid-color .wp-block-pullquote__citation {
    273   color: white;
     280.wp-block-pullquote.is-style-solid-color blockquote:not(.has-text-color) {
     281  color: #fff;
    274282}
    275283
    … …  
    299307  margin-bottom: 0.5em;
    300308  margin-top: 0.5em;
    301   color: #111;
    302309}
    303310
    … …  
    323330  line-height: 1.6;
    324331  text-transform: none;
    325   color: #767676;
    326332}
    327333
    … …  
    345351body[data-type="core/pullquote"][data-align="right"] .editor-block-list__block-edit .wp-block-pullquote.is-style-solid-color {
    346352  padding: 1em;
    347 }
    348 
    349 body[data-type="core/pullquote"][data-align="left"] .editor-block-list__block-edit .wp-block-pullquote.is-style-solid-color p,
    350 body[data-type="core/pullquote"][data-align="left"] .editor-block-list__block-edit .wp-block-pullquote.is-style-solid-color .wp-block-pullquote__citation,
    351 body[data-type="core/pullquote"][data-align="right"] .editor-block-list__block-edit .wp-block-pullquote.is-style-solid-color p,
    352 body[data-type="core/pullquote"][data-align="right"] .editor-block-list__block-edit .wp-block-pullquote.is-style-solid-color .wp-block-pullquote__citation {
    353   color: white;
    354353}
    355354
    … …  
    434433}
    435434
     435ul.wp-block-archives li:not(.menu-item-has-children),
     436.wp-block-categories li:not(.menu-item-has-children),
     437.wp-block-latest-posts li:not(.menu-item-has-children) {
     438  padding-bottom: 0.75rem;
     439}
     440
    436441ul.wp-block-archives li a,
    437442.wp-block-categories li a,
    … …  
    440445}
    441446
    442 ul.wp-block-archives li a:after,
    443 .wp-block-categories li a:after,
    444 .wp-block-latest-posts li a:after {
    445   color: #767676;
    446   content: ",";
    447 }
    448 
    449 ul.wp-block-archives li:last-child a:after,
    450 .wp-block-categories li:last-child a:after,
    451 .wp-block-latest-posts li:last-child a:after {
    452   color: #767676;
    453   content: ".";
     447ul.wp-block-archives li ul,
     448.wp-block-categories li ul,
     449.wp-block-latest-posts li ul {
     450  padding-left: 1rem;
    454451}
    455452
    … …  
    503500.wp-block-freeform {
    504501  /* Add style for galleries in classic-editor block */
     502  /* Add style for galleries in classic-editor block */
     503}
     504
     505.wp-block-freeform blockquote {
     506  border-left: 2px solid #0073aa;
     507}
     508
     509.wp-block-freeform blockquote cite {
     510  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
     511  font-size: 0.71111em;
     512  font-style: normal;
     513  line-height: 1.6;
     514  color: #767676;
    505515}
    506516
  • branches/5.0/src/wp-content/themes/twentynineteen/style-editor.scss

    r43808 r43842  
    103103}
    104104
     105.has-primary-background-color {
     106       
     107        p,
     108        h1,
     109        h2,
     110        h3,
     111        h4,
     112        h5,
     113        h6,
     114        a,
     115        a:hover {
     116                color: $color__background-body;
     117        }
     118}
     119
    105120figcaption,
    106121.gallery-caption {
    … …  
    124139}
    125140
    126 /** === Cover Image === */
    127 
    128 .wp-block-cover-image {
     141/** === Cover === */
     142
     143.wp-block-cover {
    129144
    130145        h2,
    131         .wp-block-cover-image-text {
     146        .wp-block-cover-text {
    132147                font-family: $font__heading;
    133148                font-size: $font__size-xl;
    … …  
    140155
    141156                h2,
    142                 .wp-block-cover-image-text {
     157                .wp-block-cover-text {
    143158                        padding: 1em;
    144159                }
    … …  
    149164
    150165                h2,
    151                 .wp-block-cover-image-text {
     166                .wp-block-cover-text {
    152167                        padding: 1em;
    153168                }
    … …  
    155170}
    156171
    157 body[data-type="core/cover-image"][data-align="left"],
    158 body[data-type="core/cover-image"][data-align="right"] {
     172body[data-type="core/cover"][data-align="left"],
     173body[data-type="core/cover"][data-align="right"] {
    159174
    160175        h2,
    161         .wp-block-cover-image-text {
     176        .wp-block-cover-text {
    162177                width: 100%;
    163178                max-width: 305px;
    … …  
    165180}
    166181
    167 body[data-type="core/cover-image"][data-align="wide"],
    168 body[data-type="core/cover-image"][data-align="full"] {
     182body[data-type="core/cover"][data-align="wide"],
     183body[data-type="core/cover"][data-align="full"] {
    169184
    170185        @include media(desktop) {
    171186                h2,
    172                 .wp-block-cover-image-text {
     187                .wp-block-cover-text {
    173188                        padding: 0;
    174189                        width: calc(6 * (100vw / 12));
    … …  
    201216        }
    202217
    203         .wp-block-button__link:not(.has-background),
    204         .wp-block-button__link:not(.has-background) {
     218        &:not(.is-style-outline) .wp-block-button__link {
    205219                background: $color__background-button;
    206220        }
    … …  
    210224        }
    211225
    212         &.is-style-outline .wp-block-button__link,
    213         &.is-style-outline .wp-block-button__link:hover,
    214         &.is-style-outline .wp-block-button__link:focus,
    215         &.is-style-outline .wp-block-button__link:active {
     226        &.is-style-outline,
     227        &.is-style-outline:hover,
     228        &.is-style-outline:focus,
     229        &.is-style-outline:active {
    216230                background: transparent;
    217                 border-color: $color__background-button;
    218 
    219                 &:not(.has-text-color) {
    220                         color: $color__background-button;
     231                color: $color__background-button;
     232
     233                .wp-block-button__link {
     234                        background: transparent;
     235
     236                        &:not(.has-text-color) {
     237                                color: $color__background-button;
     238                        }
    221239                }
    222240        }
    … …  
    275293                }
    276294
    277                 blockquote:not(.has-text-color) p,
    278                 .wp-block-pullquote__citation {
    279                         color: white;
     295                blockquote:not(.has-text-color) {
     296                        color: $color__background-body;
    280297                }
    281298
    … …  
    303320                margin-bottom: 0.5em;
    304321                margin-top: 0.5em;
    305                 color: $color__text-main;
    306322
    307323                @include media(tablet) {
    … …  
    315331                line-height: 1.6;
    316332                text-transform: none;
    317                 color: $color__text-light;
    318333        }
    319334
    … …  
    335350                .wp-block-pullquote.is-style-solid-color {
    336351                        padding: 1em;
    337 
    338                         p,
    339                         .wp-block-pullquote__citation {
    340                                 color: white;
    341                         }
    342352                }
    343353        }
    … …  
    426436                line-height: $font__line-height-heading;
    427437
     438                &:not(.menu-item-has-children) {
     439                        padding-bottom: ( .75 * $size__spacing-unit );
     440                }
     441
    428442                a {
    429443                        text-decoration: none;
    430 
    431                         &:after {
    432                                 color: $color__text-light;
    433                                 content: ",";
    434                         }
    435                 }
    436 
    437                 &:last-child a:after {
    438                         color: $color__text-light;
    439                         content: ".";
     444                }
     445
     446                ul {
     447                        padding-left: $size__spacing-unit;
    440448                }
    441449        }
    … …  
    500508
    501509        /* Add style for galleries in classic-editor block */
     510        blockquote {
     511                border-left: 2px solid $color__link;
     512
     513                cite {
     514                        font-family: $font__heading;
     515                        font-size: $font__size-xs;
     516                        font-style: normal;
     517                        line-height: 1.6;
     518                        color: $color__text-light;
     519                }
     520        }
     521
     522        /* Add style for galleries in classic-editor block */
    502523        .gallery {
    503524
  • branches/5.0/src/wp-content/themes/twentynineteen/style-rtl.css

    r43808 r43842  
    423423.page-description,
    424424h2.author-title,
     425.author-description .author-link,
    425426.not-found .page-title,
    426427.error-404 .page-title,
    … …  
    462463.main-navigation ul.main-menu > li,
    463464.social-navigation,
    464 .author-description p.author-bio,
     465.author-description .author-bio,
    465466.nav-links {
    466467  line-height: 1.25;
    … …  
    581582}
    582583
    583 blockquote > p {
    584   font-size: 1.6875em;
    585   font-style: italic;
    586   line-height: 1.2;
    587 }
    588 
    589584blockquote cite {
    590   font-size: 0.88889em;
     585  font-size: 0.71111em;
    591586  font-style: normal;
    592587  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
    … …  
    667662
    668663a:focus {
    669   outline: 0;
     664  outline: thin;
     665  outline-style: dotted;
    670666  text-decoration: underline;
    671667}
    … …  
    731727}
    732728
    733 img:before {
    734   background-color: #eee;
    735   border: 1px dashed #ccc;
    736   border-radius: 3px;
    737   content: " ";
    738   display: block;
    739   height: 100%;
    740   right: 0;
    741   position: absolute;
    742   top: 0;
    743   width: 100%;
    744 }
    745 
    746 img:after {
    747   color: #666;
    748   content: "This image is broken :-/ ( " attr(alt) " )";
    749   display: block;
    750   right: 50%;
    751   position: absolute;
    752   text-align: center;
    753   top: 50%;
    754   transform: translate(50%, -50%);
    755   width: 100%;
    756 }
    757 
    758729figure {
    759730  margin: 0;
    … …  
    763734  border-right: 2px solid #0073aa;
    764735  margin-right: -2rem;
    765   padding: 1rem 2rem 0.5rem 0;
     736  padding: 0 1rem 0 0;
    766737}
    767738
    … …  
    800771  line-height: 1.2;
    801772  outline: none;
    802   padding: 0.66rem 1rem;
     773  padding: 0.76rem 1rem;
     774  vertical-align: bottom;
    803775}
    804776
    … …  
    853825  box-sizing: border-box;
    854826  outline: none;
    855   padding: 0.5rem 0.66rem;
     827  padding: 0.36rem 0.66rem;
    856828}
    857829
    … …  
    909881
    910882a:focus {
    911   outline: 0;
     883  outline: thin dotted;
    912884  text-decoration: underline;
    913885}
    … …  
    918890/** === Main menu === */
    919891.main-navigation {
    920   display: inline;
     892  display: block;
     893  margin-top: 0.25rem;
    921894  /*
    922895         * :focus-within needs its own selector so other similar
    923896         * selectors don’t get ignored if a browser doesn’t recognize it
    924897         */
    925 }
    926 
    927 @media only screen and (min-width: 768px) {
    928   .main-navigation {
    929     display: block;
    930   }
     898  /* Only show one submenu expand button at a time (desktop vs mobile) */
    931899}
    932900
    … …  
    946914
    947915.main-navigation .main-menu > li {
     916  color: #0073aa;
    948917  display: inline;
     918}
     919
     920@media only screen and (min-width: 768px) {
     921  .main-navigation .main-menu > li {
     922    position: relative;
     923  }
    949924}
    950925
    … …  
    952927  font-weight: 700;
    953928  color: #0073aa;
     929  margin-left: 0.5rem;
    954930}
    955931
    956932.main-navigation .main-menu > li > a + svg {
    957   color: #0073aa;
    958   margin-left: -0.25rem;
    959 }
    960 
    961 .main-navigation .main-menu > li > a:hover {
    962   color: #005177;
    963 }
    964 
     933  margin-left: 0.5rem;
     934}
     935
     936.main-navigation .main-menu > li > a:hover,
    965937.main-navigation .main-menu > li > a:hover + svg {
    966938  color: #005177;
    967939}
    968940
    969 .main-navigation .main-menu > li > a:after {
    970   content: ",";
    971   display: inline;
    972   color: #767676;
    973 }
    974 
    975 .main-navigation .main-menu > li.menu-item-has-children:after {
    976   content: ",";
    977   display: inline;
    978   color: #767676;
     941.main-navigation .main-menu > li.menu-item-has-children {
     942  display: inline-block;
     943}
     944
     945.main-navigation .main-menu > li.menu-item-has-children > a {
     946  margin-left: 0.125rem;
    979947}
    980948
    … …  
    985953}
    986954
    987 .main-navigation .main-menu > li:last-child > a:after {
    988   content: ".";
     955.main-navigation .main-menu > li.menu-item-has-children .mobile-submenu-expand svg,
     956.main-navigation .main-menu > li.menu-item-has-children .desktop-submenu-expand svg {
     957  position: relative;
     958  top: 0.2rem;
     959}
     960
     961.main-navigation .main-menu > li.menu-item-has-children:not(:last-child) .mobile-submenu-expand,
     962.main-navigation .main-menu > li.menu-item-has-children:not(:last-child) .desktop-submenu-expand {
     963  margin-left: 0.5rem;
    989964}
    990965
    … …  
    1000975  display: none;
    1001976  float: right;
    1002   width: 100%;
    1003977  position: absolute;
    1004978  opacity: 0;
    1005   right: -999em;
     979  right: -999px;
    1006980  z-index: 99999;
    1007   transition: opacity 0.5s ease-in-out;
    1008981}
    1009982
    1010983@media only screen and (min-width: 768px) {
    1011984  .main-navigation .sub-menu {
     985    width: -webkit-max-content;
     986    width: -moz-max-content;
     987    width: max-content;
    1012988    max-width: calc(3 * (100vw / 12));
    1013989  }
    … …  
    1022998}
    1023999
    1024 .main-navigation .sub-menu > li.menu-item-has-children svg {
     1000.main-navigation .sub-menu > li.menu-item-has-children .mobile-submenu-expand,
     1001.main-navigation .sub-menu > li.menu-item-has-children .desktop-submenu-expand {
    10251002  position: absolute;
    1026   left: 0.5rem;
    1027   top: 0.65rem;
     1003  width: calc( 24px + 1rem);
     1004  left: 0;
     1005  top: calc( .125 * 1rem);
     1006  bottom: 0;
     1007  color: white;
     1008  line-height: 1;
     1009  padding: calc( .5 * 1rem);
     1010}
     1011
     1012.main-navigation .sub-menu > li.menu-item-has-children .mobile-submenu-expand svg,
     1013.main-navigation .sub-menu > li.menu-item-has-children .desktop-submenu-expand svg {
     1014  top: 0;
     1015}
     1016
     1017.main-navigation .sub-menu > li.menu-item-has-children:not(:last-child) .mobile-submenu-expand,
     1018.main-navigation .sub-menu > li.menu-item-has-children:not(:last-child) .desktop-submenu-expand {
     1019  margin-left: 0;
    10281020}
    10291021
    … …  
    10341026}
    10351027
    1036 .main-navigation .sub-menu > li > a {
     1028.main-navigation .sub-menu > li > a:not(.mobile-submenu-expand) {
    10371029  color: #fff;
    10381030  display: block;
    10391031  line-height: 1.2;
    1040   padding: calc( .5 * 1rem) 1rem;
    1041 }
    1042 
    1043 .main-navigation .sub-menu > li > a:hover, .main-navigation .sub-menu > li > a:focus {
     1032  padding: calc( .5 * 1rem) 1rem calc( .5 * 1rem) calc( 24px + 1rem);
     1033}
     1034
     1035.main-navigation .sub-menu > li > a:not(.mobile-submenu-expand):hover, .main-navigation .sub-menu > li > a:not(.mobile-submenu-expand):focus {
    10441036  background: #005177;
    10451037}
    10461038
    1047 .main-navigation .sub-menu > li > a:hover:after, .main-navigation .sub-menu > li > a:focus:after {
     1039.main-navigation .sub-menu > li > a:not(.mobile-submenu-expand):hover:after, .main-navigation .sub-menu > li > a:not(.mobile-submenu-expand):focus:after {
    10481040  background: #005177;
    10491041}
    10501042
    1051 .main-navigation .main-menu .menu-item-has-children:hover > .sub-menu,
    1052 .main-navigation .main-menu .menu-item-has-children .sub-menu:hover {
    1053   display: block;
    1054   right: inherit;
    1055   margin-top: -2px;
     1043.main-navigation .sub-menu > li.mobile-parent-nav-menu-item {
     1044  display: none;
     1045  font-size: 0.88889em;
     1046  font-weight: normal;
     1047}
     1048
     1049.main-navigation .sub-menu > li.mobile-parent-nav-menu-item svg {
     1050  position: relative;
     1051  top: 0.2rem;
     1052  margin-left: calc( .25 * 1rem);
     1053}
     1054
     1055.main-navigation .main-menu .menu-item-has-children:focus-within > .sub-menu {
     1056  display: block;
     1057  right: 0;
     1058  margin-top: 0;
    10561059  opacity: 1;
    1057 }
    1058 
    1059 .main-navigation .main-menu .menu-item-has-children:hover > .sub-menu .sub-menu,
    1060 .main-navigation .main-menu .menu-item-has-children .sub-menu:hover .sub-menu {
     1060  width: calc( 100vw - 2rem);
     1061}
     1062
     1063.main-navigation .main-menu .menu-item-has-children:focus-within > .sub-menu .sub-menu {
    10611064  margin-top: inherit;
    10621065  position: relative;
    … …  
    10651068
    10661069@media only screen and (min-width: 768px) {
     1070  .main-navigation .main-menu .menu-item-has-children:focus-within > .sub-menu .sub-menu {
     1071    padding-right: 0;
     1072    position: absolute;
     1073    right: 100%;
     1074    width: -webkit-max-content;
     1075    width: -moz-max-content;
     1076    width: max-content;
     1077    top: 0;
     1078  }
     1079}
     1080
     1081.main-navigation .main-menu .menu-item-has-children:hover > .sub-menu,
     1082.main-navigation .main-menu .menu-item-has-children:focus > .sub-menu,
     1083.main-navigation .main-menu .menu-item-has-children .sub-menu:hover,
     1084.main-navigation .main-menu .menu-item-has-children .sub-menu:focus {
     1085  display: table;
     1086  margin-top: 0;
     1087  opacity: 1;
     1088  /* Non-mobile position */
     1089}
     1090
     1091@media only screen and (min-width: 768px) {
     1092  .main-navigation .main-menu .menu-item-has-children:hover > .sub-menu,
     1093  .main-navigation .main-menu .menu-item-has-children:focus > .sub-menu,
     1094  .main-navigation .main-menu .menu-item-has-children .sub-menu:hover,
     1095  .main-navigation .main-menu .menu-item-has-children .sub-menu:focus {
     1096    position: absolute;
     1097    right: 0;
     1098    left: auto;
     1099    top: auto;
     1100    bottom: auto;
     1101    height: auto;
     1102    width: -webkit-max-content;
     1103    width: -moz-max-content;
     1104    width: max-content;
     1105    transform: none;
     1106    animation: fade_in 0.1s forwards;
     1107  }
     1108}
     1109
     1110@media only screen and (min-width: 768px) {
    10671111  .main-navigation .main-menu .menu-item-has-children:hover > .sub-menu .sub-menu,
    1068   .main-navigation .main-menu .menu-item-has-children .sub-menu:hover .sub-menu {
     1112  .main-navigation .main-menu .menu-item-has-children:focus > .sub-menu .sub-menu,
     1113  .main-navigation .main-menu .menu-item-has-children .sub-menu:hover .sub-menu,
     1114  .main-navigation .main-menu .menu-item-has-children .sub-menu:focus .sub-menu {
     1115    margin-top: inherit;
    10691116    padding-right: 0;
    10701117    position: absolute;
    … …  
    10741121}
    10751122
    1076 .main-navigation .main-menu .menu-item-has-children:focus-within > .sub-menu {
    1077   display: block;
    1078   right: inherit;
    1079   margin-top: -2px;
     1123.main-navigation .main-menu .menu-item-has-children.focus .sub-menu.expanded-true {
     1124  display: table;
     1125  margin-top: 0;
    10801126  opacity: 1;
    1081 }
    1082 
    1083 .main-navigation .main-menu .menu-item-has-children:focus-within > .sub-menu .sub-menu {
    1084   margin-top: inherit;
    1085   position: relative;
    1086   padding-right: 1rem;
    1087 }
    1088 
    1089 @media only screen and (min-width: 768px) {
    1090   .main-navigation .main-menu .menu-item-has-children:focus-within > .sub-menu .sub-menu {
    1091     padding-right: 0;
    1092     position: absolute;
    1093     right: 100%;
    1094     top: 0;
     1127  padding-right: 0;
     1128  /* Mobile position */
     1129  right: 0;
     1130  top: 0;
     1131  left: 0;
     1132  bottom: 0;
     1133  position: fixed;
     1134  z-index: 100000;
     1135  /* Make sure appears above mobile admin bar */
     1136  width: 100%;
     1137  height: 100%;
     1138  transform: translateX(-100%);
     1139  animation: slide_in_right 0.3s forwards;
     1140}
     1141
     1142.main-navigation .main-menu .menu-item-has-children.focus .sub-menu.expanded-true > .mobile-parent-nav-menu-item {
     1143  display: inline-block;
     1144}
     1145
     1146.main-navigation .desktop-submenu-expand {
     1147  display: none;
     1148}
     1149
     1150@media only screen and (min-width: 768px) {
     1151  .main-navigation .desktop-submenu-expand {
     1152    display: inline-block;
     1153  }
     1154}
     1155
     1156.main-navigation .mobile-submenu-expand {
     1157  display: inline-block;
     1158}
     1159
     1160@media only screen and (min-width: 768px) {
     1161  .main-navigation .mobile-submenu-expand {
     1162    display: none;
     1163  }
     1164}
     1165
     1166/* Menu Animation */
     1167@keyframes slide_in_right {
     1168  100% {
     1169    transform: translateX(0%);
     1170  }
     1171}
     1172
     1173@keyframes fade_in {
     1174  from {
     1175    opacity: 0;
     1176  }
     1177  to {
     1178    opacity: 1;
    10951179  }
    10961180}
    … …  
    11591243}
    11601244
     1245@media only screen and (min-width: 768px) {
     1246  .post-navigation {
     1247    margin: calc(3 * 1rem) calc(2 * (100vw / 12));
     1248    max-width: calc(6 * (100vw / 12));
     1249  }
     1250}
     1251
     1252@media only screen and (min-width: 1168px) {
     1253  .post-navigation {
     1254    margin: calc(3 * 1rem) 0;
     1255    max-width: 100%;
     1256  }
     1257}
     1258
    11611259.post-navigation .nav-links {
    11621260  margin: 0 1rem;
    … …  
    11641262  display: flex;
    11651263  flex-direction: column;
     1264}
     1265
     1266@media only screen and (min-width: 768px) {
     1267  .post-navigation .nav-links {
     1268    margin: 0;
     1269  }
    11661270}
    11671271
    … …  
    12321336  .post-navigation .nav-links .nav-next {
    12331337    order: 2;
     1338    padding-right: 1rem;
    12341339  }
    12351340}
    … …  
    12801385  display: flex;
    12811386  flex-direction: row;
     1387  margin: 0 1rem;
     1388}
     1389
     1390@media only screen and (min-width: 1168px) {
     1391  .comment-navigation .nav-links {
     1392    margin: 0 calc(2 * (100vw / 12));
     1393    max-width: calc(8 * (100vw / 12));
     1394  }
    12821395}
    12831396
    … …  
    12861399  min-width: 50%;
    12871400  width: 100%;
     1401  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
     1402  font-weight: bold;
    12881403}
    12891404
    … …  
    14501565  .site-branding {
    14511566    margin: 0 calc(2 * (100vw / 12));
    1452     max-width: 22em;
    14531567  }
    14541568}
    … …  
    14641578    margin-bottom: 0;
    14651579    position: absolute;
    1466     left: calc(100% + (0.5 * calc(100vw / 12)));
     1580    left: calc(100% + (0.5 * 100vw / 12));
    14671581    top: 4px;
    14681582    z-index: 999;
    … …  
    14991613  margin: auto;
    15001614  display: inline;
     1615  /* When there is no description set, make sure navigation appears below title. */
     1616}
     1617
     1618.site-title a:link,
     1619.site-title a:visited {
    15011620  color: #111;
    1502   /* When there is no description set, make sure navigation appears below title. */
    15031621}
    15041622
    … …  
    15291647    display: inline;
    15301648  }
     1649}
     1650
     1651.site-title:not(:empty) + .site-description:not(:empty):before {
     1652  content: "\2014";
     1653  margin: 0 .2em;
    15311654}
    15321655
    … …  
    15361659  font-weight: normal;
    15371660  margin: 0;
    1538 }
    1539 
    1540 .site-description:not(:empty):before {
    1541   content: "\2014";
    1542   margin: 0 .2em;
    15431661}
    15441662
    … …  
    15491667  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
    15501668  /* Set white text color when featured image is set. */
    1551   /* Post header styles */
     1669  /* add focus state to social media icons */
     1670  /* Entry header */
    15521671  /* Custom Logo Link */
    15531672  /* Make sure important elements are above pseudo elements used for effects. */
    … …  
    15621681  /* Second layer: screen. */
    15631682  /* Third layer: multiply. */
     1683  /* When image filters are inactive, a black overlay is added. */
    15641684  /* Fourth layer: overlay. */
    15651685  /* Fifth layer: readability overlay */
    … …  
    15741694.site-header.featured-image .entry-meta,
    15751695.site-header.featured-image .entry-title {
    1576   color: white;
     1696  color: #fff;
    15771697}
    15781698
    15791699.site-header.featured-image .main-navigation a,
     1700.site-header.featured-image .main-navigation a + svg,
    15801701.site-header.featured-image .social-navigation a,
    15811702.site-header.featured-image .site-title a,
    1582 .site-header.featured-image .hentry a {
    1583   color: white;
     1703.site-header.featured-image .site-featured-image a {
     1704  color: #fff;
    15841705  transition: opacity 110ms ease-in-out;
    15851706}
    15861707
    15871708.site-header.featured-image .main-navigation a:hover, .site-header.featured-image .main-navigation a:active,
     1709.site-header.featured-image .main-navigation a:hover + svg,
     1710.site-header.featured-image .main-navigation a:active + svg,
     1711.site-header.featured-image .main-navigation a + svg:hover,
     1712.site-header.featured-image .main-navigation a + svg:active,
     1713.site-header.featured-image .main-navigation a + svg:hover + svg,
     1714.site-header.featured-image .main-navigation a + svg:active + svg,
    15881715.site-header.featured-image .social-navigation a:hover,
    15891716.site-header.featured-image .social-navigation a:active,
     1717.site-header.featured-image .social-navigation a:hover + svg,
     1718.site-header.featured-image .social-navigation a:active + svg,
    15901719.site-header.featured-image .site-title a:hover,
    15911720.site-header.featured-image .site-title a:active,
    1592 .site-header.featured-image .hentry a:hover,
    1593 .site-header.featured-image .hentry a:active {
    1594   color: white;
     1721.site-header.featured-image .site-title a:hover + svg,
     1722.site-header.featured-image .site-title a:active + svg,
     1723.site-header.featured-image .site-featured-image a:hover,
     1724.site-header.featured-image .site-featured-image a:active,
     1725.site-header.featured-image .site-featured-image a:hover + svg,
     1726.site-header.featured-image .site-featured-image a:active + svg {
     1727  color: #fff;
    15951728  opacity: 0.6;
    15961729}
    15971730
    15981731.site-header.featured-image .main-navigation a:focus,
     1732.site-header.featured-image .main-navigation a:focus + svg,
     1733.site-header.featured-image .main-navigation a + svg:focus,
     1734.site-header.featured-image .main-navigation a + svg:focus + svg,
    15991735.site-header.featured-image .social-navigation a:focus,
     1736.site-header.featured-image .social-navigation a:focus + svg,
    16001737.site-header.featured-image .site-title a:focus,
    1601 .site-header.featured-image .hentry a:focus {
    1602   color: white;
     1738.site-header.featured-image .site-title a:focus + svg,
     1739.site-header.featured-image .site-featured-image a:focus,
     1740.site-header.featured-image .site-featured-image a:focus + svg {
     1741  color: #fff;
    16031742}
    16041743
    16051744.site-header.featured-image .social-navigation a:focus {
    1606   color: white;
     1745  color: #fff;
    16071746  opacity: 1;
    1608   border-bottom: 1px solid white;
     1747  border-bottom: 1px solid #fff;
    16091748}
    16101749
    16111750.site-header.featured-image .social-navigation svg,
    1612 .site-header.featured-image .hentry svg {
     1751.site-header.featured-image .site-featured-image svg {
    16131752  /* Use -webkit- only if supporting: Chrome < 54, iOS < 9.3, Android < 4.4.4 */
    16141753  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.35));
    16151754}
    16161755
    1617 .site-header.featured-image .hentry .entry-header {
     1756.site-header.featured-image .site-featured-image .entry-header {
     1757  margin-bottom: 0;
    16181758  margin-right: 0;
    16191759  margin-left: 0;
    1620 }
    1621 
    1622 @media only screen and (min-width: 768px) {
    1623   .site-header.featured-image .hentry .entry-header {
     1760  /* Entry meta */
     1761}
     1762
     1763@media only screen and (min-width: 768px) {
     1764  .site-header.featured-image .site-featured-image .entry-header {
    16241765    margin-right: calc(2 * (100vw / 12));
    16251766    margin-left: calc(2 * (100vw / 12));
    … …  
    16271768}
    16281769
    1629 .site-header.featured-image .hentry .entry-header .entry-title:before {
    1630   background: white;
     1770.site-header.featured-image .site-featured-image .entry-header .entry-title:before {
     1771  background: #fff;
     1772}
     1773
     1774.site-header.featured-image .site-featured-image .entry-header .entry-meta {
     1775  font-weight: 500;
     1776}
     1777
     1778.site-header.featured-image .site-featured-image .entry-header .entry-meta > span {
     1779  margin-left: 1rem;
     1780  display: inline-block;
     1781}
     1782
     1783.site-header.featured-image .site-featured-image .entry-header .entry-meta > span:last-child {
     1784  margin-left: 0;
     1785}
     1786
     1787.site-header.featured-image .site-featured-image .entry-header .entry-meta a {
     1788  transition: color 110ms ease-in-out;
     1789  color: currentColor;
     1790}
     1791
     1792.site-header.featured-image .site-featured-image .entry-header .entry-meta a:hover {
     1793  text-decoration: none;
     1794}
     1795
     1796.site-header.featured-image .site-featured-image .entry-header .entry-meta .svg-icon {
     1797  position: relative;
     1798  display: inline-block;
     1799  vertical-align: middle;
     1800  margin-left: 0.5em;
     1801}
     1802
     1803.site-header.featured-image .site-featured-image .entry-header .entry-meta .discussion-avatar-list {
     1804  display: none;
     1805}
     1806
     1807@media only screen and (min-width: 768px) {
     1808  .site-header.featured-image .site-featured-image .entry-header.has-discussion .entry-meta {
     1809    display: flex;
     1810    position: relative;
     1811  }
     1812  .site-header.featured-image .site-featured-image .entry-header.has-discussion .entry-title {
     1813    padding-left: calc(1 * (100vw / 12) + 1rem);
     1814  }
     1815  .site-header.featured-image .site-featured-image .entry-header.has-discussion .entry-meta .comment-count {
     1816    position: absolute;
     1817    left: 0;
     1818  }
     1819  .site-header.featured-image .site-featured-image .entry-header.has-discussion .entry-meta .discussion-avatar-list {
     1820    display: block;
     1821    position: absolute;
     1822    bottom: 100%;
     1823  }
    16311824}
    16321825
    16331826.site-header.featured-image .custom-logo-link {
    1634   background: white;
     1827  background: #fff;
    16351828  box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    16361829}
    … …  
    16401833}
    16411834
    1642 .site-header.featured-image .site-branding,
    1643 .site-header.featured-image .hentry .entry-header {
     1835.site-header.featured-image .site-branding {
     1836  position: relative;
    16441837  z-index: 10;
     1838}
     1839
     1840.site-header.featured-image .site-featured-image .entry-header {
     1841  position: relative;
     1842  z-index: 9;
    16451843}
    16461844
    16471845.site-header.featured-image .site-branding-container:before,
    16481846.site-header.featured-image .site-branding-container:after,
    1649 .site-header.featured-image .hentry:before,
    1650 .site-header.featured-image .hentry:after, .site-header.featured-image:after {
     1847.site-header.featured-image .site-featured-image:before,
     1848.site-header.featured-image .site-featured-image:after, .site-header.featured-image:after {
    16511849  display: block;
    16521850  position: absolute;
    … …  
    16621860  background-repeat: no-repeat;
    16631861  background-size: cover;
     1862  z-index: 1;
     1863  /* When image filters are active, make it grayscale to colorize it blue. */
     1864}
     1865
     1866.image-filters-enabled .site-header.featured-image .site-branding-container:before {
    16641867  filter: grayscale(100%);
    1665   z-index: 1;
    1666 }
    1667 
    1668 .site-header.featured-image .hentry:before {
     1868}
     1869
     1870.image-filters-enabled .site-header.featured-image .site-featured-image:before {
    16691871  background: #0073aa;
    16701872  mix-blend-mode: screen;
    16711873  opacity: 0.1;
    1672   z-index: 2;
    1673 }
    1674 
    1675 .site-header.featured-image .hentry:after {
     1874}
     1875
     1876.site-header.featured-image .site-featured-image:after {
     1877  background: #000;
     1878  mix-blend-mode: multiply;
     1879  opacity: .7;
     1880  /* When image filters are active, a blue overlay is added. */
     1881}
     1882
     1883.image-filters-enabled .site-header.featured-image .site-featured-image:after {
    16761884  background: #0073aa;
    1677   mix-blend-mode: multiply;
    1678   opacity: 1;
     1885  opacity: .8;
    16791886  z-index: 3;
    1680 }
    1681 
    1682 .site-header.featured-image .site-branding-container:after {
    1683   background: rgba(255, 255, 255, 0.35);
     1887  /* Browsers supporting mix-blend-mode don't need opacity < 1 */
     1888}
     1889
     1890@supports (mix-blend-mode: multiply) {
     1891  .image-filters-enabled .site-header.featured-image .site-featured-image:after {
     1892    opacity: 1;
     1893  }
     1894}
     1895
     1896.image-filters-enabled .site-header.featured-image .site-branding-container:after {
     1897  background: rgba(0, 0, 0, 0.35);
    16841898  mix-blend-mode: overlay;
    16851899  opacity: 0.5;
    16861900  z-index: 4;
     1901  /* Browsers supporting mix-blend-mode can have a light overlay */
     1902}
     1903
     1904@supports (mix-blend-mode: overlay) {
     1905  .image-filters-enabled .site-header.featured-image .site-branding-container:after {
     1906    background: rgba(255, 255, 255, 0.35);
     1907  }
    16871908}
    16881909
    16891910.site-header.featured-image:after {
    1690   background: #000e14;
     1911  background: #000;
    16911912  /**
    16921913                 * Add a transition to the readability overlay, to add a subtle
    … …  
    16941915                 */
    16951916  transition: opacity 1200ms ease-in-out;
     1917  opacity: 0.7;
    16961918  z-index: 5;
     1919  /* When image filters are active, a blue overlay is added. */
     1920}
     1921
     1922.image-filters-enabled .site-header.featured-image:after {
     1923  background: #000e14;
    16971924  opacity: 0.38;
    16981925}
    16991926
    17001927@media only screen and (min-width: 768px) {
    1701   .site-header.featured-image:after {
     1928  .image-filters-enabled .site-header.featured-image:after {
    17021929    opacity: 0.18;
    1703   }
    1704 }
    1705 
    1706 @media only screen and (min-width: 1168px) {
    1707   .site-header.featured-image:after {
    1708     opacity: 0.1;
    17091930  }
    17101931}
    … …  
    17471968}
    17481969
    1749 .hentry {
     1970.entry {
    17501971  margin-top: calc(6 * 1rem);
    17511972}
    17521973
    1753 .hentry:first-of-type {
     1974.entry:first-of-type {
    17541975  margin-top: 0;
    17551976}
    17561977
    1757 .hentry .entry-header {
     1978.entry .entry-header {
    17581979  margin: calc(3 * 1rem) 1rem 1rem;
    17591980  position: relative;
    … …  
    17611982
    17621983@media only screen and (min-width: 768px) {
    1763   .hentry .entry-header {
     1984  .entry .entry-header {
    17641985    margin: calc(3 * 1rem) calc(2 * (100vw / 12 )) 1rem;
    17651986  }
    1766   .featured-image .hentry .entry-header {
    1767     margin-bottom: 0;
    1768   }
    1769 }
    1770 
    1771 .hentry .entry-title {
     1987}
     1988
     1989.entry .entry-title {
    17721990  margin: 0;
    17731991}
    17741992
    1775 .hentry .entry-title:before {
     1993.entry .entry-title:before {
    17761994  background: #767676;
    17771995  content: "\020";
    … …  
    17822000}
    17832001
    1784 .hentry .entry-title a {
     2002.entry .entry-title a {
    17852003  color: inherit;
    17862004}
    17872005
    1788 .hentry .entry-title a:hover {
     2006.entry .entry-title a:hover {
    17892007  color: #4a4a4a;
    17902008}
    17912009
    1792 .hentry .entry-meta,
    1793 .hentry .entry-footer {
     2010.entry .entry-meta,
     2011.entry .entry-footer {
    17942012  color: #767676;
    17952013  font-weight: 500;
    17962014}
    17972015
    1798 .hentry .entry-meta > span,
    1799 .hentry .entry-footer > span {
     2016.entry .entry-meta > span,
     2017.entry .entry-footer > span {
    18002018  margin-left: 1rem;
    1801 }
    1802 
    1803 .hentry .entry-meta > span:last-child,
    1804 .hentry .entry-footer > span:last-child {
     2019  display: inline-block;
     2020}
     2021
     2022.entry .entry-meta > span:last-child,
     2023.entry .entry-footer > span:last-child {
    18052024  margin-left: 0;
    18062025}
    18072026
    1808 .hentry .entry-meta a,
    1809 .hentry .entry-footer a {
     2027.entry .entry-meta a,
     2028.entry .entry-footer a {
    18102029  transition: color 110ms ease-in-out;
    18112030  color: currentColor;
    18122031}
    18132032
    1814 .hentry .entry-meta a:hover,
    1815 .hentry .entry-footer a:hover {
     2033.entry .entry-meta a:hover,
     2034.entry .entry-footer a:hover {
    18162035  text-decoration: none;
    18172036  color: #0073aa;
    18182037}
    18192038
    1820 .hentry .entry-meta .svg-icon,
    1821 .hentry .entry-footer .svg-icon {
     2039.entry .entry-meta .svg-icon,
     2040.entry .entry-footer .svg-icon {
    18222041  position: relative;
    18232042  display: inline-block;
    … …  
    18262045}
    18272046
    1828 .hentry .entry-meta {
     2047.entry .entry-meta {
    18292048  margin: 1rem 0;
    18302049}
    18312050
    1832 @media only screen and (min-width: 1168px) {
    1833   .hentry .entry-meta.has-discussion .comment-count {
    1834     float: left;
    1835     position: relative;
    1836   }
    1837 }
    1838 
    1839 .hentry .entry-meta.has-discussion .comment-count .discussion-avatar-list {
    1840   display: none;
    1841 }
    1842 
    1843 @media only screen and (min-width: 1168px) {
    1844   .hentry .entry-meta.has-discussion .comment-count .discussion-avatar-list {
    1845     bottom: 100%;
    1846     display: block;
    1847     position: absolute;
    1848   }
    1849 }
    1850 
    1851 .hentry .entry-footer {
     2051.entry .entry-footer {
    18522052  margin: calc(2 * 1rem) 1rem 1rem;
    18532053}
    18542054
    18552055@media only screen and (min-width: 768px) {
    1856   .hentry .entry-footer {
    1857     margin: calc(3 * 1rem) calc(2 * (100vw / 12));
     2056  .entry .entry-footer {
     2057    margin: 1rem calc(2 * (100vw / 12)) calc(3 * 1rem);
    18582058    max-width: calc(8 * (100vw / 12));
    18592059  }
    … …  
    18612061
    18622062@media only screen and (min-width: 768px) {
    1863   .hentry .entry-footer {
     2063  .entry .entry-footer {
    18642064    max-width: calc(6 * (100vw / 12));
    18652065  }
    18662066}
    18672067
    1868 .hentry .post-thumbnail {
     2068.entry .post-thumbnail {
    18692069  margin: 1rem;
    18702070}
    18712071
    18722072@media only screen and (min-width: 768px) {
    1873   .hentry .post-thumbnail {
     2073  .entry .post-thumbnail {
    18742074    margin: 1rem calc(2 * (100vw / 12));
    18752075  }
    18762076}
    18772077
    1878 .hentry .post-thumbnail:focus {
     2078.entry .post-thumbnail:focus {
    18792079  outline: none;
    18802080}
    18812081
    1882 .hentry .post-thumbnail .post-thumbnail-inner {
    1883   display: block;
    1884 }
    1885 
    1886 .hentry .post-thumbnail .post-thumbnail-inner img {
     2082.entry .post-thumbnail .post-thumbnail-inner {
     2083  display: block;
     2084}
     2085
     2086.entry .post-thumbnail .post-thumbnail-inner img {
    18872087  position: relative;
    18882088  display: block;
    … …  
    18902090}
    18912091
    1892 .image-filters-enabled .hentry .post-thumbnail {
     2092.image-filters-enabled .entry .post-thumbnail {
    18932093  position: relative;
    18942094  display: block;
    18952095}
    18962096
    1897 .image-filters-enabled .hentry .post-thumbnail .post-thumbnail-inner {
    1898   position: relative;
     2097.image-filters-enabled .entry .post-thumbnail .post-thumbnail-inner {
    18992098  filter: grayscale(100%);
    1900   z-index: 1;
    1901 }
    1902 
    1903 .image-filters-enabled .hentry .post-thumbnail .post-thumbnail-inner:after {
    1904   display: block;
     2099}
     2100
     2101.image-filters-enabled .entry .post-thumbnail .post-thumbnail-inner:after {
     2102  background: rgba(0, 0, 0, 0.35);
     2103  content: "";
     2104  display: block;
     2105  height: 100%;
     2106  opacity: .5;
     2107  pointer-events: none;
     2108  position: absolute;
     2109  top: 0;
    19052110  width: 100%;
    1906   height: 100%;
    1907   z-index: 10;
    1908 }
    1909 
    1910 .image-filters-enabled .hentry .post-thumbnail:before, .image-filters-enabled .hentry .post-thumbnail:after {
     2111  z-index: 4;
     2112}
     2113
     2114@supports (mix-blend-mode: multiply) {
     2115  .image-filters-enabled .entry .post-thumbnail .post-thumbnail-inner:after {
     2116    display: none;
     2117  }
     2118}
     2119
     2120.image-filters-enabled .entry .post-thumbnail:before, .image-filters-enabled .entry .post-thumbnail:after {
    19112121  position: absolute;
    19122122  display: block;
    … …  
    19162126  right: 0;
    19172127  content: "\020";
    1918   display: block;
    19192128  pointer-events: none;
    19202129}
    19212130
    1922 .image-filters-enabled .hentry .post-thumbnail:before {
     2131.image-filters-enabled .entry .post-thumbnail:before {
    19232132  background: #0073aa;
    19242133  mix-blend-mode: screen;
    … …  
    19272136}
    19282137
    1929 .image-filters-enabled .hentry .post-thumbnail:after {
     2138.image-filters-enabled .entry .post-thumbnail:after {
    19302139  background: #0073aa;
    19312140  mix-blend-mode: multiply;
    1932   opacity: 1;
     2141  opacity: .8;
    19332142  z-index: 3;
    1934 }
    1935 
    1936 .hentry .entry-content .more-link {
     2143  /* Browsers supporting mix-blend-mode don't need opacity < 1 */
     2144}
     2145
     2146@supports (mix-blend-mode: multiply) {
     2147  .image-filters-enabled .entry .post-thumbnail:after {
     2148    opacity: 1;
     2149  }
     2150}
     2151
     2152.entry .entry-content p {
     2153  word-wrap: break-word;
     2154}
     2155
     2156.entry .entry-content .more-link {
    19372157  transition: color 110ms ease-in-out;
    19382158  display: inline;
    … …  
    19402160}
    19412161
    1942 .hentry .entry-content .more-link:after {
    1943   content: "»";
     2162.entry .entry-content .more-link:after {
     2163  content: "\02192";
    19442164  margin-right: 0.5em;
    19452165}
    19462166
    1947 .hentry .entry-content .more-link:hover {
     2167.entry .entry-content .more-link:hover {
    19482168  color: #0073aa;
    19492169  text-decoration: none;
    19502170}
    19512171
    1952 .hentry .entry-content a {
     2172.entry .entry-content a {
    19532173  text-decoration: underline;
    19542174}
    19552175
    1956 .hentry .entry-content a:hover {
     2176.entry .entry-content a:hover {
    19572177  text-decoration: none;
    19582178}
    19592179
    1960 .hentry .entry-content > iframe[style] {
     2180.entry .entry-content > iframe[style] {
    19612181  margin: 32px 1rem !important;
    19622182  max-width: calc(100vw - (2 * 1rem)) !important;
    … …  
    19642184
    19652185@media only screen and (min-width: 768px) {
    1966   .hentry .entry-content > iframe[style] {
     2186  .entry .entry-content > iframe[style] {
    19672187    margin: 32px calc(2 * (100vw / 12)) !important;
    19682188    max-width: calc(8 * (100vw / 12)) !important;
    … …  
    19712191
    19722192@media only screen and (min-width: 1168px) {
    1973   .hentry .entry-content > iframe[style] {
     2193  .entry .entry-content > iframe[style] {
    19742194    max-width: calc(6 * (100vw / 12)) !important;
    19752195  }
    19762196}
    19772197
    1978 .hentry .entry-content .wp-audio-shortcode {
     2198.entry .entry-content .wp-audio-shortcode {
    19792199  max-width: calc(100vw - (2 * 1rem));
    19802200}
    19812201
    19822202@media only screen and (min-width: 768px) {
    1983   .hentry .entry-content .wp-audio-shortcode {
     2203  .entry .entry-content .wp-audio-shortcode {
    19842204    max-width: calc(8 * (100vw / 12));
    19852205  }
    … …  
    19872207
    19882208@media only screen and (min-width: 1168px) {
    1989   .hentry .entry-content .wp-audio-shortcode {
     2209  .entry .entry-content .wp-audio-shortcode {
    19902210    max-width: calc(6 * (100vw / 12));
    19912211  }
     2212}
     2213
     2214/* Author description */
     2215.author-bio {
     2216  margin: calc(2 * 1rem) 1rem 1rem;
     2217}
     2218
     2219@media only screen and (min-width: 768px) {
     2220  .author-bio {
     2221    margin: calc(3 * 1rem) calc(2 * (100vw / 12));
     2222    max-width: calc(8 * (100vw / 12));
     2223  }
     2224}
     2225
     2226@media only screen and (min-width: 768px) {
     2227  .author-bio {
     2228    max-width: calc(6 * (100vw / 12));
     2229  }
     2230}
     2231
     2232.author-bio .author-title {
     2233  display: inline;
     2234}
     2235
     2236.author-bio .author-title:before {
     2237  background: #767676;
     2238  content: "\020";
     2239  display: block;
     2240  height: 2px;
     2241  margin: 1rem 0;
     2242  width: 1em;
     2243}
     2244
     2245.author-bio .author-description {
     2246  display: inline;
     2247  color: #767676;
     2248  font-size: 1.125em;
     2249  line-height: 1.2;
     2250}
     2251
     2252.author-bio .author-description .author-link {
     2253  display: inline-block;
     2254}
     2255
     2256.author-bio .author-description .author-link:hover {
     2257  color: #005177;
     2258  text-decoration: none;
    19922259}
    19932260
    … …  
    20052272.comments-area {
    20062273  /* Add extra margin when the comments section is located immediately after the
    2007          * post itself (this happens on pages). 
     2274         * post itself (this happens on pages).
    20082275         */
    20092276}
    20102277
    2011 .hentry + .comments-area {
     2278.entry + .comments-area {
    20122279  margin-top: calc(3 * 1rem);
    20132280}
    20142281
    2015 .comments-area .comments-title-wrap,
    20162282.comments-area .comment-list,
     2283.comments-area .comment-navigation,
    20172284.comments-area > .comment-respond,
    20182285.comments-area .comment-form-flex,
    … …  
    20222289
    20232290@media only screen and (min-width: 768px) {
    2024   .comments-area .comments-title-wrap,
    20252291  .comments-area .comment-list,
     2292  .comments-area .comment-navigation,
    20262293  .comments-area > .comment-respond,
    20272294  .comments-area .comment-form-flex,
    … …  
    20332300
    20342301.comments-area .comments-title-wrap {
    2035   align-items: baseline;
    2036   display: flex;
    2037   justify-content: space-between;
     2302  margin: calc(2 * 1rem) 1rem;
     2303}
     2304
     2305@media only screen and (min-width: 768px) {
     2306  .comments-area .comments-title-wrap {
     2307    align-items: baseline;
     2308    display: flex;
     2309    justify-content: space-between;
     2310    margin: calc(3 * 1rem) calc(2 * (100vw / 12));
     2311    max-width: calc(8 * (100vw / 12));
     2312  }
    20382313}
    20392314
    … …  
    20512326}
    20522327
     2328@media only screen and (min-width: 768px) {
     2329  .comments-area .comments-title-wrap .comments-title {
     2330    flex: 1 0 calc(3 * (100vw / 12));
     2331  }
     2332}
     2333
     2334@media only screen and (min-width: 768px) {
     2335  .comments-area .comments-title-wrap .discussion-meta {
     2336    flex: 0 0 calc(2 * (100vw / 12));
     2337    margin-right: 1rem;
     2338  }
     2339}
     2340
    20532341#comment {
    20542342  max-width: 100%;
    … …  
    20612349
    20622350#respond .comment-user-avatar {
    2063   display: none;
     2351  margin: 1rem 0 -1rem;
    20642352}
    20652353
    … …  
    20792367#comments > .comments-title:last-child {
    20802368  display: none;
    2081 }
    2082 
    2083 @media only screen and (min-width: 1168px) {
    2084   #comments > #respond .comment-user-avatar {
    2085     position: absolute;
    2086     display: block;
    2087     top: 0;
    2088     right: 0;
    2089   }
    2090   #comments > #respond .comment-user-avatar .avatar {
    2091     display: block;
    2092   }
    20932369}
    20942370
    … …  
    22162492  position: absolute;
    22172493  background: #008fd3;
    2218   left: calc(100% + 0.25rem);
     2494  left: calc(100% - 2.5rem);
    22192495  top: -3px;
    22202496  width: 18px;
     2497}
     2498
     2499@media only screen and (min-width: 768px) {
     2500  .comment .comment-author .post-author-badge {
     2501    left: calc(100% + 0.75rem);
     2502  }
    22212503}
    22222504
    … …  
    23412623  height: calc(1.5 * 1rem);
    23422624  width: calc(1.5 * 1rem);
    2343 }
    2344 
    2345 .discussion-meta .discussion-avatar-list {
    2346   display: inline-block;
    2347   margin-left: 8px;
    23482625}
    23492626
    … …  
    24402717}
    24412718
    2442 @media only screen and (min-width: 768px) {
    2443   .hfeed .hentry .entry-header {
     2719.archive .page-header .page-description {
     2720  display: block;
     2721  color: #111;
     2722  font-size: 1em;
     2723}
     2724
     2725@media only screen and (min-width: 768px) {
     2726  .hfeed .entry .entry-header {
    24442727    margin: calc(3 * 1rem) calc(2 * (100vw / 12)) calc(1rem / 2);
    24452728  }
    … …  
    24742757--------------------------------------------------------------*/
    24752758/* Site footer */
    2476 .site-footer {
    2477   color: #767676;
    2478 }
    2479 
    2480 .site-footer .site-info {
     2759#colophon .widget-area,
     2760#colophon .site-info {
    24812761  margin: calc(2 * 1rem) 1rem;
    24822762}
    24832763
    24842764@media only screen and (min-width: 768px) {
    2485   .site-footer .site-info {
     2765  #colophon .widget-area,
     2766  #colophon .site-info {
    24862767    margin: calc(3 * 1rem) calc(2 * (100vw / 12));
    24872768    max-width: calc(8 * (100vw / 12));
    … …  
    24892770}
    24902771
    2491 .site-footer .site-info .imprint {
     2772#colophon .widget-area .imprint,
     2773#colophon .site-info .imprint {
    24922774  margin-left: 1rem;
    24932775}
    24942776
    2495 .site-footer a {
     2777#colophon .site-info a {
    24962778  color: inherit;
    24972779}
    24982780
    2499 .site-footer a:hover {
     2781#colophon .site-info a:hover {
    25002782  text-decoration: none;
    25012783  color: #0073aa;
     2784}
     2785
     2786#colophon .widget-column {
     2787  display: flex;
     2788  flex-wrap: wrap;
     2789}
     2790
     2791#colophon .widget-column .widget {
     2792  width: 100%;
     2793}
     2794
     2795@media only screen and (min-width: 1168px) {
     2796  #colophon .widget-column .widget {
     2797    margin-left: calc(3 * 1rem);
     2798    width: calc(50% - (3 * 1rem));
     2799  }
     2800}
     2801
     2802#colophon .site-info {
     2803  color: #767676;
    25022804}
    25032805
    … …  
    25102812.widget select {
    25112813  max-width: 100%;
     2814}
     2815
     2816.widget a {
     2817  color: #0073aa;
     2818}
     2819
     2820.widget a:hover {
     2821  color: #005177;
     2822}
     2823
     2824.widget_archive ul,
     2825.widget_nav_menu ul,
     2826.widget_meta ul,
     2827.widget_recent_entries ul,
     2828.widget_rss ul {
     2829  padding: 0;
     2830  list-style: none;
     2831}
     2832
     2833.widget_archive ul li,
     2834.widget_nav_menu ul li,
     2835.widget_meta ul li,
     2836.widget_recent_entries ul li,
     2837.widget_rss ul li {
     2838  color: #767676;
     2839  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
     2840  font-size: calc(22px * 1.6875);
     2841  font-weight: bold;
     2842  line-height: 1.2;
     2843}
     2844
     2845.widget_archive ul li:not(.menu-item-has-children),
     2846.widget_nav_menu ul li:not(.menu-item-has-children),
     2847.widget_meta ul li:not(.menu-item-has-children),
     2848.widget_recent_entries ul li:not(.menu-item-has-children),
     2849.widget_rss ul li:not(.menu-item-has-children) {
     2850  padding-bottom: 0.75rem;
     2851}
     2852
     2853.widget_archive ul li ul,
     2854.widget_nav_menu ul li ul,
     2855.widget_meta ul li ul,
     2856.widget_recent_entries ul li ul,
     2857.widget_rss ul li ul {
     2858  padding-right: 1rem;
     2859}
     2860
     2861.widget_archive ul.sub-menu,
     2862.widget_nav_menu ul.sub-menu,
     2863.widget_meta ul.sub-menu,
     2864.widget_recent_entries ul.sub-menu,
     2865.widget_rss ul.sub-menu {
     2866  padding-top: 0.75rem;
     2867}
     2868
     2869.widget_search .search-submit {
     2870  display: block;
     2871  margin-top: 1rem;
    25122872}
    25132873
    … …  
    25652925  .entry-content > *.alignwide,
    25662926  .entry-summary > *.alignwide {
    2567     margin-right: calc(1 * (100vw / 12));
    2568     margin-left: calc(1 * (100vw / 12));
    2569     max-width: calc(10 * (100vw / 12));
     2927    margin-right: calc(2 * (100vw / 12));
     2928    margin-left: calc(2 * (100vw / 12));
     2929    max-width: calc(8 * (100vw / 12));
    25702930  }
    25712931}
    … …  
    26172977    margin-right: calc(2 * 1rem);
    26182978    margin-left: calc(2 * (100vw / 12));
     2979  }
     2980}
     2981
     2982.entry-content > *.aligncenter,
     2983.entry-summary > *.aligncenter {
     2984  margin-right: auto;
     2985  margin-left: auto;
     2986}
     2987
     2988@media only screen and (min-width: 1168px) {
     2989  .entry-content > *.aligncenter,
     2990  .entry-summary > *.aligncenter {
     2991    margin-right: calc(2 * (100vw / 12));
     2992    margin-left: calc(2 * (100vw / 12));
     2993    max-width: calc(10 * (100vw / 12));
     2994    position: relative;
     2995    right: 25%;
     2996    transform: translate(50%);
    26192997  }
    26202998}
    … …  
    26603038  box-sizing: border-box;
    26613039  font-weight: bold;
    2662   padding: 0.66rem 1rem;
     3040  text-decoration: none;
     3041  padding: 0.76rem 1rem;
    26633042  outline: none;
    26643043  color: white;
    … …  
    26883067  transition: all 150ms ease-in-out;
    26893068  background: transparent;
    2690   border: 2px solid #0073aa;
    2691 }
    2692 
    2693 .entry-content .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color),
    2694 .entry-content .wp-block-button.is-style-outline .wp-block-button__link:focus:not(.has-text-color),
    2695 .entry-content .wp-block-button.is-style-outline .wp-block-button__link:active:not(.has-text-color) {
     3069  border: 2px solid currentColor;
    26963070  color: #0073aa;
    26973071}
    26983072
    26993073.entry-content .wp-block-button.is-style-outline .wp-block-button__link:hover {
    2700   border-color: #111;
    27013074  color: #111;
    27023075}
    … …  
    27193092}
    27203093
    2721 .entry-content .wp-block-archives li a:after,
    2722 .entry-content .wp-block-categories li a:after,
    2723 .entry-content .wp-block-latest-posts li a:after {
    2724   color: #767676;
    2725   content: ",";
    2726 }
    2727 
    2728 .entry-content .wp-block-archives li:last-child a:after,
    2729 .entry-content .wp-block-categories li:last-child a:after,
    2730 .entry-content .wp-block-latest-posts li:last-child a:after {
    2731   color: #767676;
    2732   content: ".";
     3094.entry-content .wp-block-archives li:not(.menu-item-has-children),
     3095.entry-content .wp-block-categories li:not(.menu-item-has-children),
     3096.entry-content .wp-block-latest-posts li:not(.menu-item-has-children) {
     3097  padding-bottom: 0.75rem;
     3098}
     3099
     3100.entry-content .wp-block-archives li a,
     3101.entry-content .wp-block-categories li a,
     3102.entry-content .wp-block-latest-posts li a {
     3103  text-decoration: none;
     3104}
     3105
     3106.entry-content .wp-block-archives li ul,
     3107.entry-content .wp-block-categories li ul,
     3108.entry-content .wp-block-latest-posts li ul {
     3109  padding-right: 1rem;
    27333110}
    27343111
    … …  
    27773154
    27783155.entry-content .wp-block-pullquote blockquote {
     3156  color: #111;
    27793157  border: none;
    27803158  padding-bottom: calc(2 * 1rem);
    … …  
    27883166  margin-bottom: 0.5em;
    27893167  margin-top: 0.5em;
    2790   color: #111;
    27913168}
    27923169
    … …  
    28073184  line-height: 1.6;
    28083185  text-transform: none;
    2809   color: #767676;
    28103186}
    28113187
    … …  
    28213197}
    28223198
     3199.entry-content .wp-block-pullquote.is-style-solid-color {
     3200  background-color: #0073aa;
     3201}
     3202
    28233203.entry-content .wp-block-pullquote.is-style-solid-color p {
    28243204  font-size: 1.6875em;
    … …  
    28343214}
    28353215
     3216.entry-content .wp-block-pullquote.is-style-solid-color a {
     3217  color: #fff;
     3218}
     3219
    28363220.entry-content .wp-block-pullquote.is-style-solid-color blockquote {
     3221  color: #fff;
    28373222  margin: 0 auto;
    28383223}
    28393224
    2840 .entry-content .wp-block-pullquote.is-style-solid-color blockquote:not(.has-text-color) p,
    2841 .entry-content .wp-block-pullquote.is-style-solid-color cite {
    2842   color: white;
    2843 }
    2844 
    2845 .entry-content .wp-block-pullquote.is-style-solid-color:not(.has-background-color) {
     3225.entry-content .wp-block-pullquote.is-style-solid-color .has-primary-background-color {
    28463226  background-color: #0073aa;
    28473227}
    … …  
    29223302
    29233303.entry-content .wp-block-cover-image .wp-block-cover-image-text,
    2924 .entry-content .wp-block-cover-image h2 {
     3304.entry-content .wp-block-cover-image .wp-block-cover-text,
     3305.entry-content .wp-block-cover-image h2,
     3306.entry-content .wp-block-cover .wp-block-cover-image-text,
     3307.entry-content .wp-block-cover .wp-block-cover-text,
     3308.entry-content .wp-block-cover h2 {
    29253309  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
    29263310  font-size: 1.6875em;
    … …  
    29323316@media only screen and (min-width: 768px) {
    29333317  .entry-content .wp-block-cover-image .wp-block-cover-image-text,
    2934   .entry-content .wp-block-cover-image h2 {
     3318  .entry-content .wp-block-cover-image .wp-block-cover-text,
     3319  .entry-content .wp-block-cover-image h2,
     3320  .entry-content .wp-block-cover .wp-block-cover-image-text,
     3321  .entry-content .wp-block-cover .wp-block-cover-text,
     3322  .entry-content .wp-block-cover h2 {
    29353323    font-size: 2.25em;
    29363324    width: calc(8 * (100vw / 12));
    … …  
    29413329@media only screen and (min-width: 1168px) {
    29423330  .entry-content .wp-block-cover-image .wp-block-cover-image-text,
    2943   .entry-content .wp-block-cover-image h2 {
     3331  .entry-content .wp-block-cover-image .wp-block-cover-text,
     3332  .entry-content .wp-block-cover-image h2,
     3333  .entry-content .wp-block-cover .wp-block-cover-image-text,
     3334  .entry-content .wp-block-cover .wp-block-cover-text,
     3335  .entry-content .wp-block-cover h2 {
    29443336    width: calc(6 * (100vw / 12 ));
    29453337    max-width: calc(6 * (100vw / 12 ));
    … …  
    29483340
    29493341.entry-content .wp-block-cover-image.alignleft h2,
    2950 .entry-content .wp-block-cover-image.alignleft .wp-block-cover-image-text, .entry-content .wp-block-cover-image.alignright h2,
    2951 .entry-content .wp-block-cover-image.alignright .wp-block-cover-image-text, .entry-content .wp-block-cover-image.aligncenter h2,
    2952 .entry-content .wp-block-cover-image.aligncenter .wp-block-cover-image-text {
     3342.entry-content .wp-block-cover-image.alignleft .wp-block-cover-image-text,
     3343.entry-content .wp-block-cover-image.alignleft .wp-block-cover-text, .entry-content .wp-block-cover-image.alignright h2,
     3344.entry-content .wp-block-cover-image.alignright .wp-block-cover-image-text,
     3345.entry-content .wp-block-cover-image.alignright .wp-block-cover-text, .entry-content .wp-block-cover-image.aligncenter h2,
     3346.entry-content .wp-block-cover-image.aligncenter .wp-block-cover-image-text,
     3347.entry-content .wp-block-cover-image.aligncenter .wp-block-cover-text,
     3348.entry-content .wp-block-cover.alignleft h2,
     3349.entry-content .wp-block-cover.alignleft .wp-block-cover-image-text,
     3350.entry-content .wp-block-cover.alignleft .wp-block-cover-text,
     3351.entry-content .wp-block-cover.alignright h2,
     3352.entry-content .wp-block-cover.alignright .wp-block-cover-image-text,
     3353.entry-content .wp-block-cover.alignright .wp-block-cover-text,
     3354.entry-content .wp-block-cover.aligncenter h2,
     3355.entry-content .wp-block-cover.aligncenter .wp-block-cover-image-text,
     3356.entry-content .wp-block-cover.aligncenter .wp-block-cover-text {
    29533357  width: 100%;
    29543358  z-index: 1;
    … …  
    29593363}
    29603364
    2961 .entry-content .wp-block-cover-image.has-left-content {
     3365.entry-content .wp-block-cover-image.has-left-content,
     3366.entry-content .wp-block-cover.has-left-content {
    29623367  justify-content: center;
    29633368}
    29643369
    29653370.entry-content .wp-block-cover-image.has-left-content h2,
    2966 .entry-content .wp-block-cover-image.has-left-content .wp-block-cover-image-text {
     3371.entry-content .wp-block-cover-image.has-left-content .wp-block-cover-image-text,
     3372.entry-content .wp-block-cover-image.has-left-content .wp-block-cover-text,
     3373.entry-content .wp-block-cover.has-left-content h2,
     3374.entry-content .wp-block-cover.has-left-content .wp-block-cover-image-text,
     3375.entry-content .wp-block-cover.has-left-content .wp-block-cover-text {
    29673376  padding: 1rem;
    29683377}
    29693378
    2970 .entry-content .wp-block-cover-image.has-right-content {
     3379.entry-content .wp-block-cover-image.has-right-content,
     3380.entry-content .wp-block-cover.has-right-content {
    29713381  justify-content: center;
    29723382}
    29733383
    29743384.entry-content .wp-block-cover-image.has-right-content h2,
    2975 .entry-content .wp-block-cover-image.has-right-content .wp-block-cover-image-text {
     3385.entry-content .wp-block-cover-image.has-right-content .wp-block-cover-image-text,
     3386.entry-content .wp-block-cover-image.has-right-content .wp-block-cover-text,
     3387.entry-content .wp-block-cover.has-right-content h2,
     3388.entry-content .wp-block-cover.has-right-content .wp-block-cover-image-text,
     3389.entry-content .wp-block-cover.has-right-content .wp-block-cover-text {
    29763390  padding: 1rem;
    29773391}
    … …  
    31173531}
    31183532
     3533.entry-content .has-primary-background-color {
     3534  background-color: #0073aa;
     3535}
     3536
     3537.entry-content .has-primary-background-color p,
     3538.entry-content .has-primary-background-color h1,
     3539.entry-content .has-primary-background-color h2,
     3540.entry-content .has-primary-background-color h3,
     3541.entry-content .has-primary-background-color h4,
     3542.entry-content .has-primary-background-color h5,
     3543.entry-content .has-primary-background-color h6,
     3544.entry-content .has-primary-background-color a {
     3545  color: #fff;
     3546}
     3547
    31193548/* Media */
    31203549.page-content .wp-smiley,
    … …  
    31763605.gallery {
    31773606  display: flex;
     3607  flex-flow: row wrap;
     3608  justify-content: center;
    31783609  margin-bottom: calc(1.5 * 1rem);
    31793610}
    … …  
    31813612.gallery-item {
    31823613  display: inline-block;
    3183   margin-left: 1rem;
     3614  padding-left: 1rem;
    31843615  margin-bottom: 1rem;
    31853616  text-align: center;
    … …  
    32213652
    32223653.gallery-item:last-of-type {
    3223   margin-left: 0;
     3654  padding-left: 0;
    32243655}
    32253656
  • branches/5.0/src/wp-content/themes/twentynineteen/style.css

    r43808 r43842  
    423423.page-description,
    424424h2.author-title,
     425.author-description .author-link,
    425426.not-found .page-title,
    426427.error-404 .page-title,
    … …  
    462463.main-navigation ul.main-menu > li,
    463464.social-navigation,
    464 .author-description p.author-bio,
     465.author-description .author-bio,
    465466.nav-links {
    466467  line-height: 1.25;
    … …  
    581582}
    582583
    583 blockquote > p {
    584   font-size: 1.6875em;
    585   font-style: italic;
    586   line-height: 1.2;
    587 }
    588 
    589584blockquote cite {
    590   font-size: 0.88889em;
     585  font-size: 0.71111em;
    591586  font-style: normal;
    592587  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
    … …  
    667662
    668663a:focus {
    669   outline: 0;
     664  outline: thin;
     665  outline-style: dotted;
    670666  text-decoration: underline;
    671667}
    … …  
    731727}
    732728
    733 img:before {
    734   background-color: #eee;
    735   border: 1px dashed #ccc;
    736   border-radius: 3px;
    737   content: " ";
    738   display: block;
    739   height: 100%;
    740   left: 0;
    741   position: absolute;
    742   top: 0;
    743   width: 100%;
    744 }
    745 
    746 img:after {
    747   color: #666;
    748   content: "This image is broken :-/ ( " attr(alt) " )";
    749   display: block;
    750   left: 50%;
    751   position: absolute;
    752   text-align: center;
    753   top: 50%;
    754   transform: translate(-50%, -50%);
    755   width: 100%;
    756 }
    757 
    758729figure {
    759730  margin: 0;
    … …  
    763734  border-left: 2px solid #0073aa;
    764735  margin-left: -2rem;
    765   padding: 1rem 0 0.5rem 2rem;
     736  padding: 0 0 0 1rem;
    766737}
    767738
    … …  
    800771  line-height: 1.2;
    801772  outline: none;
    802   padding: 0.66rem 1rem;
     773  padding: 0.76rem 1rem;
     774  vertical-align: bottom;
    803775}
    804776
    … …  
    853825  box-sizing: border-box;
    854826  outline: none;
    855   padding: 0.5rem 0.66rem;
     827  padding: 0.36rem 0.66rem;
    856828}
    857829
    … …  
    909881
    910882a:focus {
    911   outline: 0;
     883  outline: thin dotted;
    912884  text-decoration: underline;
    913885}
    … …  
    918890/** === Main menu === */
    919891.main-navigation {
    920   display: inline;
     892  display: block;
     893  margin-top: 0.25rem;
    921894  /*
    922895         * :focus-within needs its own selector so other similar
    923896         * selectors don’t get ignored if a browser doesn’t recognize it
    924897         */
    925 }
    926 
    927 @media only screen and (min-width: 768px) {
    928   .main-navigation {
    929     display: block;
    930   }
     898  /* Only show one submenu expand button at a time (desktop vs mobile) */
    931899}
    932900
    … …  
    946914
    947915.main-navigation .main-menu > li {
     916  color: #0073aa;
    948917  display: inline;
     918}
     919
     920@media only screen and (min-width: 768px) {
     921  .main-navigation .main-menu > li {
     922    position: relative;
     923  }
    949924}
    950925
    … …  
    952927  font-weight: 700;
    953928  color: #0073aa;
     929  margin-right: 0.5rem;
    954930}
    955931
    956932.main-navigation .main-menu > li > a + svg {
    957   color: #0073aa;
    958   margin-right: -0.25rem;
    959 }
    960 
    961 .main-navigation .main-menu > li > a:hover {
    962   color: #005177;
    963 }
    964 
     933  margin-right: 0.5rem;
     934}
     935
     936.main-navigation .main-menu > li > a:hover,
    965937.main-navigation .main-menu > li > a:hover + svg {
    966938  color: #005177;
    967939}
    968940
    969 .main-navigation .main-menu > li > a:after {
    970   content: ",";
    971   display: inline;
    972   color: #767676;
    973 }
    974 
    975 .main-navigation .main-menu > li.menu-item-has-children:after {
    976   content: ",";
    977   display: inline;
    978   color: #767676;
     941.main-navigation .main-menu > li.menu-item-has-children {
     942  display: inline-block;
     943}
     944
     945.main-navigation .main-menu > li.menu-item-has-children > a {
     946  margin-right: 0.125rem;
    979947}
    980948
    … …  
    985953}
    986954
    987 .main-navigation .main-menu > li:last-child > a:after {
    988   content: ".";
     955.main-navigation .main-menu > li.menu-item-has-children .mobile-submenu-expand svg,
     956.main-navigation .main-menu > li.menu-item-has-children .desktop-submenu-expand svg {
     957  position: relative;
     958  top: 0.2rem;
     959}
     960
     961.main-navigation .main-menu > li.menu-item-has-children:not(:last-child) .mobile-submenu-expand,
     962.main-navigation .main-menu > li.menu-item-has-children:not(:last-child) .desktop-submenu-expand {
     963  margin-right: 0.5rem;
    989964}
    990965
    … …  
    1000975  display: none;
    1001976  float: left;
    1002   width: 100%;
    1003977  position: absolute;
    1004978  opacity: 0;
    1005   left: -999em;
     979  left: -999px;
    1006980  z-index: 99999;
    1007   transition: opacity 0.5s ease-in-out;
    1008981}
    1009982
    1010983@media only screen and (min-width: 768px) {
    1011984  .main-navigation .sub-menu {
     985    width: -webkit-max-content;
     986    width: -moz-max-content;
     987    width: max-content;
    1012988    max-width: calc(3 * (100vw / 12));
    1013989  }
    … …  
    1022998}
    1023999
    1024 .main-navigation .sub-menu > li.menu-item-has-children svg {
     1000.main-navigation .sub-menu > li.menu-item-has-children .mobile-submenu-expand,
     1001.main-navigation .sub-menu > li.menu-item-has-children .desktop-submenu-expand {
    10251002  position: absolute;
    1026   right: 0.5rem;
    1027   top: 0.65rem;
     1003  width: calc( 24px + 1rem);
     1004  right: 0;
     1005  top: calc( .125 * 1rem);
     1006  bottom: 0;
     1007  color: white;
     1008  line-height: 1;
     1009  padding: calc( .5 * 1rem);
     1010}
     1011
     1012.main-navigation .sub-menu > li.menu-item-has-children .mobile-submenu-expand svg,
     1013.main-navigation .sub-menu > li.menu-item-has-children .desktop-submenu-expand svg {
     1014  top: 0;
     1015}
     1016
     1017.main-navigation .sub-menu > li.menu-item-has-children:not(:last-child) .mobile-submenu-expand,
     1018.main-navigation .sub-menu > li.menu-item-has-children:not(:last-child) .desktop-submenu-expand {
     1019  margin-right: 0;
    10281020}
    10291021
    … …  
    10341026}
    10351027
    1036 .main-navigation .sub-menu > li > a {
     1028.main-navigation .sub-menu > li > a:not(.mobile-submenu-expand) {
    10371029  color: #fff;
    10381030  display: block;
    10391031  line-height: 1.2;
    1040   padding: calc( .5 * 1rem) 1rem;
    1041 }
    1042 
    1043 .main-navigation .sub-menu > li > a:hover, .main-navigation .sub-menu > li > a:focus {
     1032  padding: calc( .5 * 1rem) calc( 24px + 1rem) calc( .5 * 1rem) 1rem;
     1033}
     1034
     1035.main-navigation .sub-menu > li > a:not(.mobile-submenu-expand):hover, .main-navigation .sub-menu > li > a:not(.mobile-submenu-expand):focus {
    10441036  background: #005177;
    10451037}
    10461038
    1047 .main-navigation .sub-menu > li > a:hover:after, .main-navigation .sub-menu > li > a:focus:after {
     1039.main-navigation .sub-menu > li > a:not(.mobile-submenu-expand):hover:after, .main-navigation .sub-menu > li > a:not(.mobile-submenu-expand):focus:after {
    10481040  background: #005177;
    10491041}
    10501042
    1051 .main-navigation .main-menu .menu-item-has-children:hover > .sub-menu,
    1052 .main-navigation .main-menu .menu-item-has-children .sub-menu:hover {
    1053   display: block;
    1054   left: inherit;
    1055   margin-top: -2px;
     1043.main-navigation .sub-menu > li.mobile-parent-nav-menu-item {
     1044  display: none;
     1045  font-size: 0.88889em;
     1046  font-weight: normal;
     1047}
     1048
     1049.main-navigation .sub-menu > li.mobile-parent-nav-menu-item svg {
     1050  position: relative;
     1051  top: 0.2rem;
     1052  margin-right: calc( .25 * 1rem);
     1053}
     1054
     1055.main-navigation .main-menu .menu-item-has-children:focus-within > .sub-menu {
     1056  display: block;
     1057  left: 0;
     1058  margin-top: 0;
    10561059  opacity: 1;
    1057 }
    1058 
    1059 .main-navigation .main-menu .menu-item-has-children:hover > .sub-menu .sub-menu,
    1060 .main-navigation .main-menu .menu-item-has-children .sub-menu:hover .sub-menu {
     1060  width: calc( 100vw - 2rem);
     1061}
     1062
     1063.main-navigation .main-menu .menu-item-has-children:focus-within > .sub-menu .sub-menu {
    10611064  margin-top: inherit;
    10621065  position: relative;
    … …  
    10651068
    10661069@media only screen and (min-width: 768px) {
     1070  .main-navigation .main-menu .menu-item-has-children:focus-within > .sub-menu .sub-menu {
     1071    padding-left: 0;
     1072    position: absolute;
     1073    left: 100%;
     1074    width: -webkit-max-content;
     1075    width: -moz-max-content;
     1076    width: max-content;
     1077    top: 0;
     1078  }
     1079}
     1080
     1081.main-navigation .main-menu .menu-item-has-children:hover > .sub-menu,
     1082.main-navigation .main-menu .menu-item-has-children:focus > .sub-menu,
     1083.main-navigation .main-menu .menu-item-has-children .sub-menu:hover,
     1084.main-navigation .main-menu .menu-item-has-children .sub-menu:focus {
     1085  display: table;
     1086  margin-top: 0;
     1087  opacity: 1;
     1088  /* Non-mobile position */
     1089}
     1090
     1091@media only screen and (min-width: 768px) {
     1092  .main-navigation .main-menu .menu-item-has-children:hover > .sub-menu,
     1093  .main-navigation .main-menu .menu-item-has-children:focus > .sub-menu,
     1094  .main-navigation .main-menu .menu-item-has-children .sub-menu:hover,
     1095  .main-navigation .main-menu .menu-item-has-children .sub-menu:focus {
     1096    position: absolute;
     1097    left: 0;
     1098    right: auto;
     1099    top: auto;
     1100    bottom: auto;
     1101    height: auto;
     1102    width: -webkit-max-content;
     1103    width: -moz-max-content;
     1104    width: max-content;
     1105    transform: none;
     1106    animation: fade_in 0.1s forwards;
     1107  }
     1108}
     1109
     1110@media only screen and (min-width: 768px) {
    10671111  .main-navigation .main-menu .menu-item-has-children:hover > .sub-menu .sub-menu,
    1068   .main-navigation .main-menu .menu-item-has-children .sub-menu:hover .sub-menu {
     1112  .main-navigation .main-menu .menu-item-has-children:focus > .sub-menu .sub-menu,
     1113  .main-navigation .main-menu .menu-item-has-children .sub-menu:hover .sub-menu,
     1114  .main-navigation .main-menu .menu-item-has-children .sub-menu:focus .sub-menu {
     1115    margin-top: inherit;
    10691116    padding-left: 0;
    10701117    position: absolute;
    … …  
    10741121}
    10751122
    1076 .main-navigation .main-menu .menu-item-has-children:focus-within > .sub-menu {
    1077   display: block;
    1078   left: inherit;
    1079   margin-top: -2px;
     1123.main-navigation .main-menu .menu-item-has-children.focus .sub-menu.expanded-true {
     1124  display: table;
     1125  margin-top: 0;
    10801126  opacity: 1;
    1081 }
    1082 
    1083 .main-navigation .main-menu .menu-item-has-children:focus-within > .sub-menu .sub-menu {
    1084   margin-top: inherit;
    1085   position: relative;
    1086   padding-left: 1rem;
    1087 }
    1088 
    1089 @media only screen and (min-width: 768px) {
    1090   .main-navigation .main-menu .menu-item-has-children:focus-within > .sub-menu .sub-menu {
    1091     padding-left: 0;
    1092     position: absolute;
    1093     left: 100%;
    1094     top: 0;
     1127  padding-left: 0;
     1128  /* Mobile position */
     1129  left: 0;
     1130  top: 0;
     1131  right: 0;
     1132  bottom: 0;
     1133  position: fixed;
     1134  z-index: 100000;
     1135  /* Make sure appears above mobile admin bar */
     1136  width: 100%;
     1137  height: 100%;
     1138  transform: translateX(100%);
     1139  animation: slide_in_right 0.3s forwards;
     1140}
     1141
     1142.main-navigation .main-menu .menu-item-has-children.focus .sub-menu.expanded-true > .mobile-parent-nav-menu-item {
     1143  display: inline-block;
     1144}
     1145
     1146.main-navigation .desktop-submenu-expand {
     1147  display: none;
     1148}
     1149
     1150@media only screen and (min-width: 768px) {
     1151  .main-navigation .desktop-submenu-expand {
     1152    display: inline-block;
     1153  }
     1154}
     1155
     1156.main-navigation .mobile-submenu-expand {
     1157  display: inline-block;
     1158}
     1159
     1160@media only screen and (min-width: 768px) {
     1161  .main-navigation .mobile-submenu-expand {
     1162    display: none;
     1163  }
     1164}
     1165
     1166/* Menu Animation */
     1167@keyframes slide_in_right {
     1168  100% {
     1169    transform: translateX(0%);
     1170  }
     1171}
     1172
     1173@keyframes fade_in {
     1174  from {
     1175    opacity: 0;
     1176  }
     1177  to {
     1178    opacity: 1;
    10951179  }
    10961180}
    … …  
    11591243}
    11601244
     1245@media only screen and (min-width: 768px) {
     1246  .post-navigation {
     1247    margin: calc(3 * 1rem) calc(2 * (100vw / 12));
     1248    max-width: calc(6 * (100vw / 12));
     1249  }
     1250}
     1251
     1252@media only screen and (min-width: 1168px) {
     1253  .post-navigation {
     1254    margin: calc(3 * 1rem) 0;
     1255    max-width: 100%;
     1256  }
     1257}
     1258
    11611259.post-navigation .nav-links {
    11621260  margin: 0 1rem;
    … …  
    11641262  display: flex;
    11651263  flex-direction: column;
     1264}
     1265
     1266@media only screen and (min-width: 768px) {
     1267  .post-navigation .nav-links {
     1268    margin: 0;
     1269  }
    11661270}
    11671271
    … …  
    12321336  .post-navigation .nav-links .nav-next {
    12331337    order: 2;
     1338    padding-left: 1rem;
    12341339  }
    12351340}
    … …  
    12801385  display: flex;
    12811386  flex-direction: row;
     1387  margin: 0 1rem;
     1388}
     1389
     1390@media only screen and (min-width: 1168px) {
     1391  .comment-navigation .nav-links {
     1392    margin: 0 calc(2 * (100vw / 12));
     1393    max-width: calc(8 * (100vw / 12));
     1394  }
    12821395}
    12831396
    … …  
    12861399  min-width: 50%;
    12871400  width: 100%;
     1401  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
     1402  font-weight: bold;
    12881403}
    12891404
    … …  
    14501565  .site-branding {
    14511566    margin: 0 calc(2 * (100vw / 12));
    1452     max-width: 22em;
    14531567  }
    14541568}
    … …  
    14641578    margin-bottom: 0;
    14651579    position: absolute;
    1466     right: calc(100% + (0.5 * calc(100vw / 12)));
     1580    right: calc(100% + (0.5 * 100vw / 12));
    14671581    top: 4px;
    14681582    z-index: 999;
    … …  
    14991613  margin: auto;
    15001614  display: inline;
     1615  /* When there is no description set, make sure navigation appears below title. */
     1616}
     1617
     1618.site-title a:link,
     1619.site-title a:visited {
    15011620  color: #111;
    1502   /* When there is no description set, make sure navigation appears below title. */
    15031621}
    15041622
    … …  
    15291647    display: inline;
    15301648  }
     1649}
     1650
     1651.site-title:not(:empty) + .site-description:not(:empty):before {
     1652  content: "\2014";
     1653  margin: 0 .2em;
    15311654}
    15321655
    … …  
    15361659  font-weight: normal;
    15371660  margin: 0;
    1538 }
    1539 
    1540 .site-description:not(:empty):before {
    1541   content: "\2014";
    1542   margin: 0 .2em;
    15431661}
    15441662
    … …  
    15491667  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
    15501668  /* Set white text color when featured image is set. */
    1551   /* Post header styles */
     1669  /* add focus state to social media icons */
     1670  /* Entry header */
    15521671  /* Custom Logo Link */
    15531672  /* Make sure important elements are above pseudo elements used for effects. */
    … …  
    15621681  /* Second layer: screen. */
    15631682  /* Third layer: multiply. */
     1683  /* When image filters are inactive, a black overlay is added. */
    15641684  /* Fourth layer: overlay. */
    15651685  /* Fifth layer: readability overlay */
    … …  
    15741694.site-header.featured-image .entry-meta,
    15751695.site-header.featured-image .entry-title {
    1576   color: white;
     1696  color: #fff;
    15771697}
    15781698
    15791699.site-header.featured-image .main-navigation a,
     1700.site-header.featured-image .main-navigation a + svg,
    15801701.site-header.featured-image .social-navigation a,
    15811702.site-header.featured-image .site-title a,
    1582 .site-header.featured-image .hentry a {
    1583   color: white;
     1703.site-header.featured-image .site-featured-image a {
     1704  color: #fff;
    15841705  transition: opacity 110ms ease-in-out;
    15851706}
    15861707
    15871708.site-header.featured-image .main-navigation a:hover, .site-header.featured-image .main-navigation a:active,
     1709.site-header.featured-image .main-navigation a:hover + svg,
     1710.site-header.featured-image .main-navigation a:active + svg,
     1711.site-header.featured-image .main-navigation a + svg:hover,
     1712.site-header.featured-image .main-navigation a + svg:active,
     1713.site-header.featured-image .main-navigation a + svg:hover + svg,
     1714.site-header.featured-image .main-navigation a + svg:active + svg,
    15881715.site-header.featured-image .social-navigation a:hover,
    15891716.site-header.featured-image .social-navigation a:active,
     1717.site-header.featured-image .social-navigation a:hover + svg,
     1718.site-header.featured-image .social-navigation a:active + svg,
    15901719.site-header.featured-image .site-title a:hover,
    15911720.site-header.featured-image .site-title a:active,
    1592 .site-header.featured-image .hentry a:hover,
    1593 .site-header.featured-image .hentry a:active {
    1594   color: white;
     1721.site-header.featured-image .site-title a:hover + svg,
     1722.site-header.featured-image .site-title a:active + svg,
     1723.site-header.featured-image .site-featured-image a:hover,
     1724.site-header.featured-image .site-featured-image a:active,
     1725.site-header.featured-image .site-featured-image a:hover + svg,
     1726.site-header.featured-image .site-featured-image a:active + svg {
     1727  color: #fff;
    15951728  opacity: 0.6;
    15961729}
    15971730
    15981731.site-header.featured-image .main-navigation a:focus,
     1732.site-header.featured-image .main-navigation a:focus + svg,
     1733.site-header.featured-image .main-navigation a + svg:focus,
     1734.site-header.featured-image .main-navigation a + svg:focus + svg,
    15991735.site-header.featured-image .social-navigation a:focus,
     1736.site-header.featured-image .social-navigation a:focus + svg,
    16001737.site-header.featured-image .site-title a:focus,
    1601 .site-header.featured-image .hentry a:focus {
    1602   color: white;
     1738.site-header.featured-image .site-title a:focus + svg,
     1739.site-header.featured-image .site-featured-image a:focus,
     1740.site-header.featured-image .site-featured-image a:focus + svg {
     1741  color: #fff;
    16031742}
    16041743
    16051744.site-header.featured-image .social-navigation a:focus {
    1606   color: white;
     1745  color: #fff;
    16071746  opacity: 1;
    1608   border-bottom: 1px solid white;
     1747  border-bottom: 1px solid #fff;
    16091748}
    16101749
    16111750.site-header.featured-image .social-navigation svg,
    1612 .site-header.featured-image .hentry svg {
     1751.site-header.featured-image .site-featured-image svg {
    16131752  /* Use -webkit- only if supporting: Chrome < 54, iOS < 9.3, Android < 4.4.4 */
    16141753  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.35));
    16151754}
    16161755
    1617 .site-header.featured-image .hentry .entry-header {
     1756.site-header.featured-image .site-featured-image .entry-header {
     1757  margin-bottom: 0;
    16181758  margin-left: 0;
    16191759  margin-right: 0;
    1620 }
    1621 
    1622 @media only screen and (min-width: 768px) {
    1623   .site-header.featured-image .hentry .entry-header {
     1760  /* Entry meta */
     1761}
     1762
     1763@media only screen and (min-width: 768px) {
     1764  .site-header.featured-image .site-featured-image .entry-header {
    16241765    margin-left: calc(2 * (100vw / 12));
    16251766    margin-right: calc(2 * (100vw / 12));
    … …  
    16271768}
    16281769
    1629 .site-header.featured-image .hentry .entry-header .entry-title:before {
    1630   background: white;
     1770.site-header.featured-image .site-featured-image .entry-header .entry-title:before {
     1771  background: #fff;
     1772}
     1773
     1774.site-header.featured-image .site-featured-image .entry-header .entry-meta {
     1775  font-weight: 500;
     1776}
     1777
     1778.site-header.featured-image .site-featured-image .entry-header .entry-meta > span {
     1779  margin-right: 1rem;
     1780  display: inline-block;
     1781}
     1782
     1783.site-header.featured-image .site-featured-image .entry-header .entry-meta > span:last-child {
     1784  margin-right: 0;
     1785}
     1786
     1787.site-header.featured-image .site-featured-image .entry-header .entry-meta a {
     1788  transition: color 110ms ease-in-out;
     1789  color: currentColor;
     1790}
     1791
     1792.site-header.featured-image .site-featured-image .entry-header .entry-meta a:hover {
     1793  text-decoration: none;
     1794}
     1795
     1796.site-header.featured-image .site-featured-image .entry-header .entry-meta .svg-icon {
     1797  position: relative;
     1798  display: inline-block;
     1799  vertical-align: middle;
     1800  margin-right: 0.5em;
     1801}
     1802
     1803.site-header.featured-image .site-featured-image .entry-header .entry-meta .discussion-avatar-list {
     1804  display: none;
     1805}
     1806
     1807@media only screen and (min-width: 768px) {
     1808  .site-header.featured-image .site-featured-image .entry-header.has-discussion .entry-meta {
     1809    display: flex;
     1810    position: relative;
     1811  }
     1812  .site-header.featured-image .site-featured-image .entry-header.has-discussion .entry-title {
     1813    padding-right: calc(1 * (100vw / 12) + 1rem);
     1814  }
     1815  .site-header.featured-image .site-featured-image .entry-header.has-discussion .entry-meta .comment-count {
     1816    position: absolute;
     1817    right: 0;
     1818  }
     1819  .site-header.featured-image .site-featured-image .entry-header.has-discussion .entry-meta .discussion-avatar-list {
     1820    display: block;
     1821    position: absolute;
     1822    bottom: 100%;
     1823  }
    16311824}
    16321825
    16331826.site-header.featured-image .custom-logo-link {
    1634   background: white;
     1827  background: #fff;
    16351828  box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    16361829}
    … …  
    16401833}
    16411834
    1642 .site-header.featured-image .site-branding,
    1643 .site-header.featured-image .hentry .entry-header {
     1835.site-header.featured-image .site-branding {
     1836  position: relative;
    16441837  z-index: 10;
     1838}
     1839
     1840.site-header.featured-image .site-featured-image .entry-header {
     1841  position: relative;
     1842  z-index: 9;
    16451843}
    16461844
    16471845.site-header.featured-image .site-branding-container:before,
    16481846.site-header.featured-image .site-branding-container:after,
    1649 .site-header.featured-image .hentry:before,
    1650 .site-header.featured-image .hentry:after, .site-header.featured-image:after {
     1847.site-header.featured-image .site-featured-image:before,
     1848.site-header.featured-image .site-featured-image:after, .site-header.featured-image:after {
    16511849  display: block;
    16521850  position: absolute;
    … …  
    16621860  background-repeat: no-repeat;
    16631861  background-size: cover;
     1862  z-index: 1;
     1863  /* When image filters are active, make it grayscale to colorize it blue. */
     1864}
     1865
     1866.image-filters-enabled .site-header.featured-image .site-branding-container:before {
    16641867  filter: grayscale(100%);
    1665   z-index: 1;
    1666 }
    1667 
    1668 .site-header.featured-image .hentry:before {
     1868}
     1869
     1870.image-filters-enabled .site-header.featured-image .site-featured-image:before {
    16691871  background: #0073aa;
    16701872  mix-blend-mode: screen;
    16711873  opacity: 0.1;
    1672   z-index: 2;
    1673 }
    1674 
    1675 .site-header.featured-image .hentry:after {
     1874}
     1875
     1876.site-header.featured-image .site-featured-image:after {
     1877  background: #000;
     1878  mix-blend-mode: multiply;
     1879  opacity: .7;
     1880  /* When image filters are active, a blue overlay is added. */
     1881}
     1882
     1883.image-filters-enabled .site-header.featured-image .site-featured-image:after {
    16761884  background: #0073aa;
    1677   mix-blend-mode: multiply;
    1678   opacity: 1;
     1885  opacity: .8;
    16791886  z-index: 3;
    1680 }
    1681 
    1682 .site-header.featured-image .site-branding-container:after {
    1683   background: rgba(255, 255, 255, 0.35);
     1887  /* Browsers supporting mix-blend-mode don't need opacity < 1 */
     1888}
     1889
     1890@supports (mix-blend-mode: multiply) {
     1891  .image-filters-enabled .site-header.featured-image .site-featured-image:after {
     1892    opacity: 1;
     1893  }
     1894}
     1895
     1896.image-filters-enabled .site-header.featured-image .site-branding-container:after {
     1897  background: rgba(0, 0, 0, 0.35);
    16841898  mix-blend-mode: overlay;
    16851899  opacity: 0.5;
    16861900  z-index: 4;
     1901  /* Browsers supporting mix-blend-mode can have a light overlay */
     1902}
     1903
     1904@supports (mix-blend-mode: overlay) {
     1905  .image-filters-enabled .site-header.featured-image .site-branding-container:after {
     1906    background: rgba(255, 255, 255, 0.35);
     1907  }
    16871908}
    16881909
    16891910.site-header.featured-image:after {
    1690   background: #000e14;
     1911  background: #000;
    16911912  /**
    16921913                 * Add a transition to the readability overlay, to add a subtle
    … …  
    16941915                 */
    16951916  transition: opacity 1200ms ease-in-out;
     1917  opacity: 0.7;
    16961918  z-index: 5;
     1919  /* When image filters are active, a blue overlay is added. */
     1920}
     1921
     1922.image-filters-enabled .site-header.featured-image:after {
     1923  background: #000e14;
    16971924  opacity: 0.38;
    16981925}
    16991926
    17001927@media only screen and (min-width: 768px) {
    1701   .site-header.featured-image:after {
     1928  .image-filters-enabled .site-header.featured-image:after {
    17021929    opacity: 0.18;
    1703   }
    1704 }
    1705 
    1706 @media only screen and (min-width: 1168px) {
    1707   .site-header.featured-image:after {
    1708     opacity: 0.1;
    17091930  }
    17101931}
    … …  
    17471968}
    17481969
    1749 .hentry {
     1970.entry {
    17501971  margin-top: calc(6 * 1rem);
    17511972}
    17521973
    1753 .hentry:first-of-type {
     1974.entry:first-of-type {
    17541975  margin-top: 0;
    17551976}
    17561977
    1757 .hentry .entry-header {
     1978.entry .entry-header {
    17581979  margin: calc(3 * 1rem) 1rem 1rem;
    17591980  position: relative;
    … …  
    17611982
    17621983@media only screen and (min-width: 768px) {
    1763   .hentry .entry-header {
     1984  .entry .entry-header {
    17641985    margin: calc(3 * 1rem) calc(2 * (100vw / 12 )) 1rem;
    17651986  }
    1766   .featured-image .hentry .entry-header {
    1767     margin-bottom: 0;
    1768   }
    1769 }
    1770 
    1771 .hentry .entry-title {
     1987}
     1988
     1989.entry .entry-title {
    17721990  margin: 0;
    17731991}
    17741992
    1775 .hentry .entry-title:before {
     1993.entry .entry-title:before {
    17761994  background: #767676;
    17771995  content: "\020";
    … …  
    17822000}
    17832001
    1784 .hentry .entry-title a {
     2002.entry .entry-title a {
    17852003  color: inherit;
    17862004}
    17872005
    1788 .hentry .entry-title a:hover {
     2006.entry .entry-title a:hover {
    17892007  color: #4a4a4a;
    17902008}
    17912009
    1792 .hentry .entry-meta,
    1793 .hentry .entry-footer {
     2010.entry .entry-meta,
     2011.entry .entry-footer {
    17942012  color: #767676;
    17952013  font-weight: 500;
    17962014}
    17972015
    1798 .hentry .entry-meta > span,
    1799 .hentry .entry-footer > span {
     2016.entry .entry-meta > span,
     2017.entry .entry-footer > span {
    18002018  margin-right: 1rem;
    1801 }
    1802 
    1803 .hentry .entry-meta > span:last-child,
    1804 .hentry .entry-footer > span:last-child {
     2019  display: inline-block;
     2020}
     2021
     2022.entry .entry-meta > span:last-child,
     2023.entry .entry-footer > span:last-child {
    18052024  margin-right: 0;
    18062025}
    18072026
    1808 .hentry .entry-meta a,
    1809 .hentry .entry-footer a {
     2027.entry .entry-meta a,
     2028.entry .entry-footer a {
    18102029  transition: color 110ms ease-in-out;
    18112030  color: currentColor;
    18122031}
    18132032
    1814 .hentry .entry-meta a:hover,
    1815 .hentry .entry-footer a:hover {
     2033.entry .entry-meta a:hover,
     2034.entry .entry-footer a:hover {
    18162035  text-decoration: none;
    18172036  color: #0073aa;
    18182037}
    18192038
    1820 .hentry .entry-meta .svg-icon,
    1821 .hentry .entry-footer .svg-icon {
     2039.entry .entry-meta .svg-icon,
     2040.entry .entry-footer .svg-icon {
    18222041  position: relative;
    18232042  display: inline-block;
    … …  
    18262045}
    18272046
    1828 .hentry .entry-meta {
     2047.entry .entry-meta {
    18292048  margin: 1rem 0;
    18302049}
    18312050
    1832 @media only screen and (min-width: 1168px) {
    1833   .hentry .entry-meta.has-discussion .comment-count {
    1834     float: right;
    1835     position: relative;
    1836   }
    1837 }
    1838 
    1839 .hentry .entry-meta.has-discussion .comment-count .discussion-avatar-list {
    1840   display: none;
    1841 }
    1842 
    1843 @media only screen and (min-width: 1168px) {
    1844   .hentry .entry-meta.has-discussion .comment-count .discussion-avatar-list {
    1845     bottom: 100%;
    1846     display: block;
    1847     position: absolute;
    1848   }
    1849 }
    1850 
    1851 .hentry .entry-footer {
     2051.entry .entry-footer {
    18522052  margin: calc(2 * 1rem) 1rem 1rem;
    18532053}
    18542054
    18552055@media only screen and (min-width: 768px) {
    1856   .hentry .entry-footer {
    1857     margin: calc(3 * 1rem) calc(2 * (100vw / 12));
     2056  .entry .entry-footer {
     2057    margin: 1rem calc(2 * (100vw / 12)) calc(3 * 1rem);
    18582058    max-width: calc(8 * (100vw / 12));
    18592059  }
    … …  
    18612061
    18622062@media only screen and (min-width: 768px) {
    1863   .hentry .entry-footer {
     2063  .entry .entry-footer {
    18642064    max-width: calc(6 * (100vw / 12));
    18652065  }
    18662066}
    18672067
    1868 .hentry .post-thumbnail {
     2068.entry .post-thumbnail {
    18692069  margin: 1rem;
    18702070}
    18712071
    18722072@media only screen and (min-width: 768px) {
    1873   .hentry .post-thumbnail {
     2073  .entry .post-thumbnail {
    18742074    margin: 1rem calc(2 * (100vw / 12));
    18752075  }
    18762076}
    18772077
    1878 .hentry .post-thumbnail:focus {
     2078.entry .post-thumbnail:focus {
    18792079  outline: none;
    18802080}
    18812081
    1882 .hentry .post-thumbnail .post-thumbnail-inner {
    1883   display: block;
    1884 }
    1885 
    1886 .hentry .post-thumbnail .post-thumbnail-inner img {
     2082.entry .post-thumbnail .post-thumbnail-inner {
     2083  display: block;
     2084}
     2085
     2086.entry .post-thumbnail .post-thumbnail-inner img {
    18872087  position: relative;
    18882088  display: block;
    … …  
    18902090}
    18912091
    1892 .image-filters-enabled .hentry .post-thumbnail {
     2092.image-filters-enabled .entry .post-thumbnail {
    18932093  position: relative;
    18942094  display: block;
    18952095}
    18962096
    1897 .image-filters-enabled .hentry .post-thumbnail .post-thumbnail-inner {
    1898   position: relative;
     2097.image-filters-enabled .entry .post-thumbnail .post-thumbnail-inner {
    18992098  filter: grayscale(100%);
    1900   z-index: 1;
    1901 }
    1902 
    1903 .image-filters-enabled .hentry .post-thumbnail .post-thumbnail-inner:after {
    1904   display: block;
     2099}
     2100
     2101.image-filters-enabled .entry .post-thumbnail .post-thumbnail-inner:after {
     2102  background: rgba(0, 0, 0, 0.35);
     2103  content: "";
     2104  display: block;
     2105  height: 100%;
     2106  opacity: .5;
     2107  pointer-events: none;
     2108  position: absolute;
     2109  top: 0;
    19052110  width: 100%;
    1906   height: 100%;
    1907   z-index: 10;
    1908 }
    1909 
    1910 .image-filters-enabled .hentry .post-thumbnail:before, .image-filters-enabled .hentry .post-thumbnail:after {
     2111  z-index: 4;
     2112}
     2113
     2114@supports (mix-blend-mode: multiply) {
     2115  .image-filters-enabled .entry .post-thumbnail .post-thumbnail-inner:after {
     2116    display: none;
     2117  }
     2118}
     2119
     2120.image-filters-enabled .entry .post-thumbnail:before, .image-filters-enabled .entry .post-thumbnail:after {
    19112121  position: absolute;
    19122122  display: block;
    … …  
    19162126  left: 0;
    19172127  content: "\020";
    1918   display: block;
    19192128  pointer-events: none;
    19202129}
    19212130
    1922 .image-filters-enabled .hentry .post-thumbnail:before {
     2131.image-filters-enabled .entry .post-thumbnail:before {
    19232132  background: #0073aa;
    19242133  mix-blend-mode: screen;
    … …  
    19272136}
    19282137
    1929 .image-filters-enabled .hentry .post-thumbnail:after {
     2138.image-filters-enabled .entry .post-thumbnail:after {
    19302139  background: #0073aa;
    19312140  mix-blend-mode: multiply;
    1932   opacity: 1;
     2141  opacity: .8;
    19332142  z-index: 3;
    1934 }
    1935 
    1936 .hentry .entry-content .more-link {
     2143  /* Browsers supporting mix-blend-mode don't need opacity < 1 */
     2144}
     2145
     2146@supports (mix-blend-mode: multiply) {
     2147  .image-filters-enabled .entry .post-thumbnail:after {
     2148    opacity: 1;
     2149  }
     2150}
     2151
     2152.entry .entry-content p {
     2153  word-wrap: break-word;
     2154}
     2155
     2156.entry .entry-content .more-link {
    19372157  transition: color 110ms ease-in-out;
    19382158  display: inline;
    … …  
    19402160}
    19412161
    1942 .hentry .entry-content .more-link:after {
    1943   content: "»";
     2162.entry .entry-content .more-link:after {
     2163  content: "\02192";
    19442164  margin-left: 0.5em;
    19452165}
    19462166
    1947 .hentry .entry-content .more-link:hover {
     2167.entry .entry-content .more-link:hover {
    19482168  color: #0073aa;
    19492169  text-decoration: none;
    19502170}
    19512171
    1952 .hentry .entry-content a {
     2172.entry .entry-content a {
    19532173  text-decoration: underline;
    19542174}
    19552175
    1956 .hentry .entry-content a:hover {
     2176.entry .entry-content a:hover {
    19572177  text-decoration: none;
    19582178}
    19592179
    1960 .hentry .entry-content > iframe[style] {
     2180.entry .entry-content > iframe[style] {
    19612181  margin: 32px 1rem !important;
    19622182  max-width: calc(100vw - (2 * 1rem)) !important;
    … …  
    19642184
    19652185@media only screen and (min-width: 768px) {
    1966   .hentry .entry-content > iframe[style] {
     2186  .entry .entry-content > iframe[style] {
    19672187    margin: 32px calc(2 * (100vw / 12)) !important;
    19682188    max-width: calc(8 * (100vw / 12)) !important;
    … …  
    19712191
    19722192@media only screen and (min-width: 1168px) {
    1973   .hentry .entry-content > iframe[style] {
     2193  .entry .entry-content > iframe[style] {
    19742194    max-width: calc(6 * (100vw / 12)) !important;
    19752195  }
    19762196}
    19772197
    1978 .hentry .entry-content .wp-audio-shortcode {
     2198.entry .entry-content .wp-audio-shortcode {
    19792199  max-width: calc(100vw - (2 * 1rem));
    19802200}
    19812201
    19822202@media only screen and (min-width: 768px) {
    1983   .hentry .entry-content .wp-audio-shortcode {
     2203  .entry .entry-content .wp-audio-shortcode {
    19842204    max-width: calc(8 * (100vw / 12));
    19852205  }
    … …  
    19872207
    19882208@media only screen and (min-width: 1168px) {
    1989   .hentry .entry-content .wp-audio-shortcode {
     2209  .entry .entry-content .wp-audio-shortcode {
    19902210    max-width: calc(6 * (100vw / 12));
    19912211  }
     2212}
     2213
     2214/* Author description */
     2215.author-bio {
     2216  margin: calc(2 * 1rem) 1rem 1rem;
     2217}
     2218
     2219@media only screen and (min-width: 768px) {
     2220  .author-bio {
     2221    margin: calc(3 * 1rem) calc(2 * (100vw / 12));
     2222    max-width: calc(8 * (100vw / 12));
     2223  }
     2224}
     2225
     2226@media only screen and (min-width: 768px) {
     2227  .author-bio {
     2228    max-width: calc(6 * (100vw / 12));
     2229  }
     2230}
     2231
     2232.author-bio .author-title {
     2233  display: inline;
     2234}
     2235
     2236.author-bio .author-title:before {
     2237  background: #767676;
     2238  content: "\020";
     2239  display: block;
     2240  height: 2px;
     2241  margin: 1rem 0;
     2242  width: 1em;
     2243}
     2244
     2245.author-bio .author-description {
     2246  display: inline;
     2247  color: #767676;
     2248  font-size: 1.125em;
     2249  line-height: 1.2;
     2250}
     2251
     2252.author-bio .author-description .author-link {
     2253  display: inline-block;
     2254}
     2255
     2256.author-bio .author-description .author-link:hover {
     2257  color: #005177;
     2258  text-decoration: none;
    19922259}
    19932260
    … …  
    20052272.comments-area {
    20062273  /* Add extra margin when the comments section is located immediately after the
    2007          * post itself (this happens on pages). 
     2274         * post itself (this happens on pages).
    20082275         */
    20092276}
    20102277
    2011 .hentry + .comments-area {
     2278.entry + .comments-area {
    20122279  margin-top: calc(3 * 1rem);
    20132280}
    20142281
    2015 .comments-area .comments-title-wrap,
    20162282.comments-area .comment-list,
     2283.comments-area .comment-navigation,
    20172284.comments-area > .comment-respond,
    20182285.comments-area .comment-form-flex,
    … …  
    20222289
    20232290@media only screen and (min-width: 768px) {
    2024   .comments-area .comments-title-wrap,
    20252291  .comments-area .comment-list,
     2292  .comments-area .comment-navigation,
    20262293  .comments-area > .comment-respond,
    20272294  .comments-area .comment-form-flex,
    … …  
    20332300
    20342301.comments-area .comments-title-wrap {
    2035   align-items: baseline;
    2036   display: flex;
    2037   justify-content: space-between;
     2302  margin: calc(2 * 1rem) 1rem;
     2303}
     2304
     2305@media only screen and (min-width: 768px) {
     2306  .comments-area .comments-title-wrap {
     2307    align-items: baseline;
     2308    display: flex;
     2309    justify-content: space-between;
     2310    margin: calc(3 * 1rem) calc(2 * (100vw / 12));
     2311    max-width: calc(8 * (100vw / 12));
     2312  }
    20382313}
    20392314
    … …  
    20512326}
    20522327
     2328@media only screen and (min-width: 768px) {
     2329  .comments-area .comments-title-wrap .comments-title {
     2330    flex: 1 0 calc(3 * (100vw / 12));
     2331  }
     2332}
     2333
     2334@media only screen and (min-width: 768px) {
     2335  .comments-area .comments-title-wrap .discussion-meta {
     2336    flex: 0 0 calc(2 * (100vw / 12));
     2337    margin-left: 1rem;
     2338  }
     2339}
     2340
    20532341#comment {
    20542342  max-width: 100%;
    … …  
    20612349
    20622350#respond .comment-user-avatar {
    2063   display: none;
     2351  margin: 1rem 0 -1rem;
    20642352}
    20652353
    … …  
    20792367#comments > .comments-title:last-child {
    20802368  display: none;
    2081 }
    2082 
    2083 @media only screen and (min-width: 1168px) {
    2084   #comments > #respond .comment-user-avatar {
    2085     position: absolute;
    2086     display: block;
    2087     top: 0;
    2088     left: 0;
    2089   }
    2090   #comments > #respond .comment-user-avatar .avatar {
    2091     display: block;
    2092   }
    20932369}
    20942370
    … …  
    22162492  position: absolute;
    22172493  background: #008fd3;
    2218   right: calc(100% + 0.25rem);
     2494  right: calc(100% - 2.5rem);
    22192495  top: -3px;
    22202496  width: 18px;
     2497}
     2498
     2499@media only screen and (min-width: 768px) {
     2500  .comment .comment-author .post-author-badge {
     2501    right: calc(100% + 0.75rem);
     2502  }
    22212503}
    22222504
    … …  
    23412623  height: calc(1.5 * 1rem);
    23422624  width: calc(1.5 * 1rem);
    2343 }
    2344 
    2345 .discussion-meta .discussion-avatar-list {
    2346   display: inline-block;
    2347   margin-right: 8px;
    23482625}
    23492626
    … …  
    24402717}
    24412718
    2442 @media only screen and (min-width: 768px) {
    2443   .hfeed .hentry .entry-header {
     2719.archive .page-header .page-description {
     2720  display: block;
     2721  color: #111;
     2722  font-size: 1em;
     2723}
     2724
     2725@media only screen and (min-width: 768px) {
     2726  .hfeed .entry .entry-header {
    24442727    margin: calc(3 * 1rem) calc(2 * (100vw / 12)) calc(1rem / 2);
    24452728  }
    … …  
    24742757--------------------------------------------------------------*/
    24752758/* Site footer */
    2476 .site-footer {
    2477   color: #767676;
    2478 }
    2479 
    2480 .site-footer .site-info {
     2759#colophon .widget-area,
     2760#colophon .site-info {
    24812761  margin: calc(2 * 1rem) 1rem;
    24822762}
    24832763
    24842764@media only screen and (min-width: 768px) {
    2485   .site-footer .site-info {
     2765  #colophon .widget-area,
     2766  #colophon .site-info {
    24862767    margin: calc(3 * 1rem) calc(2 * (100vw / 12));
    24872768    max-width: calc(8 * (100vw / 12));
    … …  
    24892770}
    24902771
    2491 .site-footer .site-info .imprint {
     2772#colophon .widget-area .imprint,
     2773#colophon .site-info .imprint {
    24922774  margin-right: 1rem;
    24932775}
    24942776
    2495 .site-footer a {
     2777#colophon .site-info a {
    24962778  color: inherit;
    24972779}
    24982780
    2499 .site-footer a:hover {
     2781#colophon .site-info a:hover {
    25002782  text-decoration: none;
    25012783  color: #0073aa;
     2784}
     2785
     2786#colophon .widget-column {
     2787  display: flex;
     2788  flex-wrap: wrap;
     2789}
     2790
     2791#colophon .widget-column .widget {
     2792  width: 100%;
     2793}
     2794
     2795@media only screen and (min-width: 1168px) {
     2796  #colophon .widget-column .widget {
     2797    margin-right: calc(3 * 1rem);
     2798    width: calc(50% - (3 * 1rem));
     2799  }
     2800}
     2801
     2802#colophon .site-info {
     2803  color: #767676;
    25022804}
    25032805
    … …  
    25102812.widget select {
    25112813  max-width: 100%;
     2814}
     2815
     2816.widget a {
     2817  color: #0073aa;
     2818}
     2819
     2820.widget a:hover {
     2821  color: #005177;
     2822}
     2823
     2824.widget_archive ul,
     2825.widget_nav_menu ul,
     2826.widget_meta ul,
     2827.widget_recent_entries ul,
     2828.widget_rss ul {
     2829  padding: 0;
     2830  list-style: none;
     2831}
     2832
     2833.widget_archive ul li,
     2834.widget_nav_menu ul li,
     2835.widget_meta ul li,
     2836.widget_recent_entries ul li,
     2837.widget_rss ul li {
     2838  color: #767676;
     2839  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
     2840  font-size: calc(22px * 1.6875);
     2841  font-weight: bold;
     2842  line-height: 1.2;
     2843}
     2844
     2845.widget_archive ul li:not(.menu-item-has-children),
     2846.widget_nav_menu ul li:not(.menu-item-has-children),
     2847.widget_meta ul li:not(.menu-item-has-children),
     2848.widget_recent_entries ul li:not(.menu-item-has-children),
     2849.widget_rss ul li:not(.menu-item-has-children) {
     2850  padding-bottom: 0.75rem;
     2851}
     2852
     2853.widget_archive ul li ul,
     2854.widget_nav_menu ul li ul,
     2855.widget_meta ul li ul,
     2856.widget_recent_entries ul li ul,
     2857.widget_rss ul li ul {
     2858  padding-left: 1rem;
     2859}
     2860
     2861.widget_archive ul.sub-menu,
     2862.widget_nav_menu ul.sub-menu,
     2863.widget_meta ul.sub-menu,
     2864.widget_recent_entries ul.sub-menu,
     2865.widget_rss ul.sub-menu {
     2866  padding-top: 0.75rem;
     2867}
     2868
     2869.widget_search .search-submit {
     2870  display: block;
     2871  margin-top: 1rem;
    25122872}
    25132873
    … …  
    25652925  .entry-content > *.alignwide,
    25662926  .entry-summary > *.alignwide {
    2567     margin-left: calc(1 * (100vw / 12));
    2568     margin-right: calc(1 * (100vw / 12));
    2569     max-width: calc(10 * (100vw / 12));
     2927    margin-left: calc(2 * (100vw / 12));
     2928    margin-right: calc(2 * (100vw / 12));
     2929    max-width: calc(8 * (100vw / 12));
    25702930  }
    25712931}
    … …  
    26172977    margin-left: calc(2 * 1rem);
    26182978    margin-right: calc(2 * (100vw / 12));
     2979  }
     2980}
     2981
     2982.entry-content > *.aligncenter,
     2983.entry-summary > *.aligncenter {
     2984  margin-left: auto;
     2985  margin-right: auto;
     2986}
     2987
     2988@media only screen and (min-width: 1168px) {
     2989  .entry-content > *.aligncenter,
     2990  .entry-summary > *.aligncenter {
     2991    margin-left: calc(2 * (100vw / 12));
     2992    margin-right: calc(2 * (100vw / 12));
     2993    max-width: calc(10 * (100vw / 12));
     2994    position: relative;
     2995    left: 25%;
     2996    transform: translate(-50%);
    26192997  }
    26202998}
    … …  
    26603038  box-sizing: border-box;
    26613039  font-weight: bold;
    2662   padding: 0.66rem 1rem;
     3040  text-decoration: none;
     3041  padding: 0.76rem 1rem;
    26633042  outline: none;
    26643043  color: white;
    … …  
    26883067  transition: all 150ms ease-in-out;
    26893068  background: transparent;
    2690   border: 2px solid #0073aa;
    2691 }
    2692 
    2693 .entry-content .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color),
    2694 .entry-content .wp-block-button.is-style-outline .wp-block-button__link:focus:not(.has-text-color),
    2695 .entry-content .wp-block-button.is-style-outline .wp-block-button__link:active:not(.has-text-color) {
     3069  border: 2px solid currentColor;
    26963070  color: #0073aa;
    26973071}
    26983072
    26993073.entry-content .wp-block-button.is-style-outline .wp-block-button__link:hover {
    2700   border-color: #111;
    27013074  color: #111;
    27023075}
    … …  
    27193092}
    27203093
    2721 .entry-content .wp-block-archives li a:after,
    2722 .entry-content .wp-block-categories li a:after,
    2723 .entry-content .wp-block-latest-posts li a:after {
    2724   color: #767676;
    2725   content: ",";
    2726 }
    2727 
    2728 .entry-content .wp-block-archives li:last-child a:after,
    2729 .entry-content .wp-block-categories li:last-child a:after,
    2730 .entry-content .wp-block-latest-posts li:last-child a:after {
    2731   color: #767676;
    2732   content: ".";
     3094.entry-content .wp-block-archives li:not(.menu-item-has-children),
     3095.entry-content .wp-block-categories li:not(.menu-item-has-children),
     3096.entry-content .wp-block-latest-posts li:not(.menu-item-has-children) {
     3097  padding-bottom: 0.75rem;
     3098}
     3099
     3100.entry-content .wp-block-archives li a,
     3101.entry-content .wp-block-categories li a,
     3102.entry-content .wp-block-latest-posts li a {
     3103  text-decoration: none;
     3104}
     3105
     3106.entry-content .wp-block-archives li ul,
     3107.entry-content .wp-block-categories li ul,
     3108.entry-content .wp-block-latest-posts li ul {
     3109  padding-left: 1rem;
    27333110}
    27343111
    … …  
    27773154
    27783155.entry-content .wp-block-pullquote blockquote {
     3156  color: #111;
    27793157  border: none;
    27803158  padding-bottom: calc(2 * 1rem);
    … …  
    27883166  margin-bottom: 0.5em;
    27893167  margin-top: 0.5em;
    2790   color: #111;
    27913168}
    27923169
    … …  
    28073184  line-height: 1.6;
    28083185  text-transform: none;
    2809   color: #767676;
    28103186}
    28113187
    … …  
    28213197}
    28223198
     3199.entry-content .wp-block-pullquote.is-style-solid-color {
     3200  background-color: #0073aa;
     3201}
     3202
    28233203.entry-content .wp-block-pullquote.is-style-solid-color p {
    28243204  font-size: 1.6875em;
    … …  
    28343214}
    28353215
     3216.entry-content .wp-block-pullquote.is-style-solid-color a {
     3217  color: #fff;
     3218}
     3219
    28363220.entry-content .wp-block-pullquote.is-style-solid-color blockquote {
     3221  color: #fff;
    28373222  margin: 0 auto;
    28383223}
    28393224
    2840 .entry-content .wp-block-pullquote.is-style-solid-color blockquote:not(.has-text-color) p,
    2841 .entry-content .wp-block-pullquote.is-style-solid-color cite {
    2842   color: white;
    2843 }
    2844 
    2845 .entry-content .wp-block-pullquote.is-style-solid-color:not(.has-background-color) {
     3225.entry-content .wp-block-pullquote.is-style-solid-color .has-primary-background-color {
    28463226  background-color: #0073aa;
    28473227}
    … …  
    29223302
    29233303.entry-content .wp-block-cover-image .wp-block-cover-image-text,
    2924 .entry-content .wp-block-cover-image h2 {
     3304.entry-content .wp-block-cover-image .wp-block-cover-text,
     3305.entry-content .wp-block-cover-image h2,
     3306.entry-content .wp-block-cover .wp-block-cover-image-text,
     3307.entry-content .wp-block-cover .wp-block-cover-text,
     3308.entry-content .wp-block-cover h2 {
    29253309  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
    29263310  font-size: 1.6875em;
    … …  
    29323316@media only screen and (min-width: 768px) {
    29333317  .entry-content .wp-block-cover-image .wp-block-cover-image-text,
    2934   .entry-content .wp-block-cover-image h2 {
     3318  .entry-content .wp-block-cover-image .wp-block-cover-text,
     3319  .entry-content .wp-block-cover-image h2,
     3320  .entry-content .wp-block-cover .wp-block-cover-image-text,
     3321  .entry-content .wp-block-cover .wp-block-cover-text,
     3322  .entry-content .wp-block-cover h2 {
    29353323    font-size: 2.25em;
    29363324    width: calc(8 * (100vw / 12));
    … …  
    29413329@media only screen and (min-width: 1168px) {
    29423330  .entry-content .wp-block-cover-image .wp-block-cover-image-text,
    2943   .entry-content .wp-block-cover-image h2 {
     3331  .entry-content .wp-block-cover-image .wp-block-cover-text,
     3332  .entry-content .wp-block-cover-image h2,
     3333  .entry-content .wp-block-cover .wp-block-cover-image-text,
     3334  .entry-content .wp-block-cover .wp-block-cover-text,
     3335  .entry-content .wp-block-cover h2 {
    29443336    width: calc(6 * (100vw / 12 ));
    29453337    max-width: calc(6 * (100vw / 12 ));
    … …  
    29483340
    29493341.entry-content .wp-block-cover-image.alignleft h2,
    2950 .entry-content .wp-block-cover-image.alignleft .wp-block-cover-image-text, .entry-content .wp-block-cover-image.alignright h2,
    2951 .entry-content .wp-block-cover-image.alignright .wp-block-cover-image-text, .entry-content .wp-block-cover-image.aligncenter h2,
    2952 .entry-content .wp-block-cover-image.aligncenter .wp-block-cover-image-text {
     3342.entry-content .wp-block-cover-image.alignleft .wp-block-cover-image-text,
     3343.entry-content .wp-block-cover-image.alignleft .wp-block-cover-text, .entry-content .wp-block-cover-image.alignright h2,
     3344.entry-content .wp-block-cover-image.alignright .wp-block-cover-image-text,
     3345.entry-content .wp-block-cover-image.alignright .wp-block-cover-text, .entry-content .wp-block-cover-image.aligncenter h2,
     3346.entry-content .wp-block-cover-image.aligncenter .wp-block-cover-image-text,
     3347.entry-content .wp-block-cover-image.aligncenter .wp-block-cover-text,
     3348.entry-content .wp-block-cover.alignleft h2,
     3349.entry-content .wp-block-cover.alignleft .wp-block-cover-image-text,
     3350.entry-content .wp-block-cover.alignleft .wp-block-cover-text,
     3351.entry-content .wp-block-cover.alignright h2,
     3352.entry-content .wp-block-cover.alignright .wp-block-cover-image-text,
     3353.entry-content .wp-block-cover.alignright .wp-block-cover-text,
     3354.entry-content .wp-block-cover.aligncenter h2,
     3355.entry-content .wp-block-cover.aligncenter .wp-block-cover-image-text,
     3356.entry-content .wp-block-cover.aligncenter .wp-block-cover-text {
    29533357  width: 100%;
    29543358  z-index: 1;
    … …  
    29593363}
    29603364
    2961 .entry-content .wp-block-cover-image.has-left-content {
     3365.entry-content .wp-block-cover-image.has-left-content,
     3366.entry-content .wp-block-cover.has-left-content {
    29623367  justify-content: center;
    29633368}
    29643369
    29653370.entry-content .wp-block-cover-image.has-left-content h2,
    2966 .entry-content .wp-block-cover-image.has-left-content .wp-block-cover-image-text {
     3371.entry-content .wp-block-cover-image.has-left-content .wp-block-cover-image-text,
     3372.entry-content .wp-block-cover-image.has-left-content .wp-block-cover-text,
     3373.entry-content .wp-block-cover.has-left-content h2,
     3374.entry-content .wp-block-cover.has-left-content .wp-block-cover-image-text,
     3375.entry-content .wp-block-cover.has-left-content .wp-block-cover-text {
    29673376  padding: 1rem;
    29683377}
    29693378
    2970 .entry-content .wp-block-cover-image.has-right-content {
     3379.entry-content .wp-block-cover-image.has-right-content,
     3380.entry-content .wp-block-cover.has-right-content {
    29713381  justify-content: center;
    29723382}
    29733383
    29743384.entry-content .wp-block-cover-image.has-right-content h2,
    2975 .entry-content .wp-block-cover-image.has-right-content .wp-block-cover-image-text {
     3385.entry-content .wp-block-cover-image.has-right-content .wp-block-cover-image-text,
     3386.entry-content .wp-block-cover-image.has-right-content .wp-block-cover-text,
     3387.entry-content .wp-block-cover.has-right-content h2,
     3388.entry-content .wp-block-cover.has-right-content .wp-block-cover-image-text,
     3389.entry-content .wp-block-cover.has-right-content .wp-block-cover-text {
    29763390  padding: 1rem;
    29773391}
    … …  
    31173531}
    31183532
     3533.entry-content .has-primary-background-color {
     3534  background-color: #0073aa;
     3535}
     3536
     3537.entry-content .has-primary-background-color p,
     3538.entry-content .has-primary-background-color h1,
     3539.entry-content .has-primary-background-color h2,
     3540.entry-content .has-primary-background-color h3,
     3541.entry-content .has-primary-background-color h4,
     3542.entry-content .has-primary-background-color h5,
     3543.entry-content .has-primary-background-color h6,
     3544.entry-content .has-primary-background-color a {
     3545  color: #fff;
     3546}
     3547
    31193548/* Media */
    31203549.page-content .wp-smiley,
    … …  
    31763605.gallery {
    31773606  display: flex;
     3607  flex-flow: row wrap;
     3608  justify-content: center;
    31783609  margin-bottom: calc(1.5 * 1rem);
    31793610}
    … …  
    31813612.gallery-item {
    31823613  display: inline-block;
    3183   margin-right: 1rem;
     3614  padding-right: 1rem;
    31843615  margin-bottom: 1rem;
    31853616  text-align: center;
    … …  
    32213652
    32223653.gallery-item:last-of-type {
    3223   margin-right: 0;
     3654  padding-right: 0;
    32243655}
    32253656
  • branches/5.0/src/wp-content/themes/twentynineteen/template-parts/content/content-none.php

    r43808 r43842  
    77 * @package WordPress
    88 * @subpackage Twenty_Nineteen
     9 * @since 1.0.0
    910 */
    1011
  • branches/5.0/src/wp-content/themes/twentynineteen/template-parts/content/content-page.php

    r43808 r43842  
    77 * @package WordPress
    88 * @subpackage Twenty_Nineteen
     9 * @since 1.0.0
    910 */
    1011
    … …  
    1213
    1314<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
     15        <?php if ( ! twentynineteen_can_show_post_thumbnail() ) : ?>
    1416        <header class="entry-header">
    15                 <?php
    16                 if ( ! twentynineteen_can_show_post_thumbnail() ) {
    17                 get_template_part( 'template-parts/header/entry', 'header' );}
    18                 ?>
     17                <?php get_template_part( 'template-parts/header/entry', 'header' ); ?>
    1918        </header>
     19        <?php endif; ?>
    2020
    2121        <div class="entry-content">
  • branches/5.0/src/wp-content/themes/twentynineteen/template-parts/content/content-single.php

    r43808 r43842  
    77 * @package WordPress
    88 * @subpackage Twenty_Nineteen
     9 * @since 1.0.0
    910 */
    1011
    … …  
    1213
    1314<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    14 <?php if ( ! twentynineteen_can_show_post_thumbnail() ) : ?>
     15        <?php if ( ! twentynineteen_can_show_post_thumbnail() ) : ?>
    1516        <header class="entry-header">
    16                 <?php if ( ! is_page() ) : ?>
    17                 <?php $discussion = twentynineteen_can_show_post_thumbnail() ? twentynineteen_get_discussion_data() : null; ?>
    18                 <?php endif; ?>
    19                 <?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>
    20                 <?php if ( ! is_page() ) : ?>
    21                 <div class="<?php echo ( ! empty( $discussion ) && count( $discussion->authors ) > 0 ) ? 'entry-meta has-discussion' : 'entry-meta'; ?>">
    22                         <?php twentynineteen_posted_by(); ?>
    23                         <?php twentynineteen_posted_on(); ?>
    24                         <span class="comment-count">
    25                                 <?php
    26                                 if ( ! empty( $discussion ) ) {
    27                                 twentynineteen_discussion_avatars_list( $discussion->authors );}
    28                                 ?>
    29                                 <?php twentynineteen_comment_count(); ?>
    30                         </span>
    31                         <?php
    32                         // Edit post link.
    33                                 edit_post_link(
    34                                         sprintf(
    35                                                 wp_kses(
    36                                                         /* translators: %s: Name of current post. Only visible to screen readers. */
    37                                                         __( 'Edit <span class="screen-reader-text">%s</span>', 'twentynineteen' ),
    38                                                         array(
    39                                                                 'span' => array(
    40                                                                         'class' => array(),
    41                                                                 ),
    42                                                         )
    43                                                 ),
    44                                                 get_the_title()
    45                                         ),
    46                                         '<span class="edit-link">' . twentynineteen_get_icon_svg( 'edit', 16 ),
    47                                         '</span>'
    48                                 );
    49                         ?>
    50                 </div><!-- .meta-info -->
    51                 <?php endif; ?>
     17                <?php get_template_part( 'template-parts/header/entry', 'header' ); ?>
    5218        </header>
    53 <?php endif; ?>
     19        <?php endif; ?>
    5420
    5521        <div class="entry-content">
    … …  
    8349        </footer><!-- .entry-footer -->
    8450
    85         <?php get_template_part( 'template-parts/post/author', 'info' ); ?>
     51        <?php if ( ! is_singular( 'attachment' ) ) : ?>
     52        <?php get_template_part( 'template-parts/post/author', 'bio' ); ?>
     53        <?php endif; ?>
    8654
    8755</article><!-- #post-${ID} -->
  • branches/5.0/src/wp-content/themes/twentynineteen/template-parts/content/content.php

    r43808 r43842  
    77 * @package WordPress
    88 * @subpackage Twenty_Nineteen
     9 * @since 1.0.0
    910 */
    1011
    … …  
    2324                endif;
    2425                ?>
    25 
    2626        </header><!-- .entry-header -->
    2727
  • branches/5.0/src/wp-content/themes/twentynineteen/template-parts/header/entry-header.php

    r43808 r43842  
    55 * @package WordPress
    66 * @subpackage Twenty_Nineteen
    7  * @since Twenty Nineteen 1.0
     7 * @since 1.0.0
    88 */
    99
    10 if ( ! is_page() ) :
    11 ?>
    12 <?php $discussion = twentynineteen_can_show_post_thumbnail() ? twentynineteen_get_discussion_data() : null; ?>
    13 <?php endif; ?>
     10$discussion = ! is_page() && twentynineteen_can_show_post_thumbnail() ? twentynineteen_get_discussion_data() : null; ?>
     11
    1412<?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>
     13
    1514<?php if ( ! is_page() ) : ?>
    16 <div class="<?php echo ( ! empty( $discussion ) && count( $discussion->authors ) > 0 ) ? 'entry-meta has-discussion' : 'entry-meta'; ?>">
     15<div class="entry-meta">
    1716        <?php twentynineteen_posted_by(); ?>
    1817        <?php twentynineteen_posted_on(); ?>
    … …  
    2019                <?php
    2120                if ( ! empty( $discussion ) ) {
    22                 twentynineteen_discussion_avatars_list( $discussion->authors );}
     21                        twentynineteen_discussion_avatars_list( $discussion->authors );
     22                }
    2323                ?>
    2424                <?php twentynineteen_comment_count(); ?>
    2525        </span>
     26        <?php
     27        // Edit post link.
     28                edit_post_link(
     29                        sprintf(
     30                                wp_kses(
     31                                        /* translators: %s: Name of current post. Only visible to screen readers. */
     32                                        __( 'Edit <span class="screen-reader-text">%s</span>', 'twentynineteen' ),
     33                                        array(
     34                                                'span' => array(
     35                                                        'class' => array(),
     36                                                ),
     37                                        )
     38                                ),
     39                                get_the_title()
     40                        ),
     41                        '<span class="edit-link">' . twentynineteen_get_icon_svg( 'edit', 16 ),
     42                        '</span>'
     43                );
     44        ?>
    2645</div><!-- .meta-info -->
    2746<?php endif; ?>
  • branches/5.0/src/wp-content/themes/twentynineteen/template-parts/header/site-branding.php

    r43808 r43842  
    55 * @package WordPress
    66 * @subpackage Twenty_Nineteen
     7 * @since 1.0.0
    78 */
    89?>
    … …  
    1314        <?php endif; ?>
    1415
    15         <?php if ( is_front_page() && is_home() ) : ?>
    16                 <h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
    17         <?php else : ?>
    18                 <p class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></p>
     16        <?php if ( ! empty( get_bloginfo( 'name' ) ) ) : ?>
     17                <?php if ( is_front_page() && is_home() ) : ?>
     18                        <h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
     19                <?php else : ?>
     20                        <p class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></p>
     21                <?php endif; ?>
    1922        <?php endif; ?>
    2023
    … …  
    4043        <?php endif; ?>
    4144        <?php if ( has_nav_menu( 'social' ) ) : ?>
    42                 <nav class="social-navigation" aria-label="<?php esc_attr_e( 'Footer Social Links Menu', 'twentynineteen' ); ?>">
     45                <nav class="social-navigation" aria-label="<?php esc_attr_e( 'Social Links Menu', 'twentynineteen' ); ?>">
    4346                        <?php
    4447                        wp_nav_menu(
  • branches/5.0/src/wp-content/themes/twentynineteen/template-parts/post/discussion-meta.php

    r43808 r43842  
    55 * @package WordPress
    66 * @subpackage Twenty_Nineteen
     7 * @since 1.0.0
    78 */
    89
Note: See TracChangeset for help on using the changeset viewer.