sergiotarxz/Wordpress
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Accessibility: Administration: Apply a unified design to all secondary buttons across all color schemes.

Browse Source 
This ensures that secondary buttons have an appropriate color contrast in the alternative color schemes.

Props melchoyce, ryelle, audrasjb, ate-up-with-motor, afercia, sabernhardt.
Merges [46815] to the 5.3 branch.
Fixes #48585.

git-svn-id: https://develop.svn.wordpress.org/branches/5.3@46816 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Sergey Biryukov 2019-12-05 21:32:26 +00:00
parent 861d1d6182
commit cc663e635b
3 changed files with 19 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/wp-admin/css/colors/_admin.scss
View File

@ -75,41 +75,36 @@ textarea:focus {
.wp-core-ui {
.button,
.button-secondary {
color: $button-color;
border-color: $button-color;
.button {
border-color: #7e8993;
color: #32373c;
}
.button.hover,
.button:hover,
.button-secondary:hover,
.button.focus,
.button:focus,
.button-secondary:focus {
border-color: darken( $button-color, 5% );
color: darken( $button-color, 5% );
.button:focus {
border-color: darken( #7e8993, 5% );
color: darken( #32373c, 5% );
}
.button.focus,
.button:focus,
.button-secondary:focus {
border-color: $button-color;
color: darken( $button-color, 5% );
box-shadow: 0 0 0 1px $button-color;
.button:focus {
border-color: $highlight-color;
box-shadow: 0 0 0 1px $highlight-color;
}
.button:active {
background: darken( $button-color, 5% );
border-color: darken( $button-color, 5% );
border-color: #7e8993;
color: darken( #32373c, 5% );
box-shadow: none;
}
.button.active,
.button.active:focus,
.button.active:hover {
border-color: darken( $button-color, 5% );
color: darken( $button-color, 5% );
box-shadow: inset 0 2px 5px -3px darken( $button-color, 5% );
color: darken( $button-text-color, 5% );
}
.button-primary {

8
src/wp-admin/css/colors/_mixins.scss
View File

@ -5,13 +5,13 @@
@mixin button( $button-color, $text-color: #fff ) {
background: $button-color;
border-color: $button-color;
color: $text-color;
color: $button-text-color;
&:hover,
&:focus {
background: lighten( $button-color, 3% );
border-color: darken( $button-color, 3% );
color: $text-color;
color: $button-text-color;
}
&:focus {
@ -23,14 +23,14 @@
&:active {
background: darken( $button-color, 5% );
border-color: darken( $button-color, 5% );
color: $text-color;
color: $button-text-color;
}
&.active,
&.active:focus,
&.active:hover {
background: $button-color;
color: $text-color;
color: $button-text-color;
border-color: darken( $button-color, 15% );
box-shadow: inset 0 2px 5px -3px darken( $button-color, 50% );
}

3
src/wp-admin/css/colors/_variables.scss
View File

@ -18,8 +18,9 @@ $link: #0073aa !default;
$link-focus: lighten( $link, 10% ) !default;
$button-color: $highlight-color !default;
$form-checked: $highlight-color !default;
$button-text-color: $text-color !default;
$form-checked: #7e8993 !default;
// admin menu & admin-bar