Changeset 41621 for trunk/src/wp-admin/includes/widgets.php

Timestamp:

09/27/2017 04:28:59 PM (7 years ago)

Author:

afercia

Message:

Accessibility: Improve the sidebar toggles in the Widgets screen.

• uses button elements for the toggles
• uses aria-expanded on the toggles to communicate to assistive technologies the panels expanded/collapsed state
• adds the "circular focus" style to the toggles to give users a clear indication of the currently focused element
• standardizes CSS class names to .toggle-indicator and .handlediv as these names are already used across the admin for similar controls

Props monikarao, xavortm, mihai2u, Kopepasah.
Fixes #37013.

File:

• trunk/src/wp-admin/includes/widgets.php (modified) (1 diff)

trunk/src/wp-admin/includes/widgets.php

@@ -81 +81 @@
         ?>
         <div class="sidebar-name">
-            <div class="sidebar-name-arrow"><br /></div>
+            <button type="button" class="handlediv hide-if-no-js" aria-expanded="true">
+                <span class="screen-reader-text"><?php echo esc_html( $sidebar_name ); ?></span>
+                <span class="toggle-indicator" aria-hidden="true"></span>
+            </button>
             <h2><?php echo esc_html( $sidebar_name ); ?> <span class="spinner"></span></h2>
         </div>