Make WordPress Core

Ticket #32715: 32715.4.diff

File 32715.4.diff, 7.0 KB (added by afercia, 11 years ago)
  • src/wp-admin/css/customize-nav-menus.css

     
    615615        background: #eee;
    616616}
    617617
    618 #available-menu-items .open .accordion-section-title:after {
     618/* rework the arrow indicator implementation for NVDA bug see #32715 */
     619#available-menu-items .accordion-section-title:after {
     620        content: none !important;
     621}
     622
     623#available-menu-items .accordion-section-title .toggle-indicator {
     624        display: inline-block;
     625        font-size: 20px;
     626        line-height: 1;
     627}
     628
     629#available-menu-items .accordion-section-title .toggle-indicator:after {
     630        content: '\f140';
     631        font: normal 20px/1 'dashicons';
     632        vertical-align: top;
     633        speak: none;
     634        -webkit-font-smoothing: antialiased;
     635        -moz-osx-font-smoothing: grayscale;
     636        text-decoration: none !important;
     637}
     638
     639#available-menu-items .open .accordion-section-title .toggle-indicator:after {
    619640        content: '\f142';
    620641}
    621642
     
    640661#available-menu-items .accordion-section-title button {
    641662        display: block;
    642663        width: 28px;
    643         height: 32px;
     664        height: 35px;
    644665        position: absolute;
    645666        top: 5px;
    646667        right: 5px;
     668        cursor: pointer;
    647669}
    648670
    649671#available-menu-items .accordion-section-title button:focus {
  • src/wp-admin/js/accordion.js

     
    5353         */
    5454        function accordionSwitch ( el ) {
    5555                var section = el.closest( '.accordion-section' ),
     56                        sectionToggleControl = section.find( '[aria-expanded]' ).eq( 0 ),
    5657                        siblings = section.closest( '.accordion-container' ).find( '.open' ),
     58                        siblingsToggleControl = siblings.find( '[aria-expanded]' ).eq( 0 ),
    5759                        content = section.find( '.accordion-section-content' );
    5860
    5961                // This section has no content and cannot be expanded.
     
    6567                        section.toggleClass( 'open' );
    6668                        content.toggle( true ).slideToggle( 150 );
    6769                } else {
     70                        siblingsToggleControl.attr( 'aria-expanded', 'false' );
    6871                        siblings.removeClass( 'open' );
    6972                        siblings.find( '.accordion-section-content' ).show().slideUp( 150 );
    7073                        content.toggle( false ).slideToggle( 150 );
    7174                        section.toggleClass( 'open' );
    7275                }
     76
     77                // If there's an element with an aria-expanded attribute, assume it's a toggle control and toggle the aria-expanded value.
     78                if ( sectionToggleControl ) {
     79                        sectionToggleControl.attr( 'aria-expanded', sectionToggleControl.attr( 'aria-expanded' ) === 'false' ? 'true' : 'false' );
     80                }
    7381        }
    7482
    7583})(jQuery);
  • src/wp-admin/js/customize-nav-menus.js

     
    176176
    177177                // Search input change handler.
    178178                search: function( event ) {
     179                        var $searchSection = $( '#available-menu-items-search' ),
     180                                $openSections = $( '#available-menu-items .accordion-section.open' );
     181
    179182                        if ( ! event ) {
    180183                                return;
    181184                        }
    182185                        // Manual accordion-opening behavior.
    183                         if ( this.searchTerm && ! $( '#available-menu-items-search' ).hasClass( 'open' ) ) {
    184                                 $( '#available-menu-items .accordion-section-content' ).slideUp( 'fast' );
    185                                 $( '#available-menu-items-search .accordion-section-content' ).slideDown( 'fast' );
    186                                 $( '#available-menu-items .accordion-section.open' ).removeClass( 'open' );
    187                                 $( '#available-menu-items-search' ).addClass( 'open' );
     186                        if ( this.searchTerm && ! $searchSection.hasClass( 'open' ) ) {
     187                                $openSections.find( '.accordion-section-content' ).slideUp( 'fast' );
     188                                $searchSection.find( '.accordion-section-content' ).slideDown( 'fast' );
     189                                $openSections.find( '[aria-expanded]' ).eq( 0 ).attr( 'aria-expanded', 'false' );
     190                                $openSections.removeClass( 'open' );
     191                                $searchSection.addClass( 'open' );
    188192                        }
    189193                        if ( '' === event.target.value ) {
    190                                 $( '#available-menu-items-search' ).removeClass( 'open' );
     194                                $searchSection.removeClass( 'open' );
    191195                        }
    192196                        if ( this.searchTerm === event.target.value ) {
    193197                                return;
  • src/wp-includes/class-wp-customize-nav-menus.php

     
    671671                                <ul class="accordion-section-content" data-type="search"></ul>
    672672                        </div>
    673673                        <div id="new-custom-menu-item" class="accordion-section">
    674                                 <h4 class="accordion-section-title"><?php _e( 'Custom Links' ); ?><button type="button" class="not-a-button"><span class="screen-reader-text"><?php _e( 'Toggle' ); ?></span></button></h4>
     674                                <h4 class="accordion-section-title" role="presentation"><?php _e( 'Custom Links' ); ?> <button type="button" class="not-a-button" aria-expanded="false"><span class="screen-reader-text"><?php _e( 'Toggle section: Custom Links' ); ?></span><span class="toggle-indicator" aria-hidden="true"></span></button></h4>
    675675                                <div class="accordion-section-content">
    676676                                        <input type="hidden" value="custom" id="custom-menu-item-type" name="menu-item[-1][menu-item-type]" />
    677677                                        <p id="menu-item-url-wrap">
     
    703703                                foreach ( $post_types as $type ) :
    704704                                        ?>
    705705                                        <div id="available-menu-items-<?php echo esc_attr( $type->name ); ?>" class="accordion-section">
    706                                                 <h4 class="accordion-section-title"><?php echo esc_html( $type->label ); ?> <span class="spinner"></span> <button type="button" class="not-a-button"><span class="screen-reader-text"><?php _e( 'Toggle' ); ?></span></button></h4>
     706                                                <h4 class="accordion-section-title" role="presentation"><?php echo esc_html( $type->label ); ?> <span class="spinner"></span> <button type="button" class="not-a-button" aria-expanded="false"><span class="screen-reader-text"><?php printf( 'Toggle section: %s', esc_html( $type->label ) ); ?></span><span class="toggle-indicator" aria-hidden="true"></span></button></h4>
    707707                                                <ul class="accordion-section-content" data-type="<?php echo esc_attr( $type->name ); ?>" data-obj_type="post_type"></ul>
    708708                                        </div>
    709709                                <?php
     
    715715                                foreach ( $taxonomies as $tax ) :
    716716                                        ?>
    717717                                        <div id="available-menu-items-<?php echo esc_attr( $tax->name ); ?>" class="accordion-section">
    718                                                 <h4 class="accordion-section-title"><?php echo esc_html( $tax->label ); ?> <span class="spinner"></span> <button type="button" class="not-a-button"><span class="screen-reader-text"><?php _e( 'Toggle' ); ?></span></button></h4>
     718                                                <h4 class="accordion-section-title" role="presentation"><?php echo esc_html( $tax->label ); ?> <span class="spinner"></span> <button type="button" class="not-a-button" aria-expanded="false"><span class="screen-reader-text"><?php printf( 'Toggle section: %s', esc_html( $tax->label ) ); ?></span><span class="toggle-indicator" aria-hidden="true"></span></button></h4>
    719719                                                <ul class="accordion-section-content" data-type="<?php echo esc_attr( $tax->name ); ?>" data-obj_type="taxonomy"></ul>
    720720                                        </div>
    721721                                <?php