Accessibility: Change the "Show / Hide dismissed updates" link to a button.
For better accessibility and semantics, user interface controls that perform an action should be buttons. Links should exclusively be used for navigation. Also, adds an `aria-expanded` attribute to communicate the expandable panel state and improves the buttons spacing. Props Cheffheid, audrasjb, afercia. Fixes #38674. git-svn-id: https://develop.svn.wordpress.org/trunk@42785 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
parent
ef84e589d2
commit
0a63e2ed96
@ -1548,6 +1548,15 @@ ul#dismissed-updates {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#dismissed-updates li > p {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
#dismiss,
|
||||
#undismiss {
|
||||
margin-left: 0.5em;
|
||||
}
|
||||
|
||||
form.upgrade {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
@ -138,15 +138,14 @@ function dismissed_updates() {
|
||||
$hide_text = esc_js( __( 'Hide hidden updates' ) );
|
||||
?>
|
||||
<script type="text/javascript">
|
||||
|
||||
jQuery(function($) {
|
||||
$('dismissed-updates').show();
|
||||
$('#show-dismissed').toggle(function(){$(this).text('<?php echo $hide_text; ?>');}, function() {$(this).text('<?php echo $show_text; ?>')});
|
||||
$('#show-dismissed').click(function() { $('#dismissed-updates').toggle('slow');});
|
||||
jQuery(function( $ ) {
|
||||
$( 'dismissed-updates' ).show();
|
||||
$( '#show-dismissed' ).toggle( function() { $( this ).text( '<?php echo $hide_text; ?>' ).attr( 'aria-expanded', 'true' ); }, function() { $( this ).text( '<?php echo $show_text; ?>' ).attr( 'aria-expanded', 'false' ); } );
|
||||
$( '#show-dismissed' ).click( function() { $( '#dismissed-updates' ).toggle( 'fast' ); } );
|
||||
});
|
||||
</script>
|
||||
<?php
|
||||
echo '<p class="hide-if-no-js"><a id="show-dismissed" href="#">' . __( 'Show hidden updates' ) . '</a></p>';
|
||||
echo '<p class="hide-if-no-js"><button type="button" class="button" id="show-dismissed" aria-expanded="false">' . __( 'Show hidden updates' ) . '</button></p>';
|
||||
echo '<ul id="dismissed-updates" class="core-updates dismissed">';
|
||||
foreach ( (array) $dismissed as $update ) {
|
||||
echo '<li>';
|
||||
|
Loading…
Reference in New Issue
Block a user