Customize: Improve keyboard accessibility for publish settings section.

Props sayedwp.
See #39896.
Fixes #42027.


git-svn-id: https://develop.svn.wordpress.org/trunk@41802 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Weston Ruter
2017-10-09 23:00:39 +00:00
parent 2ab27649f6
commit a4dab604fb
3 changed files with 30 additions and 11 deletions

View File

@@ -38,6 +38,11 @@ body:not(.ready) #customize-save-button-wrapper .save {
box-shadow: none; /* @todo Adjust box shadow based on the disable states of paired button. */
margin-top: 0;
}
#customize-save-button-wrapper .save:focus, #publish-settings:focus {
box-shadow: 0 1px 0 #0073aa, 0 0 2px 1px #33b3db; /* This is default box shadow for focus */
}
#customize-save-button-wrapper .save.has-next-sibling {
border-radius: 3px 0 0 3px;
}
@@ -46,16 +51,17 @@ body:not(.ready) #customize-save-button-wrapper .save {
position: absolute;
top: 0;
bottom: 0;
left: -301px;
left: 0;
visibility: hidden;
overflow-x: hidden;
overflow-y: auto;
width: 300px;
width: 100%;
margin: 0;
z-index: 4;
z-index: -1;
background: #eee;
transition: left .18s;
border-right: 1px solid #ddd;
border-left: 1px solid #ddd;
height: 100%;
}
@@ -73,7 +79,7 @@ body:not(.ready) #customize-save-button-wrapper .save {
.outer-section-open .wp-full-overlay.expanded #customize-sidebar-outer-content {
visibility: visible;
left: 0;
left: 100%;
transition: left .18s;
}
@@ -132,6 +138,10 @@ body.trashing #publish-settings {
overflow-x: hidden;
}
.outer-section-open #customize-controls .wp-full-overlay-sidebar-content {
background: #eee;
}
#customize-controls .customize-info {
border: none;
border-bottom: 1px solid #ddd;
@@ -2828,6 +2838,14 @@ body.adding-widget .add-new-widget:before,
width: 100%;
}
body.wp-customizer .wp-full-overlay.expanded #customize-sidebar-outer-content {
left: -100%;
}
body.wp-customizer.outer-section-open .wp-full-overlay.expanded #customize-sidebar-outer-content {
left: 0;
}
#available-widgets .customize-section-title,
#available-menu-items .customize-section-title {
display: block;
@@ -2882,4 +2900,4 @@ body.adding-widget .add-new-widget:before,
.reordering .reorder-done {
padding: 8px;
}
}
}