Accessibility: fix the Skip to content link, show it on :focus, improve the styling of the skip links when shown, see #21310, see #21471
git-svn-id: https://develop.svn.wordpress.org/trunk@21435 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
parent
496e7275b1
commit
d3a4604335
|
@ -107,7 +107,7 @@ if ( wp_script_is( 'customize-loader', 'queue' ) && current_user_can( 'edit_them
|
||||||
?>
|
?>
|
||||||
|
|
||||||
<div id="wpwrap">
|
<div id="wpwrap">
|
||||||
<a id="wpbody-content-shortcut" tabindex="5" href="#wpbody-content" class="hide-if-no-js screen-reader-text"><?php _e('Skip to main content'); ?></a>
|
<a tabindex="1" href="#wpbody-content" class="screen-reader-text screen-reader-shortcut"><?php _e('Skip to main content'); ?></a>
|
||||||
<?php require(ABSPATH . 'wp-admin/menu-header.php'); ?>
|
<?php require(ABSPATH . 'wp-admin/menu-header.php'); ?>
|
||||||
<div id="wpcontent">
|
<div id="wpcontent">
|
||||||
|
|
||||||
|
@ -123,7 +123,7 @@ $current_screen->set_parentage( $parent_file );
|
||||||
|
|
||||||
?>
|
?>
|
||||||
|
|
||||||
<div id="wpbody-content" tabindex="-1" aria-label="<?php esc_attr_e('Main content'); ?>">
|
<div id="wpbody-content" aria-label="<?php esc_attr_e('Main content'); ?>">
|
||||||
<?php
|
<?php
|
||||||
|
|
||||||
$current_screen->render_screen_meta();
|
$current_screen->render_screen_meta();
|
||||||
|
|
|
@ -198,6 +198,20 @@ TABLE OF CONTENTS:
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.screen-reader-shortcut:focus {
|
||||||
|
left: 5px;
|
||||||
|
top: 5px;
|
||||||
|
height: auto;
|
||||||
|
width: auto;
|
||||||
|
display: block;
|
||||||
|
padding: 10px 15px;
|
||||||
|
background: #fff;
|
||||||
|
color: #000;
|
||||||
|
border: 2px solid #333;
|
||||||
|
border-radius: 3px;
|
||||||
|
z-index: 100000;
|
||||||
|
}
|
||||||
|
|
||||||
.hidden,
|
.hidden,
|
||||||
.js .closed .inside,
|
.js .closed .inside,
|
||||||
.js .hide-if-js,
|
.js .hide-if-js,
|
||||||
|
|
|
@ -374,11 +374,6 @@ $(document).ready( function() {
|
||||||
pageInput.val('1');
|
pageInput.val('1');
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
$('#wpbody-content-shortcut').bind('click.wp-skip-to-content', function(e){
|
|
||||||
$('#wpbody-content').focus();
|
|
||||||
e.preventDefault();
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
|
|
||||||
// internal use
|
// internal use
|
||||||
|
|
|
@ -619,17 +619,19 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
#wpadminbar #wpadminbar-shortcut:focus {
|
#wpadminbar #wpadminbar-shortcut:focus {
|
||||||
left: 0;
|
left: 5px;
|
||||||
top: 0;
|
top: 5px;
|
||||||
height: auto;
|
height: auto;
|
||||||
width: auto;
|
width: auto;
|
||||||
display: block;
|
display: block;
|
||||||
padding: 10px 15px;
|
padding: 10px 15px;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
color: #000;
|
color: #000;
|
||||||
outline: none;
|
border: 2px solid #333;
|
||||||
|
border-radius: 3px;
|
||||||
z-index: 100000;
|
z-index: 100000;
|
||||||
text-shadow: none;
|
text-shadow: none;
|
||||||
|
line-height: normal;
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
Loading…
Reference in New Issue