Ticket #37513: 37513.4.diff

src/wp-includes/class-wp-admin-bar.php

@@ -501 +501 @@
                         return;
                 }
 
-                $is_parent = ! empty( $node->children );
-                $has_link  = ! empty( $node->href );
+                $is_parent             = ! empty( $node->children );
+                $has_link              = ! empty( $node->href );
+                $is_root_top_item      = 'root-default' === $node->parent;
+                $is_top_secondary_item = 'top-secondary' === $node->parent;
 
                 // Allow only numeric values, then casted to integers, and allow a tabindex value of `0` for a11y.
                 $tabindex        = ( isset( $node->meta['tabindex'] ) && is_numeric( $node->meta['tabindex'] ) ) ? (int) $node->meta['tabindex'] : '';
@@ -509 +511 @@
                 $aria_attributes = ( '' !== $tabindex ) ? ' tabindex="' . $tabindex . '"' : '';
 
                 $menuclass = '';
+                $arrow     = '';
 
                 if ( $is_parent ) {
                         $menuclass        = 'menupop ';
@@ -519 +522 @@
                         $menuclass .= $node->meta['class'];
                 }
 
+                // Print the arrow icon for the menu children with children.
+                if ( ! $is_root_top_item && ! $is_top_secondary_item && $is_parent ) {
+                        $arrow = '<span class="wp-admin-bar-arrow" aria-hidden="true"></span>';
+                }
+
                 if ( $menuclass ) {
                         $menuclass = ' class="' . esc_attr( trim( $menuclass ) ) . '"';
                 }
@@ -542 +550 @@
                         }
                 }
 
-                echo ">{$node->title}";
+                echo ">{$arrow}{$node->title}";
 
                 if ( $has_link ) {
                         echo '</a>';

src/wp-includes/css/admin-bar.css

@@ -228 +228 @@
 
 #wpadminbar > #wp-toolbar > #wp-admin-bar-root-default .ab-icon,
 #wpadminbar .ab-icon,
-#wpadminbar .ab-item:before {
+#wpadminbar .ab-item:before,
+.wp-admin-bar-arrow {
         position: relative;
         float: left;
         font: normal 20px/1 dashicons;
@@ -305 +306 @@
         color: #00b9eb;
 }
 
-#wpadminbar .menupop .menupop > .ab-item:before,
+#wpadminbar .menupop .menupop > .ab-item .wp-admin-bar-arrow:before,
 #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item:before {
         position: absolute;
         font: normal 17px/1 dashicons;
@@ -319 +320 @@
         padding-right: 2em;
 }
 
-#wpadminbar .menupop .menupop > .ab-item:before {
+#wpadminbar .menupop .menupop > .ab-item .wp-admin-bar-arrow:before {
         top: 1px;
-        right: 4px;
+        right: 10px;
+        padding: 4px 0;
         content: "\f139";
         color: inherit;
 }
@@ -331 +333 @@
         padding-right: 1em;
 }
 
-#wpadminbar .ab-top-secondary .menupop .menupop > .ab-item:before {
+#wpadminbar .ab-top-secondary .menupop .menupop > .ab-item .wp-admin-bar-arrow:before {
         top: 1px;
         left: 6px;
         content: "\f141";