vhad/wordpress-develop
1
0
Fork 0
mirror of https://github.com/gosticks/wordpress-develop.git synced 2026-07-05 17:50:03 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Accessibility: Improve accessibility of all the media views form controls.

Browse Source 
- changes the media views form controls to have explicitly associated labels with for/id attributes
- adds a few missing labels / aria-labels
- improves a few existing labels / aria-labels
- improves semantics in a few places, by adding visually hidden headings, fieldset + legend elements, aria-describedby attributes
- improves the image custom size input fields and their labelling
- adds `role="status"` to the "saved" indicator so that status messages are announced to assistive technologies
- swaps the columns source order in the image details template, to make visual and DOM order match
- swaps the "Replace" and "Back" buttons source order in the Replace Image view, to make visual and DOM order match
- gallery settings: move checkbox label to the right: checkboxes are supposed to have labels on the right
- merge similar strings, unified to "Drop files to upload" (removed "Drop files here", and "Drop files anywhere to upload")
- makes the "upload-ui" consistent across the media views
- hides the IE 11 "X" `::-ms-clear` button in the Insert from URL field, as it conflicts with the uploading spinner
- adds comments to all the media templates to clarify their usage
- slightly increases vertical spacing between form fields in the media sidebar
- removes some CSS selectors introduced as backwards compatibility for WordPress pre-4.4
- removes some CSS still targeting Internet Explorer 7 and 8

Fixes #47141.
Fixes #47122.


git-svn-id: https://develop.svn.wordpress.org/trunk@45499 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Andrea Fercia
2019-06-07 20:43:26 +00:00
parent ffe40885a1
commit 226dc75154
10 changed files with 644 additions and 617 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/wp-admin/css/media.css
View File

@@ -374,12 +374,11 @@
}
.drag-drop .drag-drop-inside {
margin: 70px auto 0;
margin: 60px auto 0;
width: 250px;
}
.drag-drop-inside p {
color: #a0a5aa;
font-size: 14px;
margin: 5px 0;
display: none;
@@ -480,7 +479,6 @@ border color while dragging a file over the uploader drop area */
color: #c00;
}
.upload-php .mode-grid .media-sidebar .media-uploader-status.errors h3, /* Back-compat for pre-4.4 */
.upload-php .mode-grid .media-sidebar .media-uploader-status.errors h2 {
display: none;
}
@@ -1031,7 +1029,6 @@ border color while dragging a file over the uploader drop area */
display: block;
}
#poststuff .imgedit-group-top h3, /* Back-compat for pre-4.4 */
#poststuff .imgedit-group-top h2 {
display: inline-block;
margin: 0;
@@ -1109,6 +1106,10 @@ span.imgedit-scale-warn {
margin: 8px 0;
}
.imgedit-save-target legend {
font-weight: 600;
}
.imgedit-group {
margin-bottom: 8px;
padding: 10px;
@@ -1126,7 +1127,6 @@ span.imgedit-scale-warn {
display: inline-block;
width: 7px;
text-align: center;
vertical-align: middle;
font-size: 13px;
color: #444;
}
@@ -1190,10 +1190,6 @@ audio, video {
font-size: 16px;
padding: 6px 10px;
}
.imgedit-applyto .imgedit-label {
vertical-align: middle;
}
}
/**
@@ -1232,10 +1228,6 @@ audio, video {
height: 40px;
}
.upload-php .media-modal-close .media-modal-icon {
margin: 9px 10px;
}
.edit-attachment-frame .edit-media-header .right:before,
.edit-attachment-frame .edit-media-header .left:before {
line-height: 40px !important;