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

Administration: Attempt to even-out the new Up/Down arrows in metabox headings and make them look a bit better. Also group them a little closer together in an attempt to reduce confusion of having two down arrows next to one another. Move the focus outline to the button instead of only the icon.

Browse Source 
Fixes #39074.

git-svn-id: https://develop.svn.wordpress.org/trunk@48465 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Andrew Ozz 2020-07-14 01:35:47 +00:00
parent 022ebde54d
commit 719dcd244a
1 changed files with 18 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/wp-admin/css/common.css
View File

@ -2027,6 +2027,7 @@ html.wp-toolbar {
.postbox .handle-order-higher,
.postbox .handle-order-lower {
color: #72777c;
width: 1.62rem;
}
/* Post box order buttons in the block editor meta boxes area. */
@ -2055,6 +2056,10 @@ html.wp-toolbar {
line-height: 1;
}
.postbox.closed {
border-bottom: 0;
}
/* user-select is not a part of the CSS standard - may change behavior in the future */
.postbox .hndle,
.stuffbox .hndle {
@ -3021,13 +3026,21 @@ img {
}
.postbox .handle-order-higher .order-higher-indicator::before,
.postbox .handle-order-lower .order-lower-indicator::before,
.postbox .handle-order-lower .order-lower-indicator::before {
position: relative;
top: 0.11rem;
width: 20px;
height: 20px;
}
.postbox .handlediv .toggle-indicator::before {
width: 20px;
border-radius: 50%;
}
.postbox .handlediv .toggle-indicator::before {
position: relative;
top: 0.05rem;
text-indent: -1px; /* account for the dashicon glyph uneven horizontal alignment */
}
@ -3044,7 +3057,9 @@ img {
.postbox .handle-order-higher:focus,
.postbox .handle-order-lower:focus,
.postbox .handlediv:focus {
box-shadow: none;
box-shadow:
0 0 0 1px #5b9dd9,
0 0 2px 1px rgba(30, 140, 190, 0.8);
/* Only visible in Windows High Contrast mode */
outline: 1px solid transparent;
}
@ -3052,9 +3067,7 @@ img {
.postbox .handle-order-higher:focus .order-higher-indicator::before,
.postbox .handle-order-lower:focus .order-lower-indicator::before,
.postbox .handlediv:focus .toggle-indicator::before {
box-shadow:
0 0 0 1px #5b9dd9,
0 0 2px 1px rgba(30, 140, 190, 0.8);
box-shadow: none;
/* Only visible in Windows High Contrast mode */
outline: 1px solid transparent;
}