Changeset 58146 for trunk/src/wp-includes/class-wp-customize-nav-menus.php

Timestamp:

05/14/2024 04:47:03 PM (12 months ago)

Author:

joedolson

Message:

Administration: A11y: Replace placeholders with visible labels.

Add visible labels to inputs that are using placeholder attributes as a substitute for visible labeling.

Labels added or made visible on the customizer theme search, customizer widget search, customizer menu item search, customizer new page UI, the search plugins screens, the media search screens, and the classic editor link inserter.

Props afercia, joedolson, rcreators, sabernhardt.
See #40331.

File:

• trunk/src/wp-includes/class-wp-customize-nav-menus.php (modified) (3 diffs)

trunk/src/wp-includes/class-wp-customize-nav-menus.php

@@ -1164 +1164 @@
             <div id="available-menu-items-search" class="accordion-section cannot-expand">
                 <div class="accordion-section-title">
-                    <label class="screen-reader-text" for="menu-items-search">
-                        <?php
-                        /* translators: Hidden accessibility text. */
-                        _e( 'Search Menu Items' );
-                        ?>
-                    </label>
-                    <input type="text" id="menu-items-search" placeholder="<?php esc_attr_e( 'Search menu items&hellip;' ); ?>" aria-describedby="menu-items-search-desc" />
+                    <label for="menu-items-search"><?php _e( 'Search Menu Items' ); ?></label>
+                    <input type="text" id="menu-items-search" aria-describedby="menu-items-search-desc" />
                     <p class="screen-reader-text" id="menu-items-search-desc">
                         <?php
@@ -1178 +1173 @@
                     </p>
                     <span class="spinner"></span>
+                    <div class="search-icon" aria-hidden="true"></div>
+                    <button type="button" class="clear-results"><span class="screen-reader-text">
+                        <?php
+                        /* translators: Hidden accessibility text. */
+                        _e( 'Clear Results' );
+                        ?>
+                    </span></button>
                 </div>
-                <div class="search-icon" aria-hidden="true"></div>
-                <button type="button" class="clear-results"><span class="screen-reader-text">
-                    <?php
-                    /* translators: Hidden accessibility text. */
-                    _e( 'Clear Results' );
-                    ?>
-                </span></button>
                 <ul class="accordion-section-content available-menu-items-list" data-type="search"></ul>
             </div>
@@ -1244 +1239 @@
                     <?php $post_type_obj = get_post_type_object( $available_item_type['object'] ); ?>
                     <?php if ( current_user_can( $post_type_obj->cap->create_posts ) && current_user_can( $post_type_obj->cap->publish_posts ) ) : ?>
-                        <div class="new-content-item">
-                            <label for="<?php echo esc_attr( 'create-item-input-' . $available_item_type['object'] ); ?>" class="screen-reader-text"><?php echo esc_html( $post_type_obj->labels->add_new_item ); ?></label>
-                            <input type="text" id="<?php echo esc_attr( 'create-item-input-' . $available_item_type['object'] ); ?>" class="create-item-input" placeholder="<?php echo esc_attr( $post_type_obj->labels->add_new_item ); ?>">
-                            <button type="button" class="button add-content"><?php _e( 'Add' ); ?></button>
+                        <div class="new-content-item-wrapper">
+                            <label for="<?php echo esc_attr( 'create-item-input-' . $available_item_type['object'] ); ?>"><?php echo esc_html( $post_type_obj->labels->add_new_item ); ?></label>
+                            <div class="new-content-item">
+                                <input type="text" id="<?php echo esc_attr( 'create-item-input-' . $available_item_type['object'] ); ?>" class="create-item-input">
+                                <button type="button" class="button add-content"><?php _e( 'Add' ); ?></button>
+                            </div>
                         </div>
                     <?php endif; ?>