IntenseWebs/WordPress
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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

Browse Source 
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.

Built from https://develop.svn.wordpress.org/trunk@46363


git-svn-id: http://core.svn.wordpress.org/trunk@46162 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Andrea Fercia
2019-09-30 19:37:58 +00:00
parent e534fdf5aa
commit 63e199abc7
8 changed files with 558 additions and 246 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
wp-includes/media-template.php
View File

@@ -178,9 +178,15 @@ function wp_print_media_templates() {
<?php // Template for the media frame: used both in the media grid and in the media modal. ?>
<script type="text/html" id="tmpl-media-frame">
<div class="media-frame-title" id="media-frame-title"></div>
<button type="button" class="button button-link media-frame-menu-toggle" aria-expanded="false">
<?php _e( 'Media Types' ); ?>
<span class="dashicons dashicons-arrow-down" aria-hidden="true"></span>
</button>
<div class="media-frame-menu"></div>
<div class="media-frame-router"></div>
<div class="media-frame-content"></div>
<div class="media-frame-tab-panel">
<div class="media-frame-router"></div>
<div class="media-frame-content"></div>
</div>
<div class="media-frame-toolbar"></div>
<div class="media-frame-uploader"></div>
</script>