Accessibility: Menus: Make tab panels in Add menu items section more accessible for keyboard users.

Props audrasjb, afercia.
Fixes #49211.

git-svn-id: https://develop.svn.wordpress.org/trunk@47209 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Sergey Biryukov 2020-02-07 21:36:59 +00:00
parent 6c7f322c71
commit 23c2257935
2 changed files with 13 additions and 8 deletions

View File

@ -997,6 +997,11 @@ div.tabs-panel-inactive {
display: none;
}
div.tabs-panel-active:focus {
box-shadow: inset 0 0 0 1px #5b9dd9, inset 0 0 2px 1px rgba(30, 140, 190, 0.8);
outline: 0 none;
}
#front-page-warning,
#front-static-pages ul,
ul.export-filters,

View File

@ -335,6 +335,7 @@ function wp_nav_menu_item_post_type_meta_box( $object, $box ) {
global $_nav_menu_placeholder, $nav_menu_selected_id;
$post_type_name = $box['args']->name;
$post_type = get_post_type_object( $post_type_name );
// Paginate browsing for large numbers of post objects.
$per_page = 50;
@ -517,7 +518,7 @@ function wp_nav_menu_item_post_type_meta_box( $object, $box ) {
</li>
</ul><!-- .posttype-tabs -->
<div id="tabs-panel-posttype-<?php echo $post_type_name; ?>-most-recent" class="tabs-panel <?php echo ( 'most-recent' == $current_tab ? 'tabs-panel-active' : 'tabs-panel-inactive' ); ?>">
<div id="tabs-panel-posttype-<?php echo $post_type_name; ?>-most-recent" class="tabs-panel <?php echo ( 'most-recent' == $current_tab ? 'tabs-panel-active' : 'tabs-panel-inactive' ); ?>" role="region" aria-label="<?php _e( 'Most Recent' ); ?>" tabindex="0">
<ul id="<?php echo $post_type_name; ?>checklist-most-recent" class="categorychecklist form-no-clear">
<?php
$recent_args = array_merge(
@ -552,7 +553,7 @@ function wp_nav_menu_item_post_type_meta_box( $object, $box ) {
</ul>
</div><!-- /.tabs-panel -->
<div class="tabs-panel <?php echo ( 'search' == $current_tab ? 'tabs-panel-active' : 'tabs-panel-inactive' ); ?>" id="tabs-panel-posttype-<?php echo $post_type_name; ?>-search">
<div class="tabs-panel <?php echo ( 'search' == $current_tab ? 'tabs-panel-active' : 'tabs-panel-inactive' ); ?>" id="tabs-panel-posttype-<?php echo $post_type_name; ?>-search" role="region" aria-label="<?php echo $post_type->labels->search_items; ?>" tabindex="0">
<?php
if ( isset( $_REQUEST[ 'quick-search-posttype-' . $post_type_name ] ) ) {
$searched = esc_attr( $_REQUEST[ 'quick-search-posttype-' . $post_type_name ] );
@ -590,7 +591,7 @@ function wp_nav_menu_item_post_type_meta_box( $object, $box ) {
</ul>
</div><!-- /.tabs-panel -->
<div id="<?php echo $post_type_name; ?>-all" class="tabs-panel tabs-panel-view-all <?php echo ( 'all' == $current_tab ? 'tabs-panel-active' : 'tabs-panel-inactive' ); ?>">
<div id="<?php echo $post_type_name; ?>-all" class="tabs-panel tabs-panel-view-all <?php echo ( 'all' == $current_tab ? 'tabs-panel-active' : 'tabs-panel-inactive' ); ?>" role="region" aria-label="<?php echo $post_type->labels->all_items; ?>" tabindex="0">
<?php if ( ! empty( $page_links ) ) : ?>
<div class="add-menu-item-pagelinks">
<?php echo $page_links; ?>
@ -600,8 +601,6 @@ function wp_nav_menu_item_post_type_meta_box( $object, $box ) {
<?php
$args['walker'] = $walker;
$post_type = get_post_type_object( $post_type_name );
if ( $post_type->has_archive ) {
$_nav_menu_placeholder = ( 0 > $_nav_menu_placeholder ) ? intval( $_nav_menu_placeholder ) - 1 : -1;
array_unshift(
@ -686,6 +685,7 @@ function wp_nav_menu_item_post_type_meta_box( $object, $box ) {
*/
function wp_nav_menu_item_taxonomy_meta_box( $object, $box ) {
global $nav_menu_selected_id;
$taxonomy_name = $box['args']->name;
$taxonomy = get_taxonomy( $taxonomy_name );
@ -803,7 +803,7 @@ function wp_nav_menu_item_taxonomy_meta_box( $object, $box ) {
</li>
</ul><!-- .taxonomy-tabs -->
<div id="tabs-panel-<?php echo $taxonomy_name; ?>-pop" class="tabs-panel <?php echo ( 'most-used' == $current_tab ? 'tabs-panel-active' : 'tabs-panel-inactive' ); ?> ">
<div id="tabs-panel-<?php echo $taxonomy_name; ?>-pop" class="tabs-panel <?php echo ( 'most-used' == $current_tab ? 'tabs-panel-active' : 'tabs-panel-inactive' ); ?>" role="region" aria-label="<?php echo $taxonomy->labels->most_used; ?>" tabindex="0">
<ul id="<?php echo $taxonomy_name; ?>checklist-pop" class="categorychecklist form-no-clear" >
<?php
$popular_terms = get_terms(
@ -821,7 +821,7 @@ function wp_nav_menu_item_taxonomy_meta_box( $object, $box ) {
</ul>
</div><!-- /.tabs-panel -->
<div id="tabs-panel-<?php echo $taxonomy_name; ?>-all" class="tabs-panel tabs-panel-view-all <?php echo ( 'all' == $current_tab ? 'tabs-panel-active' : 'tabs-panel-inactive' ); ?> ">
<div id="tabs-panel-<?php echo $taxonomy_name; ?>-all" class="tabs-panel tabs-panel-view-all <?php echo ( 'all' == $current_tab ? 'tabs-panel-active' : 'tabs-panel-inactive' ); ?>" role="region" aria-label="<?php echo $taxonomy->labels->all_items; ?>" tabindex="0">
<?php if ( ! empty( $page_links ) ) : ?>
<div class="add-menu-item-pagelinks">
<?php echo $page_links; ?>
@ -840,7 +840,7 @@ function wp_nav_menu_item_taxonomy_meta_box( $object, $box ) {
<?php endif; ?>
</div><!-- /.tabs-panel -->
<div class="tabs-panel <?php echo ( 'search' == $current_tab ? 'tabs-panel-active' : 'tabs-panel-inactive' ); ?>" id="tabs-panel-search-taxonomy-<?php echo $taxonomy_name; ?>">
<div class="tabs-panel <?php echo ( 'search' == $current_tab ? 'tabs-panel-active' : 'tabs-panel-inactive' ); ?>" id="tabs-panel-search-taxonomy-<?php echo $taxonomy_name; ?>" role="region" aria-label="<?php echo $taxonomy->labels->search_items; ?>" tabindex="0">
<?php
if ( isset( $_REQUEST[ 'quick-search-taxonomy-' . $taxonomy_name ] ) ) {
$searched = esc_attr( $_REQUEST[ 'quick-search-taxonomy-' . $taxonomy_name ] );