WordPress.org

Make WordPress Core


Ignore:
Timestamp:
09/30/2019 07:36:42 PM (7 weeks ago)
Author:
afercia
Message:

Accessibility: Media: Use the ARIA tabs pattern for the media modal menus.

The ARIA tabs pattern improves interaction for keyboard and assistive technologies users.
It gives the menu items proper roles, and aria-selected allows users of assistive technologies to know which tab is currently selected.

Props audrasjb, afercia, joedolson, karmatosed, melchoyce.
See #47149.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-includes/media-template.php

    r46239 r46363  
    179179    <script type="text/html" id="tmpl-media-frame">
    180180        <div class="media-frame-title" id="media-frame-title"></div>
     181        <button type="button" class="button button-link media-frame-menu-toggle" aria-expanded="false">
     182            <?php _e( 'Media Types' ); ?>
     183            <span class="dashicons dashicons-arrow-down" aria-hidden="true"></span>
     184        </button>
    181185        <div class="media-frame-menu"></div>
    182         <div class="media-frame-router"></div>
    183         <div class="media-frame-content"></div>
     186        <div class="media-frame-tab-panel">
     187            <div class="media-frame-router"></div>
     188            <div class="media-frame-content"></div>
     189        </div>
    184190        <div class="media-frame-toolbar"></div>
    185191        <div class="media-frame-uploader"></div>
Note: See TracChangeset for help on using the changeset viewer.