From c9a6381244251a976c17d2f41cc407336b0f66cb Mon Sep 17 00:00:00 2001 From: Kelly Choyce-Dwan Date: Thu, 14 Jan 2021 21:58:25 +0000 Subject: [PATCH] Administration: Update hover and focus states in admin menu. This adds a border along the side of admin menu links when hovering or focusing on them, as color should not be the only indicator of link state. Props accessiblejoe florianziegler afercia rianrietveld michael-arestad ryan hedgefield audrasjb ibdz. Fixes #28599. git-svn-id: https://develop.svn.wordpress.org/trunk@49961 602fd350-edb4-49c9-b593-d223f7449a82 --- src/wp-admin/css/admin-menu.css | 20 ++++++++++++++++++-- 1 file changed, 18 insertions(+), 2 deletions(-) diff --git a/src/wp-admin/css/admin-menu.css b/src/wp-admin/css/admin-menu.css index f2f9887df0..87abd19803 100644 --- a/src/wp-admin/css/admin-menu.css +++ b/src/wp-admin/css/admin-menu.css @@ -194,6 +194,13 @@ color: #00b9eb; } +#adminmenu a:hover, +#adminmenu a:focus, +.folded #adminmenu .wp-submenu-head:hover { + box-shadow: inset 4px 0 0 0 currentColor; + transition: box-shadow .1s linear; +} + #adminmenu li.menu-top { border: none; min-height: 34px; @@ -289,6 +296,7 @@ .folded #adminmenu .wp-has-current-submenu .wp-submenu { min-width: 160px; width: auto; + border-left: 5px solid transparent; } #adminmenu .wp-submenu li.current, @@ -495,8 +503,11 @@ ul#adminmenu > li.current > a.current:after { color: #fff; font-weight: 400; font-size: 14px; - padding: 8px 4px 8px 11px; - margin: -7px 0px 4px; + padding: 5px 4px 5px 11px; + margin: -7px 0px 4px -5px; + border-width: 3px 0 3px 5px; + border-style: solid; + border-color: transparent; } #adminmenu li.current, @@ -843,6 +854,11 @@ li#wp-admin-bar-menu-toggle { top: 0; } + #adminmenu .wp-not-current-submenu .wp-submenu, + .folded #adminmenu .wp-has-current-submenu .wp-submenu { + border-left: none; + } + /* Remove submenu headers and adjust sub meu*/ #adminmenu .wp-submenu .wp-submenu-head { display: none;