Ticket #29958: 29958-3.patch

wp-admin/css/admin-menu-rtl.css

@@ -533 +533 @@
         display: none;
 }
 
-#collapse-menu {
-        font-size: 13px;
-        line-height: 34px;
-        margin-top: 10px;
+#collapse-menu a.menu-top {
         color: #aaa;
-        -webkit-transition: all .1s ease-in-out;
-        transition: all .1s ease-in-out;
+        font-size: 13px;
+        font-weight: normal;
 }
 
-#collapse-menu:hover,
-#collapse-menu:hover #collapse-button div:after {
+#collapse-menu a:focus,
+#collapse-menu:hover a {
         color: #45bbe6;
 }
 
-.folded #collapse-menu span {
-        display: none;
-}
-
-#collapse-button,
-#collapse-button div {
-        width: 15px;
-        height: 15px;
-}
-
-#collapse-button {
-        float: right;
-        height: 15px;
-        margin: 10px 11px 10px 8px;
-        width: 15px;
-        -webkit-border-radius: 10px;
-        border-radius: 10px;
-}
-
-#wpwrap #collapse-button div {
-        padding: 0;
-}
-
-#collapse-button div:after {
-        content: '\f148';
-        display: block;
-        line-height: 15px;
-        right: -3px;
-        top: -3px;
-        color: #aaa;
-        font: normal 20px/1 'dashicons' !important;
-        speak: none;
-        margin: 0 auto;
-        padding: 0 !important;
-        position: relative;
-        text-align: center;
-        width: 20px;
-        -webkit-transition: all .1s ease-in-out;
-        transition: all .1s ease-in-out;
-        -webkit-font-smoothing: antialiased;
-        -moz-osx-font-smoothing: grayscale;
-}
-
-.folded #collapse-button div:after,
-.rtl #collapse-button div:after {
+.folded #collapse-menu .wp-menu-image:before,
+.rtl #collapse-menu .wp-menu-image:before {
         -webkit-transform: rotate(180deg);
         -ms-transform: rotate(180deg);
         transform: rotate(180deg);
 }
 
-.rtl.folded #collapse-button div:after {
+.rtl.folded #collapse-menu .wp-menu-image:before {
         -webkit-transform: none;
         -ms-transform: none;
         transform: none;

wp-admin/menu-header.php

@@ -212 +212 @@
                 echo "</li>";
         }
 
-        echo '<li id="collapse-menu" class="hide-if-no-js"><div id="collapse-button"><div></div></div>';
-        echo '<span>' . esc_html__( 'Collapse menu' ) . '</span>';
+        echo '<li id="collapse-menu" class="hide-if-no-js">';
+        echo '<a class="menu-top" title="' . esc_attr__( 'Collapse menu' ) . '" href="#">';
+        echo '<div class="wp-menu-image dashicons-before dashicons-admin-collapse"><br /></div>';
+        echo '<div class="wp-menu-name">' . esc_html__( 'Collapse menu' ) . '</div>';
+        echo '</a>';
         echo '</li>';
 }
 

wp-admin/css/colors/_admin.scss

@@ -235 +235 @@
 
 /* Admin Menu: collapse button */
 
-#collapse-menu {
-    color: $menu-collapse-text;
+#collapse-menu a {
+        color: $menu-collapse-text;
 }
 
-#collapse-menu:hover {
-    color: $menu-collapse-focus-text;
-}
-
-#collapse-button div:after {
-    color: $menu-collapse-icon;
-}
-
-#collapse-menu:hover #collapse-button div:after {
-    color: $menu-collapse-focus-icon;
+#collapse-menu a:focus,
+#collapse-menu:hover a {
+        color: $menu-collapse-focus-text;
 }
 
 

wp-admin/css/admin-menu.css

@@ -533 +533 @@
         display: none;
 }
 
-#collapse-menu {
-        font-size: 13px;
-        line-height: 34px;
-        margin-top: 10px;
+#collapse-menu a {
         color: #aaa;
-        -webkit-transition: all .1s ease-in-out;
-        transition: all .1s ease-in-out;
+        font-size: 13px;
+        font-weight: normal;
 }
 
-#collapse-menu:hover,
-#collapse-menu:hover #collapse-button div:after {
+#collapse-menu a:focus,
+#collapse-menu:hover a {
         color: #45bbe6;
 }
 
-.folded #collapse-menu span {
-        display: none;
-}
-
-#collapse-button,
-#collapse-button div {
-        width: 15px;
-        height: 15px;
-}
-
-#collapse-button {
-        float: left;
-        height: 15px;
-        margin: 10px 8px 10px 11px;
-        width: 15px;
-        -webkit-border-radius: 10px;
-        border-radius: 10px;
-}
-
-#wpwrap #collapse-button div {
-        padding: 0;
-}
-
-#collapse-button div:after {
-        content: '\f148';
-        display: block;
-        line-height: 15px;
-        left: -3px;
-        top: -3px;
-        color: #aaa;
-        font: normal 20px/1 'dashicons' !important;
-        speak: none;
-        margin: 0 auto;
-        padding: 0 !important;
-        position: relative;
-        text-align: center;
-        width: 20px;
-        -webkit-transition: all .1s ease-in-out;
-        transition: all .1s ease-in-out;
-        -webkit-font-smoothing: antialiased;
-        -moz-osx-font-smoothing: grayscale;
-}
-
-.folded #collapse-button div:after,
-.rtl #collapse-button div:after {
+.folded #collapse-menu .wp-menu-image:before,
+.rtl #collapse-menu .wp-menu-image:before {
         -webkit-transform: rotate(180deg);
         -ms-transform: rotate(180deg);
         transform: rotate(180deg);
 }
 
-.rtl.folded #collapse-button div:after {
+.rtl.folded #collapse-menu .wp-menu-image:before {
         -webkit-transform: none;
         -ms-transform: none;
         transform: none;