Accessibility: Customize: Improve focus styles for color picker and media upload button in Customizer.

Props audrasjb, timhavinga, afercia, karmatosed.
Fixes #48694.

git-svn-id: https://develop.svn.wordpress.org/trunk@47208 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Sergey Biryukov 2020-02-07 21:09:39 +00:00
parent f8b2ff1b53
commit 6c7f322c71
2 changed files with 7 additions and 11 deletions

View File

@ -120,16 +120,14 @@
.iris-picker .ui-square-handle:focus, .iris-picker .ui-square-handle:focus,
.iris-picker .iris-strip .ui-slider-handle:focus { .iris-picker .iris-strip .ui-slider-handle:focus {
box-shadow: border-color: #007cba;
0 0 0 1px #5b9dd9, border-style: solid;
0 0 2px 1px rgba(30, 140, 190, 0.8); box-shadow: 0 0 0 1px #007cba;
outline: 2px solid transparent;
} }
.iris-picker .iris-palette:focus { .iris-picker .iris-palette:focus {
box-shadow: box-shadow: 0 0 0 2px #007cba;
inset 0 0 5px rgba(0, 0, 0, 0.4),
0 0 0 1px #5b9dd9,
0 0 2px 1px rgba(30, 140, 190, 0.8);
} }
@media screen and (max-width: 782px) { @media screen and (max-width: 782px) {

View File

@ -1392,12 +1392,10 @@ p.customize-section-description {
.customize-control .attachment-media-view .button-add-media:focus { .customize-control .attachment-media-view .button-add-media:focus {
background-color: #fbfbfc; background-color: #fbfbfc;
border-color: #007cba;
border-style: solid; border-style: solid;
border-color: #5b9dd9; box-shadow: 0 0 0 1px #007cba;
box-shadow: 0 0 3px rgba( 0, 115, 170, .8 );
/* Only visible in Windows High Contrast mode */
outline: 2px solid transparent; outline: 2px solid transparent;
outline-offset: -2px;
} }
.customize-control-header .inner { .customize-control-header .inner {