admin-menu.css 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944
  1. #adminmenuback,
  2. #adminmenuwrap,
  3. #adminmenu,
  4. #adminmenu .wp-submenu {
  5. width: 160px;
  6. background-color: #1d2327;
  7. }
  8. #adminmenuback {
  9. position: fixed;
  10. top: 0;
  11. bottom: -120px;
  12. z-index: 1; /* positive z-index to avoid elastic scrolling woes in Safari */
  13. }
  14. .php-error #adminmenuback {
  15. position: absolute;
  16. }
  17. .php-error #adminmenuback,
  18. .php-error #adminmenuwrap {
  19. margin-top: 2em;
  20. }
  21. #adminmenu {
  22. clear: left;
  23. margin: 12px 0;
  24. padding: 0;
  25. list-style: none;
  26. }
  27. .folded #adminmenuback,
  28. .folded #adminmenuwrap,
  29. .folded #adminmenu,
  30. .folded #adminmenu li.menu-top {
  31. width: 36px;
  32. }
  33. .icon16 {
  34. height: 18px;
  35. width: 18px;
  36. padding: 6px;
  37. margin: -6px 0 0 -8px;
  38. float: left;
  39. }
  40. /* New Menu icons */
  41. .icon16:before {
  42. color: #8c8f94; /* same as new icons */
  43. font: normal 20px/1 dashicons;
  44. speak: never;
  45. padding: 6px 0;
  46. height: 34px;
  47. width: 20px;
  48. display: inline-block;
  49. -webkit-font-smoothing: antialiased;
  50. -moz-osx-font-smoothing: grayscale;
  51. transition: all .1s ease-in-out;
  52. }
  53. .icon16.icon-dashboard:before {
  54. content: "\f226";
  55. }
  56. .icon16.icon-post:before {
  57. content: "\f109";
  58. }
  59. .icon16.icon-media:before {
  60. content: "\f104";
  61. }
  62. .icon16.icon-links:before {
  63. content: "\f103";
  64. }
  65. .icon16.icon-page:before {
  66. content: "\f105";
  67. }
  68. .icon16.icon-comments:before {
  69. content: "\f101";
  70. margin-top: 1px;
  71. }
  72. .icon16.icon-appearance:before {
  73. content: "\f100";
  74. }
  75. .icon16.icon-plugins:before {
  76. content: "\f106";
  77. }
  78. .icon16.icon-users:before {
  79. content: "\f110";
  80. }
  81. .icon16.icon-tools:before {
  82. content: "\f107";
  83. }
  84. .icon16.icon-settings:before {
  85. content: "\f108";
  86. }
  87. .icon16.icon-site:before {
  88. content: "\f541";
  89. }
  90. .icon16.icon-generic:before {
  91. content: "\f111";
  92. }
  93. /* hide background-image for icons above */
  94. .icon16.icon-dashboard,
  95. .menu-icon-dashboard div.wp-menu-image,
  96. .icon16.icon-post,
  97. .menu-icon-post div.wp-menu-image,
  98. .icon16.icon-media,
  99. .menu-icon-media div.wp-menu-image,
  100. .icon16.icon-links,
  101. .menu-icon-links div.wp-menu-image,
  102. .icon16.icon-page,
  103. .menu-icon-page div.wp-menu-image,
  104. .icon16.icon-comments,
  105. .menu-icon-comments div.wp-menu-image,
  106. .icon16.icon-appearance,
  107. .menu-icon-appearance div.wp-menu-image,
  108. .icon16.icon-plugins,
  109. .menu-icon-plugins div.wp-menu-image,
  110. .icon16.icon-users,
  111. .menu-icon-users div.wp-menu-image,
  112. .icon16.icon-tools,
  113. .menu-icon-tools div.wp-menu-image,
  114. .icon16.icon-settings,
  115. .menu-icon-settings div.wp-menu-image,
  116. .icon16.icon-site,
  117. .menu-icon-site div.wp-menu-image,
  118. .icon16.icon-generic,
  119. .menu-icon-generic div.wp-menu-image {
  120. background-image: none !important;
  121. }
  122. /*------------------------------------------------------------------------------
  123. 7.0 - Main Navigation (Left Menu)
  124. ------------------------------------------------------------------------------*/
  125. #adminmenuwrap {
  126. position: relative;
  127. float: left;
  128. z-index: 9990;
  129. }
  130. /* side admin menu */
  131. #adminmenu * {
  132. -webkit-user-select: none;
  133. user-select: none;
  134. }
  135. #adminmenu li {
  136. margin: 0;
  137. padding: 0;
  138. }
  139. #adminmenu a {
  140. display: block;
  141. line-height: 1.3;
  142. padding: 2px 5px;
  143. color: #f0f0f1;
  144. }
  145. #adminmenu .wp-submenu a {
  146. color: #c3c4c7;
  147. color: rgba(240, 246, 252, 0.7);
  148. font-size: 13px;
  149. line-height: 1.4;
  150. margin: 0;
  151. padding: 5px 0;
  152. }
  153. #adminmenu .wp-submenu a:hover,
  154. #adminmenu .wp-submenu a:focus {
  155. background: none;
  156. }
  157. #adminmenu a:hover,
  158. #adminmenu li.menu-top > a:focus,
  159. #adminmenu .wp-submenu a:hover,
  160. #adminmenu .wp-submenu a:focus {
  161. color: #72aee6;
  162. }
  163. #adminmenu a:hover,
  164. #adminmenu a:focus,
  165. .folded #adminmenu .wp-submenu-head:hover {
  166. box-shadow: inset 4px 0 0 0 currentColor;
  167. transition: box-shadow .1s linear;
  168. }
  169. #adminmenu li.menu-top {
  170. border: none;
  171. min-height: 34px;
  172. position: relative;
  173. }
  174. #adminmenu .wp-submenu {
  175. list-style: none;
  176. position: absolute;
  177. top: -1000em;
  178. left: 160px;
  179. overflow: visible;
  180. word-wrap: break-word;
  181. padding: 7px 0 8px;
  182. z-index: 9999;
  183. background-color: #2c3338;
  184. box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
  185. }
  186. .js #adminmenu .sub-open,
  187. .js #adminmenu .opensub .wp-submenu,
  188. #adminmenu a.menu-top:focus + .wp-submenu,
  189. .no-js li.wp-has-submenu:hover .wp-submenu {
  190. top: -1px;
  191. }
  192. #adminmenu a.wp-has-current-submenu:focus + .wp-submenu {
  193. top: 0;
  194. }
  195. #adminmenu .wp-has-current-submenu .wp-submenu,
  196. .no-js li.wp-has-current-submenu:hover .wp-submenu,
  197. #adminmenu .wp-has-current-submenu .wp-submenu.sub-open,
  198. #adminmenu .wp-has-current-submenu.opensub .wp-submenu {
  199. position: relative;
  200. z-index: 3;
  201. top: auto;
  202. left: auto;
  203. right: auto;
  204. bottom: auto;
  205. border: 0 none;
  206. margin-top: 0;
  207. box-shadow: none;
  208. }
  209. .folded #adminmenu .wp-has-current-submenu .wp-submenu {
  210. box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
  211. }
  212. /* ensure that wp-submenu's box shadow doesn't appear on top of the focused menu item's background. */
  213. #adminmenu li.menu-top:hover,
  214. #adminmenu li.opensub > a.menu-top,
  215. #adminmenu li > a.menu-top:focus {
  216. position: relative;
  217. background-color: #1d2327;
  218. color: #72aee6;
  219. }
  220. .folded #adminmenu li.menu-top:hover,
  221. .folded #adminmenu li.opensub > a.menu-top,
  222. .folded #adminmenu li > a.menu-top:focus {
  223. z-index: 10000;
  224. }
  225. #adminmenu li.wp-has-current-submenu a.wp-has-current-submenu,
  226. #adminmenu li.current a.menu-top,
  227. #adminmenu .wp-menu-arrow,
  228. #adminmenu .wp-has-current-submenu .wp-submenu .wp-submenu-head,
  229. #adminmenu .wp-menu-arrow div {
  230. background: #2271b1;
  231. color: #fff;
  232. }
  233. .folded #adminmenu .wp-submenu.sub-open,
  234. .folded #adminmenu .opensub .wp-submenu,
  235. .folded #adminmenu .wp-has-current-submenu .wp-submenu.sub-open,
  236. .folded #adminmenu .wp-has-current-submenu.opensub .wp-submenu,
  237. .folded #adminmenu a.menu-top:focus + .wp-submenu,
  238. .folded #adminmenu .wp-has-current-submenu a.menu-top:focus + .wp-submenu,
  239. .no-js.folded #adminmenu .wp-has-submenu:hover .wp-submenu {
  240. top: 0;
  241. left: 36px;
  242. }
  243. .folded #adminmenu a.wp-has-current-submenu:focus + .wp-submenu,
  244. .folded #adminmenu .wp-has-current-submenu .wp-submenu {
  245. position: absolute;
  246. top: -1000em;
  247. }
  248. #adminmenu .wp-not-current-submenu .wp-submenu,
  249. .folded #adminmenu .wp-has-current-submenu .wp-submenu {
  250. min-width: 160px;
  251. width: auto;
  252. border-left: 5px solid transparent;
  253. }
  254. #adminmenu .wp-submenu li.current,
  255. #adminmenu .wp-submenu li.current a,
  256. #adminmenu .opensub .wp-submenu li.current a,
  257. #adminmenu a.wp-has-current-submenu:focus + .wp-submenu li.current a,
  258. #adminmenu .wp-submenu li.current a:hover,
  259. #adminmenu .wp-submenu li.current a:focus {
  260. color: #fff;
  261. }
  262. #adminmenu .wp-not-current-submenu li > a,
  263. .folded #adminmenu .wp-has-current-submenu li > a {
  264. padding-right: 16px;
  265. padding-left: 14px;
  266. /* Exclude from the transition the outline for Windows High Contrast mode */
  267. transition: all .1s ease-in-out, outline 0s;
  268. }
  269. #adminmenu .wp-has-current-submenu ul > li > a,
  270. .folded #adminmenu li.menu-top .wp-submenu > li > a {
  271. padding: 5px 12px;
  272. }
  273. #adminmenu a.menu-top,
  274. #adminmenu .wp-submenu-head {
  275. font-size: 14px;
  276. font-weight: 400;
  277. line-height: 1.3;
  278. padding: 0;
  279. }
  280. #adminmenu .wp-submenu-head {
  281. display: none;
  282. }
  283. .folded #adminmenu .wp-menu-name {
  284. position: absolute;
  285. left: -999px;
  286. }
  287. .folded #adminmenu .wp-submenu-head {
  288. display: block;
  289. }
  290. #adminmenu .wp-submenu li {
  291. padding: 0;
  292. margin: 0;
  293. }
  294. #adminmenu .wp-menu-image img {
  295. padding: 9px 0 0;
  296. opacity: 0.6;
  297. filter: alpha(opacity=60);
  298. }
  299. #adminmenu div.wp-menu-name {
  300. padding: 8px 8px 8px 36px;
  301. overflow-wrap: break-word;
  302. word-wrap: break-word;
  303. -ms-word-break: break-all;
  304. word-break: break-word;
  305. -webkit-hyphens: auto;
  306. hyphens: auto;
  307. }
  308. #adminmenu div.wp-menu-image {
  309. float: left;
  310. width: 36px;
  311. height: 34px;
  312. margin: 0;
  313. text-align: center;
  314. }
  315. #adminmenu div.wp-menu-image.svg {
  316. background-repeat: no-repeat;
  317. background-position: center;
  318. background-size: 20px auto;
  319. }
  320. div.wp-menu-image:before {
  321. color: #a7aaad;
  322. color: rgba(240, 246, 252, 0.6);
  323. padding: 7px 0;
  324. transition: all .1s ease-in-out;
  325. }
  326. #adminmenu div.wp-menu-image:before {
  327. color: #a7aaad;
  328. color: rgba(240, 246, 252, 0.6);
  329. }
  330. #adminmenu li.wp-has-current-submenu:hover div.wp-menu-image:before,
  331. #adminmenu .wp-has-current-submenu div.wp-menu-image:before,
  332. #adminmenu .current div.wp-menu-image:before,
  333. #adminmenu a.wp-has-current-submenu:hover div.wp-menu-image:before,
  334. #adminmenu a.current:hover div.wp-menu-image:before,
  335. #adminmenu li.wp-has-current-submenu a:focus div.wp-menu-image:before,
  336. #adminmenu li.wp-has-current-submenu.opensub div.wp-menu-image:before {
  337. color: #fff;
  338. }
  339. #adminmenu li:hover div.wp-menu-image:before,
  340. #adminmenu li a:focus div.wp-menu-image:before,
  341. #adminmenu li.opensub div.wp-menu-image:before {
  342. color: #72aee6;
  343. }
  344. .folded #adminmenu div.wp-menu-image {
  345. width: 35px;
  346. height: 30px;
  347. position: absolute;
  348. z-index: 25;
  349. }
  350. .folded #adminmenu a.menu-top {
  351. height: 34px;
  352. }
  353. /* Sticky admin menu */
  354. .sticky-menu #adminmenuwrap {
  355. position: fixed;
  356. }
  357. /* A new arrow */
  358. .wp-menu-arrow {
  359. display: none !important;
  360. }
  361. ul#adminmenu a.wp-has-current-submenu {
  362. position: relative;
  363. }
  364. ul#adminmenu a.wp-has-current-submenu:after,
  365. ul#adminmenu > li.current > a.current:after {
  366. right: 0;
  367. border: solid 8px transparent;
  368. content: " ";
  369. height: 0;
  370. width: 0;
  371. position: absolute;
  372. pointer-events: none;
  373. border-right-color: #f0f0f1;
  374. top: 50%;
  375. margin-top: -8px;
  376. }
  377. .folded ul#adminmenu li:hover a.wp-has-current-submenu:after,
  378. .folded ul#adminmenu li.wp-has-current-submenu:focus-within a.wp-has-current-submenu:after {
  379. display: none;
  380. }
  381. .folded ul#adminmenu a.wp-has-current-submenu:after,
  382. .folded ul#adminmenu > li a.current:after {
  383. border-width: 4px;
  384. margin-top: -4px;
  385. }
  386. /* flyout menu arrow */
  387. #adminmenu li.wp-has-submenu.wp-not-current-submenu:hover:after,
  388. #adminmenu li.wp-has-submenu.wp-not-current-submenu:focus-within:after {
  389. right: 0;
  390. border: 8px solid transparent;
  391. content: " ";
  392. height: 0;
  393. width: 0;
  394. position: absolute;
  395. pointer-events: none;
  396. top: 10px;
  397. z-index: 10000;
  398. }
  399. .folded ul#adminmenu li.wp-has-submenu.wp-not-current-submenu:hover:after,
  400. .folded ul#adminmenu li.wp-has-submenu.wp-not-current-submenu:focus-within:after {
  401. border-width: 4px;
  402. margin-top: -4px;
  403. top: 18px;
  404. }
  405. #adminmenu li.wp-has-submenu.wp-not-current-submenu.opensub:hover:after,
  406. #adminmenu li.wp-has-submenu.wp-not-current-submenu:focus-within:after {
  407. border-right-color: #2c3338;
  408. }
  409. #adminmenu li.menu-top:hover .wp-menu-image img,
  410. #adminmenu li.wp-has-current-submenu .wp-menu-image img {
  411. opacity: 1;
  412. filter: alpha(opacity=100);
  413. }
  414. #adminmenu li.wp-menu-separator {
  415. height: 5px;
  416. padding: 0;
  417. margin: 0 0 6px;
  418. cursor: inherit;
  419. }
  420. /* @todo: is this even needed given that it's nested beneath the above li.wp-menu-separator? */
  421. #adminmenu div.separator {
  422. height: 2px;
  423. padding: 0;
  424. }
  425. #adminmenu .wp-submenu .wp-submenu-head {
  426. color: #fff;
  427. font-weight: 400;
  428. font-size: 14px;
  429. padding: 5px 4px 5px 11px;
  430. margin: -7px 0 4px -5px;
  431. border-width: 3px 0 3px 5px;
  432. border-style: solid;
  433. border-color: transparent;
  434. }
  435. #adminmenu li.current,
  436. .folded #adminmenu li.wp-menu-open {
  437. border: 0 none;
  438. }
  439. /* @todo: consider to use a single rule for these counters and the list table comments counters. */
  440. #adminmenu .awaiting-mod,
  441. #adminmenu .update-plugins {
  442. display: inline-block;
  443. vertical-align: top;
  444. box-sizing: border-box;
  445. margin: 1px 0 -1px 2px;
  446. padding: 0 5px;
  447. min-width: 18px;
  448. height: 18px;
  449. border-radius: 9px;
  450. background-color: #d63638;
  451. color: #fff;
  452. font-size: 11px;
  453. line-height: 1.6;
  454. text-align: center;
  455. z-index: 26;
  456. }
  457. #adminmenu li.current a .awaiting-mod,
  458. #adminmenu li a.wp-has-current-submenu .update-plugins {
  459. background-color: #d63638;
  460. color: #fff;
  461. }
  462. #adminmenu li span.count-0 {
  463. display: none;
  464. }
  465. #collapse-button {
  466. display: block;
  467. width: 100%;
  468. height: 34px;
  469. margin: 0;
  470. border: none;
  471. padding: 0;
  472. position: relative;
  473. overflow: visible;
  474. background: none;
  475. color: #a7aaad;
  476. cursor: pointer;
  477. }
  478. #collapse-button:hover {
  479. color: #72aee6;
  480. }
  481. #collapse-button:focus {
  482. color: #72aee6;
  483. /* Only visible in Windows High Contrast mode */
  484. outline: 1px solid transparent;
  485. outline-offset: -1px;
  486. }
  487. #collapse-button .collapse-button-icon,
  488. #collapse-button .collapse-button-label {
  489. /* absolutely positioned to avoid 1px shift in IE when button is pressed */
  490. display: block;
  491. position: absolute;
  492. top: 0;
  493. left: 0;
  494. }
  495. #collapse-button .collapse-button-label {
  496. top: 8px;
  497. }
  498. #collapse-button .collapse-button-icon {
  499. width: 36px;
  500. height: 34px;
  501. }
  502. #collapse-button .collapse-button-label {
  503. padding: 0 0 0 36px;
  504. }
  505. .folded #collapse-button .collapse-button-label {
  506. display: none;
  507. }
  508. #collapse-button .collapse-button-icon:after {
  509. content: "\f148";
  510. display: block;
  511. position: relative;
  512. top: 7px;
  513. text-align: center;
  514. font: normal 20px/1 dashicons !important;
  515. speak: never;
  516. -webkit-font-smoothing: antialiased;
  517. -moz-osx-font-smoothing: grayscale;
  518. }
  519. /* rtl:ignore */
  520. .folded #collapse-button .collapse-button-icon:after,
  521. .rtl #collapse-button .collapse-button-icon:after {
  522. transform: rotate(180deg);
  523. }
  524. .rtl.folded #collapse-button .collapse-button-icon:after {
  525. transform: none;
  526. }
  527. #collapse-button .collapse-button-icon:after,
  528. #collapse-button .collapse-button-label {
  529. transition: all .1s ease-in-out;
  530. }
  531. /**
  532. * Toolbar menu toggle
  533. */
  534. li#wp-admin-bar-menu-toggle {
  535. display: none;
  536. }
  537. /* Hide-if-customize for items we can't add classes to */
  538. .customize-support #menu-appearance a[href="themes.php?page=custom-header"],
  539. .customize-support #menu-appearance a[href="themes.php?page=custom-background"] {
  540. display: none;
  541. }
  542. /* Auto-folding of the admin menu */
  543. @media only screen and (max-width: 960px) {
  544. .auto-fold #wpcontent,
  545. .auto-fold #wpfooter {
  546. margin-left: 36px;
  547. }
  548. .auto-fold #adminmenuback,
  549. .auto-fold #adminmenuwrap,
  550. .auto-fold #adminmenu,
  551. .auto-fold #adminmenu li.menu-top {
  552. width: 36px;
  553. }
  554. .auto-fold #adminmenu .wp-submenu.sub-open,
  555. .auto-fold #adminmenu .opensub .wp-submenu,
  556. .auto-fold #adminmenu .wp-has-current-submenu .wp-submenu.sub-open,
  557. .auto-fold #adminmenu .wp-has-current-submenu.opensub .wp-submenu,
  558. .auto-fold #adminmenu a.menu-top:focus + .wp-submenu,
  559. .auto-fold #adminmenu .wp-has-current-submenu a.menu-top:focus + .wp-submenu {
  560. top: 0;
  561. left: 36px;
  562. }
  563. .auto-fold #adminmenu a.wp-has-current-submenu:focus + .wp-submenu,
  564. .auto-fold #adminmenu .wp-has-current-submenu .wp-submenu {
  565. position: absolute;
  566. top: -1000em;
  567. margin-right: -1px;
  568. padding: 7px 0 8px;
  569. z-index: 9999;
  570. }
  571. .auto-fold #adminmenu .wp-has-current-submenu .wp-submenu {
  572. min-width: 150px;
  573. width: auto;
  574. }
  575. .auto-fold #adminmenu .wp-has-current-submenu li > a {
  576. padding-right: 16px;
  577. padding-left: 14px;
  578. }
  579. .auto-fold #adminmenu li.menu-top .wp-submenu > li > a {
  580. padding-left: 12px;
  581. }
  582. .auto-fold #adminmenu .wp-menu-name {
  583. position: absolute;
  584. left: -999px;
  585. }
  586. .auto-fold #adminmenu .wp-submenu-head {
  587. display: block;
  588. }
  589. .auto-fold #adminmenu div.wp-menu-image {
  590. height: 30px;
  591. width: 34px;
  592. position: absolute;
  593. z-index: 25;
  594. }
  595. .auto-fold #adminmenu a.menu-top {
  596. min-height: 34px;
  597. }
  598. .auto-fold #adminmenu li.wp-menu-open {
  599. border: 0 none;
  600. }
  601. .auto-fold #adminmenu .wp-has-current-submenu.menu-top-last {
  602. margin-bottom: 0;
  603. }
  604. .auto-fold ul#adminmenu li:hover a.wp-has-current-submenu:after,
  605. .auto-fold ul#adminmenu li:focus-within a.wp-has-current-submenu:after {
  606. display: none;
  607. }
  608. .auto-fold ul#adminmenu li.wp-has-submenu.wp-not-current-submenu:hover:after,
  609. .auto-fold ul#adminmenu li.wp-has-submenu.wp-not-current-submenu:focus-within:after {
  610. border-width: 4px;
  611. margin-top: -4px;
  612. top: 16px;
  613. }
  614. .auto-fold ul#adminmenu a.wp-has-current-submenu:after,
  615. .auto-fold ul#adminmenu > li a.current:after {
  616. border-width: 4px;
  617. margin-top: -4px;
  618. }
  619. .auto-fold #adminmenu li.menu-top:hover,
  620. .auto-fold #adminmenu li.opensub > a.menu-top,
  621. .auto-fold #adminmenu li > a.menu-top:focus {
  622. z-index: 10000;
  623. }
  624. .auto-fold #collapse-menu .collapse-button-label {
  625. display: none;
  626. }
  627. /* rtl:ignore */
  628. .auto-fold #collapse-button .collapse-button-icon:after {
  629. transform: rotate(180deg);
  630. }
  631. .rtl.auto-fold #collapse-button .collapse-button-icon:after {
  632. transform: none;
  633. }
  634. }
  635. @media screen and (max-width: 782px) {
  636. .auto-fold #wpcontent {
  637. position: relative;
  638. margin-left: 0;
  639. padding-left: 10px;
  640. }
  641. .sticky-menu #adminmenuwrap {
  642. position: relative;
  643. z-index: auto;
  644. top: 0;
  645. }
  646. /* Sidebar Adjustments */
  647. .auto-fold #adminmenu,
  648. .auto-fold #adminmenuback,
  649. .auto-fold #adminmenuwrap {
  650. position: absolute;
  651. width: 190px;
  652. z-index: 100;
  653. }
  654. .auto-fold #adminmenuback {
  655. position: fixed;
  656. }
  657. .auto-fold #adminmenuback,
  658. .auto-fold #adminmenuwrap {
  659. display: none;
  660. }
  661. .auto-fold .wp-responsive-open #adminmenuback,
  662. .auto-fold .wp-responsive-open #adminmenuwrap {
  663. display: block;
  664. }
  665. .auto-fold #adminmenu li.menu-top {
  666. width: 100%;
  667. }
  668. /* Resize the admin menu items to a comfortable touch size */
  669. .auto-fold #adminmenu li a {
  670. font-size: 16px;
  671. padding: 5px;
  672. }
  673. .auto-fold #adminmenu li.menu-top .wp-submenu > li > a {
  674. padding: 10px 10px 10px 20px;
  675. }
  676. /* Restore the menu names */
  677. .auto-fold #adminmenu .wp-menu-name {
  678. position: static;
  679. }
  680. /* Switch the arrow side */
  681. .auto-fold ul#adminmenu a.wp-has-current-submenu:after,
  682. .auto-fold ul#adminmenu > li.current > a.current:after {
  683. border-width: 8px;
  684. margin-top: -8px;
  685. }
  686. .auto-fold ul#adminmenu li.wp-has-submenu.wp-not-current-submenu:hover:after,
  687. .auto-fold ul#adminmenu li.wp-has-submenu.wp-not-current-submenu:focus-within:after {
  688. display: none;
  689. }
  690. /* Make the submenus appear correctly when tapped. */
  691. #adminmenu .wp-submenu {
  692. position: relative;
  693. display: none;
  694. }
  695. .auto-fold #adminmenu .selected .wp-submenu,
  696. .auto-fold #adminmenu .wp-menu-open .wp-submenu {
  697. position: relative;
  698. display: block;
  699. top: 0;
  700. left: -1px;
  701. box-shadow: none;
  702. }
  703. .auto-fold #adminmenu .selected .wp-submenu:after,
  704. .auto-fold #adminmenu .wp-menu-open .wp-submenu:after {
  705. display: none;
  706. }
  707. .auto-fold #adminmenu .opensub .wp-submenu {
  708. display: none;
  709. }
  710. .auto-fold #adminmenu .selected .wp-submenu {
  711. display: block;
  712. }
  713. .auto-fold ul#adminmenu li:hover a.wp-has-current-submenu:after,
  714. .auto-fold ul#adminmenu li:focus-within a.wp-has-current-submenu:after {
  715. display: block;
  716. }
  717. .auto-fold #adminmenu a.menu-top:focus + .wp-submenu,
  718. .auto-fold #adminmenu .wp-has-current-submenu a.menu-top:focus + .wp-submenu {
  719. position: relative;
  720. left: -1px;
  721. right: 0;
  722. top: 0;
  723. }
  724. #adminmenu .wp-not-current-submenu .wp-submenu,
  725. .folded #adminmenu .wp-has-current-submenu .wp-submenu {
  726. border-left: none;
  727. }
  728. /* Remove submenu headers and adjust sub meu*/
  729. #adminmenu .wp-submenu .wp-submenu-head {
  730. display: none;
  731. }
  732. /* Toolbar menu toggle */
  733. #wp-responsive-toggle {
  734. position: fixed;
  735. top: 5px;
  736. left: 4px;
  737. padding-right: 10px;
  738. z-index: 99999;
  739. border: none;
  740. box-sizing: border-box;
  741. }
  742. #wpadminbar #wp-admin-bar-menu-toggle a {
  743. display: block;
  744. padding: 0;
  745. overflow: hidden;
  746. outline: none;
  747. text-decoration: none;
  748. border: 1px solid transparent;
  749. background: none;
  750. height: 44px;
  751. margin-left: -1px;
  752. }
  753. .wp-responsive-open #wpadminbar #wp-admin-bar-menu-toggle a {
  754. background: #2c3338;
  755. }
  756. li#wp-admin-bar-menu-toggle {
  757. display: block;
  758. }
  759. #wpadminbar #wp-admin-bar-menu-toggle a:hover {
  760. border: 1px solid transparent;
  761. }
  762. #wpadminbar #wp-admin-bar-menu-toggle .ab-icon:before {
  763. content: "\f228";
  764. display: inline-block;
  765. float: left;
  766. font: normal 40px/45px dashicons;
  767. vertical-align: middle;
  768. outline: none;
  769. margin: 0;
  770. -webkit-font-smoothing: antialiased;
  771. -moz-osx-font-smoothing: grayscale;
  772. height: 44px;
  773. width: 50px;
  774. padding: 0;
  775. border: none;
  776. text-align: center;
  777. text-decoration: none;
  778. box-sizing: border-box;
  779. }
  780. .wp-responsive-open #wpadminbar #wp-admin-bar-menu-toggle .ab-icon:before {
  781. color: #72aee6;
  782. }
  783. }
  784. /* Smartphone */
  785. @media screen and (max-width: 600px) {
  786. #adminmenuwrap,
  787. #adminmenuback {
  788. display: none;
  789. }
  790. .wp-responsive-open #adminmenuwrap,
  791. .wp-responsive-open #adminmenuback {
  792. display: block;
  793. }
  794. .auto-fold #adminmenu {
  795. top: 46px;
  796. }
  797. }