diff -r 34716fd837a4 -r be944660c56a wp/wp-admin/css/admin-menu-rtl.css --- a/wp/wp-admin/css/admin-menu-rtl.css Tue Dec 15 15:52:01 2020 +0100 +++ b/wp/wp-admin/css/admin-menu-rtl.css Wed Sep 21 18:19:35 2022 +0200 @@ -4,7 +4,7 @@ #adminmenu, #adminmenu .wp-submenu { width: 160px; - background-color: #23282d; + background-color: #1d2327; } #adminmenuback { @@ -48,9 +48,9 @@ /* New Menu icons */ .icon16:before { - color: #82878c; /* same as new icons */ + color: #8c8f94; /* same as new icons */ font: normal 20px/1 dashicons; - speak: none; + speak: never; padding: 6px 0; height: 34px; width: 20px; @@ -156,8 +156,6 @@ /* side admin menu */ #adminmenu * { -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; user-select: none; } @@ -171,12 +169,12 @@ display: block; line-height: 1.3; padding: 2px 5px; - color: #eee; + color: #f0f0f1; } #adminmenu .wp-submenu a { - color: #b4b9be; - color: rgba(240, 245, 250, 0.7); + color: #c3c4c7; + color: rgba(240, 246, 252, 0.7); font-size: 13px; line-height: 1.4; margin: 0; @@ -192,7 +190,14 @@ #adminmenu li.menu-top > a:focus, #adminmenu .wp-submenu a:hover, #adminmenu .wp-submenu a:focus { - color: #00b9eb; + color: #72aee6; +} + +#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 { @@ -208,14 +213,9 @@ right: 160px; overflow: visible; word-wrap: break-word; -} - -#adminmenu .wp-submenu, -.folded #adminmenu a.wp-has-current-submenu:focus + .wp-submenu, -.folded #adminmenu .wp-has-current-submenu .wp-submenu { padding: 7px 0 8px; z-index: 9999; - background-color: #32373c; + background-color: #2c3338; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2); } @@ -226,9 +226,12 @@ top: -1px; } +#adminmenu a.wp-has-current-submenu:focus + .wp-submenu { + top: 0; +} + #adminmenu .wp-has-current-submenu .wp-submenu, .no-js li.wp-has-current-submenu:hover .wp-submenu, -#adminmenu a.wp-has-current-submenu:focus + .wp-submenu, #adminmenu .wp-has-current-submenu .wp-submenu.sub-open, #adminmenu .wp-has-current-submenu.opensub .wp-submenu { position: relative; @@ -240,7 +243,10 @@ border: 0 none; margin-top: 0; box-shadow: none; - background-color: #32373c; +} + +.folded #adminmenu .wp-has-current-submenu .wp-submenu { + box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2); } /* ensure that wp-submenu's box shadow doesn't appear on top of the focused menu item's background. */ @@ -248,8 +254,8 @@ #adminmenu li.opensub > a.menu-top, #adminmenu li > a.menu-top:focus { position: relative; - background-color: #191e23; - color: #00b9eb; + background-color: #1d2327; + color: #72aee6; } .folded #adminmenu li.menu-top:hover, @@ -260,12 +266,10 @@ #adminmenu li.wp-has-current-submenu a.wp-has-current-submenu, #adminmenu li.current a.menu-top, -.folded #adminmenu li.wp-has-current-submenu, -.folded #adminmenu li.current.menu-top, #adminmenu .wp-menu-arrow, #adminmenu .wp-has-current-submenu .wp-submenu .wp-submenu-head, #adminmenu .wp-menu-arrow div { - background: #0073aa; + background: #2271b1; color: #fff; } @@ -290,6 +294,7 @@ .folded #adminmenu .wp-has-current-submenu .wp-submenu { min-width: 160px; width: auto; + border-right: 5px solid transparent; } #adminmenu .wp-submenu li.current, @@ -347,7 +352,13 @@ } #adminmenu div.wp-menu-name { - padding: 8px 0; + padding: 8px 36px 8px 8px; + overflow-wrap: break-word; + word-wrap: break-word; + -ms-word-break: break-all; + word-break: break-word; + -webkit-hyphens: auto; + hyphens: auto; } #adminmenu div.wp-menu-image { @@ -365,15 +376,15 @@ } div.wp-menu-image:before { - color: #a0a5aa; - color: rgba(240, 245, 250, 0.6); + color: #a7aaad; + color: rgba(240, 246, 252, 0.6); padding: 7px 0; transition: all .1s ease-in-out; } #adminmenu div.wp-menu-image:before { - color: #a0a5aa; - color: rgba(240, 245, 250, 0.6); + color: #a7aaad; + color: rgba(240, 246, 252, 0.6); } #adminmenu li.wp-has-current-submenu:hover div.wp-menu-image:before, @@ -389,7 +400,7 @@ #adminmenu li:hover div.wp-menu-image:before, #adminmenu li a:focus div.wp-menu-image:before, #adminmenu li.opensub div.wp-menu-image:before { - color: #00b9eb; + color: #72aee6; } .folded #adminmenu div.wp-menu-image { @@ -427,12 +438,13 @@ width: 0; position: absolute; pointer-events: none; - border-left-color: #f1f1f1; + border-left-color: #f0f0f1; top: 50%; margin-top: -8px; } -.folded ul#adminmenu li:hover a.wp-has-current-submenu:after { +.folded ul#adminmenu li:hover a.wp-has-current-submenu:after, +.folded ul#adminmenu li.wp-has-current-submenu:focus-within a.wp-has-current-submenu:after { display: none; } @@ -443,27 +455,29 @@ } /* 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, +#adminmenu li.wp-has-submenu.wp-not-current-submenu:focus-within:after { left: 0; - border: solid transparent; + border: 8px solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; - border-width: 8px; top: 10px; z-index: 10000; } -.folded ul#adminmenu li.wp-has-submenu.wp-not-current-submenu:hover:after { +.folded ul#adminmenu li.wp-has-submenu.wp-not-current-submenu:hover:after, +.folded ul#adminmenu li.wp-has-submenu.wp-not-current-submenu:focus-within:after { border-width: 4px; margin-top: -4px; top: 18px; } -#adminmenu li.wp-has-submenu.wp-not-current-submenu.opensub:hover:after { - border-left-color: #32373c; +#adminmenu li.wp-has-submenu.wp-not-current-submenu.opensub:hover:after, +#adminmenu li.wp-has-submenu.wp-not-current-submenu:focus-within:after { + border-left-color: #2c3338; } #adminmenu li.menu-top:hover .wp-menu-image img, @@ -489,8 +503,11 @@ color: #fff; font-weight: 400; font-size: 14px; - padding: 8px 11px 8px 4px; - margin: -7px 0px 4px; + padding: 5px 11px 5px 4px; + margin: -7px -5px 4px 0px; + border-width: 3px 5px 3px 0; + border-style: solid; + border-color: transparent; } #adminmenu li.current, @@ -509,7 +526,7 @@ min-width: 18px; height: 18px; border-radius: 9px; - background-color: #ca4a1f; + background-color: #d63638; color: #fff; font-size: 11px; line-height: 1.6; @@ -519,7 +536,7 @@ #adminmenu li.current a .awaiting-mod, #adminmenu li a.wp-has-current-submenu .update-plugins { - background-color: #ca4a1f; + background-color: #d63638; color: #fff; } @@ -537,16 +554,16 @@ position: relative; overflow: visible; background: none; - color: #aaa; + color: #a7aaad; cursor: pointer; } #collapse-button:hover { - color: #00b9eb; + color: #72aee6; } #collapse-button:focus { - color: #00b9eb; + color: #72aee6; /* Only visible in Windows High Contrast mode */ outline: 1px solid transparent; outline-offset: -1px; @@ -585,7 +602,7 @@ top: 7px; text-align: center; font: normal 20px/1 dashicons !important; - speak: none; + speak: never; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } @@ -683,7 +700,7 @@ } .auto-fold #adminmenu a.menu-top { - height: 34px; + min-height: 34px; } .auto-fold #adminmenu li.wp-menu-open { @@ -694,11 +711,13 @@ margin-bottom: 0; } - .auto-fold ul#adminmenu li:hover a.wp-has-current-submenu:after { + .auto-fold ul#adminmenu li:hover a.wp-has-current-submenu:after, + .auto-fold ul#adminmenu li:focus-within a.wp-has-current-submenu:after { display: none; } - .auto-fold ul#adminmenu li.wp-has-submenu.wp-not-current-submenu:hover:after { + .auto-fold ul#adminmenu li.wp-has-submenu.wp-not-current-submenu:hover:after, + .auto-fold ul#adminmenu li.wp-has-submenu.wp-not-current-submenu:focus-within:after { border-width: 4px; margin-top: -4px; top: 16px; @@ -784,7 +803,6 @@ /* Restore the menu names */ .auto-fold #adminmenu .wp-menu-name { position: static; - margin-right: 35px; } /* Switch the arrow side */ @@ -794,7 +812,8 @@ margin-top: -8px; } - .auto-fold ul#adminmenu li.wp-has-submenu.wp-not-current-submenu:hover:after { + .auto-fold ul#adminmenu li.wp-has-submenu.wp-not-current-submenu:hover:after, + .auto-fold ul#adminmenu li.wp-has-submenu.wp-not-current-submenu:focus-within:after { display: none; } @@ -826,7 +845,8 @@ display: block; } - .auto-fold ul#adminmenu li:hover a.wp-has-current-submenu:after { + .auto-fold ul#adminmenu li:hover a.wp-has-current-submenu:after, + .auto-fold ul#adminmenu li:focus-within a.wp-has-current-submenu:after { display: block; } @@ -838,6 +858,11 @@ top: 0; } + #adminmenu .wp-not-current-submenu .wp-submenu, + .folded #adminmenu .wp-has-current-submenu .wp-submenu { + border-right: none; + } + /* Remove submenu headers and adjust sub meu*/ #adminmenu .wp-submenu .wp-submenu-head { display: none; @@ -867,7 +892,7 @@ } .wp-responsive-open #wpadminbar #wp-admin-bar-menu-toggle a { - background: #32373c; + background: #2c3338; } li#wp-admin-bar-menu-toggle { @@ -898,7 +923,7 @@ } .wp-responsive-open #wpadminbar #wp-admin-bar-menu-toggle .ab-icon:before { - color: #00b9eb; + color: #72aee6; } }