Нет описания

admin-bar.css 23KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093
  1. #wpadminbar * {
  2. height: auto;
  3. width: auto;
  4. margin: 0;
  5. padding: 0;
  6. position: static;
  7. text-shadow: none;
  8. text-transform: none;
  9. letter-spacing: normal;
  10. font-size: 13px;
  11. font-weight: 400;
  12. font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  13. line-height: 2.46153846;
  14. border-radius: 0;
  15. box-sizing: content-box;
  16. transition: none;
  17. -webkit-font-smoothing: subpixel-antialiased; /* Prevent Safari from switching to standard antialiasing on hover */
  18. -moz-osx-font-smoothing: auto; /* Prevent Firefox from inheriting from themes that use other values */
  19. }
  20. .rtl #wpadminbar * {
  21. font-family: Tahoma, sans-serif;
  22. }
  23. html:lang(he-il) .rtl #wpadminbar * {
  24. font-family: Arial, sans-serif;
  25. }
  26. #wpadminbar .ab-empty-item {
  27. cursor: default;
  28. }
  29. #wpadminbar .ab-empty-item,
  30. #wpadminbar a.ab-item,
  31. #wpadminbar > #wp-toolbar span.ab-label,
  32. #wpadminbar > #wp-toolbar span.noticon {
  33. color: #f0f0f1;
  34. }
  35. #wpadminbar #wp-admin-bar-site-name a.ab-item,
  36. #wpadminbar #wp-admin-bar-my-sites a.ab-item {
  37. white-space: nowrap;
  38. }
  39. #wpadminbar ul li:before,
  40. #wpadminbar ul li:after {
  41. content: normal;
  42. }
  43. #wpadminbar a,
  44. #wpadminbar a:hover,
  45. #wpadminbar a img,
  46. #wpadminbar a img:hover {
  47. border: none;
  48. text-decoration: none;
  49. background: none;
  50. box-shadow: none;
  51. }
  52. #wpadminbar a:focus,
  53. #wpadminbar a:active,
  54. #wpadminbar input[type="text"],
  55. #wpadminbar input[type="password"],
  56. #wpadminbar input[type="number"],
  57. #wpadminbar input[type="search"],
  58. #wpadminbar input[type="email"],
  59. #wpadminbar input[type="url"],
  60. #wpadminbar select,
  61. #wpadminbar textarea,
  62. #wpadminbar div {
  63. box-shadow: none;
  64. }
  65. #wpadminbar a:focus {
  66. /* Inherits transparent outline only visible in Windows High Contrast mode */
  67. outline-offset: -1px;
  68. }
  69. #wpadminbar {
  70. direction: ltr;
  71. color: #c3c4c7;
  72. font-size: 13px;
  73. font-weight: 400;
  74. font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  75. line-height: 2.46153846;
  76. height: 32px;
  77. position: fixed;
  78. top: 0;
  79. left: 0;
  80. width: 100%;
  81. min-width: 600px; /* match the min-width of the body in wp-admin/css/common.css */
  82. z-index: 99999;
  83. background: #1d2327;
  84. }
  85. #wpadminbar .ab-sub-wrapper,
  86. #wpadminbar ul,
  87. #wpadminbar ul li {
  88. background: none;
  89. clear: none;
  90. list-style: none;
  91. margin: 0;
  92. padding: 0;
  93. position: relative;
  94. text-indent: 0;
  95. z-index: 99999;
  96. }
  97. #wpadminbar ul#wp-admin-bar-root-default>li {
  98. margin-right: 0;
  99. }
  100. #wpadminbar .quicklinks ul {
  101. text-align: left;
  102. }
  103. #wpadminbar li {
  104. float: left;
  105. }
  106. #wpadminbar .ab-empty-item {
  107. outline: none;
  108. }
  109. #wpadminbar .quicklinks .ab-top-secondary > li {
  110. float: right;
  111. }
  112. #wpadminbar .quicklinks a,
  113. #wpadminbar .quicklinks .ab-empty-item,
  114. #wpadminbar .shortlink-input {
  115. height: 32px;
  116. display: block;
  117. padding: 0 10px;
  118. margin: 0;
  119. }
  120. #wpadminbar .quicklinks > ul > li > a {
  121. padding: 0 8px 0 7px;
  122. }
  123. #wpadminbar .menupop .ab-sub-wrapper,
  124. #wpadminbar .shortlink-input {
  125. margin: 0;
  126. padding: 0;
  127. box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
  128. background: #2c3338;
  129. display: none;
  130. position: absolute;
  131. float: none;
  132. }
  133. #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper {
  134. min-width: 100%;
  135. }
  136. #wpadminbar .ab-top-secondary .menupop .ab-sub-wrapper {
  137. right: 0;
  138. left: auto;
  139. }
  140. #wpadminbar .ab-submenu {
  141. padding: 6px 0;
  142. }
  143. #wpadminbar .selected .shortlink-input {
  144. display: block;
  145. }
  146. #wpadminbar .quicklinks .menupop ul li {
  147. float: none;
  148. }
  149. #wpadminbar .quicklinks .menupop ul li a strong {
  150. font-weight: 600;
  151. }
  152. #wpadminbar .quicklinks .menupop ul li .ab-item,
  153. #wpadminbar .quicklinks .menupop ul li a strong,
  154. #wpadminbar .quicklinks .menupop.hover ul li .ab-item,
  155. #wpadminbar.nojs .quicklinks .menupop:hover ul li .ab-item,
  156. #wpadminbar .shortlink-input {
  157. line-height: 2;
  158. height: 26px;
  159. white-space: nowrap;
  160. min-width: 140px;
  161. }
  162. #wpadminbar .shortlink-input {
  163. width: 200px;
  164. }
  165. #wpadminbar.nojs li:hover > .ab-sub-wrapper,
  166. #wpadminbar li.hover > .ab-sub-wrapper {
  167. display: block;
  168. }
  169. #wpadminbar .menupop li:hover > .ab-sub-wrapper,
  170. #wpadminbar .menupop li.hover > .ab-sub-wrapper {
  171. margin-left: 100%;
  172. margin-top: -32px;
  173. }
  174. #wpadminbar .ab-top-secondary .menupop li:hover > .ab-sub-wrapper,
  175. #wpadminbar .ab-top-secondary .menupop li.hover > .ab-sub-wrapper {
  176. margin-left: 0;
  177. left: inherit;
  178. right: 100%;
  179. }
  180. #wpadminbar:not(.mobile) .ab-top-menu > li > .ab-item:focus,
  181. #wpadminbar.nojq .quicklinks .ab-top-menu > li > .ab-item:focus,
  182. #wpadminbar:not(.mobile) .ab-top-menu > li:hover > .ab-item,
  183. #wpadminbar .ab-top-menu > li.hover > .ab-item {
  184. background: #2c3338;
  185. color: #72aee6;
  186. }
  187. #wpadminbar:not(.mobile) > #wp-toolbar li:hover span.ab-label,
  188. #wpadminbar > #wp-toolbar li.hover span.ab-label,
  189. #wpadminbar:not(.mobile) > #wp-toolbar a:focus span.ab-label {
  190. color: #72aee6;
  191. }
  192. #wpadminbar > #wp-toolbar > #wp-admin-bar-root-default .ab-icon,
  193. #wpadminbar .ab-icon,
  194. #wpadminbar .ab-item:before,
  195. .wp-admin-bar-arrow {
  196. position: relative;
  197. float: left;
  198. font: normal 20px/1 dashicons;
  199. speak: never;
  200. padding: 4px 0;
  201. -webkit-font-smoothing: antialiased;
  202. -moz-osx-font-smoothing: grayscale;
  203. background-image: none !important;
  204. margin-right: 6px;
  205. }
  206. #wpadminbar .ab-icon:before,
  207. #wpadminbar .ab-item:before,
  208. #wpadminbar #adminbarsearch:before {
  209. color: #a7aaad;
  210. color: rgba(240, 246, 252, 0.6);
  211. }
  212. #wpadminbar .ab-icon:before,
  213. #wpadminbar .ab-item:before,
  214. #wpadminbar #adminbarsearch:before {
  215. position: relative;
  216. transition: all .1s ease-in-out;
  217. }
  218. #wpadminbar .ab-label {
  219. display: inline-block;
  220. height: 32px;
  221. }
  222. #wpadminbar .ab-submenu .ab-item {
  223. color: #c3c4c7;
  224. color: rgba(240, 246, 252, 0.7);
  225. }
  226. #wpadminbar .quicklinks .menupop ul li a,
  227. #wpadminbar .quicklinks .menupop ul li a strong,
  228. #wpadminbar .quicklinks .menupop.hover ul li a,
  229. #wpadminbar.nojs .quicklinks .menupop:hover ul li a {
  230. color: #c3c4c7;
  231. color: rgba(240, 246, 252, 0.7);
  232. }
  233. #wpadminbar .quicklinks .menupop ul li a:hover,
  234. #wpadminbar .quicklinks .menupop ul li a:focus,
  235. #wpadminbar .quicklinks .menupop ul li a:hover strong,
  236. #wpadminbar .quicklinks .menupop ul li a:focus strong,
  237. #wpadminbar .quicklinks .ab-sub-wrapper .menupop.hover > a,
  238. #wpadminbar .quicklinks .menupop.hover ul li a:hover,
  239. #wpadminbar .quicklinks .menupop.hover ul li a:focus,
  240. #wpadminbar .quicklinks .menupop.hover ul li div[tabindex]:hover,
  241. #wpadminbar .quicklinks .menupop.hover ul li div[tabindex]:focus,
  242. #wpadminbar.nojs .quicklinks .menupop:hover ul li a:hover,
  243. #wpadminbar.nojs .quicklinks .menupop:hover ul li a:focus,
  244. #wpadminbar li:hover .ab-icon:before,
  245. #wpadminbar li:hover .ab-item:before,
  246. #wpadminbar li a:focus .ab-icon:before,
  247. #wpadminbar li .ab-item:focus:before,
  248. #wpadminbar li .ab-item:focus .ab-icon:before,
  249. #wpadminbar li.hover .ab-icon:before,
  250. #wpadminbar li.hover .ab-item:before,
  251. #wpadminbar li:hover #adminbarsearch:before,
  252. #wpadminbar li #adminbarsearch.adminbar-focused:before {
  253. color: #72aee6;
  254. }
  255. #wpadminbar.mobile .quicklinks .ab-icon:before,
  256. #wpadminbar.mobile .quicklinks .ab-item:before {
  257. color: #c3c4c7;
  258. }
  259. #wpadminbar.mobile .quicklinks .hover .ab-icon:before,
  260. #wpadminbar.mobile .quicklinks .hover .ab-item:before {
  261. color: #72aee6;
  262. }
  263. #wpadminbar .menupop .menupop > .ab-item .wp-admin-bar-arrow:before,
  264. #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item:before {
  265. position: absolute;
  266. font: normal 17px/1 dashicons;
  267. speak: never;
  268. -webkit-font-smoothing: antialiased;
  269. -moz-osx-font-smoothing: grayscale;
  270. }
  271. #wpadminbar .menupop .menupop > .ab-item {
  272. display: block;
  273. padding-right: 2em;
  274. }
  275. #wpadminbar .menupop .menupop > .ab-item .wp-admin-bar-arrow:before {
  276. top: 1px;
  277. right: 10px;
  278. padding: 4px 0;
  279. content: "\f139";
  280. color: inherit;
  281. }
  282. #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item {
  283. padding-left: 2em;
  284. padding-right: 1em;
  285. }
  286. #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item .wp-admin-bar-arrow:before {
  287. top: 1px;
  288. left: 6px;
  289. content: "\f141";
  290. }
  291. #wpadminbar .quicklinks .menupop ul.ab-sub-secondary {
  292. display: block;
  293. position: relative;
  294. right: auto;
  295. margin: 0;
  296. box-shadow: none;
  297. }
  298. #wpadminbar .quicklinks .menupop ul.ab-sub-secondary,
  299. #wpadminbar .quicklinks .menupop ul.ab-sub-secondary .ab-submenu {
  300. background: #3c434a;
  301. }
  302. #wpadminbar .quicklinks .menupop .ab-sub-secondary > li > a:hover,
  303. #wpadminbar .quicklinks .menupop .ab-sub-secondary > li .ab-item:focus a {
  304. color: #72aee6;
  305. }
  306. #wpadminbar .quicklinks a span#ab-updates {
  307. background: #f0f0f1;
  308. color: #2c3338;
  309. display: inline;
  310. padding: 2px 5px;
  311. font-size: 10px;
  312. font-weight: 600;
  313. border-radius: 10px;
  314. }
  315. #wpadminbar .quicklinks a:hover span#ab-updates {
  316. background: #fff;
  317. color: #000;
  318. }
  319. #wpadminbar .ab-top-secondary {
  320. float: right;
  321. }
  322. #wpadminbar ul li:last-child,
  323. #wpadminbar ul li:last-child .ab-item {
  324. box-shadow: none;
  325. }
  326. /**
  327. * Recovery Mode
  328. */
  329. #wpadminbar #wp-admin-bar-recovery-mode {
  330. color: #fff;
  331. background-color: #d63638;
  332. }
  333. #wpadminbar .ab-top-menu > #wp-admin-bar-recovery-mode.hover >.ab-item,
  334. #wpadminbar.nojq .quicklinks .ab-top-menu > #wp-admin-bar-recovery-mode > .ab-item:focus,
  335. #wpadminbar:not(.mobile) .ab-top-menu > #wp-admin-bar-recovery-mode:hover > .ab-item,
  336. #wpadminbar:not(.mobile) .ab-top-menu > #wp-admin-bar-recovery-mode > .ab-item:focus {
  337. color: #fff;
  338. background-color: #d63638;
  339. }
  340. /**
  341. * My Account
  342. */
  343. #wp-admin-bar-my-account > ul {
  344. min-width: 198px;
  345. }
  346. #wp-admin-bar-my-account:not(.with-avatar) > .ab-item {
  347. display: inline-block;
  348. }
  349. #wp-admin-bar-my-account > .ab-item:before {
  350. content: "\f110";
  351. top: 2px;
  352. float: right;
  353. margin-left: 6px;
  354. margin-right: 0;
  355. }
  356. #wp-admin-bar-my-account.with-avatar > .ab-item:before {
  357. display: none;
  358. content: none;
  359. }
  360. #wp-admin-bar-my-account.with-avatar > ul {
  361. min-width: 270px;
  362. }
  363. #wpadminbar #wp-admin-bar-user-actions > li {
  364. margin-left: 16px;
  365. margin-right: 16px;
  366. }
  367. #wpadminbar #wp-admin-bar-user-actions.ab-submenu {
  368. padding: 6px 0 12px;
  369. }
  370. #wpadminbar #wp-admin-bar-my-account.with-avatar #wp-admin-bar-user-actions > li {
  371. margin-left: 88px;
  372. }
  373. #wpadminbar #wp-admin-bar-user-info {
  374. margin-top: 6px;
  375. margin-bottom: 15px;
  376. height: auto;
  377. background: none;
  378. }
  379. #wp-admin-bar-user-info .avatar {
  380. position: absolute;
  381. left: -72px;
  382. top: 4px;
  383. width: 64px;
  384. height: 64px;
  385. }
  386. #wpadminbar #wp-admin-bar-user-info a {
  387. background: none;
  388. height: auto;
  389. }
  390. #wpadminbar #wp-admin-bar-user-info span {
  391. background: none;
  392. padding: 0;
  393. height: 18px;
  394. }
  395. #wpadminbar #wp-admin-bar-user-info .display-name,
  396. #wpadminbar #wp-admin-bar-user-info .username {
  397. display: block;
  398. }
  399. #wpadminbar #wp-admin-bar-user-info .username {
  400. color: #a7aaad;
  401. font-size: 11px;
  402. }
  403. #wpadminbar #wp-admin-bar-my-account.with-avatar > .ab-empty-item img,
  404. #wpadminbar #wp-admin-bar-my-account.with-avatar > a img {
  405. width: auto;
  406. height: 16px;
  407. padding: 0;
  408. border: 1px solid #8c8f94;
  409. background: #f0f0f1;
  410. line-height: 1.84615384;
  411. vertical-align: middle;
  412. margin: -4px 0 0 6px;
  413. float: none;
  414. display: inline;
  415. }
  416. /**
  417. * WP Logo
  418. */
  419. #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon {
  420. width: 15px;
  421. height: 20px;
  422. margin-right: 0;
  423. padding: 6px 0 5px;
  424. }
  425. #wpadminbar #wp-admin-bar-wp-logo > .ab-item {
  426. padding: 0 7px;
  427. }
  428. #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon:before {
  429. content: "\f120";
  430. top: 2px;
  431. }
  432. /*
  433. * My Sites & Site Title
  434. */
  435. #wpadminbar .quicklinks li .blavatar {
  436. display: inline-block;
  437. vertical-align: middle;
  438. font: normal 16px/1 dashicons !important;
  439. speak: never;
  440. -webkit-font-smoothing: antialiased;
  441. -moz-osx-font-smoothing: grayscale;
  442. color: #f0f0f1;
  443. }
  444. #wpadminbar .quicklinks li a:hover .blavatar,
  445. #wpadminbar .quicklinks li a:focus .blavatar,
  446. #wpadminbar .quicklinks .ab-sub-wrapper .menupop.hover > a .blavatar {
  447. color: #72aee6;
  448. }
  449. #wpadminbar .quicklinks li img.blavatar,
  450. #wpadminbar .quicklinks li div.blavatar:before {
  451. height: 16px;
  452. width: 16px;
  453. margin: 0 8px 2px -2px;
  454. }
  455. #wpadminbar .quicklinks li div.blavatar:before {
  456. content: "\f120";
  457. display: inline-block;
  458. }
  459. #wpadminbar #wp-admin-bar-appearance {
  460. margin-top: -12px;
  461. }
  462. #wpadminbar #wp-admin-bar-my-sites > .ab-item:before,
  463. #wpadminbar #wp-admin-bar-site-name > .ab-item:before {
  464. content: "\f541";
  465. top: 2px;
  466. }
  467. #wpadminbar #wp-admin-bar-customize > .ab-item:before {
  468. content: "\f540";
  469. top: 2px;
  470. }
  471. #wpadminbar #wp-admin-bar-edit > .ab-item:before {
  472. content: "\f464";
  473. top: 2px;
  474. }
  475. #wpadminbar #wp-admin-bar-site-name > .ab-item:before {
  476. content: "\f226";
  477. }
  478. .wp-admin #wpadminbar #wp-admin-bar-site-name > .ab-item:before {
  479. content: "\f102";
  480. }
  481. /**
  482. * Comments
  483. */
  484. #wpadminbar #wp-admin-bar-comments .ab-icon {
  485. margin-right: 6px;
  486. }
  487. #wpadminbar #wp-admin-bar-comments .ab-icon:before {
  488. content: "\f101";
  489. top: 3px;
  490. }
  491. #wpadminbar #wp-admin-bar-comments .count-0 {
  492. opacity: .5;
  493. }
  494. /**
  495. * New Content
  496. */
  497. #wpadminbar #wp-admin-bar-new-content .ab-icon:before {
  498. content: "\f132";
  499. top: 4px;
  500. }
  501. /**
  502. * Updates
  503. */
  504. #wpadminbar #wp-admin-bar-updates .ab-icon:before {
  505. content: "\f463";
  506. top: 2px;
  507. }
  508. #wpadminbar #wp-admin-bar-updates.spin .ab-icon:before {
  509. display: inline-block;
  510. animation: rotation 2s infinite linear;
  511. }
  512. @media (prefers-reduced-motion: reduce) {
  513. #wpadminbar #wp-admin-bar-updates.spin .ab-icon:before {
  514. animation: none;
  515. }
  516. }
  517. /**
  518. * Search
  519. */
  520. #wpadminbar #wp-admin-bar-search .ab-item {
  521. padding: 0;
  522. background: transparent;
  523. }
  524. #wpadminbar #adminbarsearch {
  525. position: relative;
  526. height: 32px;
  527. padding: 0 2px;
  528. z-index: 1;
  529. }
  530. #wpadminbar #adminbarsearch:before {
  531. position: absolute;
  532. top: 6px;
  533. left: 5px;
  534. z-index: 20;
  535. font: normal 20px/1 dashicons !important;
  536. content: "\f179";
  537. speak: never;
  538. -webkit-font-smoothing: antialiased;
  539. -moz-osx-font-smoothing: grayscale;
  540. }
  541. /* The admin bar search field needs to reset many styles that might be inherited from the active Theme CSS. See ticket #40313. */
  542. #wpadminbar > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input {
  543. display: inline-block;
  544. float: none;
  545. position: relative;
  546. z-index: 30;
  547. font-size: 13px;
  548. font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  549. line-height: 1.84615384;
  550. text-indent: 0;
  551. height: 24px;
  552. width: 24px;
  553. max-width: none;
  554. padding: 0 3px 0 24px;
  555. margin: 0;
  556. color: #c3c4c7;
  557. background-color: rgba(255, 255, 255, 0);
  558. border: none;
  559. outline: none;
  560. cursor: pointer;
  561. box-shadow: none;
  562. box-sizing: border-box;
  563. transition-duration: 400ms;
  564. transition-property: width, background;
  565. transition-timing-function: ease;
  566. }
  567. #wpadminbar > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input:focus {
  568. z-index: 10;
  569. color: #000;
  570. width: 200px;
  571. background-color: rgba(255, 255, 255, 0.9);
  572. cursor: text;
  573. border: 0;
  574. }
  575. #wpadminbar #adminbarsearch .adminbar-button {
  576. display: none;
  577. }
  578. /**
  579. * Customize support classes
  580. */
  581. .no-customize-support .hide-if-no-customize,
  582. .customize-support .hide-if-customize,
  583. .no-customize-support #wpadminbar .hide-if-no-customize,
  584. .no-customize-support.wp-core-ui .hide-if-no-customize,
  585. .no-customize-support .wp-core-ui .hide-if-no-customize,
  586. .customize-support #wpadminbar .hide-if-customize,
  587. .customize-support.wp-core-ui .hide-if-customize,
  588. .customize-support .wp-core-ui .hide-if-customize {
  589. display: none;
  590. }
  591. /* Skip link */
  592. #wpadminbar .screen-reader-text,
  593. #wpadminbar .screen-reader-text span {
  594. border: 0;
  595. clip: rect(1px, 1px, 1px, 1px);
  596. -webkit-clip-path: inset(50%);
  597. clip-path: inset(50%);
  598. height: 1px;
  599. margin: -1px;
  600. overflow: hidden;
  601. padding: 0;
  602. position: absolute;
  603. width: 1px;
  604. word-wrap: normal !important;
  605. }
  606. #wpadminbar .screen-reader-shortcut {
  607. position: absolute;
  608. top: -1000em;
  609. }
  610. #wpadminbar .screen-reader-shortcut:focus {
  611. left: 6px;
  612. top: 7px;
  613. height: auto;
  614. width: auto;
  615. display: block;
  616. font-size: 14px;
  617. font-weight: 600;
  618. padding: 15px 23px 14px;
  619. background: #f0f0f1;
  620. color: #2271b1;
  621. z-index: 100000;
  622. line-height: normal;
  623. text-decoration: none;
  624. box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  625. }
  626. @media screen and (max-width: 782px) {
  627. /* Toolbar Touchification*/
  628. html #wpadminbar {
  629. height: 46px;
  630. min-width: 240px; /* match the min-width of the body in wp-admin/css/common.css */
  631. }
  632. #wpadminbar * {
  633. font-size: 14px;
  634. font-weight: 400;
  635. font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  636. line-height: 2.28571428;
  637. }
  638. #wpadminbar .quicklinks > ul > li > a,
  639. #wpadminbar .quicklinks .ab-empty-item {
  640. padding: 0;
  641. height: 46px;
  642. line-height: 3.28571428;
  643. width: auto;
  644. }
  645. #wpadminbar .ab-icon {
  646. font: 40px/1 dashicons !important;
  647. margin: 0;
  648. padding: 0;
  649. width: 52px;
  650. height: 46px;
  651. text-align: center;
  652. }
  653. #wpadminbar .ab-icon:before {
  654. text-align: center;
  655. }
  656. #wpadminbar .ab-submenu {
  657. padding: 0;
  658. }
  659. #wpadminbar #wp-admin-bar-site-name a.ab-item,
  660. #wpadminbar #wp-admin-bar-my-sites a.ab-item,
  661. #wpadminbar #wp-admin-bar-my-account a.ab-item {
  662. text-overflow: clip;
  663. }
  664. #wpadminbar .quicklinks .menupop ul li .ab-item,
  665. #wpadminbar .quicklinks .menupop ul li a strong,
  666. #wpadminbar .quicklinks .menupop.hover ul li .ab-item,
  667. #wpadminbar.nojs .quicklinks .menupop:hover ul li .ab-item,
  668. #wpadminbar .shortlink-input {
  669. line-height: 1.6;
  670. }
  671. #wpadminbar .ab-label {
  672. display: none;
  673. }
  674. #wpadminbar .menupop li:hover > .ab-sub-wrapper,
  675. #wpadminbar .menupop li.hover > .ab-sub-wrapper {
  676. margin-top: -46px;
  677. }
  678. #wpadminbar .ab-top-menu .menupop .ab-sub-wrapper .menupop > .ab-item {
  679. padding-right: 30px;
  680. }
  681. #wpadminbar .menupop .menupop > .ab-item:before {
  682. top: 10px;
  683. right: 6px;
  684. }
  685. #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper .ab-item {
  686. font-size: 16px;
  687. padding: 8px 16px;
  688. }
  689. #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper a:empty {
  690. display: none;
  691. }
  692. /* WP logo */
  693. #wpadminbar #wp-admin-bar-wp-logo > .ab-item {
  694. padding: 0;
  695. }
  696. #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon {
  697. padding: 0;
  698. width: 52px;
  699. height: 46px;
  700. text-align: center;
  701. vertical-align: top;
  702. }
  703. #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon:before {
  704. font: 28px/1 dashicons !important;
  705. top: -3px;
  706. }
  707. #wpadminbar .ab-icon,
  708. #wpadminbar .ab-item:before {
  709. padding: 0;
  710. }
  711. /* My Sites and "Site Title" menu */
  712. #wpadminbar #wp-admin-bar-my-sites > .ab-item,
  713. #wpadminbar #wp-admin-bar-site-name > .ab-item,
  714. #wpadminbar #wp-admin-bar-customize > .ab-item,
  715. #wpadminbar #wp-admin-bar-edit > .ab-item,
  716. #wpadminbar #wp-admin-bar-my-account > .ab-item {
  717. text-indent: 100%;
  718. white-space: nowrap;
  719. overflow: hidden;
  720. width: 52px;
  721. padding: 0;
  722. color: #a7aaad; /* @todo not needed? this text is hidden */
  723. position: relative;
  724. }
  725. #wpadminbar > #wp-toolbar > #wp-admin-bar-root-default .ab-icon,
  726. #wpadminbar .ab-icon,
  727. #wpadminbar .ab-item:before {
  728. padding: 0;
  729. margin-right: 0;
  730. }
  731. #wpadminbar #wp-admin-bar-edit > .ab-item:before,
  732. #wpadminbar #wp-admin-bar-my-sites > .ab-item:before,
  733. #wpadminbar #wp-admin-bar-site-name > .ab-item:before,
  734. #wpadminbar #wp-admin-bar-customize > .ab-item:before,
  735. #wpadminbar #wp-admin-bar-my-account > .ab-item:before {
  736. display: block;
  737. text-indent: 0;
  738. font: normal 32px/1 dashicons;
  739. speak: never;
  740. top: 7px;
  741. width: 52px;
  742. text-align: center;
  743. -webkit-font-smoothing: antialiased;
  744. -moz-osx-font-smoothing: grayscale;
  745. }
  746. #wpadminbar #wp-admin-bar-appearance {
  747. margin-top: 0;
  748. }
  749. #wpadminbar .quicklinks li .blavatar:before {
  750. display: none;
  751. }
  752. /* Search */
  753. #wpadminbar #wp-admin-bar-search {
  754. display: none;
  755. }
  756. /* New Content */
  757. #wpadminbar #wp-admin-bar-new-content .ab-icon:before {
  758. top: 0;
  759. line-height: 1.33333333;
  760. height: 46px !important;
  761. text-align: center;
  762. width: 52px;
  763. display: block;
  764. }
  765. /* Updates */
  766. #wpadminbar #wp-admin-bar-updates {
  767. text-align: center;
  768. }
  769. #wpadminbar #wp-admin-bar-updates .ab-icon:before {
  770. top: 3px;
  771. }
  772. /* Comments */
  773. #wpadminbar #wp-admin-bar-comments .ab-icon {
  774. margin: 0;
  775. }
  776. #wpadminbar #wp-admin-bar-comments .ab-icon:before {
  777. display: block;
  778. font-size: 34px;
  779. height: 46px;
  780. line-height: 1.38235294;
  781. top: 0;
  782. }
  783. /* My Account */
  784. #wpadminbar #wp-admin-bar-my-account > a {
  785. position: relative;
  786. white-space: nowrap;
  787. text-indent: 150%; /* More than 100% indention is needed since this element has padding */
  788. width: 28px;
  789. padding: 0 10px;
  790. overflow: hidden; /* Prevent link text from forcing horizontal scrolling on mobile */
  791. }
  792. #wpadminbar .quicklinks li#wp-admin-bar-my-account.with-avatar > a img {
  793. position: absolute;
  794. top: 13px;
  795. right: 10px;
  796. width: 26px;
  797. height: 26px;
  798. }
  799. #wpadminbar #wp-admin-bar-user-actions.ab-submenu {
  800. padding: 0;
  801. }
  802. #wpadminbar #wp-admin-bar-user-actions.ab-submenu img.avatar {
  803. display: none;
  804. }
  805. #wpadminbar #wp-admin-bar-my-account.with-avatar #wp-admin-bar-user-actions > li {
  806. margin: 0;
  807. }
  808. #wpadminbar #wp-admin-bar-user-info .display-name {
  809. height: auto;
  810. font-size: 16px;
  811. line-height: 1.5;
  812. color: #f0f0f1;
  813. }
  814. #wpadminbar #wp-admin-bar-user-info a {
  815. padding-top: 4px;
  816. }
  817. #wpadminbar #wp-admin-bar-user-info .username {
  818. line-height: 0.8 !important;
  819. margin-bottom: -2px;
  820. }
  821. /* Show only default top level items */
  822. #wp-toolbar > ul > li {
  823. display: none;
  824. }
  825. #wpadminbar li#wp-admin-bar-menu-toggle,
  826. #wpadminbar li#wp-admin-bar-wp-logo,
  827. #wpadminbar li#wp-admin-bar-my-sites,
  828. #wpadminbar li#wp-admin-bar-updates,
  829. #wpadminbar li#wp-admin-bar-site-name,
  830. #wpadminbar li#wp-admin-bar-customize,
  831. #wpadminbar li#wp-admin-bar-new-content,
  832. #wpadminbar li#wp-admin-bar-edit,
  833. #wpadminbar li#wp-admin-bar-comments,
  834. #wpadminbar li#wp-admin-bar-my-account {
  835. display: block;
  836. }
  837. /* Allow dropdown list items to appear normally */
  838. #wpadminbar li:hover ul li,
  839. #wpadminbar li.hover ul li,
  840. #wpadminbar li:hover ul li:hover ul li {
  841. display: list-item;
  842. }
  843. /* Override default min-width so dropdown lists aren't stretched
  844. to 100% viewport width at responsive sizes. */
  845. #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper {
  846. min-width: -moz-fit-content;
  847. min-width: fit-content;
  848. }
  849. #wpadminbar ul#wp-admin-bar-root-default > li {
  850. margin-right: 0;
  851. }
  852. /* Experimental fix for touch toolbar dropdown positioning */
  853. #wpadminbar .ab-top-menu,
  854. #wpadminbar .ab-top-secondary,
  855. #wpadminbar #wp-admin-bar-wp-logo,
  856. #wpadminbar #wp-admin-bar-my-sites,
  857. #wpadminbar #wp-admin-bar-site-name,
  858. #wpadminbar #wp-admin-bar-updates,
  859. #wpadminbar #wp-admin-bar-comments,
  860. #wpadminbar #wp-admin-bar-new-content,
  861. #wpadminbar #wp-admin-bar-edit,
  862. #wpadminbar #wp-admin-bar-my-account {
  863. position: static;
  864. }
  865. #wpadminbar #wp-admin-bar-my-account {
  866. float: right;
  867. }
  868. .network-admin #wpadminbar ul#wp-admin-bar-top-secondary > li#wp-admin-bar-my-account {
  869. margin-right: 0;
  870. }
  871. /* Realign arrows on taller responsive submenus */
  872. #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item:before {
  873. top: 10px;
  874. left: 0;
  875. }
  876. }
  877. /* Smartphone */
  878. @media screen and (max-width: 600px) {
  879. #wpadminbar {
  880. position: absolute;
  881. }
  882. #wp-responsive-overlay {
  883. position: fixed;
  884. top: 0;
  885. left: 0;
  886. width: 100%;
  887. height: 100%;
  888. z-index: 400;
  889. }
  890. #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper {
  891. width: 100%;
  892. left: 0;
  893. }
  894. #wpadminbar .menupop .menupop > .ab-item:before {
  895. display: none;
  896. }
  897. #wpadminbar #wp-admin-bar-wp-logo.menupop .ab-sub-wrapper {
  898. margin-left: 0;
  899. }
  900. #wpadminbar .ab-top-menu > .menupop li > .ab-sub-wrapper {
  901. margin: 0;
  902. width: 100%;
  903. top: auto;
  904. left: auto;
  905. position: relative;
  906. }
  907. #wpadminbar .ab-top-menu > .menupop li > .ab-sub-wrapper .ab-item {
  908. font-size: 16px;
  909. padding: 6px 15px 19px 30px;
  910. }
  911. #wpadminbar li:hover ul li ul li {
  912. display: list-item;
  913. }
  914. #wpadminbar li#wp-admin-bar-wp-logo,
  915. #wpadminbar li#wp-admin-bar-updates {
  916. display: none;
  917. }
  918. /* Make submenus full-width at this size */
  919. #wpadminbar .ab-top-menu > .menupop li > .ab-sub-wrapper {
  920. position: static;
  921. box-shadow: none;
  922. }
  923. }
  924. /* Very narrow screens */
  925. @media screen and (max-width: 400px) {
  926. #wpadminbar li#wp-admin-bar-comments {
  927. display: none;
  928. }
  929. }