Changeset 21574 for trunk/wp-admin/menu-header.php

Timestamp:

08/21/2012 10:46:30 PM (13 years ago)

Author:

azaozz

Message:

Improve the layout and accessibility of the admin menu: simplify the HTML structure, move the submenus off the viewport (still visible for screen readers) instead of hiding them with display: none, make it possible to unfold the menu on small/narrow screens, see #21349

File:

• trunk/wp-admin/menu-header.php (modified) (3 diffs)

trunk/wp-admin/menu-header.php

@@ -88 +88 @@
             if ( ! empty( $menu_hook ) || ( ('index.php' != $submenu_items[0][2]) && file_exists( WP_PLUGIN_DIR . "/$menu_file" ) ) ) {
                 $admin_is_parent = true;
-                echo "<div class='wp-menu-image'><a href='admin.php?page={$submenu_items[0][2]}' tabindex='-1' aria-label='$aria_label'>$img</a></div>$arrow<a href='admin.php?page={$submenu_items[0][2]}'$class $aria_attributes>$title</a>";
+                echo "<a href='admin.php?page={$submenu_items[0][2]}'$class $aria_attributes>$arrow<div class='wp-menu-image'>$img</div><div class='wp-menu-name'>$title</div></a>";
             } else {
-                echo "\n\t<div class='wp-menu-image'><a href='{$submenu_items[0][2]}' tabindex='-1' aria-label='$aria_label'>$img</a></div>$arrow<a href='{$submenu_items[0][2]}'$class $aria_attributes>$title</a>";
+                echo "\n\t<a href='{$submenu_items[0][2]}'$class $aria_attributes>$arrow<div class='wp-menu-image'>$img</div><div class='wp-menu-name'>$title</div></a>";
             }
         } elseif ( ! empty( $item[2] ) && current_user_can( $item[1] ) ) {
@@ -99 +99 @@
             if ( ! empty( $menu_hook ) || ( ('index.php' != $item[2]) && file_exists( WP_PLUGIN_DIR . "/$menu_file" ) ) ) {
                 $admin_is_parent = true;
-                echo "\n\t<div class='wp-menu-image'><a href='admin.php?page={$item[2]}' tabindex='-1' aria-label='$aria_label'>$img</a></div>$arrow<a href='admin.php?page={$item[2]}'$class $aria_attributes>{$item[0]}</a>";
+                echo "\n\t<a href='admin.php?page={$item[2]}'$class $aria_attributes>$arrow<div class='wp-menu-image'>$img</div><div class='wp-menu-name'>{$item[0]}</div></a>";
             } else {
-                echo "\n\t<div class='wp-menu-image'><a href='{$item[2]}' tabindex='-1' aria-label='$aria_label'>$img</a></div>$arrow<a href='{$item[2]}'$class $aria_attributes>{$item[0]}</a>";
+                echo "\n\t<a href='{$item[2]}'$class $aria_attributes>$arrow<div class='wp-menu-image'>$img</div><div class='wp-menu-name'>{$item[0]}</div></a>";
             }
         }
 
         if ( ! empty( $submenu_items ) ) {
-            echo "\n\t<div class='wp-submenu'><div class='wp-submenu-wrap'>";
-            echo "<div class='wp-submenu-head'>{$item[0]}</div><ul>";
+            echo "\n\t<ul class='wp-submenu wp-submenu-wrap'>";
+            echo "<li class='wp-submenu-head'>{$item[0]}</li>";
+    
             $first = true;
             foreach ( $submenu_items as $sub_key => $sub_item ) {
@@ -161 +162 @@
                 }
             }
-            echo "</ul></div></div>";
+            echo "</ul>";
         }
         echo "</li>";