Accessibility: Improve the Screen Options and Help buttons order.

- makes the buttons visual order match the DOM order
- also, restores the focus style on the "hero" primary button after [34948]

Props vrimill, mukesh27 for reporting and testing.
Fixes #45094.

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


git-svn-id: http://core.svn.wordpress.org/trunk@45314 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Andrea Fercia 2019-06-08 16:31:53 +00:00
parent be14c6e5c6
commit 935c35fe34
10 changed files with 29 additions and 13 deletions

View File

@ -1665,6 +1665,7 @@ form.upgrade .hint {
} }
#screen-meta-links { #screen-meta-links {
float: left;
margin: 0 0 0 20px; margin: 0 0 0 20px;
} }
@ -1681,7 +1682,7 @@ form.upgrade .hint {
#screen-options-link-wrap, #screen-options-link-wrap,
#contextual-help-link-wrap { #contextual-help-link-wrap {
float: left; float: right;
margin: 0 6px 0 0; margin: 0 6px 0 0;
} }

File diff suppressed because one or more lines are too long

View File

@ -1665,6 +1665,7 @@ form.upgrade .hint {
} }
#screen-meta-links { #screen-meta-links {
float: right;
margin: 0 20px 0 0; margin: 0 20px 0 0;
} }
@ -1681,7 +1682,7 @@ form.upgrade .hint {
#screen-options-link-wrap, #screen-options-link-wrap,
#contextual-help-link-wrap { #contextual-help-link-wrap {
float: right; float: left;
margin: 0 0 0 6px; margin: 0 0 0 6px;
} }

File diff suppressed because one or more lines are too long

View File

@ -927,16 +927,16 @@ final class WP_Screen {
} }
?> ?>
<div id="screen-meta-links"> <div id="screen-meta-links">
<?php if ( $this->get_help_tabs() ) : ?> <?php if ( $this->show_screen_options() ) : ?>
<div id="contextual-help-link-wrap" class="hide-if-no-js screen-meta-toggle"> <div id="screen-options-link-wrap" class="hide-if-no-js screen-meta-toggle">
<button type="button" id="contextual-help-link" class="button show-settings" aria-controls="contextual-help-wrap" aria-expanded="false"><?php _e( 'Help' ); ?></button> <button type="button" id="show-settings-link" class="button show-settings" aria-controls="screen-options-wrap" aria-expanded="false"><?php _e( 'Screen Options' ); ?></button>
</div> </div>
<?php <?php
endif; endif;
if ( $this->show_screen_options() ) : if ( $this->get_help_tabs() ) :
?> ?>
<div id="screen-options-link-wrap" class="hide-if-no-js screen-meta-toggle"> <div id="contextual-help-link-wrap" class="hide-if-no-js screen-meta-toggle">
<button type="button" id="show-settings-link" class="button show-settings" aria-controls="screen-options-wrap" aria-expanded="false"><?php _e( 'Screen Options' ); ?></button> <button type="button" id="contextual-help-link" class="button show-settings" aria-controls="contextual-help-wrap" aria-expanded="false"><?php _e( 'Help' ); ?></button>
</div> </div>
<?php endif; ?> <?php endif; ?>
</div> </div>

View File

@ -286,6 +286,13 @@ TABLE OF CONTENTS:
box-shadow: 0 2px 0 #006799; box-shadow: 0 2px 0 #006799;
} }
.wp-core-ui .button.button-primary.button-hero:focus {
box-shadow:
0 2px 0 #006799,
0 1px 0 #0073aa,
0 0 2px 1px #33b3db;
}
.wp-core-ui .button.button-primary.button-hero.active, .wp-core-ui .button.button-primary.button-hero.active,
.wp-core-ui .button.button-primary.button-hero.active:hover, .wp-core-ui .button.button-primary.button-hero.active:hover,
.wp-core-ui .button.button-primary.button-hero.active:focus, .wp-core-ui .button.button-primary.button-hero.active:focus,

File diff suppressed because one or more lines are too long

View File

@ -286,6 +286,13 @@ TABLE OF CONTENTS:
box-shadow: 0 2px 0 #006799; box-shadow: 0 2px 0 #006799;
} }
.wp-core-ui .button.button-primary.button-hero:focus {
box-shadow:
0 2px 0 #006799,
0 1px 0 #0073aa,
0 0 2px 1px #33b3db;
}
.wp-core-ui .button.button-primary.button-hero.active, .wp-core-ui .button.button-primary.button-hero.active,
.wp-core-ui .button.button-primary.button-hero.active:hover, .wp-core-ui .button.button-primary.button-hero.active:hover,
.wp-core-ui .button.button-primary.button-hero.active:focus, .wp-core-ui .button.button-primary.button-hero.active:focus,

File diff suppressed because one or more lines are too long

View File

@ -13,7 +13,7 @@
* *
* @global string $wp_version * @global string $wp_version
*/ */
$wp_version = '5.3-alpha-45502'; $wp_version = '5.3-alpha-45503';
/** /**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema. * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.