diff --git a/src/wp-admin/css/common.css b/src/wp-admin/css/common.css index b09c390202..a468d81395 100644 --- a/src/wp-admin/css/common.css +++ b/src/wp-admin/css/common.css @@ -3024,7 +3024,8 @@ img { /* Metabox collapse arrow indicators */ .js .sidebar-name .sidebar-name-arrow:before, -.js .meta-box-sortables .postbox .toggle-indicator:before { +.js .meta-box-sortables .postbox .toggle-indicator:before, +.bulk-action-notice .toggle-indicator:before { content: "\f142"; display: inline-block; font: normal 20px/1 dashicons; @@ -3035,7 +3036,8 @@ img { } .js .widgets-holder-wrap.closed .sidebar-name-arrow:before, -.js .meta-box-sortables .postbox.closed .handlediv .toggle-indicator:before { +.js .meta-box-sortables .postbox.closed .handlediv .toggle-indicator:before, +.bulk-action-notice .bulk-action-errors-collapsed .toggle-indicator:before { content: "\f140"; } @@ -3065,6 +3067,12 @@ img { text-indent: 1px; /* account for the dashicon alignment */ } +.bulk-action-notice .toggle-indicator:before { + line-height: 16px; + vertical-align: top; + color: #72777c; +} + .js .postbox .handlediv:focus { -webkit-box-shadow: none; box-shadow: none; diff --git a/src/wp-admin/includes/update.php b/src/wp-admin/includes/update.php index 457b5fee63..74899e37cb 100644 --- a/src/wp-admin/includes/update.php +++ b/src/wp-admin/includes/update.php @@ -634,7 +634,7 @@ function wp_print_admin_notice_templates() { <div <# if ( data.id ) { #>id="{{ data.id }}"<# } #> class="notice {{ data.className }}"><p>{{{ data.message }}}</p></div> </script> <script id="tmpl-wp-bulk-updates-admin-notice" type="text/html"> - <div id="{{ data.id }}" class="notice <# if ( data.errors ) { #>notice-error<# } else { #>notice-success<# } #>"> + <div id="{{ data.id }}" class="{{ data.className }} notice <# if ( data.errors ) { #>notice-error<# } else { #>notice-success<# } #>"> <p> <# if ( data.successes ) { #> <# if ( 1 === data.successes ) { #> @@ -664,25 +664,25 @@ function wp_print_admin_notice_templates() { <# } #> <# } #> <# if ( data.errors ) { #> - <# if ( 1 === data.errors ) { #> - <button class="button-link"> + <button class="button-link bulk-action-errors-collapsed" aria-expanded="false"> + <# if ( 1 === data.errors ) { #> <?php - /* translators: %s: Number of failures */ - printf( __( '%s failure.' ), '{{ data.errors }}' ); + /* translators: %s: Number of failed updates */ + printf( __( '%s update failed.' ), '{{ data.errors }}' ); ?> - </button> - <# } else { #> - <button class="button-link"> + <# } else { #> <?php - /* translators: %s: Number of failures */ - printf( __( '%s failures.' ), '{{ data.errors }}' ); + /* translators: %s: Number of failed updates */ + printf( __( '%s updates failed.' ), '{{ data.errors }}' ); ?> - </button> - <# } #> + <# } #> + <span class="screen-reader-text"><?php _e( 'Show more details' ); ?></span> + <span class="toggle-indicator" aria-hidden="true"></span> + </button> <# } #> </p> <# if ( data.errors ) { #> - <ul class="hidden"> + <ul class="bulk-action-errors hidden"> <# _.each( data.errorMessages, function( errorMessage ) { #> <li>{{ errorMessage }}</li> <# } ); #> diff --git a/src/wp-admin/js/updates.js b/src/wp-admin/js/updates.js index 33756ffd74..f327c003be 100644 --- a/src/wp-admin/js/updates.js +++ b/src/wp-admin/js/updates.js @@ -526,7 +526,7 @@ $card.removeClass( 'plugin-card-install-failed' ).find( '.notice.notice-error' ).remove(); $document.trigger( 'wp-plugin-installing', args ); - + return wp.updates.ajax( 'install-plugin', args ); }; @@ -718,7 +718,7 @@ wp.a11y.speak( wp.updates.l10n.deleting, 'polite' ); $document.trigger( 'wp-plugin-deleting', args ); - + return wp.updates.ajax( 'delete-plugin', args ); }; @@ -1043,7 +1043,7 @@ $( '.install-theme-info, [data-slug="' + args.slug + '"]' ).removeClass( 'theme-install-failed' ).find( '.notice.notice-error' ).remove(); $document.trigger( 'wp-theme-installing', args ); - + return wp.updates.ajax( 'install-theme', args ); }; @@ -1174,7 +1174,7 @@ $( '.theme-info .update-message' ).remove(); $document.trigger( 'wp-theme-deleting', args ); - + return wp.updates.ajax( 'delete-theme', args ); }; @@ -1982,7 +1982,7 @@ $bulkActionForm.find( '.manage-column [type="checkbox"]' ).prop( 'checked', false ); $document.trigger( 'wp-' + type + '-bulk-' + bulkAction, itemsSelected ); - + // Find all the checkboxes which have been checked. itemsSelected.each( function( index, element ) { var $checkbox = $( element ), @@ -2023,6 +2023,7 @@ wp.updates.addAdminNotice( { id: 'bulk-action-notice', + className: 'bulk-action-notice', successes: success, errors: error, errorMessages: errorMessages, @@ -2030,7 +2031,12 @@ } ); $bulkActionNotice = $( '#bulk-action-notice' ).on( 'click', 'button', function() { - $bulkActionNotice.find( 'ul' ).toggleClass( 'hidden' ); + // $( this ) is the clicked button, no need to get it again. + $( this ) + .toggleClass( 'bulk-action-errors-collapsed' ) + .attr( 'aria-expanded', ! $( this ).hasClass( 'bulk-action-errors-collapsed' ) ); + // Show the errors list. + $bulkActionNotice.find( '.bulk-action-errors' ).toggleClass( 'hidden' ); } ); if ( error > 0 && ! wp.updates.queue.length ) {