Switch admin menus to flyouts from dropdowns. First pass, see #18382.
git-svn-id: http://svn.automattic.com/wordpress/trunk@18621 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
File diff suppressed because one or more lines are too long
@@ -1,7 +1,7 @@
|
||||
/*------------------------------------------------------------------------------
|
||||
|
||||
|
||||
Howdy! This is the CSS file that controls the
|
||||
Howdy! This is the CSS file that controls the
|
||||
Gray (fresh) color style on the WordPress Dashboard.
|
||||
|
||||
This file contains both LTR and RTL styles.
|
||||
@@ -952,11 +952,27 @@ table.widefat .spam a:hover,
|
||||
border-color: #dfdfdf;
|
||||
}
|
||||
|
||||
.expanded #adminmenu li.wp-not-current-submenu:hover a.menu-top,
|
||||
.expanded #adminmenu li.wp-not-current-submenu:hover .wp-menu-arrow {
|
||||
background-color: #eee; /* Fallback */
|
||||
background-image: -ms-linear-gradient(bottom, #ccc, #eee); /* IE10 */
|
||||
background-image: -moz-linear-gradient(bottom, #ccc, #eee); /* Firefox */
|
||||
background-image: -o-linear-gradient(bottom, #ccc, #eee); /* Opera */
|
||||
background-image: -webkit-gradient(linear, left bottom, left top, from(#ccc), to(#eee)); /* old Webkit */
|
||||
background-image: -webkit-linear-gradient(bottom, #ccc, #e4e4e4); /* new Webkit */
|
||||
background-image: linear-gradient(bottom, #ccc, #eee); /* proposed W3C Markup */
|
||||
border-top-color: #e4e4e4;
|
||||
border-bottom-color: #ccc;
|
||||
text-shadow: 0 1px 0 rgba( 255, 255, 255, 0.4 );
|
||||
color: #d54e21;
|
||||
}
|
||||
|
||||
#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-menu-arrow,
|
||||
#adminmenu .current .wp-menu-arrow,
|
||||
#adminmenu .wp-has-current-submenu .wp-submenu .wp-submenu-head {
|
||||
background-color: #777; /* Fallback */
|
||||
background-image: -ms-linear-gradient(bottom, #6d6d6d, #808080); /* IE10 */
|
||||
@@ -967,6 +983,16 @@ table.widefat .spam a:hover,
|
||||
background-image: linear-gradient(bottom, #6d6d6d, #808080); /* proposed W3C Markup */
|
||||
}
|
||||
|
||||
.expanded #adminmenu li.wp-not-current-submenu li:hover a {
|
||||
background-color: #eaf2fa; /* Fallback */
|
||||
background-image: -ms-linear-gradient(left, #fff, #eaf2fa 30px); /* IE10 */
|
||||
background-image: -moz-linear-gradient(left, #fff, #eaf2fa 30px); /* Firefox */
|
||||
background-image: -o-linear-gradient(left, #fff, #eaf2fa 30px); /* Opera */
|
||||
background-image: -webkit-gradient(linear, left bottom, right bottom, from(#fff), color-stop(0.1, #eaf2fa)); /* old Webkit */
|
||||
background-image: -webkit-linear-gradient(left, #fff, #eaf2fa 30px); /* new Webkit */
|
||||
background-image: linear-gradient(left, #fff, #eaf2fa 30px); /* proposed W3C Markup */
|
||||
}
|
||||
|
||||
#adminmenu li.wp-has-current-submenu a.wp-has-current-submenu,
|
||||
#adminmenu li.current a.menu-top,
|
||||
#adminmenu .wp-has-current-submenu .wp-submenu .wp-submenu-head {
|
||||
@@ -997,12 +1023,12 @@ table.widefat .spam a:hover,
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.folded #adminmenu .wp-submenu-wrap,
|
||||
.folded #adminmenu .wp-submenu ul {
|
||||
#adminmenu .wp-submenu-wrap,
|
||||
#adminmenu .wp-submenu ul {
|
||||
border-color: #dfdfdf;
|
||||
}
|
||||
|
||||
.folded #adminmenu .wp-submenu-wrap {
|
||||
#adminmenu .wp-submenu-wrap {
|
||||
-moz-box-shadow: 2px 2px 5px rgba( 0, 0, 0, 0.4 );
|
||||
-webkit-box-shadow: 2px 2px 5px rgba( 0, 0, 0, 0.4 );
|
||||
box-shadow: 2px 2px 5px rgba( 0, 0, 0, 0.4 );
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -77,8 +77,9 @@ TABLE OF CONTENTS:
|
||||
#adminmenuback,
|
||||
#adminmenuwrap,
|
||||
#adminmenu,
|
||||
.js.folded #adminmenu .wp-submenu.sub-open,
|
||||
.js.folded #adminmenu .wp-submenu-wrap {
|
||||
.js #adminmenu .wp-submenu.sub-open,
|
||||
.js #adminmenu .wp-submenu-wrap,
|
||||
.folded #adminmenu .wp-has-current-submenu .wp-submenu.sub-open {
|
||||
width: 145px;
|
||||
}
|
||||
|
||||
@@ -1696,12 +1697,50 @@ form.upgrade .hint {
|
||||
}
|
||||
|
||||
#adminmenu .wp-submenu {
|
||||
display: none;
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#adminmenu .wp-not-current-submenu .wp-submenu,
|
||||
.folded #adminmenu .wp-has-current-submenu .wp-submenu {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: -1px;
|
||||
left: 146px;
|
||||
z-index: 999;
|
||||
width: 0;
|
||||
overflow: hidden;
|
||||
-moz-transition: width 200ms ease-out;
|
||||
-webkit-transition: width 200ms ease-out;
|
||||
-o-transition: width 200ms ease-out;
|
||||
transition: width 200ms ease-out;
|
||||
}
|
||||
|
||||
.expanded #adminmenu .wp-has-current-submenu .wp-submenu {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
width: 145px;
|
||||
top: auto;
|
||||
left: auto;
|
||||
right: auto;
|
||||
bottom: auto;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.expanded #adminmenu .wp-has-current-submenu .wp-submenu-wrap {
|
||||
-moz-box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.js.folded #adminmenu .wp-submenu {
|
||||
top: -5px;
|
||||
left: 26px;
|
||||
}
|
||||
.js #adminmenu .wp-submenu.sub-open {
|
||||
padding: 0 8px 8px 0;
|
||||
}
|
||||
|
||||
#adminmenu .wp-submenu a {
|
||||
@@ -1786,11 +1825,20 @@ body.no-js #adminmenu li.wp-has-current-submenu .wp-submenu {
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
.expanded #adminmenu li.wp-not-current-submenu li {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.expanded #adminmenu li.wp-not-current-submenu li a {
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
.wp-menu-arrow {
|
||||
display: none;
|
||||
}
|
||||
#adminmenu li.wp-has-current-submenu .wp-menu-arrow,
|
||||
#adminmenu li.menu-top.current .wp-menu-arrow {
|
||||
#adminmenu li.menu-top.current .wp-menu-arrow,
|
||||
.expanded #adminmenu li.wp-has-submenu:hover .wp-menu-arrow {
|
||||
display: block;
|
||||
position: absolute;
|
||||
right: -9px;
|
||||
@@ -1798,6 +1846,11 @@ body.no-js #adminmenu li.wp-has-current-submenu .wp-submenu {
|
||||
cursor: auto;
|
||||
z-index: 25;
|
||||
}
|
||||
|
||||
.expanded #adminmenu li.menu-top:hover .wp-menu-arrow {
|
||||
z-index: 1500;
|
||||
}
|
||||
|
||||
#adminmenu .wp-menu-arrow div {
|
||||
width: 15px;
|
||||
height: 30px;
|
||||
@@ -1845,24 +1898,6 @@ body.no-js #adminmenu li.wp-has-current-submenu .wp-submenu {
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
.js.folded #adminmenu .wp-submenu {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
left: 26px;
|
||||
z-index: 999;
|
||||
width: 0;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
-moz-transition: width 200ms ease-out;
|
||||
-webkit-transition: width 200ms ease-out;
|
||||
-o-transition: width 200ms ease-out;
|
||||
transition: width 200ms ease-out;
|
||||
}
|
||||
.js.folded #adminmenu .wp-submenu.sub-open {
|
||||
padding: 0 8px 8px 0;
|
||||
}
|
||||
|
||||
#adminmenu .wp-submenu .wp-submenu-head {
|
||||
padding: 6px 4px 5px 10px;
|
||||
cursor: default;
|
||||
@@ -1870,9 +1905,8 @@ body.no-js #adminmenu li.wp-has-current-submenu .wp-submenu {
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
.js.folded #adminmenu .wp-submenu-wrap {
|
||||
margin-top: 4px;
|
||||
border-width: 0 1px 1px 0;
|
||||
.js #adminmenu .wp-not-current-submenu .wp-submenu-wrap {
|
||||
border-width: 1px 1px 1px 0;
|
||||
border-style: solid;
|
||||
position: relative;
|
||||
-webkit-border-bottom-right-radius: 3px;
|
||||
@@ -1885,6 +1919,11 @@ body.no-js #adminmenu li.wp-has-current-submenu .wp-submenu {
|
||||
border-top-right-radius: 3px;
|
||||
}
|
||||
|
||||
.js.folded #adminmenu .wp-submenu .wp-submenu-wrap {
|
||||
margin-top: 4px;
|
||||
border-width: 0 1px 1px 0;
|
||||
}
|
||||
|
||||
.js.folded #adminmenu .wp-submenu ul {
|
||||
border-width: 0 0 0 1px;
|
||||
border-style: solid;
|
||||
|
||||
Reference in New Issue
Block a user