Create admin menu arrows using CSS3 transforms. props chexee. see #18382, fixes #18902.

git-svn-id: https://develop.svn.wordpress.org/trunk@18942 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Daryl Koopersmith
2011-10-11 21:25:38 +00:00
parent 8f0389b3e9
commit 50b17d4b68
6 changed files with 76 additions and 21 deletions

View File

@@ -1786,21 +1786,62 @@ body.no-js #adminmenu .wp-menu-toggle,
padding-left: 0;
}
#adminmenu li.wp-has-current-submenu .wp-menu-arrow,
#adminmenu li.menu-top.current .wp-menu-arrow,
#adminmenu li.wp-has-submenu:hover .wp-menu-arrow {
display: block;
position: absolute;
right: -9px;
top: 0;
.wp-menu-arrow {
display: none;
cursor: auto;
z-index: 25;
position: absolute;
right: 100%;
margin: 0;
height: 30px;
width: 6px;
-moz-transform: translate( 146px );
-webkit-transform: translate( 146px );
-o-transform: translate( 146px );
-ms-transform: translate( 146px );
transform: translate( 146px );
}
#adminmenu li.wp-has-current-submenu .wp-menu-arrow,
#adminmenu li.menu-top.current .wp-menu-arrow,
#adminmenu li.wp-not-current-submenu:hover .wp-menu-arrow {
display: block;
}
#adminmenu li.menu-top:hover .wp-menu-arrow {
z-index: 1001;
}
#adminmenu .wp-menu-arrow div {
position: absolute;
top: 7px;
left: -1px;
width: 14px;
height: 15px;
-moz-transform: matrix( -0.6, 1, 0.6, 1, 0, 0 );
-webkit-transform: matrix( -0.6, 1, 0.6, 1, 0, 0 );
-o-transform: matrix( -0.6, 1, 0.6, 1, 0, 0 );
-ms-transform: matrix( -0.6, 1, 0.6, 1, 0, 0 );
transform: matrix( -0.6, 1, 0.6, 1, 0, 0 );
}
#adminmenu li.wp-not-current-submenu .wp-menu-arrow {
-webkit-transform: translate( 145px );
height: 28px;
border-width: 1px 0;
border-style: solid;
}
#adminmenu .wp-not-current-submenu .wp-menu-arrow div {
width: 15px;
top: 6px;
left: -2px;
border-width: 0 0 1px 1px;
border-style: solid;
}
.wp-menu-arrow,
.folded #adminmenu li.menu-top:hover .wp-menu-arrow {
display: none;
@@ -1811,12 +1852,6 @@ body.no-js #adminmenu .wp-menu-toggle,
z-index: 125;
}
#adminmenu .wp-menu-arrow div {
width: 15px;
height: 30px;
background: url(../images/menu-arrow-frame.png) top right no-repeat;
}
#adminmenu .wp-submenu li {
padding: 0;
margin: 0;