Changeset 53023

Timestamp:

03/29/2022 07:06:54 PM (4 years ago)

Author:

joedolson

Message:

Quick/Bulk Edit: Position action buttons in close proximity.

Move the Submit and Cancel buttons in quick edit forms to be next to each other and change the order of the buttons. Improve accessibility for low vision and cognitive impairments for quick editing.

Props afercia, marybaum.
Fixes #55364.

Location:

trunk/src/wp-admin

Files:

• css/list-tables.css (modified) (2 diffs)
• includes/class-wp-posts-list-table.php (modified) (2 diffs)
• includes/class-wp-terms-list-table.php (modified) (2 diffs)

trunk/src/wp-admin/css/list-tables.css

@@ -915 +915 @@
 
 .inline-edit-row .submit {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
         clear: both;
         padding: 0.5em;
@@ -920 +923 @@
 }
 
+.inline-edit-save.submit .button {
+        margin-right: 8px;
+}
+
+.inline-edit-save .spinner {
+        float: none;
+        margin: 0;
+}
+
 .inline-edit-row .notice-error {
+        box-sizing: border-box;
+        min-width: 100%;
         margin-top: 1em;
 }

trunk/src/wp-admin/includes/class-wp-posts-list-table.php

@@ -2008 +2008 @@
 
                         <div class="submit inline-edit-save">
-                                <button type="button" class="button cancel alignleft"><?php _e( 'Cancel' ); ?></button>
-
                                 <?php if ( ! $bulk ) : ?>
                                         <?php wp_nonce_field( 'inlineeditnonce', '_inline_edit', false ); ?>
-                                        <button type="button" class="button button-primary save alignright"><?php _e( 'Update' ); ?></button>
+                                        <button type="button" class="button button-primary save"><?php _e( 'Update' ); ?></button>
+                                <?php else : ?>
+                                        <?php submit_button( __( 'Update' ), 'primary', 'bulk_edit', false ); ?>
+                                <?php endif; ?>
+
+                                <button type="button" class="button cancel"><?php _e( 'Cancel' ); ?></button>
+
+                                <?php if ( ! $bulk ) : ?>
                                         <span class="spinner"></span>
-                                <?php else : ?>
-                                        <?php submit_button( __( 'Update' ), 'primary alignright', 'bulk_edit', false ); ?>
                                 <?php endif; ?>
 
@@ -2023 +2026 @@
                                         <input type="hidden" name="post_author" value="<?php echo esc_attr( $post->post_author ); ?>" />
                                 <?php endif; ?>
-                                <br class="clear" />
 
                                 <div class="notice notice-error notice-alt inline hidden">

trunk/src/wp-admin/includes/class-wp-terms-list-table.php

@@ -697 +697 @@
 
                         <div class="inline-edit-save submit">
-                                <button type="button" class="cancel button alignleft"><?php _e( 'Cancel' ); ?></button>
-                                <button type="button" class="save button button-primary alignright"><?php echo $tax->labels->update_item; ?></button>
+                                <button type="button" class="save button button-primary"><?php echo $tax->labels->update_item; ?></button>
+                                <button type="button" class="cancel button"><?php _e( 'Cancel' ); ?></button>
                                 <span class="spinner"></span>
 
@@ -704 +704 @@
                                 <input type="hidden" name="taxonomy" value="<?php echo esc_attr( $this->screen->taxonomy ); ?>" />
                                 <input type="hidden" name="post_type" value="<?php echo esc_attr( $this->screen->post_type ); ?>" />
-                                <br class="clear" />
 
                                 <div class="notice notice-error notice-alt inline hidden">