admin.css 2.81 KB
Newer Older
imac's avatar
imac committed
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125
/**
 * Miscellaneous menu styles that can be used on all admin pages.
 */

/*
 * Submenu separators.
 */
hr.ws-submenu-separator {
	display: block;
	margin: 2px 0;
	padding: 0;
    height: 0;

    border-width: 1px 0 0 0;
	border-style: solid;
	border-color: #ccc;
}

/* Custom separator style suggested by a customer (Slavo) */
/*
#adminmenu .ws-submenu-separator {
	border-bottom: none;
	border-top: 1px dotted rgba(0,0,0,.3);
	width: 90%;
}
*/

/* S2Member separator style */
/*
#adminmenu .ws-submenu-separator {
	display: block;
	border: 0;
	margin: 1px 0 1px -5px;
	padding: 0;
	height: 1px;
	line-height: 1px;
	background: #CCCCCC;
}
*/

/* Override .wp-menu-separator styles as they don't work too well in submenus. */
#adminmenu .wp-submenu li.ws-submenu-separator-wrap {
	margin: 0 0 0 0;
	padding: 0;
	height: inherit;
}

/* No pointer/hand on separators. */
#adminmenu li.ws-submenu-separator-wrap a {
	cursor: default;
}

/* No extra margin in submenus with icons. The selector uses the URL prefix because we can't control the link class.
 * li.ws-submenu-separator-wrap would also work, but it's added via JS so there's an undesirable delay (FOUC).
 */
#adminmenu .ame-has-submenu-icons ul.wp-submenu li a[href^="#submenu-separator-"] {
    margin-left: 0;
}


/*
 * Submenu icons.
 */
.ame-submenu-icon {
    display: inline-block;
    padding-right: 8px;
    min-width: 20px;

    /*
    Dashicons are 20x20 by default and some of them look pretty bad at smaller sizes. Submenu item titles are 16px high
    by default. So lets hack some negative margins to make a 20px icon fit in 16px. With the current admin UI styles
    it looks okay - submenu items are ~28px high when including padding/margins, so there's no visual overlap.
     */
    height: 20px;
    margin-top: -2px;
    margin-bottom: -2px;

    vertical-align: top;

    margin-left: -28px;
    float: left;

    /* Center image-based icons. Doesn't matter for dashicons. */
    text-align: center;
}

#adminmenu .ame-has-submenu-icons ul.wp-submenu li a {
    /* Push all submenus to the right to ensure that items with and without icons line up nicely. */
    margin-left: 24px;
}

#adminmenu .ame-submenu-icon img {
    padding-top: 2px;

    opacity: 0.6;
    filter: alpha(opacity=60);
}

#adminmenu .wp-submenu li:hover .ame-submenu-icon img,
#adminmenu .wp-submenu li.current .ame-submenu-icon img {
    opacity: 1;
    filter: alpha(opacity=100);
}

/*
 * Third level menus.
 */
#adminmenu .ame-deep-submenu {

}

#adminmenu li.menu-top.opensub .ame-deep-submenu {
	top: -1000em;
}

#adminmenu .wp-submenu li.opensub > ul.ame-deep-submenu {
	top: -7px;
}

.folded #adminmenu li.opensub > ul.ame-deep-submenu,
.folded #adminmenu .wp-has-current-submenu.opensub > ul.ame-deep-submenu,
.no-js.folded #adminmenu .ame-has-deep-submenu:hover > ul.ame-deep-submenu {
    top: 0;
    left: 160px;
}