WordPress.org
Get WordPress

Make WordPress Core

Ticket #47708: 47708.7.diff

File 47708.7.diff, 25.5 KB (added by audrasjb, 5 years ago)

Fixes use of aria-current attribute in tab navigation

  • src/wp-admin/about.php 

    diff --git a/src/wp-admin/about.php b/src/wp-admin/about.php
index c44db2dce3..2dc35cb735 100644
    a b $title = _x( 'About', 'page title' ); 
    1515list( $display_version ) = explode( '-', get_bloginfo( 'version' ) );
    1616
    1717$version_label = sprintf(
    18         /* translators: The current WordPress version number */
     18        /* translators: %s: The current WordPress version number. */
    1919        __( 'WordPress %s' ),
    2020        $display_version
    2121);
    … … $version_label = sprintf( 
    2323include( ABSPATH . 'wp-admin/admin-header.php' );
    2424?>
    2525        <div class="wrap about-wrap full-width-layout">
     26
    2627                <div class="about__header">
    2728                        <div class="about__header-title">
    2829                                <h1 aria-label="<?php echo esc_attr( $version_label ); ?>">
    2930                                        <span><?php echo $display_version; ?></span>
    30                                         WordPress <?php /* @todo Does this need translation? */ ?>
     31                                        <?php _e( 'WordPress' ); ?>
    3132                                </h1>
    3233                        </div>
    3334
    … … include( ABSPATH . 'wp-admin/admin-header.php' ); 
    4647                                        <?php
    4748                                        printf(
    4849                                                /* translators: %s: The current WordPress version number. */
    49                                                 __( 'Introducing our most refined user experience with the improved Block Editor in WordPress %s &#147;Name&#148;!' ),
     50                                                __( 'Introducing our most refined user experience with the improved block editor in WordPress %s!' ),
    5051                                                $display_version
    5152                                        );
    5253                                        ?>
    … … include( ABSPATH . 'wp-admin/admin-header.php' ); 
    6364
    6465                <div class="about__section is-feature">
    6566                        <p>
    66                                 <?php _e( '5.3 expands and refines the block editor introduced in WordPress 5.0 with new blocks, more intuitive interactions, and improved accessibility. New features in the editor increase design freedoms, provide additional layout options and style variations to allow designers complete control over the look of a site. This release also introduces the Twenty Twenty theme giving the user more design flexibility and integration with the Block Editor. Creating beautiful web pages and advanced layouts has never been easier.' ); ?>
     67                                <?php _e( '5.3 expands and refines the block editor introduced in WordPress 5.0 with new blocks, more intuitive interactions, and improved accessibility. New features in the editor increase design freedoms, provide additional layout options and style variations to allow designers complete control over the look of a site. This release also introduces the Twenty Twenty theme giving the user more design flexibility and integration with the block editor. Creating beautiful web pages and advanced layouts has never been easier.' ); ?>
    6768                        </p>
    6869                </div>
    6970
    … … include( ABSPATH . 'wp-admin/admin-header.php' ); 
    8283                                </p>
    8384
    8485                                <p>
    85                                         <?php _e( 'Accessibility improvements include the integration of block editor styles in the admin interface. These improved styles fix many accessibility issues: color contrast on form fields and buttons, consistency between editor and admin interfaces, new snackbar notices, standardizing to the default WordPress color scheme, and the introduction of Motion to make interacting with your blocks feel swift and natural. For people who use a keyboard to navigate the dashboard, the Block Editor now has a Navigation mode. This lets you jump from block to block without tabbing through every part of the block controls.' ); ?>
     86                                        <?php _e( 'Accessibility improvements include the integration of block editor styles in the admin interface. These improved styles fix many accessibility issues: color contrast on form fields and buttons, consistency between editor and admin interfaces, new snackbar notices, standardizing to the default WordPress color scheme, and the introduction of Motion to make interacting with your blocks feel swift and natural. For people who use a keyboard to navigate the dashboard, the block editor now has a Navigation mode. This lets you jump from block to block without tabbing through every part of the block controls.' ); ?>
    8687                                </p>
    8788                        </div>
    8889                </div>
    … … include( ABSPATH . 'wp-admin/admin-header.php' ); 
    9091                <div class="about__section has-2-columns">
    9192                        <div class="column is-vertically-aligned-center">
    9293                                <h3><?php _e( 'Expanded Design Flexibility' ); ?></h3>
    93                                 <p><?php _e( '&#147;Name&#148; adds even more robust tools for creating amazing designs.' ); ?></p>
     94                                <p>
     95                                        <?php
     96                                        printf(
     97                                                /* translators: %s: The current WordPress version number. */
     98                                                __( 'WordPress %s adds even more robust tools for creating amazing designs.' ),
     99                                                $display_version
     100                                        );
     101                                        ?>
     102                                </p>
    94103                                <ul>
    95104                                        <li><?php _e( 'The new Group block lets you easily divide your page into colorful sections' ); ?></li>
    96105                                        <li><?php _e( 'The Columns block now supports fixed column widths' ); ?></li>
    … … include( ABSPATH . 'wp-admin/admin-header.php' ); 
    109118                <div class="about__section has-2-columns has-subtle-background-color">
    110119                        <div class="column is-vertically-aligned-center">
    111120                                <h3><?php _e( 'Introducing Twenty Twenty' ); ?></h3>
    112                                 <p><?php _e( 'As the Block Editor celebrates its first birthday, we are proud that Twenty Twenty is designed with flexibility at its core. Show off your services or products with a combination of columns, groups, and media blocks. Set your content to wide or full alignment for dynamic and engaging layouts. Or let your thoughts be the star with a centered content column!' ); ?></p>
     121                                <p><?php _e( 'As the block editor celebrates its first birthday, we are proud that Twenty Twenty is designed with flexibility at its core. Show off your services or products with a combination of columns, groups, and media blocks. Set your content to wide or full alignment for dynamic and engaging layouts. Or let your thoughts be the star with a centered content column!' ); ?></p>
    113122
    114123                                <p>
    115                                 <?php
     124                                        <?php
    116125                                        printf(
    117                                                 /* translators: 1: Link to the Inter font website. */
    118                                                 __( 'As befits a theme called Twenty Twenty, clarity and readability is also a big focus. The theme includes the typeface <a href="%1$s">Inter</a>, designed by Rasmus Andersson. Inter comes in a Variable Font version, a first for default themes, which keeps load times short by containing all weights and styles of Inter in just two font files.' ),
     126                                                /* translators: %s: Link to the Inter font website. */
     127                                                __( 'As befits a theme called Twenty Twenty, clarity and readability is also a big focus. The theme includes the typeface <a href="%s">Inter</a>, designed by Rasmus Andersson. Inter comes in a Variable Font version, a first for default themes, which keeps load times short by containing all weights and styles of Inter in just two font files.' ),
    119128                                                'https://rsms.me/inter/'
    120129                                        );
    121130                                        ?>
    … … include( ABSPATH . 'wp-admin/admin-header.php' ); 
    169178                        <h3 class="is-section-header"><?php _e( 'For Developers' ); ?></h3>
    170179
    171180                        <div class="column">
    172                                 <h4><?php _e( 'Time/Date Component Fixes' ); ?></h4>
     181                                <h4><?php _e( 'Date/Time Component Fixes' ); ?></h4>
    173182                                <p>
    174                                 <?php
     183                                        <?php
    175184                                        printf(
    176                                                 /* translators: 1: Link to the date/time developer notes. */
    177                                                 __( 'Developers can now work with <a href="%1$s">dates and timezones</a> in a more reliable way. Date and time functionality has received a number of new API functions for unified timezone retrieval and PHP interoperability, as well as many bug fixes.' ),
     185                                                /* translators: %s: Link to the date/time developer notes. */
     186                                                __( 'Developers can now work with <a href="%s">dates and timezones</a> in a more reliable way. Date and time functionality has received a number of new API functions for unified timezone retrieval and PHP interoperability, as well as many bug fixes.' ),
    178187                                                'https://make.wordpress.org/core/2019/09/23/date-time-improvements-wp-5-3/'
    179188                                        );
    180189                                        ?>
    … … include( ABSPATH . 'wp-admin/admin-header.php' ); 
    183192                        <div class="column">
    184193                                <h4><?php _e( 'PHP 7.4 Compatibility' ); ?></h4>
    185194                                <p>
    186                                 <?php
     195                                        <?php
    187196                                        printf(
    188                                                 /* translators: 1: Link to the PHP 7 developer notes. */
    189                                                 __( 'The WordPress core team is actively preparing to support PHP 7.4 when it is released later this year. WordPress 5.3 contains <a href="%1$s">multiple changes</a> to remove deprecated functionality and ensure compatibility. Please test 5.3 with PHP 7.4 to ensure all functionality continues to work as expected and does not raise any new warnings.' ),
     197                                                /* translators: %s: Link to the PHP 7 developer notes. */
     198                                                __( 'WordPress 5.3 aims to fully support PHP 7.4. This release contains <a href="%s">multiple changes</a> to remove deprecated functionality and ensure compatibility. WordPress continues to encourage all users to run the latest and greatest versions of PHP.' ),
    190199                                                'https://make.wordpress.org/core/2019/10/11/wordpress-and-php-7-4/'
    191200                                        );
    192201                                        ?>

  • src/wp-admin/credits.php 

    diff --git a/src/wp-admin/credits.php b/src/wp-admin/credits.php
index 8940a78481..86671fe542 100644
    a b $title = __( 'Credits' ); 
    1414
    1515list( $display_version ) = explode( '-', get_bloginfo( 'version' ) );
    1616
     17$version_label = sprintf(
     18        /* translators: %s: The current WordPress version number. */
     19        __( 'WordPress %s' ),
     20        $display_version
     21);
     22
    1723include( ABSPATH . 'wp-admin/admin-header.php' );
    1824?>
    1925<div class="wrap about-wrap full-width-layout">
    2026
    21 <h1>
    22         <?php
    23         printf(
    24                 /* translators: %s: The current WordPress version number. */
    25                 __( 'Welcome to WordPress&nbsp;%s' ),
    26                 $display_version
    27         );
    28         ?>
    29 </h1>
    30 
    31 <p class="about-text">
    32         <?php
    33         printf(
    34                 /* translators: %s: The current WordPress version number. */
    35                 __( 'Congratulations on updating to WordPress %s! This update makes it easier than ever to fix your site if something goes wrong.' ),
    36                 $display_version
    37         );
    38         ?>
    39 </p>
    40 
    41 <div class="wp-badge">
    42         <?php
    43         printf(
    44                 /* translators: %s: The current WordPress version number. */
    45                 __( 'Version %s' ),
    46                 $display_version
    47         );
    48         ?>
    49 </div>
    50 
    51 <nav class="nav-tab-wrapper wp-clearfix" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
    52         <a href="about.php" class="nav-tab"><?php _e( 'What&#8217;s New' ); ?></a>
    53         <a href="credits.php" class="nav-tab nav-tab-active" aria-current="page"><?php _e( 'Credits' ); ?></a>
    54         <a href="freedoms.php" class="nav-tab"><?php _e( 'Freedoms' ); ?></a>
    55         <a href="privacy.php" class="nav-tab"><?php _e( 'Privacy' ); ?></a>
    56 </nav>
    57 
    58 <div class="about-wrap-content">
     27        <div class="about__header">
     28                <div class="about__header-title">
     29                        <h1 aria-label="<?php echo esc_attr( $version_label ); ?>">
     30                                <span><?php echo $display_version; ?></span>
     31                                <?php _e( 'WordPress' ); ?>
     32                        </h1>
     33                </div>
     34
     35                <div class="about__header-badge wp-badge">
     36                        <?php
     37                        printf(
     38                                /* translators: %s: The current WordPress version number. */
     39                                __( 'Version %s' ),
     40                                $display_version
     41                        );
     42                        ?>
     43                </div>
     44
     45                <div class="about__header-text">
     46                        <p>
     47                                <?php
     48                                printf(
     49                                        /* translators: %s: The current WordPress version number. */
     50                                        __( 'Introducing our most refined user experience with the improved block editor in WordPress %s!' ),
     51                                        $display_version
     52                                );
     53                                ?>
     54                        </p>
     55                </div>
     56
     57                <nav class="about__header-navigation nav-tab-wrapper wp-clearfix" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
     58                        <a href="about.php" class="nav-tab"><?php _e( 'What&#8217;s New' ); ?></a>
     59                        <a href="credits.php" class="nav-tab nav-tab-active" aria-current="page"><?php _e( 'Credits' ); ?></a>
     60                        <a href="freedoms.php" class="nav-tab"><?php _e( 'Freedoms' ); ?></a>
     61                        <a href="privacy.php" class="nav-tab"><?php _e( 'Privacy' ); ?></a>
     62                </nav>
     63        </div>
     64
     65        <div class="about-wrap-content">
    5966<?php
    6067
    6168$credits = wp_credits();
    … … foreach ( $credits['groups'] as $group_slug => $group_data ) { 
    137144}
    138145
    139146?>
    140 </div>
     147        </div>
    141148</div>
    142149<?php
    143150

  • src/wp-admin/freedoms.php 

    diff --git a/src/wp-admin/freedoms.php b/src/wp-admin/freedoms.php
index fe8f1868f9..60f022be11 100644
    a b $title = __( 'Freedoms' ); 
    1919
    2020list( $display_version ) = explode( '-', get_bloginfo( 'version' ) );
    2121
    22 include( ABSPATH . 'wp-admin/admin-header.php' );
     22$version_label = sprintf(
     23        /* translators: %s: The current WordPress version number. */
     24        __( 'WordPress %s' ),
     25        $display_version
     26);
    2327
     28include( ABSPATH . 'wp-admin/admin-header.php' );
    2429?>
    2530<div class="wrap about-wrap full-width-layout">
    2631
    27 <h1>
    28         <?php
    29         printf(
    30                 /* translators: %s: The current WordPress version number. */
    31                 __( 'Welcome to WordPress&nbsp;%s' ),
    32                 $display_version
    33         );
    34         ?>
    35 </h1>
    36 
    37 <p class="about-text">
    38         <?php
    39         printf(
    40                 /* translators: %s: The current WordPress version number. */
    41                 __( 'Congratulations on updating to WordPress %s! This update makes it easier than ever to fix your site if something goes wrong.' ),
    42                 $display_version
    43         );
    44         ?>
    45 </p>
    46 
    47 <div class="wp-badge">
    48         <?php
    49         printf(
    50                 /* translators: %s: The current WordPress version number. */
    51                 __( 'Version %s' ),
    52                 $display_version
    53         );
    54         ?>
    55 </div>
    56 
    57 <nav class="nav-tab-wrapper wp-clearfix" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
    58         <a href="about.php" class="nav-tab"><?php _e( 'What&#8217;s New' ); ?></a>
    59         <a href="credits.php" class="nav-tab"><?php _e( 'Credits' ); ?></a>
    60         <a href="freedoms.php" class="nav-tab nav-tab-active" aria-current="page"><?php _e( 'Freedoms' ); ?></a>
    61         <a href="privacy.php" class="nav-tab"><?php _e( 'Privacy' ); ?></a>
    62 </nav>
    63 
    64 <div class="about-wrap-content">
    65         <div class="feature-section has-1-columns">
    66                 <h2><?php _e( 'Freedoms' ); ?></h2>
    67                 <p class="about-description">
    68                 <?php
    69                 printf(
    70                         /* translators: %s: https://wordpress.org/about/license/ */
    71                         __( 'WordPress is Free and open source software, built by a distributed community of mostly volunteer developers from around the world. WordPress comes with some awesome, worldview-changing rights courtesy of its <a href="%s">license</a>, the GPL.' ),
    72                         __( 'https://wordpress.org/about/license/' )
    73                 );
    74                 ?>
    75                 </p>
    76         </div>
     32        <div class="about__header">
     33                <div class="about__header-title">
     34                        <h1 aria-label="<?php echo esc_attr( $version_label ); ?>">
     35                                <span><?php echo $display_version; ?></span>
     36                                <?php _e( 'WordPress' ); ?>
     37                        </h1>
     38                </div>
    7739
    78         <div class="feature-section has-4-columns is-fullwidth">
    79                 <div class="column">
    80                         <div class="freedoms-image"></div>
    81                         <h3><?php _e( 'The 1st Freedom' ); ?></h3>
    82                         <p><?php _e( 'To run the program for any purpose.' ); ?></p>
     40                <div class="about__header-badge wp-badge">
     41                        <?php
     42                        printf(
     43                                /* translators: %s: The current WordPress version number. */
     44                                __( 'Version %s' ),
     45                                $display_version
     46                        );
     47                        ?>
    8348                </div>
    84                 <div class="column">
    85                         <div class="freedoms-image"></div>
    86                         <h3><?php _e( 'The 2nd Freedom' ); ?></h3>
    87                         <p><?php _e( 'To study how the program works and change it to make it do what you wish.' ); ?></p>
     49
     50                <div class="about__header-text">
     51                        <p>
     52                                <?php
     53                                printf(
     54                                        /* translators: %s: The current WordPress version number. */
     55                                        __( 'Introducing our most refined user experience with the improved block editor in WordPress %s!' ),
     56                                        $display_version
     57                                );
     58                                ?>
     59                        </p>
    8860                </div>
    89                 <div class="column">
    90                         <div class="freedoms-image"></div>
    91                         <h3><?php _e( 'The 3rd Freedom' ); ?></h3>
    92                         <p><?php _e( 'To redistribute.' ); ?></p>
     61
     62                <nav class="about__header-navigation nav-tab-wrapper wp-clearfix" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
     63                        <a href="about.php" class="nav-tab"><?php _e( 'What&#8217;s New' ); ?></a>
     64                        <a href="credits.php" class="nav-tab"><?php _e( 'Credits' ); ?></a>
     65                        <a href="freedoms.php" class="nav-tab nav-tab-active" aria-current="page"><?php _e( 'Freedoms' ); ?></a>
     66                        <a href="privacy.php" class="nav-tab"><?php _e( 'Privacy' ); ?></a>
     67                </nav>
     68        </div>
     69
     70        <div class="about-wrap-content">
     71                <div class="feature-section has-1-columns">
     72                        <h2><?php _e( 'Freedoms' ); ?></h2>
     73                        <p class="about-description">
     74                        <?php
     75                        printf(
     76                                /* translators: %s: https://wordpress.org/about/license/ */
     77                                __( 'WordPress is Free and open source software, built by a distributed community of mostly volunteer developers from around the world. WordPress comes with some awesome, worldview-changing rights courtesy of its <a href="%s">license</a>, the GPL.' ),
     78                                __( 'https://wordpress.org/about/license/' )
     79                        );
     80                        ?>
     81                        </p>
    9382                </div>
    94                 <div class="column">
    95                         <div class="freedoms-image"></div>
    96                         <h3><?php _e( 'The 4th Freedom' ); ?></h3>
    97                         <p><?php _e( 'To distribute copies of your modified versions to others.' ); ?></p>
     83
     84                <div class="feature-section has-4-columns is-fullwidth">
     85                        <div class="column">
     86                                <div class="freedoms-image"></div>
     87                                <h3><?php _e( 'The 1st Freedom' ); ?></h3>
     88                                <p><?php _e( 'To run the program for any purpose.' ); ?></p>
     89                        </div>
     90                        <div class="column">
     91                                <div class="freedoms-image"></div>
     92                                <h3><?php _e( 'The 2nd Freedom' ); ?></h3>
     93                                <p><?php _e( 'To study how the program works and change it to make it do what you wish.' ); ?></p>
     94                        </div>
     95                        <div class="column">
     96                                <div class="freedoms-image"></div>
     97                                <h3><?php _e( 'The 3rd Freedom' ); ?></h3>
     98                                <p><?php _e( 'To redistribute.' ); ?></p>
     99                        </div>
     100                        <div class="column">
     101                                <div class="freedoms-image"></div>
     102                                <h3><?php _e( 'The 4th Freedom' ); ?></h3>
     103                                <p><?php _e( 'To distribute copies of your modified versions to others.' ); ?></p>
     104                        </div>
    98105                </div>
    99         </div>
    100106
    101         <div class="feature-section has-1-columns">
    102                 <p>
    103                 <?php
    104                 printf(
    105                         /* translators: %s: https://wordpressfoundation.org/trademark-policy/ */
    106                         __( 'WordPress grows when people like you tell their friends about it, and the thousands of businesses and services that are built on and around WordPress share that fact with their users. We&#8217;re flattered every time someone spreads the good word, just make sure to <a href="%s">check out our trademark guidelines</a> first.' ),
    107                         'https://wordpressfoundation.org/trademark-policy/'
    108                 );
    109                 ?>
    110                 </p>
    111 
    112                 <p>
    113                 <?php
    114                 $plugins_url = current_user_can( 'activate_plugins' ) ? admin_url( 'plugins.php' ) : __( 'https://wordpress.org/plugins/' );
    115                 $themes_url  = current_user_can( 'switch_themes' ) ? admin_url( 'themes.php' ) : __( 'https://wordpress.org/themes/' );
    116                 printf(
    117                         /* translators: 1: URL to Plugins screen, 2: URL to Themes screen, 3: https://wordpress.org/about/license/ */
    118                         __( 'Every plugin and theme in WordPress.org&#8217;s directory is 100%% GPL or a similarly free and compatible license, so you can feel safe finding <a href="%1$s">plugins</a> and <a href="%2$s">themes</a> there. If you get a plugin or theme from another source, make sure to <a href="%3$s">ask them if it&#8217;s GPL</a> first. If they don&#8217;t respect the WordPress license, we don&#8217;t recommend them.' ),
    119                         $plugins_url,
    120                         $themes_url,
    121                         __( 'https://wordpress.org/about/license/' )
    122                 );
    123                 ?>
    124                 </p>
    125 
    126                 <p><?php _e( 'Don&#8217;t you wish all software came with these freedoms? So do we! For more information, check out the <a href="https://www.fsf.org/">Free Software Foundation</a>.' ); ?></p>
     107                <div class="feature-section has-1-columns">
     108                        <p>
     109                        <?php
     110                        printf(
     111                                /* translators: %s: https://wordpressfoundation.org/trademark-policy/ */
     112                                __( 'WordPress grows when people like you tell their friends about it, and the thousands of businesses and services that are built on and around WordPress share that fact with their users. We&#8217;re flattered every time someone spreads the good word, just make sure to <a href="%s">check out our trademark guidelines</a> first.' ),
     113                                'https://wordpressfoundation.org/trademark-policy/'
     114                        );
     115                        ?>
     116                        </p>
     117
     118                        <p>
     119                        <?php
     120                        $plugins_url = current_user_can( 'activate_plugins' ) ? admin_url( 'plugins.php' ) : __( 'https://wordpress.org/plugins/' );
     121                        $themes_url  = current_user_can( 'switch_themes' ) ? admin_url( 'themes.php' ) : __( 'https://wordpress.org/themes/' );
     122                        printf(
     123                                /* translators: 1: URL to Plugins screen, 2: URL to Themes screen, 3: https://wordpress.org/about/license/ */
     124                                __( 'Every plugin and theme in WordPress.org&#8217;s directory is 100%% GPL or a similarly free and compatible license, so you can feel safe finding <a href="%1$s">plugins</a> and <a href="%2$s">themes</a> there. If you get a plugin or theme from another source, make sure to <a href="%3$s">ask them if it&#8217;s GPL</a> first. If they don&#8217;t respect the WordPress license, we don&#8217;t recommend them.' ),
     125                                $plugins_url,
     126                                $themes_url,
     127                                __( 'https://wordpress.org/about/license/' )
     128                        );
     129                        ?>
     130                        </p>
     131
     132                        <p><?php _e( 'Don&#8217;t you wish all software came with these freedoms? So do we! For more information, check out the <a href="https://www.fsf.org/">Free Software Foundation</a>.' ); ?></p>
     133                </div>
    127134        </div>
    128 </div>
    129135
    130136</div>
    131137<?php include( ABSPATH . 'wp-admin/admin-footer.php' ); ?>

  • src/wp-admin/privacy.php 

    diff --git a/src/wp-admin/privacy.php b/src/wp-admin/privacy.php
index 075f6b89bf..7420e1d287 100644
    a b $title = __( 'Privacy' ); 
    1313
    1414list( $display_version ) = explode( '-', get_bloginfo( 'version' ) );
    1515
     16$version_label = sprintf(
     17        /* translators: %s: The current WordPress version number. */
     18        __( 'WordPress %s' ),
     19        $display_version
     20);
     21
    1622include( ABSPATH . 'wp-admin/admin-header.php' );
    1723?>
    1824<div class="wrap about-wrap full-width-layout">
    1925
    20 <h1>
    21         <?php
    22         printf(
    23                 /* translators: %s: The current WordPress version number. */
    24                 __( 'Welcome to WordPress&nbsp;%s' ),
    25                 $display_version
    26         );
    27         ?>
    28 </h1>
     26        <div class="about__header">
     27                <div class="about__header-title">
     28                        <h1 aria-label="<?php echo esc_attr( $version_label ); ?>">
     29                                <span><?php echo $display_version; ?></span>
     30                                <?php _e( 'WordPress' ); ?>
     31                        </h1>
     32                </div>
    2933
    30 <p class="about-text">
    31         <?php
    32         printf(
    33                 /* translators: %s: The current WordPress version number. */
    34                 __( 'Congratulations on updating to WordPress %s! This update makes it easier than ever to fix your site if something goes wrong.' ),
    35                 $display_version
    36         );
    37         ?>
    38 </p>
     34                <div class="about__header-badge wp-badge">
     35                        <?php
     36                        printf(
     37                                /* translators: %s: The current WordPress version number. */
     38                                __( 'Version %s' ),
     39                                $display_version
     40                        );
     41                        ?>
     42                </div>
    3943
    40 <div class="wp-badge">
    41         <?php
    42         printf(
    43                 /* translators: %s: The current WordPress version number. */
    44                 __( 'Version %s' ),
    45                 $display_version
    46         );
    47         ?>
    48 </div>
     44                <div class="about__header-text">
     45                        <p>
     46                                <?php
     47                                printf(
     48                                        /* translators: %s: The current WordPress version number. */
     49                                        __( 'Introducing our most refined user experience with the improved block editor in WordPress %s!' ),
     50                                        $display_version
     51                                );
     52                                ?>
     53                        </p>
     54                </div>
    4955
    50 <nav class="nav-tab-wrapper wp-clearfix" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
    51         <a href="about.php" class="nav-tab"><?php _e( 'What&#8217;s New' ); ?></a>
    52         <a href="credits.php" class="nav-tab"><?php _e( 'Credits' ); ?></a>
    53         <a href="freedoms.php" class="nav-tab"><?php _e( 'Freedoms' ); ?></a>
    54         <a href="privacy.php" class="nav-tab nav-tab-active" aria-current="page"><?php _e( 'Privacy' ); ?></a>
    55 </nav>
     56                <nav class="about__header-navigation nav-tab-wrapper wp-clearfix" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
     57                        <a href="about.php" class="nav-tab"><?php _e( 'What&#8217;s New' ); ?></a>
     58                        <a href="credits.php" class="nav-tab"><?php _e( 'Credits' ); ?></a>
     59                        <a href="freedoms.php" class="nav-tab"><?php _e( 'Freedoms' ); ?></a>
     60                        <a href="privacy.php" class="nav-tab nav-tab-active" aria-current="page"><?php _e( 'Privacy' ); ?></a>
     61                </nav>
     62        </div>
    5663
    57 <div class="about-wrap-content">
    58         <p class="about-description"><?php _e( 'From time to time, your WordPress site may send data to WordPress.org &#8212; including, but not limited to &#8212; the version of WordPress you are using, and a list of installed plugins and themes.' ); ?></p>
     64        <div class="about-wrap-content">
     65                <p class="about-description"><?php _e( 'From time to time, your WordPress site may send data to WordPress.org &#8212; including, but not limited to &#8212; the version of WordPress you are using, and a list of installed plugins and themes.' ); ?></p>
    5966
    60         <p>
    61                 <?php
    62                 printf(
    63                         /* translators: %s: https://wordpress.org/about/stats/ */
    64                         __( 'This data is used to provide general enhancements to WordPress, which includes helping to protect your site by finding and automatically installing new updates. It is also used to calculate statistics, such as those shown on the <a href="%s">WordPress.org stats page</a>.' ),
    65                         __( 'https://wordpress.org/about/stats/' )
    66                 );
    67                 ?>
    68         </p>
     67                <p>
     68                        <?php
     69                        printf(
     70                                /* translators: %s: https://wordpress.org/about/stats/ */
     71                                __( 'This data is used to provide general enhancements to WordPress, which includes helping to protect your site by finding and automatically installing new updates. It is also used to calculate statistics, such as those shown on the <a href="%s">WordPress.org stats page</a>.' ),
     72                                __( 'https://wordpress.org/about/stats/' )
     73                        );
     74                        ?>
     75                </p>
    6976
    70         <p>
    71                 <?php
    72                 printf(
    73                         /* translators: %s: https://wordpress.org/about/privacy/ */
    74                         __( 'We take privacy and transparency very seriously. To learn more about what data we collect, and how we use it, please visit <a href="%s">WordPress.org/about/privacy</a>.' ),
    75                         __( 'https://wordpress.org/about/privacy/' )
    76                 );
    77                 ?>
    78         </p>
    79 </div>
     77                <p>
     78                        <?php
     79                        printf(
     80                                /* translators: %s: https://wordpress.org/about/privacy/ */
     81                                __( 'We take privacy and transparency very seriously. To learn more about what data we collect, and how we use it, please visit <a href="%s">WordPress.org/about/privacy</a>.' ),
     82                                __( 'https://wordpress.org/about/privacy/' )
     83                        );
     84                        ?>
     85                </p>
     86        </div>
    8087
    8188</div>
    8289<?php include( ABSPATH . 'wp-admin/admin-footer.php' ); ?>