Make WordPress Core

Ticket #53951: 53951.4.diff

File 53951.4.diff, 3.0 KB (added by afercia, 2 years ago)
  • src/wp-content/themes/twentytwenty/assets/js/index.js

     
    678678/* Toggle an attribute ----------------------- */
    679679
    680680function twentytwentyToggleAttribute( element, attribute, trueVal, falseVal ) {
    681         if ( element.classList.contains( 'close-search-toggle' ) ) {
     681        var toggles;
     682
     683        if ( ! element.hasAttribute( attribute ) ) {
    682684                return;
    683685        }
     686
    684687        if ( trueVal === undefined ) {
    685688                trueVal = true;
    686689        }
     
    687690        if ( falseVal === undefined ) {
    688691                falseVal = false;
    689692        }
    690         if ( element.getAttribute( attribute ) !== trueVal ) {
    691                 element.setAttribute( attribute, trueVal );
    692         } else {
    693                 element.setAttribute( attribute, falseVal );
    694         }
     693
     694        /*
     695         * Take into account multiple toggle elements that need their state to be
     696         * synced. For example: the Search toggle buttons for desktop and mobile.
     697         */
     698        toggles = document.querySelectorAll( '[data-toggle-target="' + element.dataset.toggleTarget + '"]' );
     699
     700        toggles.forEach( function( toggle ) {
     701                if ( ! toggle.hasAttribute( attribute ) ) {
     702                        return;
     703                }
     704
     705                if ( toggle.getAttribute( attribute ) !== trueVal ) {
     706                        toggle.setAttribute( attribute, trueVal );
     707                } else {
     708                        toggle.setAttribute( attribute, falseVal );
     709                }
     710        } );
    695711}
    696712
    697713/**
  • src/wp-content/themes/twentytwenty/template-parts/modal-menu.php

     
    1717
    1818                        <div class="menu-top">
    1919
    20                                 <button class="toggle close-nav-toggle fill-children-current-color" data-toggle-target=".menu-modal" data-toggle-body-class="showing-menu-modal" aria-expanded="false" data-set-focus=".menu-modal">
     20                                <button class="toggle close-nav-toggle fill-children-current-color" data-toggle-target=".menu-modal" data-toggle-body-class="showing-menu-modal" data-set-focus=".menu-modal">
    2121                                        <span class="toggle-text"><?php _e( 'Close Menu', 'twentytwenty' ); ?></span>
    2222                                        <?php twentytwenty_the_theme_svg( 'cross' ); ?>
    2323                                </button><!-- .nav-toggle -->
  • src/wp-content/themes/twentytwenty/template-parts/modal-search.php

     
    88 */
    99
    1010?>
    11 <div class="search-modal cover-modal header-footer-group" data-modal-target-string=".search-modal">
     11<div class="search-modal cover-modal header-footer-group" data-modal-target-string=".search-modal" role="dialog" aria-modal="true" aria-label="<?php esc_attr_e( 'Search', 'twentytwenty' ); ?>">
    1212
    1313        <div class="search-modal-inner modal-inner">
    1414