Ticket #28599: 28599-currentcolor-arrow.diff

src/wp-admin/css/admin-menu.css

@@ -181 +181 @@
         color: #45bbe6;
 }
 
+/* On hover & focus display the blue "focus bar" on the left, darker background */
+#adminmenu a:hover,
+#adminmenu li.menu-top > a:focus,
+#adminmenu .wp-submenu a:hover,
+#adminmenu .wp-submenu a:focus {
+    box-shadow: inset 4px 0 0 0 currentColor;
+    transition: box-shadow .2s linear;
+}
+/* Top menu item color stays blue, when submenu is open */
+.admin-color-fresh #adminmenu li.opensub > a {
+    color: currentColor;
+}
+/* Focus bar in white, when menu item is current */
+#adminmenu li.current a:hover,
+#adminmenu li.current a:focus,
+#adminmenu li.wp-has-current-submenu > a:hover,
+#adminmenu li.wp-has-current-submenu > a:focus,
+#adminmenu .wp-submenu li.current a:hover,
+#adminmenu .wp-submenu li.current a:focus {
+    box-shadow: inset 4px 0 0 0 currentColor;
+}
+
 #adminmenu li.menu-top {
         border: none;
         min-height: 34px;
@@ -235 +257 @@
 #adminmenu li.menu-top:hover,
 #adminmenu li.opensub > a.menu-top,
 #adminmenu li > a.menu-top:focus {
+    color: #45bbe6; /* .menu-top color should be blue like the icon, when submenu is open */
         position: relative;
         background-color: #111;
 }
@@ -375 +398 @@
         color: #fff;
 }
 
-#adminmenu li:hover div.wp-menu-image:before {
+#adminmenu li:hover div.wp-menu-image:before,
+/* Makes menu image blue on focus */
+.admin-color-fresh #adminmenu li a:focus div.wp-menu-image:before,
+/* Keep menu image blue when submenu is open */
+.admin-color-fresh #adminmenu li.opensub div.wp-menu-image:before {
         color: #45bbe6;
 }
+.admin-color-fresh #adminmenu li.current:hover div.wp-menu-image:before,
+.admin-color-fresh #adminmenu li.current a:focus div.wp-menu-image:before,
+/* Keeps icon white when it has the current submenu */
+.admin-color-fresh #adminmenu li.wp-has-current-submenu.opensub div.wp-menu-image:before,
+.admin-color-fresh #adminmenu li.wp-has-current-submenu a:focus div.wp-menu-image:before {
+        color: #fff;
+}
 
 .folded #adminmenu div.wp-menu-image {
         width: 35px;
@@ -444 +478 @@
 }
 
 /* flyout menu arrow */
-#adminmenu li.wp-has-submenu.wp-not-current-submenu:hover:after {
+#adminmenu li.wp-has-submenu.wp-not-current-submenu:hover:after,
+/* Add submenu indicating arrows on focus */
+.admin-color-fresh #adminmenu li a.wp-has-submenu.wp-not-current-submenu:focus:after,
+.admin-color-fresh #adminmenu li.opensub a.wp-has-submenu.wp-not-current-submenu:after {
         right: 0;
         border: solid transparent;
         content: " ";
@@ -463 +500 @@
         top: 18px;
 }
 
-#adminmenu li.wp-has-submenu.wp-not-current-submenu.opensub:hover:after {
+#adminmenu li.wp-has-submenu.wp-not-current-submenu.opensub:hover:after,
+.admin-color-fresh #adminmenu li a.wp-has-submenu.wp-not-current-submenu:focus:after,
+.admin-color-fresh #adminmenu li.opensub a.wp-has-submenu.wp-not-current-submenu:after {
         border-right-color: #333;
 }
 
@@ -896 +935 @@
                 -moz-box-sizing: border-box;
                 box-sizing: border-box;
         }
+    /* Hide the submenu indicating arrows */
+    .admin-color-fresh #adminmenu li a.wp-has-submenu.wp-not-current-submenu:focus:after,
+    .admin-color-fresh #adminmenu li.opensub a.wp-has-submenu.wp-not-current-submenu:after {
+        border-right-color: transparent;
+    }
 }
 
 /* Smartphone */

src/wp-admin/js/user-profile.js

@@ -120 +120 @@
                                         color_scheme: $this.children( 'input[name="admin_color"]' ).val(),
                                         nonce:        $('#color-nonce').val()
                                 });
+
+                // update body class
+                $( 'body' ).removeClass( function ( index, classes ) {
+                    return ( classes.match( /(^|\s)admin-color-\S+/g ) || [] ).join(' ');
+                }).addClass( 'admin-color-' + $this.children( 'input[name="admin_color"]' ).val() );
                         }
                 });
         });