Accessibility: Improve and modernize user interface controls for better contrast: Further improvements to input heights and alignments.

- improves input fields height in the customizer
- improves input fields height for Internet Explorer 11
- improves input fields height in the Image Editor
- improves alignment of selects and buttons in the privacy policy pages
- makes the search themes fields font-size consistent

Props garrett-eclipse, afercia.
See #47477.

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


git-svn-id: http://core.svn.wordpress.org/trunk@46217 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Andrea Fercia 2019-10-07 13:20:03 +00:00
parent 1f3d583825
commit e9065659f4
21 changed files with 35 additions and 25 deletions

View File

@ -94,6 +94,7 @@
margin: 0;
padding: 5px;
vertical-align: top;
min-height: 28px;
}
.wp-color-picker::-webkit-input-placeholder {

View File

@ -1,2 +1,2 @@
/*! This file is auto-generated */
.wp-color-picker{width:80px;direction:ltr}.wp-picker-container .hidden{display:none}.wp-picker-container .wp-color-result.button{min-height:28px;margin:0 0 6px 6px;padding:0 30px 0 0;font-size:11px}.wp-color-result-text{background:#f7f7f7;border-radius:2px 0 0 2px;border-right:1px solid #ccc;color:#555;display:block;line-height:2.36363636;padding:0 6px;text-align:center}.wp-color-result:focus,.wp-color-result:hover{background:#fafafa;border-color:#999;color:#23282d}.wp-color-result:focus:after,.wp-color-result:hover:after{color:#23282d;border-color:#a0a5aa;border-right:1px solid #999}.wp-picker-container{display:inline-block}.wp-color-result:focus{border-color:#5b9dd9;box-shadow:0 0 3px rgba(0,115,170,.8)}.wp-color-result:active{transform:none!important}.wp-picker-open+.wp-picker-input-wrap{display:inline-block;vertical-align:top}.wp-picker-input-wrap label{display:inline-block;vertical-align:top}.form-table .wp-picker-input-wrap label{margin:0!important}.wp-customizer .wp-picker-input-wrap .button.wp-picker-default,.wp-picker-input-wrap .button.wp-picker-default{margin-right:6px;padding:2px 8px}.wp-picker-container .iris-square-slider .ui-slider-handle:focus{background-color:#555}.wp-picker-container .iris-picker{border-radius:0;border-color:#ddd;margin-top:6px}.wp-picker-container input[type=text].wp-color-picker{width:65px;font-size:12px;font-family:monospace;line-height:1.33333333;margin:0;padding:5px;vertical-align:top}.wp-color-picker::-webkit-input-placeholder{color:#72777c}.wp-color-picker::-moz-placeholder{color:#72777c;opacity:1}.wp-color-picker:-ms-input-placeholder{color:#72777c}.wp-picker-container input[type=text].iris-error{background-color:#ffebe8;border-color:#c00;color:#000}.iris-picker .iris-strip .ui-slider-handle:focus,.iris-picker .ui-square-handle:focus{box-shadow:0 0 0 1px #5b9dd9,0 0 2px 1px rgba(30,140,190,.8)}.iris-picker .iris-palette:focus{box-shadow:inset 0 0 5px rgba(0,0,0,.4),0 0 0 1px #5b9dd9,0 0 2px 1px rgba(30,140,190,.8)}@media screen and (max-width:782px){.wp-picker-container input[type=text].wp-color-picker{width:80px;padding:6px 5px 5px;font-size:16px;line-height:1.15}.wp-customizer .wp-picker-container input[type=text].wp-color-picker{padding:5px 5px 4px}.wp-picker-container .wp-color-result.button{height:auto;padding:0 40px 0 0;font-size:14px;line-height:2.1}.wp-customizer .wp-picker-container .wp-color-result.button{font-size:13px;line-height:2}.wp-picker-container .wp-color-result-text{padding:0 14px;font-size:inherit;line-height:inherit}.wp-customizer .wp-picker-container .wp-color-result-text{padding:0 10px}}@media screen and (max-width:640px){.wp-customizer .wp-picker-container .wp-color-result.button{font-size:14px;line-height:2.1}.wp-customizer .wp-picker-container input[type=text].wp-color-picker{padding:6px 5px}}
.wp-color-picker{width:80px;direction:ltr}.wp-picker-container .hidden{display:none}.wp-picker-container .wp-color-result.button{min-height:28px;margin:0 0 6px 6px;padding:0 30px 0 0;font-size:11px}.wp-color-result-text{background:#f7f7f7;border-radius:2px 0 0 2px;border-right:1px solid #ccc;color:#555;display:block;line-height:2.36363636;padding:0 6px;text-align:center}.wp-color-result:focus,.wp-color-result:hover{background:#fafafa;border-color:#999;color:#23282d}.wp-color-result:focus:after,.wp-color-result:hover:after{color:#23282d;border-color:#a0a5aa;border-right:1px solid #999}.wp-picker-container{display:inline-block}.wp-color-result:focus{border-color:#5b9dd9;box-shadow:0 0 3px rgba(0,115,170,.8)}.wp-color-result:active{transform:none!important}.wp-picker-open+.wp-picker-input-wrap{display:inline-block;vertical-align:top}.wp-picker-input-wrap label{display:inline-block;vertical-align:top}.form-table .wp-picker-input-wrap label{margin:0!important}.wp-customizer .wp-picker-input-wrap .button.wp-picker-default,.wp-picker-input-wrap .button.wp-picker-default{margin-right:6px;padding:2px 8px}.wp-picker-container .iris-square-slider .ui-slider-handle:focus{background-color:#555}.wp-picker-container .iris-picker{border-radius:0;border-color:#ddd;margin-top:6px}.wp-picker-container input[type=text].wp-color-picker{width:65px;font-size:12px;font-family:monospace;line-height:1.33333333;margin:0;padding:5px;vertical-align:top;min-height:28px}.wp-color-picker::-webkit-input-placeholder{color:#72777c}.wp-color-picker::-moz-placeholder{color:#72777c;opacity:1}.wp-color-picker:-ms-input-placeholder{color:#72777c}.wp-picker-container input[type=text].iris-error{background-color:#ffebe8;border-color:#c00;color:#000}.iris-picker .iris-strip .ui-slider-handle:focus,.iris-picker .ui-square-handle:focus{box-shadow:0 0 0 1px #5b9dd9,0 0 2px 1px rgba(30,140,190,.8)}.iris-picker .iris-palette:focus{box-shadow:inset 0 0 5px rgba(0,0,0,.4),0 0 0 1px #5b9dd9,0 0 2px 1px rgba(30,140,190,.8)}@media screen and (max-width:782px){.wp-picker-container input[type=text].wp-color-picker{width:80px;padding:6px 5px 5px;font-size:16px;line-height:1.15}.wp-customizer .wp-picker-container input[type=text].wp-color-picker{padding:5px 5px 4px}.wp-picker-container .wp-color-result.button{height:auto;padding:0 40px 0 0;font-size:14px;line-height:2.1}.wp-customizer .wp-picker-container .wp-color-result.button{font-size:13px;line-height:2}.wp-picker-container .wp-color-result-text{padding:0 14px;font-size:inherit;line-height:inherit}.wp-customizer .wp-picker-container .wp-color-result-text{padding:0 10px}}@media screen and (max-width:640px){.wp-customizer .wp-picker-container .wp-color-result.button{font-size:14px;line-height:2.1}.wp-customizer .wp-picker-container input[type=text].wp-color-picker{padding:6px 5px}}

View File

@ -94,6 +94,7 @@
margin: 0;
padding: 5px;
vertical-align: top;
min-height: 28px;
}
.wp-color-picker::-webkit-input-placeholder {

View File

@ -1,2 +1,2 @@
/*! This file is auto-generated */
.wp-color-picker{width:80px;direction:ltr}.wp-picker-container .hidden{display:none}.wp-picker-container .wp-color-result.button{min-height:28px;margin:0 6px 6px 0;padding:0 0 0 30px;font-size:11px}.wp-color-result-text{background:#f7f7f7;border-radius:0 2px 2px 0;border-left:1px solid #ccc;color:#555;display:block;line-height:2.36363636;padding:0 6px;text-align:center}.wp-color-result:focus,.wp-color-result:hover{background:#fafafa;border-color:#999;color:#23282d}.wp-color-result:focus:after,.wp-color-result:hover:after{color:#23282d;border-color:#a0a5aa;border-left:1px solid #999}.wp-picker-container{display:inline-block}.wp-color-result:focus{border-color:#5b9dd9;box-shadow:0 0 3px rgba(0,115,170,.8)}.wp-color-result:active{transform:none!important}.wp-picker-open+.wp-picker-input-wrap{display:inline-block;vertical-align:top}.wp-picker-input-wrap label{display:inline-block;vertical-align:top}.form-table .wp-picker-input-wrap label{margin:0!important}.wp-customizer .wp-picker-input-wrap .button.wp-picker-default,.wp-picker-input-wrap .button.wp-picker-default{margin-left:6px;padding:2px 8px}.wp-picker-container .iris-square-slider .ui-slider-handle:focus{background-color:#555}.wp-picker-container .iris-picker{border-radius:0;border-color:#ddd;margin-top:6px}.wp-picker-container input[type=text].wp-color-picker{width:65px;font-size:12px;font-family:monospace;line-height:1.33333333;margin:0;padding:5px;vertical-align:top}.wp-color-picker::-webkit-input-placeholder{color:#72777c}.wp-color-picker::-moz-placeholder{color:#72777c;opacity:1}.wp-color-picker:-ms-input-placeholder{color:#72777c}.wp-picker-container input[type=text].iris-error{background-color:#ffebe8;border-color:#c00;color:#000}.iris-picker .iris-strip .ui-slider-handle:focus,.iris-picker .ui-square-handle:focus{box-shadow:0 0 0 1px #5b9dd9,0 0 2px 1px rgba(30,140,190,.8)}.iris-picker .iris-palette:focus{box-shadow:inset 0 0 5px rgba(0,0,0,.4),0 0 0 1px #5b9dd9,0 0 2px 1px rgba(30,140,190,.8)}@media screen and (max-width:782px){.wp-picker-container input[type=text].wp-color-picker{width:80px;padding:6px 5px 5px;font-size:16px;line-height:1.15}.wp-customizer .wp-picker-container input[type=text].wp-color-picker{padding:5px 5px 4px}.wp-picker-container .wp-color-result.button{height:auto;padding:0 0 0 40px;font-size:14px;line-height:2.1}.wp-customizer .wp-picker-container .wp-color-result.button{font-size:13px;line-height:2}.wp-picker-container .wp-color-result-text{padding:0 14px;font-size:inherit;line-height:inherit}.wp-customizer .wp-picker-container .wp-color-result-text{padding:0 10px}}@media screen and (max-width:640px){.wp-customizer .wp-picker-container .wp-color-result.button{font-size:14px;line-height:2.1}.wp-customizer .wp-picker-container input[type=text].wp-color-picker{padding:6px 5px}}
.wp-color-picker{width:80px;direction:ltr}.wp-picker-container .hidden{display:none}.wp-picker-container .wp-color-result.button{min-height:28px;margin:0 6px 6px 0;padding:0 0 0 30px;font-size:11px}.wp-color-result-text{background:#f7f7f7;border-radius:0 2px 2px 0;border-left:1px solid #ccc;color:#555;display:block;line-height:2.36363636;padding:0 6px;text-align:center}.wp-color-result:focus,.wp-color-result:hover{background:#fafafa;border-color:#999;color:#23282d}.wp-color-result:focus:after,.wp-color-result:hover:after{color:#23282d;border-color:#a0a5aa;border-left:1px solid #999}.wp-picker-container{display:inline-block}.wp-color-result:focus{border-color:#5b9dd9;box-shadow:0 0 3px rgba(0,115,170,.8)}.wp-color-result:active{transform:none!important}.wp-picker-open+.wp-picker-input-wrap{display:inline-block;vertical-align:top}.wp-picker-input-wrap label{display:inline-block;vertical-align:top}.form-table .wp-picker-input-wrap label{margin:0!important}.wp-customizer .wp-picker-input-wrap .button.wp-picker-default,.wp-picker-input-wrap .button.wp-picker-default{margin-left:6px;padding:2px 8px}.wp-picker-container .iris-square-slider .ui-slider-handle:focus{background-color:#555}.wp-picker-container .iris-picker{border-radius:0;border-color:#ddd;margin-top:6px}.wp-picker-container input[type=text].wp-color-picker{width:65px;font-size:12px;font-family:monospace;line-height:1.33333333;margin:0;padding:5px;vertical-align:top;min-height:28px}.wp-color-picker::-webkit-input-placeholder{color:#72777c}.wp-color-picker::-moz-placeholder{color:#72777c;opacity:1}.wp-color-picker:-ms-input-placeholder{color:#72777c}.wp-picker-container input[type=text].iris-error{background-color:#ffebe8;border-color:#c00;color:#000}.iris-picker .iris-strip .ui-slider-handle:focus,.iris-picker .ui-square-handle:focus{box-shadow:0 0 0 1px #5b9dd9,0 0 2px 1px rgba(30,140,190,.8)}.iris-picker .iris-palette:focus{box-shadow:inset 0 0 5px rgba(0,0,0,.4),0 0 0 1px #5b9dd9,0 0 2px 1px rgba(30,140,190,.8)}@media screen and (max-width:782px){.wp-picker-container input[type=text].wp-color-picker{width:80px;padding:6px 5px 5px;font-size:16px;line-height:1.15}.wp-customizer .wp-picker-container input[type=text].wp-color-picker{padding:5px 5px 4px}.wp-picker-container .wp-color-result.button{height:auto;padding:0 0 0 40px;font-size:14px;line-height:2.1}.wp-customizer .wp-picker-container .wp-color-result.button{font-size:13px;line-height:2}.wp-picker-container .wp-color-result-text{padding:0 14px;font-size:inherit;line-height:inherit}.wp-customizer .wp-picker-container .wp-color-result-text{padding:0 10px}}@media screen and (max-width:640px){.wp-customizer .wp-picker-container .wp-color-result.button{font-size:14px;line-height:2.1}.wp-customizer .wp-picker-container input[type=text].wp-color-picker{padding:6px 5px}}

View File

@ -284,12 +284,14 @@ body.trashing #publish-settings {
}
#customize-control-changeset_preview_link input {
line-height: 2.5;
line-height: 2.85714286; /* 40px */
border-top: 1px solid #ddd;
border-right: none;
border-left: none;
text-indent: -999px;
color: #fff;
/* Only necessary for IE11 */
min-height: 40px;
}
#customize-control-changeset_preview_link label {
@ -347,7 +349,7 @@ body.trashing #publish-settings {
}
.date-time-fields .date-input.year {
width: 60px;
width: 65px;
}
.date-time-fields .date-input.meridian {
@ -924,7 +926,6 @@ p.customize-section-description {
.customize-control input[type="tel"],
.customize-control input[type="url"] {
width: 100%;
line-height: 1.3;
margin: 0;
}
@ -2588,9 +2589,9 @@ body.adding-widget .add-new-widget:before,
#available-widgets-filter input,
#available-menu-items-search input {
width: 100%;
height: 32px;
min-height: 32px;
margin: 1px 0;
padding: 6px 30px;
padding: 0 30px;
}
#available-widgets-filter input::-ms-clear,

File diff suppressed because one or more lines are too long

View File

@ -284,12 +284,14 @@ body.trashing #publish-settings {
}
#customize-control-changeset_preview_link input {
line-height: 2.5;
line-height: 2.85714286; /* 40px */
border-top: 1px solid #ddd;
border-left: none;
border-right: none;
text-indent: -999px;
color: #fff;
/* Only necessary for IE11 */
min-height: 40px;
}
#customize-control-changeset_preview_link label {
@ -347,7 +349,7 @@ body.trashing #publish-settings {
}
.date-time-fields .date-input.year {
width: 60px;
width: 65px;
}
.date-time-fields .date-input.meridian {
@ -924,7 +926,6 @@ p.customize-section-description {
.customize-control input[type="tel"],
.customize-control input[type="url"] {
width: 100%;
line-height: 1.3;
margin: 0;
}
@ -2588,9 +2589,9 @@ body.adding-widget .add-new-widget:before,
#available-widgets-filter input,
#available-menu-items-search input {
width: 100%;
height: 32px;
min-height: 32px;
margin: 1px 0;
padding: 6px 30px;
padding: 0 30px;
}
#available-widgets-filter input::-ms-clear,

File diff suppressed because one or more lines are too long

View File

@ -74,6 +74,8 @@ input[type="week"] {
padding: 0 8px;
/* inherits font size 14px */
line-height: 2; /* 28px */
/* Only necessary for IE11 */
min-height: 30px;
}
::-webkit-datetime-edit {
@ -1171,7 +1173,7 @@ table.form-table td .updated p {
.tools-privacy-policy-page input.button,
.tools-privacy-policy-page select {
margin-right: 6px;
margin: 0 6px 0 1px;
}
.tools-privacy-edit {

File diff suppressed because one or more lines are too long

View File

@ -74,6 +74,8 @@ input[type="week"] {
padding: 0 8px;
/* inherits font size 14px */
line-height: 2; /* 28px */
/* Only necessary for IE11 */
min-height: 30px;
}
::-webkit-datetime-edit {
@ -1171,7 +1173,7 @@ table.form-table td .updated p {
.tools-privacy-policy-page input.button,
.tools-privacy-policy-page select {
margin-left: 6px;
margin: 0 1px 0 6px;
}
.tools-privacy-edit {

File diff suppressed because one or more lines are too long

View File

@ -1128,7 +1128,7 @@ span.imgedit-scale-warn {
.imgedit-settings .imgedit-crop-sel input[type="text"] {
width: 80px;
font-size: 14px;
padding: 5px 8px;
padding: 0 8px;
}
.imgedit-separator {

File diff suppressed because one or more lines are too long

View File

@ -1128,7 +1128,7 @@ span.imgedit-scale-warn {
.imgedit-settings .imgedit-crop-sel input[type="text"] {
width: 80px;
font-size: 14px;
padding: 5px 8px;
padding: 0 8px;
}
.imgedit-separator {

File diff suppressed because one or more lines are too long

View File

@ -34,6 +34,7 @@ body.js .theme-browser.search-loading {
right: 20px;
margin: 0;
width: 280px;
font-size: inherit;
}
/* Position admin messages */

File diff suppressed because one or more lines are too long

View File

@ -34,6 +34,7 @@ body.js .theme-browser.search-loading {
left: 20px;
margin: 0;
width: 280px;
font-size: inherit;
}
/* Position admin messages */

File diff suppressed because one or more lines are too long

View File

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