Upstream/WordPress
1
0
Fork 0
mirror of https://github.com/WordPress/WordPress.git synced 2024-06-30 08:45:01 +02:00
Code Issues Projects Releases Wiki Activity

Accessibility: Improve the media views upload Dismiss Errors button.

Browse Source 
- makes the Dismiss Errors button visible in the media views inline uploader
- avoids a focus loss when activating the Dismiss Errors button

See the related GitHub issue from the WPCampus accessibility audit https://github.com/WordPress/gutenberg/issues/15354

Props afercia.
Merges [45376] to the 5.2 branch.
Fixes #47113.
Built from https://develop.svn.wordpress.org/branches/5.2@45840


git-svn-id: http://core.svn.wordpress.org/branches/5.2@45651 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Sergey Biryukov 2019-08-19 04:31:52 +00:00
parent ad85b0fe1d
commit 90c221a67c
7 changed files with 48 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
wp-includes/css/media-views-rtl.css
View File

@ -1235,26 +1235,33 @@
} }
.media-uploader-status .upload-dismiss-errors { .media-uploader-status .upload-dismiss-errors {
position: absolute;
top: -3px;
left: -5px;
padding: 5px;
border-radius: 50%;
transition: none;
text-decoration: none; text-decoration: none;
} }
.media-sidebar .media-uploader-status .upload-dismiss-errors { .uploader-inline .media-uploader-status .upload-dismiss-errors {
position: absolute; top: 2px;
top: -10px; left: 2px;
left: -10px;
padding: 10px;
transition: none;
} }
.media-sidebar .media-uploader-status .upload-dismiss-errors:before { .media-uploader-status .upload-dismiss-errors::before {
content: "\f153"; content: "\f153";
display: block; display: block;
font: normal 16px/1 dashicons; font: normal 16px/1 dashicons;
color: #72777c; color: #72777c;
} }
.media-sidebar .media-uploader-status .upload-dismiss-errors:hover:before, .uploader-inline .errors.media-uploader-status .upload-dismiss-errors::before {
.media-sidebar .media-uploader-status .upload-dismiss-errors:focus:before { color: #606a73;
}
.errors.media-uploader-status .upload-dismiss-errors:hover::before,
.errors.media-uploader-status .upload-dismiss-errors:focus::before {
color: #c00; color: #c00;
} }
@ -1267,6 +1274,7 @@
} }
.uploader-inline .upload-errors .upload-error { .uploader-inline .upload-errors .upload-error {
padding: 12px 30px;
background-color: #fbeaea; background-color: #fbeaea;
box-shadow: none; box-shadow: none;
} }

2
wp-includes/css/media-views-rtl.min.css vendored
View File

File diff suppressed because one or more lines are too long

26
wp-includes/css/media-views.css
View File

@ -1235,26 +1235,33 @@
} }
.media-uploader-status .upload-dismiss-errors { .media-uploader-status .upload-dismiss-errors {
position: absolute;
top: -3px;
right: -5px;
padding: 5px;
border-radius: 50%;
transition: none;
text-decoration: none; text-decoration: none;
} }
.media-sidebar .media-uploader-status .upload-dismiss-errors { .uploader-inline .media-uploader-status .upload-dismiss-errors {
position: absolute; top: 2px;
top: -10px; right: 2px;
right: -10px;
padding: 10px;
transition: none;
} }
.media-sidebar .media-uploader-status .upload-dismiss-errors:before { .media-uploader-status .upload-dismiss-errors::before {
content: "\f153"; content: "\f153";
display: block; display: block;
font: normal 16px/1 dashicons; font: normal 16px/1 dashicons;
color: #72777c; color: #72777c;
} }
.media-sidebar .media-uploader-status .upload-dismiss-errors:hover:before, .uploader-inline .errors.media-uploader-status .upload-dismiss-errors::before {
.media-sidebar .media-uploader-status .upload-dismiss-errors:focus:before { color: #606a73;
}
.errors.media-uploader-status .upload-dismiss-errors:hover::before,
.errors.media-uploader-status .upload-dismiss-errors:focus::before {
color: #c00; color: #c00;
} }
@ -1267,6 +1274,7 @@
} }
.uploader-inline .upload-errors .upload-error { .uploader-inline .upload-errors .upload-error {
padding: 12px 30px;
background-color: #fbeaea; background-color: #fbeaea;
box-shadow: none; box-shadow: none;
} }

2
wp-includes/css/media-views.min.css vendored
View File

File diff suppressed because one or more lines are too long

16
wp-includes/js/media-views.js
View File

@ -4516,8 +4516,11 @@ var FocusManager = wp.media.View.extend(/** @lends wp.media.view.FocusManager.pr
'keydown': 'constrainTabbing' 'keydown': 'constrainTabbing'
}, },
focus: function() { // Reset focus on first left menu item /**
this.$('.media-menu-item').first().focus(); * Moves focus to the first visible menu item in the modal.
*/
focus: function() {
this.$( '.media-menu-item' ).filter( ':visible' ).first().focus();
}, },
/** /**
* @param {Object} event * @param {Object} event
@ -5165,18 +5168,15 @@ UploaderStatus = View.extend(/** @lends wp.media.view.UploaderStatus.prototype *
}), { at: 0 }); }), { at: 0 });
}, },
/** dismiss: function() {
* @param {Object} event
*/
dismiss: function( event ) {
var errors = this.views.get('.upload-errors'); var errors = this.views.get('.upload-errors');
event.preventDefault();
if ( errors ) { if ( errors ) {
_.invoke( errors, 'remove' ); _.invoke( errors, 'remove' );
} }
wp.Uploader.errors.reset(); wp.Uploader.errors.reset();
// Keep focus within the modal after the dismiss button gets removed from the DOM.
this.controller.modal.focusManager.focus();
} }
}); });

6
wp-includes/js/media-views.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
wp-includes/version.php
View File

@ -13,7 +13,7 @@
* *
* @global string $wp_version * @global string $wp_version
*/ */
$wp_version = '5.2.3-alpha-45839'; $wp_version = '5.2.3-alpha-45840';
/** /**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema. * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.