You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

4156 lines
72 KiB

1 year ago
  1. /*! This file is auto-generated */
  2. /* 2 column liquid layout */
  3. #wpwrap {
  4. height: auto;
  5. min-height: 100%;
  6. width: 100%;
  7. position: relative;
  8. -webkit-font-smoothing: subpixel-antialiased;
  9. }
  10. #wpcontent {
  11. height: 100%;
  12. padding-right: 20px;
  13. }
  14. #wpcontent,
  15. #wpfooter {
  16. margin-right: 160px;
  17. }
  18. .folded #wpcontent,
  19. .folded #wpfooter {
  20. margin-right: 36px;
  21. }
  22. #wpbody-content {
  23. padding-bottom: 65px;
  24. float: right;
  25. width: 100%;
  26. overflow: visible;
  27. }
  28. /* inner 2 column liquid layout */
  29. .inner-sidebar {
  30. float: left;
  31. clear: left;
  32. display: none;
  33. width: 281px;
  34. position: relative;
  35. }
  36. .columns-2 .inner-sidebar {
  37. margin-left: auto;
  38. width: 286px;
  39. display: block;
  40. }
  41. .inner-sidebar #side-sortables,
  42. .columns-2 .inner-sidebar #side-sortables {
  43. min-height: 300px;
  44. width: 280px;
  45. padding: 0;
  46. }
  47. .has-right-sidebar .inner-sidebar {
  48. display: block;
  49. }
  50. .has-right-sidebar #post-body {
  51. float: right;
  52. clear: right;
  53. width: 100%;
  54. margin-left: -2000px;
  55. }
  56. .has-right-sidebar #post-body-content {
  57. margin-left: 300px;
  58. float: none;
  59. width: auto;
  60. }
  61. /* 2 columns main area */
  62. #col-left {
  63. float: right;
  64. width: 35%;
  65. }
  66. #col-right {
  67. float: left;
  68. width: 65%;
  69. }
  70. #col-left .col-wrap {
  71. padding: 0 0 0 6px;
  72. }
  73. #col-right .col-wrap {
  74. padding: 0 6px 0 0;
  75. }
  76. /* utility classes */
  77. .alignleft {
  78. float: right;
  79. }
  80. .alignright {
  81. float: left;
  82. }
  83. .textleft {
  84. text-align: right;
  85. }
  86. .textright {
  87. text-align: left;
  88. }
  89. .clear {
  90. clear: both;
  91. }
  92. /* modern clearfix */
  93. .wp-clearfix:after {
  94. content: "";
  95. display: table;
  96. clear: both;
  97. }
  98. /* Hide visually but not from screen readers */
  99. .screen-reader-text,
  100. .screen-reader-text span,
  101. .ui-helper-hidden-accessible {
  102. border: 0;
  103. clip: rect(1px, 1px, 1px, 1px);
  104. -webkit-clip-path: inset(50%);
  105. clip-path: inset(50%);
  106. height: 1px;
  107. margin: -1px;
  108. overflow: hidden;
  109. padding: 0;
  110. position: absolute;
  111. width: 1px;
  112. word-wrap: normal !important; /* many screen reader and browser combinations announce broken words as they would appear visually */
  113. }
  114. .button .screen-reader-text {
  115. height: auto; /* Fixes a Safari+VoiceOver bug, see ticket #42006 */
  116. }
  117. .screen-reader-text + .dashicons-external {
  118. margin-top: -1px;
  119. margin-right: 2px;
  120. }
  121. .screen-reader-shortcut {
  122. position: absolute;
  123. top: -1000em;
  124. right: 6px;
  125. height: auto;
  126. width: auto;
  127. display: block;
  128. font-size: 14px;
  129. font-weight: 600;
  130. padding: 15px 23px 14px;
  131. /* Background and color set to prevent false positives in automated accessibility tests. */
  132. background: #f0f0f1;
  133. color: #2271b1;
  134. z-index: 100000;
  135. line-height: normal;
  136. }
  137. .screen-reader-shortcut:focus {
  138. top: -25px;
  139. /* Overrides a:focus in the admin. See ticket #56789. */
  140. color: #2271b1;
  141. box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  142. text-decoration: none;
  143. /* Only visible in Windows High Contrast mode */
  144. outline: 2px solid transparent;
  145. outline-offset: -2px;
  146. }
  147. .hidden,
  148. .js .closed .inside,
  149. .js .hide-if-js,
  150. .no-js .hide-if-no-js,
  151. .js.wp-core-ui .hide-if-js,
  152. .js .wp-core-ui .hide-if-js,
  153. .no-js.wp-core-ui .hide-if-no-js,
  154. .no-js .wp-core-ui .hide-if-no-js {
  155. display: none;
  156. }
  157. /* @todo: Take a second look. Large chunks of shared color, from the colors.css merge */
  158. .widget-top,
  159. .menu-item-handle,
  160. .widget-inside,
  161. #menu-settings-column .accordion-container,
  162. #menu-management .menu-edit,
  163. .manage-menus,
  164. table.widefat,
  165. .stuffbox,
  166. p.popular-tags,
  167. .widgets-holder-wrap,
  168. .wp-editor-container,
  169. .popular-tags,
  170. .feature-filter,
  171. .comment-ays {
  172. border: 1px solid #c3c4c7;
  173. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
  174. }
  175. table.widefat,
  176. .wp-editor-container,
  177. .stuffbox,
  178. p.popular-tags,
  179. .widgets-holder-wrap,
  180. .popular-tags,
  181. .feature-filter,
  182. .comment-ays {
  183. background: #fff;
  184. }
  185. /* general */
  186. html,
  187. body {
  188. height: 100%;
  189. margin: 0;
  190. padding: 0;
  191. }
  192. body {
  193. background: #f0f0f1;
  194. color: #3c434a;
  195. font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  196. font-size: 13px;
  197. line-height: 1.4em;
  198. min-width: 600px;
  199. }
  200. body.iframe {
  201. min-width: 0;
  202. padding-top: 1px;
  203. }
  204. body.modal-open {
  205. overflow: hidden;
  206. }
  207. body.mobile.modal-open #wpwrap {
  208. overflow: hidden;
  209. position: fixed;
  210. height: 100%;
  211. }
  212. iframe,
  213. img {
  214. border: 0;
  215. }
  216. td {
  217. font-family: inherit;
  218. font-size: inherit;
  219. font-weight: inherit;
  220. line-height: inherit;
  221. }
  222. /* Any change to the default link style must be applied to button-link too. */
  223. a {
  224. color: #2271b1;
  225. transition-property: border, background, color;
  226. transition-duration: .05s;
  227. transition-timing-function: ease-in-out;
  228. }
  229. a,
  230. div {
  231. outline: 0;
  232. }
  233. a:hover,
  234. a:active {
  235. color: #135e96;
  236. }
  237. a:focus,
  238. a:focus .media-icon img,
  239. a:focus .plugin-icon,
  240. .wp-person a:focus .gravatar {
  241. color: #043959;
  242. box-shadow:
  243. 0 0 0 1px #4f94d4,
  244. 0 0 2px 1px rgba(79, 148, 212, 0.8);
  245. /* Only visible in Windows High Contrast mode */
  246. outline: 1px solid transparent;
  247. }
  248. #adminmenu a:focus {
  249. box-shadow: none;
  250. /* Only visible in Windows High Contrast mode */
  251. outline: 1px solid transparent;
  252. outline-offset: -1px;
  253. }
  254. .screen-reader-text:focus {
  255. box-shadow: none;
  256. outline: none;
  257. }
  258. blockquote,
  259. q {
  260. quotes: none;
  261. }
  262. blockquote:before,
  263. blockquote:after,
  264. q:before,
  265. q:after {
  266. content: "";
  267. content: none;
  268. }
  269. p,
  270. .wp-die-message {
  271. font-size: 13px;
  272. line-height: 1.5;
  273. margin: 1em 0;
  274. }
  275. blockquote {
  276. margin: 1em;
  277. }
  278. li,
  279. dd {
  280. margin-bottom: 6px;
  281. }
  282. h1,
  283. h2,
  284. h3,
  285. h4,
  286. h5,
  287. h6 {
  288. display: block;
  289. font-weight: 600;
  290. }
  291. h1 {
  292. color: #1d2327;
  293. font-size: 2em;
  294. margin: .67em 0;
  295. }
  296. h2,
  297. h3 {
  298. color: #1d2327;
  299. font-size: 1.3em;
  300. margin: 1em 0;
  301. }
  302. .update-core-php h2 {
  303. margin-top: 4em;
  304. }
  305. .update-php h2,
  306. .update-messages h2,
  307. h4 {
  308. font-size: 1em;
  309. margin: 1.33em 0;
  310. }
  311. h5 {
  312. font-size: 0.83em;
  313. margin: 1.67em 0;
  314. }
  315. h6 {
  316. font-size: 0.67em;
  317. margin: 2.33em 0;
  318. }
  319. ul,
  320. ol {
  321. padding: 0;
  322. }
  323. ul {
  324. list-style: none;
  325. }
  326. ol {
  327. list-style-type: decimal;
  328. margin-right: 2em;
  329. }
  330. ul.ul-disc {
  331. list-style: disc outside;
  332. }
  333. ul.ul-square {
  334. list-style: square outside;
  335. }
  336. ol.ol-decimal {
  337. list-style: decimal outside;
  338. }
  339. ul.ul-disc,
  340. ul.ul-square,
  341. ol.ol-decimal {
  342. margin-right: 1.8em;
  343. }
  344. ul.ul-disc > li,
  345. ul.ul-square > li,
  346. ol.ol-decimal > li {
  347. margin: 0 0 0.5em;
  348. }
  349. /* rtl:ignore */
  350. .ltr {
  351. direction: ltr;
  352. }
  353. /* rtl:ignore */
  354. .code,
  355. code {
  356. font-family: Consolas, Monaco, monospace;
  357. direction: ltr;
  358. unicode-bidi: embed;
  359. }
  360. kbd,
  361. code {
  362. padding: 3px 5px 2px;
  363. margin: 0 1px;
  364. background: #f0f0f1;
  365. background: rgba(0, 0, 0, 0.07);
  366. font-size: 13px;
  367. }
  368. .subsubsub {
  369. list-style: none;
  370. margin: 8px 0 0;
  371. padding: 0;
  372. font-size: 13px;
  373. float: right;
  374. color: #646970;
  375. }
  376. .subsubsub a {
  377. line-height: 2;
  378. padding: .2em;
  379. text-decoration: none;
  380. }
  381. .subsubsub a .count,
  382. .subsubsub a.current .count {
  383. color: #50575e; /* #f1f1f1 background */
  384. font-weight: 400;
  385. }
  386. .subsubsub a.current {
  387. font-weight: 600;
  388. border: none;
  389. }
  390. .subsubsub li {
  391. display: inline-block;
  392. margin: 0;
  393. padding: 0;
  394. white-space: nowrap;
  395. }
  396. /* .widefat - main style for tables */
  397. .widefat {
  398. border-spacing: 0;
  399. width: 100%;
  400. clear: both;
  401. margin: 0;
  402. }
  403. .widefat * {
  404. word-wrap: break-word;
  405. }
  406. .widefat a,
  407. .widefat button.button-link {
  408. text-decoration: none;
  409. }
  410. .widefat td,
  411. .widefat th {
  412. padding: 8px 10px;
  413. }
  414. .widefat thead th,
  415. .widefat thead td {
  416. border-bottom: 1px solid #c3c4c7;
  417. }
  418. .widefat tfoot th,
  419. .widefat tfoot td {
  420. border-top: 1px solid #c3c4c7;
  421. border-bottom: none;
  422. }
  423. .widefat .no-items td {
  424. border-bottom-width: 0;
  425. }
  426. .widefat td {
  427. vertical-align: top;
  428. }
  429. .widefat td,
  430. .widefat td p,
  431. .widefat td ol,
  432. .widefat td ul {
  433. font-size: 13px;
  434. line-height: 1.5em;
  435. }
  436. .widefat th,
  437. .widefat thead td,
  438. .widefat tfoot td {
  439. text-align: right;
  440. line-height: 1.3em;
  441. font-size: 14px;
  442. }
  443. .widefat th input,
  444. .updates-table td input,
  445. .widefat thead td input,
  446. .widefat tfoot td input {
  447. margin: 0 8px 0 0;
  448. padding: 0;
  449. vertical-align: text-top;
  450. }
  451. .widefat .check-column {
  452. width: 2.2em;
  453. padding: 6px 0 25px;
  454. vertical-align: top;
  455. }
  456. .widefat tbody th.check-column {
  457. padding: 9px 0 22px;
  458. }
  459. .widefat thead td.check-column,
  460. .widefat tbody th.check-column,
  461. .updates-table tbody td.check-column,
  462. .widefat tfoot td.check-column {
  463. padding: 11px 3px 0 0;
  464. }
  465. .widefat thead td.check-column,
  466. .widefat tfoot td.check-column {
  467. padding-top: 4px;
  468. vertical-align: middle;
  469. }
  470. .update-php div.updated,
  471. .update-php div.error {
  472. margin-right: 0;
  473. }
  474. .js-update-details-toggle .dashicons {
  475. text-decoration: none;
  476. }
  477. .js-update-details-toggle[aria-expanded="true"] .dashicons::before {
  478. content: "\f142";
  479. }
  480. .no-js .widefat thead .check-column input,
  481. .no-js .widefat tfoot .check-column input {
  482. display: none;
  483. }
  484. .widefat .num,
  485. .column-comments,
  486. .column-links,
  487. .column-posts {
  488. text-align: center;
  489. }
  490. .widefat th#comments {
  491. vertical-align: middle;
  492. }
  493. .wrap {
  494. margin: 10px 2px 0 20px;
  495. }
  496. .wrap > h2:first-child, /* Back-compat for pre-4.4 */
  497. .wrap [class$="icon32"] + h2, /* Back-compat for pre-4.4 */
  498. .postbox .inside h2, /* Back-compat for pre-4.4 */
  499. .wrap h1 {
  500. font-size: 23px;
  501. font-weight: 400;
  502. margin: 0;
  503. padding: 9px 0 4px;
  504. line-height: 1.3;
  505. }
  506. .wrap h1.wp-heading-inline {
  507. display: inline-block;
  508. margin-left: 5px;
  509. }
  510. .wp-header-end {
  511. visibility: hidden;
  512. margin: -2px 0 0;
  513. }
  514. .subtitle {
  515. margin: 0;
  516. padding-right: 25px;
  517. color: #50575e;
  518. font-size: 14px;
  519. font-weight: 400;
  520. line-height: 1;
  521. }
  522. .subtitle strong {
  523. word-break: break-all;
  524. }
  525. .wrap .add-new-h2, /* deprecated */
  526. .wrap .add-new-h2:active, /* deprecated */
  527. .wrap .page-title-action,
  528. .wrap .page-title-action:active {
  529. display: inline-block;
  530. position: relative;
  531. box-sizing: border-box;
  532. cursor: pointer;
  533. white-space: nowrap;
  534. text-decoration: none;
  535. text-shadow: none;
  536. top: -3px;
  537. margin-right: 4px;
  538. border: 1px solid #2271b1;
  539. border-radius: 3px;
  540. background: #f6f7f7;
  541. font-size: 13px;
  542. font-weight: 400;
  543. line-height: 2.15384615;
  544. color: #2271b1; /* use the standard color used for buttons */
  545. padding: 0 10px;
  546. min-height: 30px;
  547. -webkit-appearance: none;
  548. }
  549. .wrap .wp-heading-inline + .page-title-action {
  550. margin-right: 0;
  551. }
  552. .wrap .add-new-h2:hover, /* deprecated */
  553. .wrap .page-title-action:hover {
  554. background: #f0f0f1;
  555. border-color: #0a4b78;
  556. color: #0a4b78;
  557. }
  558. /* lower specificity: color needs to be overridden by :hover and :active */
  559. .page-title-action:focus {
  560. color: #0a4b78;
  561. }
  562. /* Dashicon for language options on General Settings and Profile screens */
  563. .form-table th label[for="locale"] .dashicons,
  564. .form-table th label[for="WPLANG"] .dashicons {
  565. margin-right: 5px;
  566. }
  567. .wrap .page-title-action:focus {
  568. border-color: #3582c4;
  569. box-shadow: 0 0 0 1px #3582c4;
  570. /* Only visible in Windows High Contrast mode */
  571. outline: 2px solid transparent;
  572. }
  573. .wrap h1.long-header {
  574. padding-left: 0;
  575. }
  576. .wp-dialog {
  577. background-color: #fff;
  578. }
  579. .widgets-chooser ul,
  580. #widgets-left .widget-in-question .widget-top,
  581. #available-widgets .widget-top:hover,
  582. div#widgets-right .widget-top:hover,
  583. #widgets-left .widget-top:hover {
  584. border-color: #8c8f94;
  585. box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
  586. }
  587. .sorthelper {
  588. background-color: #c5d9ed;
  589. }
  590. .ac_match,
  591. .subsubsub a.current {
  592. color: #000;
  593. }
  594. .striped > tbody > :nth-child(odd),
  595. ul.striped > :nth-child(odd),
  596. .alternate {
  597. background-color: #f6f7f7;
  598. }
  599. .bar {
  600. background-color: #f0f0f1;
  601. border-left-color: #4f94d4;
  602. }
  603. /* Helper classes for plugins to leverage the active WordPress color scheme */
  604. .highlight {
  605. background-color: #f0f6fc;
  606. color: #3c434a;
  607. }
  608. .wp-ui-primary {
  609. color: #fff;
  610. background-color: #2c3338;
  611. }
  612. .wp-ui-text-primary {
  613. color: #2c3338;
  614. }
  615. .wp-ui-highlight {
  616. color: #fff;
  617. background-color: #2271b1;
  618. }
  619. .wp-ui-text-highlight {
  620. color: #2271b1;
  621. }
  622. .wp-ui-notification {
  623. color: #fff;
  624. background-color: #d63638;
  625. }
  626. .wp-ui-text-notification {
  627. color: #d63638;
  628. }
  629. .wp-ui-text-icon {
  630. color: #8c8f94; /* same as new icons */
  631. }
  632. /* For emoji replacement images */
  633. img.emoji {
  634. display: inline !important;
  635. border: none !important;
  636. height: 1em !important;
  637. width: 1em !important;
  638. margin: 0 .07em !important;
  639. vertical-align: -0.1em !important;
  640. background: none !important;
  641. padding: 0 !important;
  642. box-shadow: none !important;
  643. }
  644. /*------------------------------------------------------------------------------
  645. 1.0 - Text Styles
  646. ------------------------------------------------------------------------------*/
  647. .widget .widget-top,
  648. .postbox .hndle,
  649. .stuffbox .hndle,
  650. .control-section .accordion-section-title,
  651. .sidebar-name,
  652. #nav-menu-header,
  653. #nav-menu-footer,
  654. .menu-item-handle,
  655. .checkbox,
  656. .side-info,
  657. #your-profile #rich_editing,
  658. .widefat thead th,
  659. .widefat thead td,
  660. .widefat tfoot th,
  661. .widefat tfoot td {
  662. line-height: 1.4em;
  663. }
  664. .widget .widget-top,
  665. .menu-item-handle {
  666. background: #f6f7f7;
  667. color: #1d2327;
  668. }
  669. .stuffbox .hndle {
  670. border-bottom: 1px solid #c3c4c7;
  671. }
  672. .quicktags {
  673. background-color: #c3c4c7;
  674. color: #000;
  675. font-size: 12px;
  676. }
  677. .icon32 {
  678. display: none;
  679. }
  680. /* @todo can we combine these into a class or use an existing dashicon one? */
  681. .welcome-panel .welcome-panel-close:before,
  682. .tagchecklist .ntdelbutton .remove-tag-icon:before,
  683. #bulk-titles .ntdelbutton:before,
  684. .notice-dismiss:before {
  685. background: none;
  686. color: #787c82;
  687. content: "\f153";
  688. display: block;
  689. font: normal 16px/20px dashicons;
  690. speak: never;
  691. height: 20px;
  692. text-align: center;
  693. width: 20px;
  694. -webkit-font-smoothing: antialiased;
  695. -moz-osx-font-smoothing: grayscale;
  696. }
  697. .welcome-panel .welcome-panel-close:before {
  698. margin: 0;
  699. }
  700. .tagchecklist .ntdelbutton .remove-tag-icon:before {
  701. margin-right: 2px;
  702. border-radius: 50%;
  703. color: #2271b1;
  704. /* vertically center the icon cross browsers */
  705. line-height: 1.28;
  706. }
  707. .tagchecklist .ntdelbutton:focus {
  708. outline: 0;
  709. }
  710. .tagchecklist .ntdelbutton:hover .remove-tag-icon:before,
  711. .tagchecklist .ntdelbutton:focus .remove-tag-icon:before,
  712. #bulk-titles .ntdelbutton:hover:before,
  713. #bulk-titles .ntdelbutton:focus:before {
  714. color: #d63638;
  715. }
  716. .tagchecklist .ntdelbutton:focus .remove-tag-icon:before {
  717. box-shadow:
  718. 0 0 0 1px #4f94d4,
  719. 0 0 2px 1px rgba(79, 148, 212, 0.8);
  720. }
  721. .key-labels label {
  722. line-height: 24px;
  723. }
  724. strong, b {
  725. font-weight: 600;
  726. }
  727. .pre {
  728. /* https://developer.mozilla.org/en-US/docs/CSS/white-space */
  729. white-space: pre-wrap; /* css-3 */
  730. word-wrap: break-word; /* IE 5.5 - 7 */
  731. }
  732. .howto {
  733. color: #646970;
  734. display: block;
  735. }
  736. p.install-help {
  737. margin: 8px 0;
  738. font-style: italic;
  739. }
  740. .no-break {
  741. white-space: nowrap;
  742. }
  743. hr {
  744. border: 0;
  745. border-top: 1px solid #dcdcde;
  746. border-bottom: 1px solid #f6f7f7;
  747. }
  748. .row-actions span.delete a,
  749. .row-actions span.trash a,
  750. .row-actions span.spam a,
  751. .plugins a.delete,
  752. #all-plugins-table .plugins a.delete,
  753. #search-plugins-table .plugins a.delete,
  754. .submitbox .submitdelete,
  755. #media-items a.delete,
  756. #media-items a.delete-permanently,
  757. #nav-menu-footer .menu-delete,
  758. #delete-link a.delete,
  759. a#remove-post-thumbnail,
  760. .privacy_requests .remove-personal-data .remove-personal-data-handle {
  761. color: #b32d2e;
  762. }
  763. abbr.required,
  764. span.required,
  765. .file-error,
  766. .row-actions .delete a:hover,
  767. .row-actions .trash a:hover,
  768. .row-actions .spam a:hover,
  769. .plugins a.delete:hover,
  770. #all-plugins-table .plugins a.delete:hover,
  771. #search-plugins-table .plugins a.delete:hover,
  772. .submitbox .submitdelete:hover,
  773. #media-items a.delete:hover,
  774. #media-items a.delete-permanently:hover,
  775. #nav-menu-footer .menu-delete:hover,
  776. #delete-link a.delete:hover,
  777. a#remove-post-thumbnail:hover,
  778. .privacy_requests .remove-personal-data .remove-personal-data-handle:hover {
  779. color: #b32d2e;
  780. border: none;
  781. }
  782. /*------------------------------------------------------------------------------
  783. 3.0 - Actions
  784. ------------------------------------------------------------------------------*/
  785. #major-publishing-actions {
  786. padding: 10px;
  787. clear: both;
  788. border-top: 1px solid #dcdcde;
  789. background: #f6f7f7;
  790. }
  791. #delete-action {
  792. float: right;
  793. line-height: 2.30769231; /* 30px */
  794. }
  795. #delete-link {
  796. line-height: 2.30769231; /* 30px */
  797. vertical-align: middle;
  798. text-align: right;
  799. margin-right: 8px;
  800. }
  801. #delete-link a {
  802. text-decoration: none;
  803. }
  804. #publishing-action {
  805. text-align: left;
  806. float: left;
  807. line-height: 1.9;
  808. }
  809. #publishing-action .spinner {
  810. float: none;
  811. margin-top: 5px;
  812. }
  813. #misc-publishing-actions {
  814. padding: 6px 0 0;
  815. }
  816. .misc-pub-section {
  817. padding: 6px 10px 8px;
  818. }
  819. .word-wrap-break-word,
  820. .misc-pub-filename {
  821. word-wrap: break-word;
  822. }
  823. #minor-publishing-actions {
  824. padding: 10px 10px 0;
  825. text-align: left;
  826. }
  827. #save-post {
  828. float: right;
  829. }
  830. .preview {
  831. float: left;
  832. }
  833. #sticky-span {
  834. margin-right: 18px;
  835. }
  836. .approve,
  837. .unapproved .unapprove {
  838. display: none;
  839. }
  840. .unapproved .approve,
  841. .spam .approve,
  842. .trash .approve {
  843. display: inline;
  844. }
  845. td.action-links,
  846. th.action-links {
  847. text-align: left;
  848. }
  849. #misc-publishing-actions .notice {
  850. margin-right: 10px;
  851. margin-left: 10px;
  852. }
  853. /* Filter bar */
  854. .wp-filter {
  855. display: inline-block;
  856. position: relative;
  857. box-sizing: border-box;
  858. margin: 12px 0 25px;
  859. padding: 0 10px;
  860. width: 100%;
  861. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
  862. border: 1px solid #c3c4c7;
  863. background: #fff;
  864. color: #50575e;
  865. font-size: 13px;
  866. }
  867. .wp-filter a {
  868. text-decoration: none;
  869. }
  870. .filter-count {
  871. display: inline-block;
  872. vertical-align: middle;
  873. min-width: 4em;
  874. }
  875. .title-count,
  876. .filter-count .count {
  877. display: inline-block;
  878. position: relative;
  879. top: -1px;
  880. padding: 4px 10px;
  881. border-radius: 30px;
  882. background: #646970;
  883. color: #fff;
  884. font-size: 14px;
  885. font-weight: 600;
  886. }
  887. /* not a part of filter bar, but derived from it, so here for now */
  888. .title-count {
  889. display: inline;
  890. top: -3px;
  891. margin-right: 5px;
  892. margin-left: 20px;
  893. }
  894. .filter-items {
  895. float: right;
  896. }
  897. .filter-links {
  898. display: inline-block;
  899. margin: 0;
  900. }
  901. .filter-links li {
  902. display: inline-block;
  903. margin: 0;
  904. }
  905. .filter-links li > a {
  906. display: inline-block;
  907. margin: 0 10px;
  908. padding: 15px 0;
  909. border-bottom: 4px solid #fff;
  910. color: #646970;
  911. cursor: pointer;
  912. }
  913. .filter-links .current {
  914. box-shadow: none;
  915. border-bottom: 4px solid #646970;
  916. color: #1d2327;
  917. }
  918. .filter-links li > a:hover,
  919. .filter-links li > a:focus,
  920. .show-filters .filter-links a.current:hover,
  921. .show-filters .filter-links a.current:focus {
  922. color: #135e96;
  923. }
  924. .wp-filter .search-form {
  925. float: left;
  926. margin: 10px 0;
  927. }
  928. .wp-filter .search-form input[type="search"] {
  929. width: 280px;
  930. max-width: 100%;
  931. }
  932. .wp-filter .search-form select {
  933. margin: 0;
  934. }
  935. /* Use flexbox only on the plugins install page. The `filter-links` and search form children will become flex items. */
  936. .plugin-install-php .wp-filter {
  937. display: flex;
  938. flex-wrap: wrap;
  939. justify-content: space-between;
  940. align-items: center;
  941. }
  942. .wp-filter .search-form.search-plugins {
  943. /* This element is a flex item: the inherited float won't have any effect. */
  944. margin-top: 0;
  945. }
  946. .wp-filter .search-form.search-plugins select,
  947. .wp-filter .search-form.search-plugins .wp-filter-search {
  948. display: inline-block;
  949. margin-top: 10px;
  950. vertical-align: top;
  951. }
  952. .wp-filter .button.drawer-toggle {
  953. margin: 10px 9px 0;
  954. padding: 0 6px 0 10px;
  955. border-color: transparent;
  956. background-color: transparent;
  957. color: #646970;
  958. vertical-align: baseline;
  959. box-shadow: none;
  960. }
  961. .wp-filter .drawer-toggle:before {
  962. content: "\f111";
  963. margin: 0 0 0 5px;
  964. color: #646970;
  965. font: normal 16px/1 dashicons;
  966. vertical-align: text-bottom;
  967. -webkit-font-smoothing: antialiased;
  968. -moz-osx-font-smoothing: grayscale;
  969. }
  970. .wp-filter .button.drawer-toggle:hover,
  971. .wp-filter .drawer-toggle:hover:before,
  972. .wp-filter .button.drawer-toggle:focus,
  973. .wp-filter .drawer-toggle:focus:before {
  974. background-color: transparent;
  975. color: #135e96;
  976. }
  977. .wp-filter .button.drawer-toggle:hover,
  978. .wp-filter .button.drawer-toggle:focus:active {
  979. border-color: transparent;
  980. }
  981. .wp-filter .button.drawer-toggle:focus {
  982. border-color: #4f94d4;
  983. }
  984. .wp-filter .button.drawer-toggle:active {
  985. background: transparent;
  986. box-shadow: none;
  987. transform: none;
  988. }
  989. .wp-filter .drawer-toggle.current:before {
  990. color: #fff;
  991. }
  992. .filter-drawer,
  993. .wp-filter .favorites-form {
  994. display: none;
  995. margin: 0 -20px 0 -10px;
  996. padding: 20px;
  997. border-top: 1px solid #f0f0f1;
  998. background: #f6f7f7;
  999. overflow: hidden;
  1000. }
  1001. .show-filters .filter-drawer,
  1002. .show-favorites-form .favorites-form {
  1003. display: block;
  1004. }
  1005. .show-filters .filter-links a.current {
  1006. border-bottom: none;
  1007. }
  1008. .show-filters .wp-filter .button.drawer-toggle {
  1009. border-radius: 2px;
  1010. background: #646970;
  1011. color: #fff;
  1012. }
  1013. .show-filters .wp-filter .drawer-toggle:hover,
  1014. .show-filters .wp-filter .drawer-toggle:focus {
  1015. background: #2271b1;
  1016. }
  1017. .show-filters .wp-filter .drawer-toggle:before {
  1018. color: #fff;
  1019. }
  1020. .filter-group {
  1021. box-sizing: border-box;
  1022. position: relative;
  1023. float: right;
  1024. margin: 0 0 0 1%;
  1025. padding: 20px 10px 10px;
  1026. width: 24%;
  1027. background: #fff;
  1028. border: 1px solid #dcdcde;
  1029. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
  1030. }
  1031. .filter-group legend {
  1032. position: absolute;
  1033. top: 10px;
  1034. display: block;
  1035. margin: 0;
  1036. padding: 0;
  1037. font-size: 1em;
  1038. font-weight: 600;
  1039. }
  1040. .filter-drawer .filter-group-feature {
  1041. margin: 28px 0 0;
  1042. list-style-type: none;
  1043. font-size: 12px;
  1044. }
  1045. .filter-drawer .filter-group-feature input,
  1046. .filter-drawer .filter-group-feature label {
  1047. line-height: 1.4;
  1048. }
  1049. .filter-drawer .filter-group-feature input {
  1050. position: absolute;
  1051. margin: 0;
  1052. }
  1053. .filter-group .filter-group-feature label {
  1054. display: block;
  1055. margin: 14px 23px 14px 0;
  1056. }
  1057. .filter-drawer .buttons {
  1058. clear: both;
  1059. margin-bottom: 20px;
  1060. }
  1061. .filter-drawer .filter-group + .buttons {
  1062. margin-bottom: 0;
  1063. padding-top: 20px;
  1064. }
  1065. .filter-drawer .buttons .button span {
  1066. display: inline-block;
  1067. opacity: 0.8;
  1068. font-size: 12px;
  1069. text-indent: 10px;
  1070. }
  1071. .wp-filter .button.clear-filters {
  1072. display: none;
  1073. margin-right: 10px;
  1074. }
  1075. .wp-filter .button-link.edit-filters {
  1076. padding: 0 5px;
  1077. line-height: 2.2;
  1078. }
  1079. .filtered-by {
  1080. display: none;
  1081. margin: 0;
  1082. }
  1083. .filtered-by > span {
  1084. font-weight: 600;
  1085. }
  1086. .filtered-by a {
  1087. margin-right: 10px;
  1088. }
  1089. .filtered-by .tags {
  1090. display: inline;
  1091. }
  1092. .filtered-by .tag {
  1093. margin: 0 5px;
  1094. padding: 4px 8px;
  1095. border: 1px solid #dcdcde;
  1096. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
  1097. background: #fff;
  1098. font-size: 11px;
  1099. }
  1100. .filters-applied .filter-group,
  1101. .filters-applied .filter-drawer .buttons,
  1102. .filters-applied .filter-drawer br {
  1103. display: none;
  1104. }
  1105. .filters-applied .filtered-by {
  1106. display: block;
  1107. }
  1108. .filters-applied .filter-drawer {
  1109. padding: 20px;
  1110. }
  1111. .show-filters .favorites-form,
  1112. .show-filters .content-filterable,
  1113. .show-filters.filters-applied.loading-content .content-filterable,
  1114. .loading-content .content-filterable,
  1115. .error .content-filterable {
  1116. display: none;
  1117. }
  1118. .show-filters.filters-applied .content-filterable {
  1119. display: block;
  1120. }
  1121. .loading-content .spinner {
  1122. display: block;
  1123. margin: 40px auto 0;
  1124. float: none;
  1125. }
  1126. @media only screen and (max-width: 1120px) {
  1127. .filter-drawer {
  1128. border-bottom: 1px solid #f0f0f1;
  1129. }
  1130. .filter-group {
  1131. margin-bottom: 0;
  1132. margin-top: 5px;
  1133. width: 100%;
  1134. }
  1135. .filter-group li {
  1136. margin: 10px 0;
  1137. }
  1138. }
  1139. @media only screen and (max-width: 1000px) {
  1140. .filter-items {
  1141. float: none;
  1142. }
  1143. .wp-filter .media-toolbar-primary,
  1144. .wp-filter .media-toolbar-secondary,
  1145. .wp-filter .search-form {
  1146. float: none; /* Remove float from media-views.css */
  1147. position: relative;
  1148. max-width: 100%;
  1149. }
  1150. }
  1151. @media only screen and (max-width: 782px) {
  1152. .filter-group li {
  1153. padding: 0;
  1154. width: 50%;
  1155. }
  1156. }
  1157. @media only screen and (max-width: 320px) {
  1158. .filter-count {
  1159. display: none;
  1160. }
  1161. .wp-filter .drawer-toggle {
  1162. margin: 10px 0;
  1163. }
  1164. .filter-group li,
  1165. .wp-filter .search-form input[type="search"] {
  1166. width: 100%;
  1167. }
  1168. }
  1169. /*------------------------------------------------------------------------------
  1170. 4.0 - Notifications
  1171. ------------------------------------------------------------------------------*/
  1172. .notice,
  1173. div.updated,
  1174. div.error {
  1175. background: #fff;
  1176. border: 1px solid #c3c4c7;
  1177. border-right-width: 4px;
  1178. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
  1179. margin: 5px 15px 2px;
  1180. padding: 1px 12px;
  1181. }
  1182. div[class="update-message"] { /* back-compat for pre-4.6 */
  1183. padding: 0.5em 0 0.5em 12px;
  1184. }
  1185. .notice p,
  1186. .notice-title,
  1187. div.updated p,
  1188. div.error p,
  1189. .form-table td .notice p {
  1190. margin: 0.5em 0;
  1191. padding: 2px;
  1192. }
  1193. .error a {
  1194. text-decoration: underline;
  1195. }
  1196. .updated a {
  1197. padding-bottom: 2px;
  1198. }
  1199. .notice-alt {
  1200. box-shadow: none;
  1201. }
  1202. .notice-large {
  1203. padding: 10px 20px;
  1204. }
  1205. .notice-title {
  1206. display: inline-block;
  1207. color: #1d2327;
  1208. font-size: 18px;
  1209. }
  1210. .wp-core-ui .notice.is-dismissible {
  1211. padding-left: 38px;
  1212. position: relative;
  1213. }
  1214. .notice-dismiss {
  1215. position: absolute;
  1216. top: 0;
  1217. left: 1px;
  1218. border: none;
  1219. margin: 0;
  1220. padding: 9px;
  1221. background: none;
  1222. color: #787c82;
  1223. cursor: pointer;
  1224. }
  1225. .notice-dismiss:hover:before,
  1226. .notice-dismiss:active:before,
  1227. .notice-dismiss:focus:before {
  1228. color: #d63638;
  1229. }
  1230. .notice-dismiss:focus {
  1231. outline: none;
  1232. box-shadow:
  1233. 0 0 0 1px #4f94d4,
  1234. 0 0 2px 1px rgba(79, 148, 212, 0.8);
  1235. }
  1236. .notice-success,
  1237. div.updated {
  1238. border-right-color: #00a32a;
  1239. }
  1240. .notice-success.notice-alt {
  1241. background-color: #edfaef;
  1242. }
  1243. .notice-warning {
  1244. border-right-color: #dba617;
  1245. }
  1246. .notice-warning.notice-alt {
  1247. background-color: #fcf9e8;
  1248. }
  1249. .notice-error,
  1250. div.error {
  1251. border-right-color: #d63638;
  1252. }
  1253. .notice-error.notice-alt {
  1254. background-color: #fcf0f1;
  1255. }
  1256. .notice-info {
  1257. border-right-color: #72aee6;
  1258. }
  1259. .notice-info.notice-alt {
  1260. background-color: #f0f6fc;
  1261. }
  1262. .update-message p:before,
  1263. .updating-message p:before,
  1264. .updated-message p:before,
  1265. .import-php .updating-message:before,
  1266. .button.updating-message:before,
  1267. .button.updated-message:before,
  1268. .button.installed:before,
  1269. .button.installing:before {
  1270. display: inline-block;
  1271. font: normal 20px/1 'dashicons';
  1272. -webkit-font-smoothing: antialiased;
  1273. -moz-osx-font-smoothing: grayscale;
  1274. vertical-align: top;
  1275. }
  1276. .wrap .notice,
  1277. .wrap div.updated,
  1278. .wrap div.error,
  1279. .media-upload-form .notice,
  1280. .media-upload-form div.error {
  1281. margin: 5px 0 15px;
  1282. }
  1283. .wrap #templateside .notice {
  1284. display: block;
  1285. margin: 0;
  1286. padding: 5px 8px;
  1287. font-weight: 600;
  1288. text-decoration: none;
  1289. }
  1290. .wrap #templateside span.notice {
  1291. margin-right: -12px;
  1292. }
  1293. #templateside li.notice a {
  1294. padding: 0;
  1295. }
  1296. /* Update icon. */
  1297. .update-message p:before,
  1298. .updating-message p:before,
  1299. .import-php .updating-message:before,
  1300. .button.updating-message:before,
  1301. .button.installing:before {
  1302. color: #d63638;
  1303. content: "\f463";
  1304. }
  1305. /* Spins the update icon. */
  1306. .updating-message p:before,
  1307. .import-php .updating-message:before,
  1308. .button.updating-message:before,
  1309. .button.installing:before,
  1310. .plugins .column-auto-updates .dashicons-update.spin,
  1311. .theme-overlay .theme-autoupdate .dashicons-update.spin {
  1312. animation: rotation 2s infinite linear;
  1313. }
  1314. @media (prefers-reduced-motion: reduce) {
  1315. .updating-message p:before,
  1316. .import-php .updating-message:before,
  1317. .button.updating-message:before,
  1318. .button.installing:before,
  1319. .plugins .column-auto-updates .dashicons-update.spin,
  1320. .theme-overlay .theme-autoupdate .dashicons-update.spin {
  1321. animation: none;
  1322. }
  1323. }
  1324. .theme-overlay .theme-autoupdate .dashicons-update.spin {
  1325. margin-left: 3px;
  1326. }
  1327. /* Updated icon (check mark). */
  1328. .updated-message p:before,
  1329. .installed p:before,
  1330. .button.updated-message:before {
  1331. color: #68de7c;
  1332. content: "\f147";
  1333. }
  1334. /* Error icon. */
  1335. .update-message.notice-error p:before {
  1336. color: #d63638;
  1337. content: "\f534";
  1338. }
  1339. .wrap .notice p:before,
  1340. .import-php .updating-message:before {
  1341. margin-left: 6px;
  1342. }
  1343. .import-php .updating-message:before {
  1344. vertical-align: bottom;
  1345. }
  1346. #update-nag,
  1347. .update-nag {
  1348. display: inline-block;
  1349. line-height: 1.4;
  1350. padding: 11px 15px;
  1351. font-size: 14px;
  1352. margin: 25px 2px 0 20px;
  1353. }
  1354. ul#dismissed-updates {
  1355. display: none;
  1356. }
  1357. #dismissed-updates li > p {
  1358. margin-top: 0;
  1359. }
  1360. #dismiss,
  1361. #undismiss {
  1362. margin-right: 0.5em;
  1363. }
  1364. form.upgrade {
  1365. margin-top: 8px;
  1366. }
  1367. form.upgrade .hint {
  1368. font-style: italic;
  1369. font-size: 85%;
  1370. margin: -0.5em 0 2em;
  1371. }
  1372. .update-php .spinner {
  1373. float: none;
  1374. margin: -4px 0;
  1375. }
  1376. h2.wp-current-version {
  1377. margin-bottom: .3em;
  1378. }
  1379. p.update-last-checked {
  1380. margin-top: 0;
  1381. }
  1382. p.auto-update-status {
  1383. margin-top: 2em;
  1384. line-height: 1.8;
  1385. }
  1386. #ajax-loading,
  1387. .ajax-loading,
  1388. .ajax-feedback,
  1389. .imgedit-wait-spin,
  1390. .list-ajax-loading { /* deprecated */
  1391. visibility: hidden;
  1392. }
  1393. #ajax-response.alignleft {
  1394. margin-right: 2em;
  1395. }
  1396. .button.updating-message:before,
  1397. .button.updated-message:before,
  1398. .button.installed:before,
  1399. .button.installing:before {
  1400. margin: 3px -2px 0 5px;
  1401. }
  1402. .button-primary.updating-message:before {
  1403. color: #fff;
  1404. }
  1405. .button-primary.updated-message:before {
  1406. color: #9ec2e6;
  1407. }
  1408. .button.updated-message {
  1409. transition-property: border, background, color;
  1410. transition-duration: .05s;
  1411. transition-timing-function: ease-in-out;
  1412. }
  1413. @media aural {
  1414. .wrap .notice p:before,
  1415. .button.installing:before,
  1416. .button.installed:before,
  1417. .update-message p:before {
  1418. speak: never;
  1419. }
  1420. }
  1421. /* @todo: this does not need its own section anymore */
  1422. /*------------------------------------------------------------------------------
  1423. 6.0 - Admin Header
  1424. ------------------------------------------------------------------------------*/
  1425. #adminmenu a,
  1426. #taglist a,
  1427. #catlist a {
  1428. text-decoration: none;
  1429. }
  1430. /*------------------------------------------------------------------------------
  1431. 6.1 - Screen Options Tabs
  1432. ------------------------------------------------------------------------------*/
  1433. #screen-options-wrap,
  1434. #contextual-help-wrap {
  1435. margin: 0;
  1436. padding: 8px 20px 12px;
  1437. position: relative;
  1438. }
  1439. #contextual-help-wrap {
  1440. overflow: auto;
  1441. margin-right: 0;
  1442. }
  1443. #screen-meta-links {
  1444. float: left;
  1445. margin: 0 0 0 20px;
  1446. }
  1447. /* screen options and help tabs revert */
  1448. #screen-meta {
  1449. display: none;
  1450. margin: 0 0 -1px 20px;
  1451. position: relative;
  1452. background-color: #fff;
  1453. border: 1px solid #c3c4c7;
  1454. border-top: none;
  1455. box-shadow: 0 0 0 transparent;
  1456. }
  1457. #screen-options-link-wrap,
  1458. #contextual-help-link-wrap {
  1459. float: right;
  1460. margin: 0 6px 0 0;
  1461. }
  1462. #screen-meta-links .screen-meta-toggle {
  1463. position: relative;
  1464. top: 0;
  1465. }
  1466. #screen-meta-links .show-settings {
  1467. border: 1px solid #c3c4c7;
  1468. border-top: none;
  1469. height: auto;
  1470. margin-bottom: 0;
  1471. padding: 3px 16px 3px 6px;
  1472. background: #fff;
  1473. border-radius: 0 0 4px 4px;
  1474. color: #646970;
  1475. line-height: 1.7;
  1476. box-shadow: 0 0 0 transparent;
  1477. transition: box-shadow 0.1s linear;
  1478. }
  1479. #screen-meta-links .show-settings:hover,
  1480. #screen-meta-links .show-settings:active,
  1481. #screen-meta-links .show-settings:focus {
  1482. color: #2c3338;
  1483. }
  1484. #screen-meta-links .show-settings:focus {
  1485. border-color: #4f94d4;
  1486. box-shadow: 0 0 3px rgba(34, 113, 177, 0.8);
  1487. }
  1488. #screen-meta-links .show-settings:active {
  1489. transform: none;
  1490. }
  1491. #screen-meta-links .show-settings:after {
  1492. left: 0;
  1493. content: "\f140";
  1494. font: normal 20px/1 dashicons;
  1495. speak: never;
  1496. display: inline-block;
  1497. padding: 0 0 0 5px;
  1498. bottom: 2px;
  1499. position: relative;
  1500. vertical-align: bottom;
  1501. -webkit-font-smoothing: antialiased;
  1502. -moz-osx-font-smoothing: grayscale;
  1503. text-decoration: none;
  1504. }
  1505. #screen-meta-links .screen-meta-active:after {
  1506. content: "\f142";
  1507. }
  1508. /* end screen options and help tabs */
  1509. .toggle-arrow {
  1510. background-repeat: no-repeat;
  1511. background-position: top right;
  1512. background-color: transparent;
  1513. height: 22px;
  1514. line-height: 22px;
  1515. display: block;
  1516. }
  1517. .toggle-arrow-active {
  1518. background-position: bottom right;
  1519. }
  1520. #screen-options-wrap h5, /* Back-compat for old plugins */
  1521. #screen-options-wrap legend,
  1522. #contextual-help-wrap h5 {
  1523. margin: 0;
  1524. padding: 8px 0;
  1525. font-size: 13px;
  1526. font-weight: 600;
  1527. }
  1528. .metabox-prefs label {
  1529. display: inline-block;
  1530. padding-left: 15px;
  1531. line-height: 2.35;
  1532. }
  1533. #number-of-columns {
  1534. display: inline-block;
  1535. vertical-align: middle;
  1536. line-height: 30px;
  1537. }
  1538. .metabox-prefs input[type=checkbox] {
  1539. margin-top: 0;
  1540. margin-left: 6px;
  1541. }
  1542. .metabox-prefs label input,
  1543. .metabox-prefs label input[type=checkbox] {
  1544. margin: -4px 0 0 5px;
  1545. }
  1546. .metabox-prefs .columns-prefs label input {
  1547. margin: -1px 0 0 2px;
  1548. }
  1549. .metabox-prefs label a {
  1550. display: none;
  1551. }
  1552. .metabox-prefs .screen-options input,
  1553. .metabox-prefs .screen-options label {
  1554. margin-top: 0;
  1555. margin-bottom: 0;
  1556. vertical-align: middle;
  1557. }
  1558. .metabox-prefs .screen-options .screen-per-page {
  1559. margin-left: 15px;
  1560. padding-left: 0;
  1561. }
  1562. .metabox-prefs .screen-options label {
  1563. line-height: 2.2;
  1564. padding-left: 0;
  1565. }
  1566. .screen-options + .screen-options {
  1567. margin-top: 10px;
  1568. }
  1569. .metabox-prefs .submit {
  1570. margin-top: 1em;
  1571. padding: 0;
  1572. }
  1573. /*------------------------------------------------------------------------------
  1574. 6.2 - Help Menu
  1575. ------------------------------------------------------------------------------*/
  1576. #contextual-help-wrap {
  1577. padding: 0;
  1578. }
  1579. #contextual-help-columns {
  1580. position: relative;
  1581. }
  1582. #contextual-help-back {
  1583. position: absolute;
  1584. top: 0;
  1585. bottom: 0;
  1586. right: 150px;
  1587. left: 170px;
  1588. border: 1px solid #c3c4c7;
  1589. border-top: none;
  1590. border-bottom: none;
  1591. background: #f0f6fc;
  1592. }
  1593. #contextual-help-wrap.no-sidebar #contextual-help-back {
  1594. left: 0;
  1595. border-left-width: 0;
  1596. border-bottom-left-radius: 2px;
  1597. }
  1598. .contextual-help-tabs {
  1599. float: right;
  1600. width: 150px;
  1601. margin: 0;
  1602. }
  1603. .contextual-help-tabs ul {
  1604. margin: 1em 0;
  1605. }
  1606. .contextual-help-tabs li {
  1607. margin-bottom: 0;
  1608. list-style-type: none;
  1609. border-style: solid;
  1610. border-width: 0 2px 0 0;
  1611. border-color: transparent;
  1612. }
  1613. .contextual-help-tabs a {
  1614. display: block;
  1615. padding: 5px 12px 5px 5px;
  1616. line-height: 1.4;
  1617. text-decoration: none;
  1618. border: 1px solid transparent;
  1619. border-left: none;
  1620. border-right: none;
  1621. }
  1622. .contextual-help-tabs a:hover {
  1623. color: #2c3338;
  1624. }
  1625. .contextual-help-tabs .active {
  1626. padding: 0;
  1627. margin: 0 0 0 -1px;
  1628. border-right: 2px solid #72aee6;
  1629. background: #f0f6fc;
  1630. box-shadow: 0 2px 0 rgba(0, 0, 0, 0.02), 0 1px 0 rgba(0, 0, 0, 0.02);
  1631. }
  1632. .contextual-help-tabs .active a {
  1633. border-color: #c3c4c7;
  1634. color: #2c3338;
  1635. }
  1636. .contextual-help-tabs-wrap {
  1637. padding: 0 20px;
  1638. overflow: auto;
  1639. }
  1640. .help-tab-content {
  1641. display: none;
  1642. margin: 0 0 12px 22px;
  1643. line-height: 1.6;
  1644. }
  1645. .help-tab-content.active {
  1646. display: block;
  1647. }
  1648. .help-tab-content ul li {
  1649. list-style-type: disc;
  1650. margin-right: 18px;
  1651. }
  1652. .contextual-help-sidebar {
  1653. width: 150px;
  1654. float: left;
  1655. padding: 0 12px 0 8px;
  1656. overflow: auto;
  1657. }
  1658. /*------------------------------------------------------------------------------
  1659. 8.0 - Layout Blocks
  1660. ------------------------------------------------------------------------------*/
  1661. html.wp-toolbar {
  1662. padding-top: 32px;
  1663. box-sizing: border-box;
  1664. -ms-overflow-style: scrollbar; /* See ticket #48545 */
  1665. }
  1666. .widefat th,
  1667. .widefat td {
  1668. color: #50575e;
  1669. }
  1670. .widefat th,
  1671. .widefat thead td,
  1672. .widefat tfoot td {
  1673. font-weight: 400;
  1674. }
  1675. .widefat thead tr th,
  1676. .widefat thead tr td,
  1677. .widefat tfoot tr th,
  1678. .widefat tfoot tr td {
  1679. color: #2c3338;
  1680. }
  1681. .widefat td p {
  1682. margin: 2px 0 0.8em;
  1683. }
  1684. .widefat p,
  1685. .widefat ol,
  1686. .widefat ul {
  1687. color: #2c3338;
  1688. }
  1689. .widefat .column-comment p {
  1690. margin: 0.6em 0;
  1691. }
  1692. .widefat .column-comment ul {
  1693. list-style: initial;
  1694. margin-right: 2em;
  1695. }
  1696. /* Screens with postboxes */
  1697. .postbox-container {
  1698. float: right;
  1699. }
  1700. .postbox-container .meta-box-sortables {
  1701. box-sizing: border-box;
  1702. }
  1703. #wpbody-content .metabox-holder {
  1704. padding-top: 10px;
  1705. }
  1706. .metabox-holder .postbox-container .meta-box-sortables {
  1707. /* The jQuery UI Sortables need some initial height to work properly. */
  1708. min-height: 1px;
  1709. position: relative;
  1710. }
  1711. #post-body-content {
  1712. width: 100%;
  1713. min-width: 463px;
  1714. float: right;
  1715. }
  1716. #post-body.columns-2 #postbox-container-1 {
  1717. float: left;
  1718. margin-left: -300px;
  1719. width: 280px;
  1720. }
  1721. #post-body.columns-2 #side-sortables {
  1722. min-height: 250px;
  1723. }
  1724. /* one column on the dash */
  1725. @media only screen and (max-width: 799px) {
  1726. #wpbody-content .metabox-holder .postbox-container .empty-container {
  1727. outline: none;
  1728. height: 0;
  1729. min-height: 0;
  1730. }
  1731. }
  1732. .js .widget .widget-top,
  1733. .js .postbox .hndle {
  1734. cursor: move;
  1735. }
  1736. .js .widget .widget-top.is-non-sortable,
  1737. .js .postbox .hndle.is-non-sortable {
  1738. cursor: auto;
  1739. }
  1740. /* Configurable dashboard widgets "Configure" edit-box link. */
  1741. .hndle a {
  1742. font-size: 12px;
  1743. font-weight: 400;
  1744. }
  1745. .postbox-header {
  1746. display: flex;
  1747. align-items: center;
  1748. justify-content: space-between;
  1749. border-bottom: 1px solid #c3c4c7;
  1750. }
  1751. .postbox-header .hndle {
  1752. flex-grow: 1;
  1753. /* Handle the alignment for the configurable dashboard widgets "Configure" edit-box link. */
  1754. display: flex;
  1755. justify-content: space-between;
  1756. align-items: center;
  1757. }
  1758. .postbox-header .handle-actions {
  1759. flex-shrink: 0;
  1760. }
  1761. /* Post box order and toggle buttons. */
  1762. .postbox .handle-order-higher,
  1763. .postbox .handle-order-lower,
  1764. .postbox .handlediv {
  1765. width: 36px;
  1766. height: 36px;
  1767. margin: 0;
  1768. padding: 0;
  1769. border: 0;
  1770. background: none;
  1771. cursor: pointer;
  1772. }
  1773. .postbox .handle-order-higher,
  1774. .postbox .handle-order-lower {
  1775. color: #787c82;
  1776. width: 1.62rem;
  1777. }
  1778. /* Post box order buttons in the block editor meta boxes area. */
  1779. .edit-post-meta-boxes-area .postbox .handle-order-higher,
  1780. .edit-post-meta-boxes-area .postbox .handle-order-lower {
  1781. width: 44px;
  1782. height: 44px;
  1783. color: #1d2327
  1784. }
  1785. .postbox .handle-order-higher[aria-disabled="true"],
  1786. .postbox .handle-order-lower[aria-disabled="true"] {
  1787. cursor: default;
  1788. color: #a7aaad;
  1789. }
  1790. .sortable-placeholder {
  1791. border: 1px dashed #c3c4c7;
  1792. margin-bottom: 20px;
  1793. }
  1794. .postbox,
  1795. .stuffbox {
  1796. margin-bottom: 20px;
  1797. padding: 0;
  1798. line-height: 1;
  1799. }
  1800. .postbox.closed {
  1801. border-bottom: 0;
  1802. }
  1803. /* user-select is not a part of the CSS standard - may change behavior in the future */
  1804. .postbox .hndle,
  1805. .stuffbox .hndle {
  1806. -webkit-user-select: none;
  1807. user-select: none;
  1808. }
  1809. .postbox .inside {
  1810. padding: 0 12px 12px;
  1811. line-height: 1.4;
  1812. font-size: 13px;
  1813. }
  1814. .stuffbox .inside {
  1815. padding: 0;
  1816. line-height: 1.4;
  1817. font-size: 13px;
  1818. margin-top: 0;
  1819. }
  1820. .postbox .inside {
  1821. margin: 11px 0;
  1822. position: relative;
  1823. }
  1824. .postbox .inside > p:last-child,
  1825. .rss-widget ul li:last-child {
  1826. margin-bottom: 1px !important;
  1827. }
  1828. .postbox.closed h3 {
  1829. border: none;
  1830. box-shadow: none;
  1831. }
  1832. .postbox table.form-table {
  1833. margin-bottom: 0;
  1834. }
  1835. .postbox table.widefat {
  1836. box-shadow: none;
  1837. }
  1838. .temp-border {
  1839. border: 1px dotted #c3c4c7;
  1840. }
  1841. .columns-prefs label {
  1842. padding: 0 0 0 10px;
  1843. }
  1844. /* @todo: what is this doing here */
  1845. #dashboard_right_now .versions .b,
  1846. #post-status-display,
  1847. #post-visibility-display,
  1848. #adminmenu .wp-submenu li.current,
  1849. #adminmenu .wp-submenu li.current a,
  1850. #adminmenu .wp-submenu li.current a:hover,
  1851. .media-item .percent,
  1852. .plugins .name,
  1853. #pass-strength-result.strong,
  1854. #pass-strength-result.short,
  1855. #ed_reply_toolbar #ed_reply_strong,
  1856. .item-controls .item-order a,
  1857. .feature-filter .feature-name,
  1858. #comment-status-display {
  1859. font-weight: 600;
  1860. }
  1861. /*------------------------------------------------------------------------------
  1862. 21.0 - Admin Footer
  1863. ------------------------------------------------------------------------------*/
  1864. #wpfooter {
  1865. position: absolute;
  1866. bottom: 0;
  1867. right: 0;
  1868. left: 0;
  1869. padding: 10px 20px;
  1870. color: #50575e;
  1871. }
  1872. #wpfooter p {
  1873. font-size: 13px;
  1874. margin: 0;
  1875. line-height: 1.55;
  1876. }
  1877. #footer-thankyou {
  1878. font-style: italic;
  1879. }
  1880. /*------------------------------------------------------------------------------
  1881. 25.0 - Tabbed Admin Screen Interface (Experimental)
  1882. ------------------------------------------------------------------------------*/
  1883. .nav-tab {
  1884. float: right;
  1885. border: 1px solid #c3c4c7;
  1886. border-bottom: none;
  1887. margin-right: 0.5em; /* half the font size so set the font size properly */
  1888. padding: 5px 10px;
  1889. font-size: 14px;
  1890. line-height: 1.71428571;
  1891. font-weight: 600;
  1892. background: #dcdcde;
  1893. color: #50575e;
  1894. text-decoration: none;
  1895. white-space: nowrap;
  1896. }
  1897. h3 .nav-tab, /* Back-compat for pre-4.4 */
  1898. .nav-tab-small .nav-tab {
  1899. padding: 5px 14px;
  1900. font-size: 12px;
  1901. line-height: 1.33;
  1902. }
  1903. .nav-tab:hover,
  1904. .nav-tab:focus {
  1905. background-color: #fff;
  1906. color: #3c434a;
  1907. }
  1908. .nav-tab-active,
  1909. .nav-tab:focus:active {
  1910. box-shadow: none;
  1911. }
  1912. .nav-tab-active {
  1913. margin-bottom: -1px;
  1914. color: #3c434a;
  1915. }
  1916. .nav-tab-active,
  1917. .nav-tab-active:hover,
  1918. .nav-tab-active:focus,
  1919. .nav-tab-active:focus:active {
  1920. border-bottom: 1px solid #f0f0f1;
  1921. background: #f0f0f1;
  1922. color: #000;
  1923. }
  1924. h1.nav-tab-wrapper, /* Back-compat for pre-4.4 */
  1925. .wrap h2.nav-tab-wrapper, /* higher specificity to override .wrap > h2:first-child */
  1926. .nav-tab-wrapper {
  1927. border-bottom: 1px solid #c3c4c7;
  1928. margin: 0;
  1929. padding-top: 9px;
  1930. padding-bottom: 0;
  1931. line-height: inherit;
  1932. }
  1933. /* Back-compat for plugins. Deprecated. Use .wp-clearfix instead. */
  1934. .nav-tab-wrapper:not(.wp-clearfix):after {
  1935. content: "";
  1936. display: table;
  1937. clear: both;
  1938. }
  1939. /*------------------------------------------------------------------------------
  1940. 26.0 - Misc
  1941. ------------------------------------------------------------------------------*/
  1942. .spinner {
  1943. background: url(../images/spinner.gif) no-repeat;
  1944. background-size: 20px 20px;
  1945. display: inline-block;
  1946. visibility: hidden;
  1947. float: left;
  1948. vertical-align: middle;
  1949. opacity: 0.7;
  1950. filter: alpha(opacity=70);
  1951. width: 20px;
  1952. height: 20px;
  1953. margin: 4px 10px 0;
  1954. }
  1955. .spinner.is-active,
  1956. .loading-content .spinner {
  1957. visibility: visible;
  1958. }
  1959. #template > div {
  1960. margin-left: 16em;
  1961. }
  1962. #template .notice {
  1963. margin-top: 1em;
  1964. margin-left: 3%;
  1965. }
  1966. #template .notice p {
  1967. width: auto;
  1968. }
  1969. #template .submit .spinner {
  1970. float: none;
  1971. }
  1972. .metabox-holder .stuffbox > h3, /* Back-compat for pre-4.4 */
  1973. .metabox-holder .postbox > h3, /* Back-compat for pre-4.4 */
  1974. .metabox-holder h3.hndle, /* Back-compat for pre-4.4 */
  1975. .metabox-holder h2.hndle {
  1976. font-size: 14px;
  1977. padding: 8px 12px;
  1978. margin: 0;
  1979. line-height: 1.4;
  1980. }
  1981. /* Back-compat for nav-menus screen */
  1982. .nav-menus-php .metabox-holder h3 {
  1983. padding: 10px 14px 11px 10px;
  1984. line-height: 1.5;
  1985. }
  1986. #templateside ul li a {
  1987. text-decoration: none;
  1988. }
  1989. .plugin-install #description,
  1990. .plugin-install-network #description {
  1991. width: 60%;
  1992. }
  1993. table .vers,
  1994. table .column-visible,
  1995. table .column-rating {
  1996. text-align: right;
  1997. }
  1998. .attention,
  1999. .error-message {
  2000. color: #d63638;
  2001. font-weight: 600;
  2002. }
  2003. /* Scrollbar fix for bulk upgrade iframe */
  2004. body.iframe {
  2005. height: 98%;
  2006. }
  2007. /* Upgrader styles, Specific to Language Packs */
  2008. .lp-show-latest p {
  2009. display: none;
  2010. }
  2011. .lp-show-latest p:last-child,
  2012. .lp-show-latest .lp-error p {
  2013. display: block;
  2014. }
  2015. /* - Only used once or twice in all of WP - deprecate for global style
  2016. ------------------------------------------------------------------------------*/
  2017. .media-icon {
  2018. width: 62px; /* icon + border */
  2019. text-align: center;
  2020. }
  2021. .media-icon img {
  2022. border: 1px solid #dcdcde;
  2023. border: 1px solid rgba(0, 0, 0, 0.07);
  2024. }
  2025. #howto {
  2026. font-size: 11px;
  2027. margin: 0 5px;
  2028. display: block;
  2029. }
  2030. .importers {
  2031. font-size: 16px;
  2032. width: auto;
  2033. }
  2034. .importers td {
  2035. padding-left: 14px;
  2036. line-height: 1.4;
  2037. }
  2038. .importers .import-system {
  2039. max-width: 250px;
  2040. }
  2041. .importers td.desc {
  2042. max-width: 500px;
  2043. }
  2044. .importer-title,
  2045. .importer-desc,
  2046. .importer-action {
  2047. display: block;
  2048. }
  2049. .importer-title {
  2050. color: #000;
  2051. font-size: 14px;
  2052. font-weight: 400;
  2053. margin-bottom: .2em;
  2054. }
  2055. .importer-action {
  2056. line-height: 1.55; /* Same as with .updating-message */
  2057. color: #50575e;
  2058. margin-bottom: 1em;
  2059. }
  2060. #post-body #post-body-content #namediv h3, /* Back-compat for pre-4.4 */
  2061. #post-body #post-body-content #namediv h2 {
  2062. margin-top: 0;
  2063. }
  2064. .edit-comment-author {
  2065. color: #1d2327;
  2066. border-bottom: 1px solid #f0f0f1;
  2067. }
  2068. #namediv h3 label, /* Back-compat for pre-4.4 */
  2069. #namediv h2 label {
  2070. vertical-align: baseline;
  2071. }
  2072. #namediv table {
  2073. width: 100%;
  2074. }
  2075. #namediv td.first {
  2076. width: 10px;
  2077. white-space: nowrap;
  2078. }
  2079. #namediv input {
  2080. width: 100%;
  2081. }
  2082. #namediv p {
  2083. margin: 10px 0;
  2084. }
  2085. /* - Used - but could/should be deprecated with a CSS reset
  2086. ------------------------------------------------------------------------------*/
  2087. .zerosize {
  2088. height: 0;
  2089. width: 0;
  2090. margin: 0;
  2091. border: 0;
  2092. padding: 0;
  2093. overflow: hidden;
  2094. position: absolute;
  2095. }
  2096. br.clear {
  2097. height: 2px;
  2098. line-height: 0.15;
  2099. }
  2100. .checkbox {
  2101. border: none;
  2102. margin: 0;
  2103. padding: 0;
  2104. }
  2105. fieldset {
  2106. border: 0;
  2107. padding: 0;
  2108. margin: 0;
  2109. }
  2110. .post-categories {
  2111. display: inline;
  2112. margin: 0;
  2113. padding: 0;
  2114. }
  2115. .post-categories li {
  2116. display: inline;
  2117. }
  2118. /* Star Ratings - Back-compat for pre-3.8 */
  2119. div.star-holder {
  2120. position: relative;
  2121. height: 17px;
  2122. width: 100px;
  2123. background: url(../images/stars.png?ver=20121108) repeat-x bottom right;
  2124. }
  2125. div.star-holder .star-rating {
  2126. background: url(../images/stars.png?ver=20121108) repeat-x top right;
  2127. height: 17px;
  2128. float: right;
  2129. }
  2130. /* Star Ratings */
  2131. .star-rating {
  2132. white-space: nowrap;
  2133. }
  2134. .star-rating .star {
  2135. display: inline-block;
  2136. width: 20px;
  2137. height: 20px;
  2138. -webkit-font-smoothing: antialiased;
  2139. font-size: 20px;
  2140. line-height: 1;
  2141. font-family: dashicons;
  2142. text-decoration: inherit;
  2143. font-weight: 400;
  2144. font-style: normal;
  2145. vertical-align: top;
  2146. transition: color .1s ease-in;
  2147. text-align: center;
  2148. color: #dba617;
  2149. }
  2150. .star-rating .star-full:before {
  2151. content: "\f155";
  2152. }
  2153. .star-rating .star-half:before {
  2154. content: "\f459";
  2155. }
  2156. .rtl .star-rating .star-half {
  2157. transform: rotateY(-180deg);
  2158. }
  2159. .star-rating .star-empty:before {
  2160. content: "\f154";
  2161. }
  2162. div.action-links {
  2163. font-weight: 400;
  2164. margin: 6px 0 0;
  2165. }
  2166. /* Plugin install thickbox */
  2167. #plugin-information {
  2168. background: #fff;
  2169. position: fixed;
  2170. top: 0;
  2171. left: 0;
  2172. bottom: 0;
  2173. right: 0;
  2174. height: 100%;
  2175. padding: 0;
  2176. }
  2177. #plugin-information-scrollable {
  2178. overflow: auto;
  2179. -webkit-overflow-scrolling: touch;
  2180. height: 100%;
  2181. }
  2182. #plugin-information-title {
  2183. padding: 0 26px;
  2184. background: #f6f7f7;
  2185. font-size: 22px;
  2186. font-weight: 600;
  2187. line-height: 2.4;
  2188. position: relative;
  2189. height: 56px;
  2190. }
  2191. #plugin-information-title.with-banner {
  2192. margin-left: 0;
  2193. height: 250px;
  2194. background-size: cover;
  2195. }
  2196. #plugin-information-title h2 {
  2197. font-size: 1em;
  2198. font-weight: 600;
  2199. padding: 0;
  2200. margin: 0;
  2201. overflow: hidden;
  2202. text-overflow: ellipsis;
  2203. white-space: nowrap;
  2204. }
  2205. #plugin-information-title.with-banner h2 {
  2206. position: relative;
  2207. font-family: "Helvetica Neue", sans-serif;
  2208. display: inline-block;
  2209. font-size: 30px;
  2210. line-height: 1.68;
  2211. box-sizing: border-box;
  2212. max-width: 100%;
  2213. padding: 0 15px;
  2214. margin-top: 174px;
  2215. color: #fff;
  2216. background: rgba(29, 35, 39, 0.9);
  2217. text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
  2218. box-shadow: 0 0 30px rgba(255, 255, 255, 0.1);
  2219. border-radius: 8px;
  2220. }
  2221. #plugin-information-title div.vignette {
  2222. display: none;
  2223. }
  2224. #plugin-information-title.with-banner div.vignette {
  2225. position: absolute;
  2226. display: block;
  2227. top: 0;
  2228. right: 0;
  2229. height: 250px;
  2230. width: 100%;
  2231. background: transparent;
  2232. box-shadow: inset 0 0 50px 4px rgba(0, 0, 0, 0.2), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  2233. }
  2234. #plugin-information-tabs {
  2235. padding: 0 16px;
  2236. position: relative;
  2237. left: 0;
  2238. right: 0;
  2239. min-height: 36px;
  2240. font-size: 0;
  2241. z-index: 1;
  2242. border-bottom: 1px solid #dcdcde;
  2243. background: #f6f7f7;
  2244. }
  2245. #plugin-information-tabs a {
  2246. position: relative;
  2247. display: inline-block;
  2248. padding: 9px 10px;
  2249. margin: 0;
  2250. height: 18px;
  2251. line-height: 1.3;
  2252. font-size: 14px;
  2253. text-decoration: none;
  2254. transition: none;
  2255. }
  2256. #plugin-information-tabs a.current {
  2257. margin: 0 -1px -1px;
  2258. background: #fff;
  2259. border: 1px solid #dcdcde;
  2260. border-bottom-color: #fff;
  2261. padding-top: 8px;
  2262. color: #2c3338;
  2263. }
  2264. #plugin-information-tabs.with-banner a.current {
  2265. border-top: none;
  2266. padding-top: 9px;
  2267. }
  2268. #plugin-information-tabs a:active,
  2269. #plugin-information-tabs a:focus {
  2270. outline: none;
  2271. }
  2272. #plugin-information-content {
  2273. overflow: hidden; /* equal height column trick */
  2274. background: #fff;
  2275. position: relative;
  2276. top: 0;
  2277. left: 0;
  2278. right: 0;
  2279. min-height: 100%;
  2280. /* Height of title + tabs + install now */
  2281. min-height: calc( 100% - 152px );
  2282. }
  2283. #plugin-information-content.with-banner {
  2284. /* Height of banner + tabs + install now */
  2285. min-height: calc( 100% - 346px );
  2286. }
  2287. #section-holder {
  2288. position: relative;
  2289. top: 0;
  2290. left: 250px;
  2291. bottom: 0;
  2292. right: 0;
  2293. margin-top: 10px;
  2294. margin-left: 250px; /* FYI box */
  2295. padding: 10px 26px 99999px; /* equal height column trick */
  2296. margin-bottom: -99932px; /* 67px less than the padding below to accommodate footer height */
  2297. }
  2298. #section-holder .notice {
  2299. margin: 5px 0 15px;
  2300. }
  2301. #section-holder .updated {
  2302. margin: 16px 0;
  2303. }
  2304. #plugin-information .fyi {
  2305. float: left;
  2306. position: relative;
  2307. top: 0;
  2308. left: 0;
  2309. padding: 16px 16px 99999px; /* equal height column trick */
  2310. margin-bottom: -99932px; /* 67px less than the padding below to accommodate footer height */
  2311. width: 217px;
  2312. border-right: 1px solid #dcdcde;
  2313. background: #f6f7f7;
  2314. color: #646970;
  2315. }
  2316. #plugin-information .fyi strong {
  2317. color: #3c434a;
  2318. }
  2319. #plugin-information .fyi h3 {
  2320. font-weight: 600;
  2321. text-transform: uppercase;
  2322. font-size: 12px;
  2323. color: #646970;
  2324. margin: 24px 0 8px;
  2325. }
  2326. #plugin-information .fyi h2 {
  2327. font-size: 0.9em;
  2328. margin-bottom: 0;
  2329. margin-left: 0;
  2330. }
  2331. #plugin-information .fyi ul {
  2332. padding: 0;
  2333. margin: 0;
  2334. list-style: none;
  2335. }
  2336. #plugin-information .fyi li {
  2337. margin: 0 0 10px;
  2338. }
  2339. #plugin-information .fyi-description {
  2340. margin-top: 0;
  2341. }
  2342. #plugin-information .counter-container {
  2343. margin: 3px 0;
  2344. }
  2345. #plugin-information .counter-label {
  2346. float: right;
  2347. margin-left: 5px;
  2348. min-width: 55px;
  2349. }
  2350. #plugin-information .counter-back {
  2351. height: 17px;
  2352. width: 92px;
  2353. background-color: #dcdcde;
  2354. float: right;
  2355. }
  2356. #plugin-information .counter-bar {
  2357. height: 17px;
  2358. background-color: #f0c33c; /* slightly lighter than stars due to larger expanse */
  2359. float: right;
  2360. }
  2361. #plugin-information .counter-count {
  2362. margin-right: 5px;
  2363. }
  2364. #plugin-information .fyi ul.contributors {
  2365. margin-top: 10px;
  2366. }
  2367. #plugin-information .fyi ul.contributors li {
  2368. display: inline-block;
  2369. margin-left: 8px;
  2370. vertical-align: middle;
  2371. }
  2372. #plugin-information .fyi ul.contributors li {
  2373. display: inline-block;
  2374. margin-left: 8px;
  2375. vertical-align: middle;
  2376. }
  2377. #plugin-information .fyi ul.contributors li img {
  2378. vertical-align: middle;
  2379. margin-left: 4px;
  2380. }
  2381. #plugin-information-footer {
  2382. padding: 13px 16px;
  2383. position: absolute;
  2384. left: 0;
  2385. bottom: 0;
  2386. right: 0;
  2387. height: 40px; /* actual height: 40+13+13+1=67 */
  2388. border-top: 1px solid #dcdcde;
  2389. background: #f6f7f7;
  2390. }
  2391. /* rtl:ignore */
  2392. #plugin-information .section {
  2393. direction: ltr;
  2394. }
  2395. /* rtl:ignore */
  2396. #plugin-information .section ul,
  2397. #plugin-information .section ol {
  2398. list-style-type: disc;
  2399. margin-left: 24px;
  2400. }
  2401. #plugin-information .section,
  2402. #plugin-information .section p {
  2403. font-size: 14px;
  2404. line-height: 1.7;
  2405. }
  2406. #plugin-information #section-screenshots ol {
  2407. list-style: none;
  2408. margin: 0;
  2409. }
  2410. #plugin-information #section-screenshots li img {
  2411. vertical-align: text-top;
  2412. margin-top: 16px;
  2413. max-width: 100%;
  2414. width: auto;
  2415. height: auto;
  2416. box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  2417. }
  2418. /* rtl:ignore */
  2419. #plugin-information #section-screenshots li p {
  2420. font-style: italic;
  2421. padding-left: 20px;
  2422. }
  2423. #plugin-information pre {
  2424. padding: 7px;
  2425. overflow: auto;
  2426. border: 1px solid #c3c4c7;
  2427. }
  2428. #plugin-information blockquote {
  2429. border-right: 2px solid #dcdcde;
  2430. color: #646970;
  2431. font-style: italic;
  2432. margin: 1em 0;
  2433. padding: 0 1em 0 0;
  2434. }
  2435. /* rtl:ignore */
  2436. #plugin-information .review {
  2437. overflow: hidden; /* clearfix */
  2438. width: 100%;
  2439. margin-bottom: 20px;
  2440. border-bottom: 1px solid #dcdcde;
  2441. }
  2442. #plugin-information .review-title-section {
  2443. overflow: hidden; /* clearfix */
  2444. }
  2445. /* rtl:ignore */
  2446. #plugin-information .review-title-section h4 {
  2447. display: inline-block;
  2448. float: left;
  2449. margin: 0 6px 0 0;
  2450. }
  2451. #plugin-information .reviewer-info p {
  2452. clear: both;
  2453. margin: 0;
  2454. padding-top: 2px;
  2455. }
  2456. /* rtl:ignore */
  2457. #plugin-information .reviewer-info .avatar {
  2458. float: left;
  2459. margin: 4px 6px 0 0;
  2460. }
  2461. /* rtl:ignore */
  2462. #plugin-information .reviewer-info .star-rating {
  2463. float: left;
  2464. }
  2465. /* rtl:ignore */
  2466. #plugin-information .review-meta {
  2467. float: left;
  2468. margin-left: 0.75em;
  2469. }
  2470. /* rtl:ignore */
  2471. #plugin-information .review-body {
  2472. float: left;
  2473. width: 100%;
  2474. }
  2475. .plugin-version-author-uri {
  2476. font-size: 13px;
  2477. }
  2478. /* For non-js plugin installation screen ticket #36430. */
  2479. .update-php .button.button-primary {
  2480. margin-left: 1em;
  2481. }
  2482. @media screen and (max-width: 771px) {
  2483. #plugin-information-title.with-banner {
  2484. height: 100px;
  2485. }
  2486. #plugin-information-title.with-banner h2 {
  2487. margin-top: 30px;
  2488. font-size: 20px;
  2489. line-height: 2;
  2490. max-width: 85%;
  2491. }
  2492. #plugin-information-title.with-banner div.vignette {
  2493. height: 100px;
  2494. }
  2495. #plugin-information-tabs {
  2496. overflow: hidden; /* clearfix */
  2497. padding: 0;
  2498. height: auto; /* let tabs wrap */
  2499. }
  2500. #plugin-information-tabs a.current {
  2501. margin-bottom: 0;
  2502. border-bottom: none;
  2503. }
  2504. #plugin-information .fyi {
  2505. float: none;
  2506. border: 1px solid #dcdcde;
  2507. position: static;
  2508. width: auto;
  2509. margin: 26px 26px 0;
  2510. padding-bottom: 0; /* reset from the two column height fix */
  2511. }
  2512. #section-holder {
  2513. position: static;
  2514. margin: 0;
  2515. padding-bottom: 70px; /* reset from the two column height fix, plus accommodate footer */
  2516. }
  2517. #plugin-information .fyi h3,
  2518. #plugin-information .fyi small {
  2519. display: none;
  2520. }
  2521. #plugin-information-footer {
  2522. padding: 12px 16px 0;
  2523. height: 46px;
  2524. }
  2525. }
  2526. /* Thickbox for the Plugin details modal. */
  2527. #TB_window.plugin-details-modal {
  2528. background: #fff;
  2529. }
  2530. #TB_window.plugin-details-modal.thickbox-loading:before {
  2531. content: "";
  2532. display: block;
  2533. width: 20px;
  2534. height: 20px;
  2535. position: absolute;
  2536. right: 50%;
  2537. top: 50%;
  2538. z-index: -1;
  2539. margin: -10px -10px 0 0;
  2540. background: #fff url(../images/spinner.gif) no-repeat center;
  2541. background-size: 20px 20px;
  2542. transform: translateZ(0);
  2543. }
  2544. @media print,
  2545. (-webkit-min-device-pixel-ratio: 1.25),
  2546. (min-resolution: 120dpi) {
  2547. #TB_window.plugin-details-modal.thickbox-loading:before {
  2548. background-image: url(../images/spinner-2x.gif);
  2549. }
  2550. }
  2551. .plugin-details-modal #TB_title {
  2552. float: right;
  2553. height: 1px;
  2554. }
  2555. .plugin-details-modal #TB_ajaxWindowTitle {
  2556. display: none;
  2557. }
  2558. .plugin-details-modal #TB_closeWindowButton {
  2559. right: auto;
  2560. left: -30px;
  2561. color: #f0f0f1;
  2562. }
  2563. .plugin-details-modal #TB_closeWindowButton:hover,
  2564. .plugin-details-modal #TB_closeWindowButton:focus {
  2565. outline: none;
  2566. box-shadow: none;
  2567. }
  2568. .plugin-details-modal #TB_closeWindowButton:hover::after,
  2569. .plugin-details-modal #TB_closeWindowButton:focus::after {
  2570. outline: 2px solid;
  2571. outline-offset: -4px;
  2572. border-radius: 4px;
  2573. }
  2574. .plugin-details-modal .tb-close-icon {
  2575. display: none;
  2576. }
  2577. .plugin-details-modal #TB_closeWindowButton:after {
  2578. content: "\f335";
  2579. font: normal 32px/29px 'dashicons';
  2580. speak: never;
  2581. -webkit-font-smoothing: antialiased;
  2582. -moz-osx-font-smoothing: grayscale;
  2583. }
  2584. /* move plugin install close icon to top on narrow screens */
  2585. @media screen and (max-width: 830px) {
  2586. .plugin-details-modal #TB_closeWindowButton {
  2587. left: 0;
  2588. top: -30px;
  2589. }
  2590. }
  2591. /* @todo: move this. */
  2592. img {
  2593. border: none;
  2594. }
  2595. /* Metabox collapse arrow indicators */
  2596. .sidebar-name .toggle-indicator::before,
  2597. .meta-box-sortables .postbox .toggle-indicator::before,
  2598. .meta-box-sortables .postbox .order-higher-indicator::before,
  2599. .meta-box-sortables .postbox .order-lower-indicator::before,
  2600. .bulk-action-notice .toggle-indicator::before,
  2601. .privacy-text-box .toggle-indicator::before {
  2602. content: "\f142";
  2603. display: inline-block;
  2604. font: normal 20px/1 dashicons;
  2605. speak: never;
  2606. -webkit-font-smoothing: antialiased;
  2607. -moz-osx-font-smoothing: grayscale;
  2608. text-decoration: none;
  2609. }
  2610. .js .widgets-holder-wrap.closed .toggle-indicator::before,
  2611. .meta-box-sortables .postbox.closed .handlediv .toggle-indicator::before,
  2612. .bulk-action-notice .bulk-action-errors-collapsed .toggle-indicator::before,
  2613. .privacy-text-box.closed .toggle-indicator::before {
  2614. content: "\f140";
  2615. }
  2616. .postbox .handle-order-higher .order-higher-indicator::before {
  2617. content: "\f343";
  2618. color: inherit;
  2619. }
  2620. .postbox .handle-order-lower .order-lower-indicator::before {
  2621. content: "\f347";
  2622. color: inherit;
  2623. }
  2624. .postbox .handle-order-higher .order-higher-indicator::before,
  2625. .postbox .handle-order-lower .order-lower-indicator::before {
  2626. position: relative;
  2627. top: 0.11rem;
  2628. width: 20px;
  2629. height: 20px;
  2630. }
  2631. .postbox .handlediv .toggle-indicator::before {
  2632. width: 20px;
  2633. border-radius: 50%;
  2634. }
  2635. .postbox .handlediv .toggle-indicator::before {
  2636. position: relative;
  2637. top: 0.05rem;
  2638. text-indent: -1px; /* account for the dashicon glyph uneven horizontal alignment */
  2639. }
  2640. .rtl .postbox .handlediv .toggle-indicator::before {
  2641. text-indent: 1px; /* account for the dashicon glyph uneven horizontal alignment */
  2642. }
  2643. .bulk-action-notice .toggle-indicator::before {
  2644. line-height: 16px;
  2645. vertical-align: top;
  2646. color: #787c82;
  2647. }
  2648. .postbox .handle-order-higher:focus,
  2649. .postbox .handle-order-lower:focus,
  2650. .postbox .handlediv:focus {
  2651. box-shadow:
  2652. 0 0 0 1px #4f94d4,
  2653. 0 0 2px 1px rgba(79, 148, 212, 0.8);
  2654. /* Only visible in Windows High Contrast mode */
  2655. outline: 1px solid transparent;
  2656. }
  2657. .postbox .handle-order-higher:focus .order-higher-indicator::before,
  2658. .postbox .handle-order-lower:focus .order-lower-indicator::before,
  2659. .postbox .handlediv:focus .toggle-indicator::before {
  2660. box-shadow: none;
  2661. /* Only visible in Windows High Contrast mode */
  2662. outline: 1px solid transparent;
  2663. }
  2664. /* @todo: appears to be Press This only and overridden */
  2665. #photo-add-url-div input[type="text"] {
  2666. width: 300px;
  2667. }
  2668. /* Theme/Plugin file editor */
  2669. .alignleft h2 {
  2670. margin: 0;
  2671. }
  2672. #template textarea {
  2673. font-family: Consolas, Monaco, monospace;
  2674. font-size: 13px;
  2675. background: #f6f7f7;
  2676. -o-tab-size: 4;
  2677. tab-size: 4;
  2678. }
  2679. #template textarea,
  2680. #template .CodeMirror {
  2681. width: 100%;
  2682. min-height: 60vh;
  2683. height: calc( 100vh - 295px );
  2684. border: 1px solid #dcdcde;
  2685. box-sizing: border-box;
  2686. }
  2687. #templateside > h2 {
  2688. padding-top: 6px;
  2689. padding-bottom: 7px;
  2690. margin: 0;
  2691. }
  2692. #templateside ol,
  2693. #templateside ul {
  2694. margin: 0;
  2695. padding: 0;
  2696. }
  2697. #templateside > ul {
  2698. box-sizing: border-box;
  2699. margin-top: 0;
  2700. overflow: auto;
  2701. padding: 0;
  2702. min-height: 60vh;
  2703. height: calc(100vh - 295px);
  2704. background-color: #f6f7f7;
  2705. border: 1px solid #dcdcde;
  2706. border-right: none;
  2707. }
  2708. #templateside ul ul {
  2709. padding-right: 12px;
  2710. }
  2711. #templateside > ul > li > ul[role=group] {
  2712. padding-right: 0;
  2713. }
  2714. /*
  2715. * Styles for Theme and Plugin file editors.
  2716. */
  2717. /* Hide collapsed items. */
  2718. [role="treeitem"][aria-expanded="false"] > ul {
  2719. display: none;
  2720. }
  2721. /* Use arrow dashicons for folder states, but hide from screen readers. */
  2722. [role="treeitem"] span[aria-hidden] {
  2723. display: inline;
  2724. font-family: dashicons;
  2725. font-size: 20px;
  2726. position: absolute;
  2727. pointer-events: none;
  2728. }
  2729. [role="treeitem"][aria-expanded="false"] > .folder-label .icon:after {
  2730. content: "\f141";
  2731. }
  2732. [role="treeitem"][aria-expanded="true"] > .folder-label .icon:after {
  2733. content: "\f140";
  2734. }
  2735. [role="treeitem"] .folder-label {
  2736. display: block;
  2737. padding: 3px 12px 3px 3px;
  2738. cursor: pointer;
  2739. }
  2740. /* Remove outline, and create our own focus and hover styles */
  2741. [role="treeitem"] {
  2742. outline: 0;
  2743. }
  2744. [role="treeitem"] .folder-label.focus {
  2745. color: #043959;
  2746. box-shadow:
  2747. 0 0 0 1px #4f94d4,
  2748. 0 0 2px 1px rgba(79, 148, 212, 0.8);
  2749. }
  2750. [role="treeitem"].hover,
  2751. [role="treeitem"] .folder-label.hover {
  2752. background-color: #f0f0f1;
  2753. }
  2754. .tree-folder {
  2755. margin: 0;
  2756. position: relative;
  2757. }
  2758. [role="treeitem"] li {
  2759. position: relative;
  2760. }
  2761. /* Styles for folder indicators/depth */
  2762. .tree-folder .tree-folder::after {
  2763. content: "";
  2764. display: block;
  2765. position: absolute;
  2766. right: 2px;
  2767. border-right: 1px solid #c3c4c7;
  2768. top: -13px;
  2769. bottom: 10px;
  2770. }
  2771. .tree-folder > li::before {
  2772. content: "";
  2773. position: absolute;
  2774. display: block;
  2775. border-right: 1px solid #c3c4c7;
  2776. right: 2px;
  2777. top: -5px;
  2778. height: 18px;
  2779. width: 7px;
  2780. border-bottom: 1px solid #c3c4c7;
  2781. }
  2782. .tree-folder > li::after {
  2783. content: "";
  2784. position: absolute;
  2785. display: block;
  2786. border-right: 1px solid #c3c4c7;
  2787. right: 2px;
  2788. bottom: -7px;
  2789. top: 0;
  2790. }
  2791. /* current-file needs to adjustment for .notice styles */
  2792. #templateside .current-file {
  2793. margin: -4px 0 -2px;
  2794. }
  2795. .tree-folder > .current-file::before {
  2796. right: 4px;
  2797. height: 15px;
  2798. width: 0;
  2799. border-right: none;
  2800. top: 3px;
  2801. }
  2802. .tree-folder > .current-file::after {
  2803. bottom: -4px;
  2804. height: 7px;
  2805. right: 2px;
  2806. top: auto;
  2807. }
  2808. /* Lines shouldn't continue on last item */
  2809. .tree-folder > li:last-child::after,
  2810. .tree-folder li:last-child > .tree-folder::after {
  2811. display: none;
  2812. }
  2813. #theme-plugin-editor-selector,
  2814. #theme-plugin-editor-label,
  2815. #documentation label {
  2816. font-weight: 600;
  2817. }
  2818. #theme-plugin-editor-label {
  2819. display: inline-block;
  2820. margin-bottom: 1em;
  2821. }
  2822. /* rtl:ignore */
  2823. #template textarea,
  2824. #docs-list {
  2825. direction: ltr;
  2826. }
  2827. .fileedit-sub #theme,
  2828. .fileedit-sub #plugin {
  2829. max-width: 40%;
  2830. }
  2831. .fileedit-sub .alignright {
  2832. text-align: left;
  2833. }
  2834. #template p {
  2835. width: 97%;
  2836. }
  2837. #file-editor-linting-error {
  2838. margin-top: 1em;
  2839. margin-bottom: 1em;
  2840. }
  2841. #file-editor-linting-error > .notice {
  2842. margin: 0;
  2843. display: inline-block;
  2844. }
  2845. #file-editor-linting-error > .notice > p {
  2846. width: auto;
  2847. }
  2848. #template .submit {
  2849. margin-top: 1em;
  2850. padding: 0;
  2851. }
  2852. #template .submit input[type=submit][disabled] {
  2853. cursor: not-allowed;
  2854. }
  2855. #templateside {
  2856. float: left;
  2857. width: 16em;
  2858. word-wrap: break-word;
  2859. }
  2860. #postcustomstuff p.submit {
  2861. margin: 0;
  2862. }
  2863. #templateside h4 {
  2864. margin: 1em 0 0;
  2865. }
  2866. #templateside li {
  2867. margin: 4px 0;
  2868. }
  2869. #templateside li:not(.howto) a,
  2870. .theme-editor-php .highlight {
  2871. display: block;
  2872. padding: 3px 12px 3px 0;
  2873. text-decoration: none;
  2874. }
  2875. #templateside li:not(.howto) > a:first-of-type {
  2876. padding-top: 0;
  2877. }
  2878. #templateside li.howto {
  2879. padding: 6px 12px 12px;
  2880. }
  2881. .theme-editor-php .highlight {
  2882. margin: -3px -12px -3px 3px;
  2883. }
  2884. #templateside .highlight {
  2885. border: none;
  2886. font-weight: 600;
  2887. }
  2888. .nonessential {
  2889. color: #646970;
  2890. font-size: 11px;
  2891. font-style: italic;
  2892. padding-right: 12px;
  2893. }
  2894. #documentation {
  2895. margin-top: 10px;
  2896. }
  2897. #documentation label {
  2898. line-height: 1.8;
  2899. vertical-align: baseline;
  2900. }
  2901. .fileedit-sub {
  2902. padding: 10px 0 8px;
  2903. line-height: 180%;
  2904. }
  2905. #file-editor-warning .file-editor-warning-content {
  2906. margin: 25px;
  2907. }
  2908. /* @todo: can we use a common class for these? */
  2909. .nav-menus-php .item-edit:before,
  2910. .widget-top .widget-action .toggle-indicator:before,
  2911. .control-section .accordion-section-title:after,
  2912. .accordion-section-title:after {
  2913. content: "\f140";
  2914. font: normal 20px/1 dashicons;
  2915. speak: never;
  2916. display: block;
  2917. -webkit-font-smoothing: antialiased;
  2918. -moz-osx-font-smoothing: grayscale;
  2919. text-decoration: none;
  2920. }
  2921. .widget-top .widget-action .toggle-indicator:before {
  2922. padding: 1px 0 1px 2px;
  2923. border-radius: 50%;
  2924. }
  2925. .handlediv,
  2926. .postbox .handlediv.button-link,
  2927. .item-edit,
  2928. .toggle-indicator,
  2929. .accordion-section-title:after {
  2930. color: #787c82;
  2931. }
  2932. .widget-action {
  2933. color: #50575e; /* #fafafa background in the Widgets screen */
  2934. }
  2935. .widget-top:hover .widget-action,
  2936. .widget-action:focus,
  2937. .handlediv:hover,
  2938. .handlediv:focus,
  2939. .postbox .handlediv.button-link:hover,
  2940. .postbox .handlediv.button-link:focus,
  2941. .item-edit:hover,
  2942. .item-edit:focus,
  2943. .sidebar-name:hover .toggle-indicator,
  2944. .accordion-section-title:hover:after {
  2945. color: #1d2327;
  2946. /* Only visible in Windows High Contrast mode */
  2947. outline: 1px solid transparent;
  2948. }
  2949. .widget-top .widget-action:focus .toggle-indicator:before {
  2950. box-shadow:
  2951. 0 0 0 1px #4f94d4,
  2952. 0 0 2px 1px rgba(79, 148, 212, 0.8);
  2953. }
  2954. .control-section .accordion-section-title:after,
  2955. .accordion-section-title:after {
  2956. float: left;
  2957. left: 20px;
  2958. top: -2px;
  2959. }
  2960. .control-section.open .accordion-section-title:after,
  2961. #customize-info.open .accordion-section-title:after,
  2962. .nav-menus-php .menu-item-edit-active .item-edit:before,
  2963. .widget.open .widget-top .widget-action .toggle-indicator:before,
  2964. .widget.widget-in-question .widget-top .widget-action .toggle-indicator:before {
  2965. content: "\f142";
  2966. }
  2967. /*!
  2968. * jQuery UI Draggable/Sortable 1.11.4
  2969. * http://jqueryui.com
  2970. *
  2971. * Copyright jQuery Foundation and other contributors
  2972. * Released under the MIT license.
  2973. * http://jquery.org/license
  2974. */
  2975. .ui-draggable-handle,
  2976. .ui-sortable-handle {
  2977. touch-action: none;
  2978. }
  2979. /* Accordion */
  2980. .accordion-section {
  2981. border-bottom: 1px solid #dcdcde;
  2982. margin: 0;
  2983. }
  2984. .accordion-section.open .accordion-section-content,
  2985. .no-js .accordion-section .accordion-section-content {
  2986. display: block;
  2987. }
  2988. .accordion-section.open:hover {
  2989. border-bottom-color: #dcdcde;
  2990. }
  2991. .accordion-section-content {
  2992. display: none;
  2993. padding: 10px 20px 15px;
  2994. overflow: hidden;
  2995. background: #fff;
  2996. }
  2997. .accordion-section-title {
  2998. margin: 0;
  2999. padding: 12px 15px 15px;
  3000. position: relative;
  3001. border-right: 1px solid #dcdcde;
  3002. border-left: 1px solid #dcdcde;
  3003. -webkit-user-select: none;
  3004. user-select: none;
  3005. }
  3006. .js .accordion-section-title {
  3007. cursor: pointer;
  3008. }
  3009. .js .accordion-section-title:after {
  3010. position: absolute;
  3011. top: 12px;
  3012. left: 10px;
  3013. z-index: 1;
  3014. }
  3015. .accordion-section-title:focus {
  3016. /* Only visible in Windows High Contrast mode */
  3017. outline: 1px solid transparent;
  3018. }
  3019. .accordion-section-title:hover:after,
  3020. .accordion-section-title:focus:after {
  3021. border-color: #a7aaad transparent;
  3022. /* Only visible in Windows High Contrast mode */
  3023. outline: 1px solid transparent;
  3024. }
  3025. .cannot-expand .accordion-section-title {
  3026. cursor: auto;
  3027. }
  3028. .cannot-expand .accordion-section-title:after {
  3029. display: none;
  3030. }
  3031. .control-section .accordion-section-title,
  3032. .customize-pane-child .accordion-section-title {
  3033. border-right: none;
  3034. border-left: none;
  3035. padding: 10px 14px 11px 10px;
  3036. line-height: 1.55;
  3037. background: #fff;
  3038. }
  3039. .control-section .accordion-section-title:after,
  3040. .customize-pane-child .accordion-section-title:after {
  3041. top: calc(50% - 10px); /* Arrow height is 20px, so use half of that to vertically center */
  3042. }
  3043. .js .control-section:hover .accordion-section-title,
  3044. .js .control-section .accordion-section-title:hover,
  3045. .js .control-section.open .accordion-section-title,
  3046. .js .control-section .accordion-section-title:focus {
  3047. color: #1d2327;
  3048. background: #f6f7f7;
  3049. }
  3050. .control-section.open .accordion-section-title {
  3051. /* When expanded */
  3052. border-bottom: 1px solid #dcdcde;
  3053. }
  3054. /* Edit Site */
  3055. .network-admin .edit-site-actions {
  3056. margin-top: 0;
  3057. }
  3058. /* My Sites */
  3059. .my-sites {
  3060. display: block;
  3061. overflow: auto;
  3062. zoom: 1;
  3063. }
  3064. .my-sites li {
  3065. display: block;
  3066. padding: 8px 3%;
  3067. min-height: 130px;
  3068. margin: 0;
  3069. }
  3070. @media only screen and (max-width: 599px) {
  3071. .my-sites li {
  3072. min-height: 0;
  3073. }
  3074. }
  3075. @media only screen and (min-width: 600px) {
  3076. .my-sites.striped li {
  3077. background-color: #fff;
  3078. position: relative;
  3079. }
  3080. .my-sites.striped li:after {
  3081. content: "";
  3082. width: 1px;
  3083. height: 100%;
  3084. position: absolute;
  3085. top: 0;
  3086. left: 0;
  3087. background: #c3c4c7;
  3088. }
  3089. }
  3090. @media only screen and (min-width: 600px) and (max-width: 699px) {
  3091. .my-sites li{
  3092. float: right;
  3093. width: 44%;
  3094. }
  3095. .my-sites.striped li {
  3096. background-color: #fff;
  3097. }
  3098. .my-sites.striped li:nth-of-type(2n+1) {
  3099. clear: right;
  3100. }
  3101. .my-sites.striped li:nth-of-type(2n+2):after {
  3102. content: none;
  3103. }
  3104. .my-sites li:nth-of-type(4n+1),
  3105. .my-sites li:nth-of-type(4n+2) {
  3106. background-color: #f6f7f7;
  3107. }
  3108. }
  3109. @media only screen and (min-width: 700px) and (max-width: 1199px) {
  3110. .my-sites li {
  3111. float: right;
  3112. width: 27.333333%;
  3113. background-color: #fff;
  3114. }
  3115. .my-sites.striped li:nth-of-type(3n+3):after {
  3116. content: none;
  3117. }
  3118. .my-sites li:nth-of-type(6n+1),
  3119. .my-sites li:nth-of-type(6n+2),
  3120. .my-sites li:nth-of-type(6n+3) {
  3121. background-color: #f6f7f7;
  3122. }
  3123. }
  3124. @media only screen and (min-width: 1200px) and (max-width: 1399px) {
  3125. .my-sites li {
  3126. float: right;
  3127. width: 21%;
  3128. padding: 8px 2%;
  3129. background-color: #fff;
  3130. }
  3131. .my-sites.striped li:nth-of-type(4n+1) {
  3132. clear: right;
  3133. }
  3134. .my-sites.striped li:nth-of-type(4n+4):after {
  3135. content: none;
  3136. }
  3137. .my-sites li:nth-of-type(8n+1),
  3138. .my-sites li:nth-of-type(8n+2),
  3139. .my-sites li:nth-of-type(8n+3),
  3140. .my-sites li:nth-of-type(8n+4) {
  3141. background-color: #f6f7f7;
  3142. }
  3143. }
  3144. @media only screen and (min-width: 1400px) and (max-width: 1599px) {
  3145. .my-sites li {
  3146. float: right;
  3147. width: 16%;
  3148. padding: 8px 2%;
  3149. background-color: #fff;
  3150. }
  3151. .my-sites.striped li:nth-of-type(5n+1) {
  3152. clear: right;
  3153. }
  3154. .my-sites.striped li:nth-of-type(5n+5):after {
  3155. content: none;
  3156. }
  3157. .my-sites li:nth-of-type(10n+1),
  3158. .my-sites li:nth-of-type(10n+2),
  3159. .my-sites li:nth-of-type(10n+3),
  3160. .my-sites li:nth-of-type(10n+4),
  3161. .my-sites li:nth-of-type(10n+5) {
  3162. background-color: #f6f7f7;
  3163. }
  3164. }
  3165. @media only screen and (min-width: 1600px) {
  3166. .my-sites li {
  3167. float: right;
  3168. width: 12.666666%;
  3169. padding: 8px 2%;
  3170. background-color: #fff;
  3171. }
  3172. .my-sites.striped li:nth-of-type(6n+1) {
  3173. clear: right;
  3174. }
  3175. .my-sites.striped li:nth-of-type(6n+6):after {
  3176. content: none;
  3177. }
  3178. .my-sites li:nth-of-type(12n+1),
  3179. .my-sites li:nth-of-type(12n+2),
  3180. .my-sites li:nth-of-type(12n+3),
  3181. .my-sites li:nth-of-type(12n+4),
  3182. .my-sites li:nth-of-type(12n+5),
  3183. .my-sites li:nth-of-type(12n+6) {
  3184. background-color: #f6f7f7;
  3185. }
  3186. }
  3187. .my-sites li a {
  3188. text-decoration: none;
  3189. }
  3190. /* =Media Queries
  3191. -------------------------------------------------------------- */
  3192. /**
  3193. * HiDPI Displays
  3194. */
  3195. @media print,
  3196. (-webkit-min-device-pixel-ratio: 1.25),
  3197. (min-resolution: 120dpi) {
  3198. /* Back-compat for pre-3.8 */
  3199. div.star-holder,
  3200. div.star-holder .star-rating {
  3201. background: url(../images/stars-2x.png?ver=20121108) repeat-x bottom right;
  3202. background-size: 21px 37px;
  3203. }
  3204. .spinner {
  3205. background-image: url(../images/spinner-2x.gif);
  3206. }
  3207. }
  3208. @media screen and (max-width: 782px) {
  3209. html.wp-toolbar {
  3210. padding-top: 46px;
  3211. }
  3212. .screen-reader-shortcut:focus {
  3213. top: -39px;
  3214. }
  3215. body {
  3216. min-width: 240px;
  3217. overflow-x: hidden;
  3218. }
  3219. body * {
  3220. -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
  3221. }
  3222. #wpcontent {
  3223. position: relative;
  3224. margin-right: 0;
  3225. padding-right: 10px;
  3226. }
  3227. #wpbody-content {
  3228. padding-bottom: 100px;
  3229. }
  3230. .wrap {
  3231. clear: both;
  3232. margin-left: 12px;
  3233. margin-right: 0;
  3234. }
  3235. /* categories */
  3236. #col-left,
  3237. #col-right {
  3238. float: none;
  3239. width: auto;
  3240. }
  3241. #col-left .col-wrap,
  3242. #col-right .col-wrap {
  3243. padding: 0;
  3244. }
  3245. /* Hidden Elements */
  3246. #collapse-menu,
  3247. .post-format-select {
  3248. display: none !important;
  3249. }
  3250. .wrap h1.wp-heading-inline {
  3251. margin-bottom: 0.5em;
  3252. }
  3253. .wrap .add-new-h2, /* deprecated */
  3254. .wrap .add-new-h2:active, /* deprecated */
  3255. .wrap .page-title-action,
  3256. .wrap .page-title-action:active {
  3257. padding: 10px 15px;
  3258. font-size: 14px;
  3259. white-space: nowrap;
  3260. }
  3261. /* Feedback Messages */
  3262. .notice,
  3263. .wrap div.updated,
  3264. .wrap div.error,
  3265. .media-upload-form div.error {
  3266. margin: 20px 0 10px;
  3267. padding: 5px 10px;
  3268. font-size: 14px;
  3269. line-height: 175%;
  3270. }
  3271. .wp-core-ui .notice.is-dismissible {
  3272. padding-left: 46px;
  3273. }
  3274. .notice-dismiss {
  3275. padding: 13px;
  3276. }
  3277. .wrap .icon32 + h2 {
  3278. margin-top: -2px;
  3279. }
  3280. .wp-responsive-open #wpbody {
  3281. left: -16em;
  3282. }
  3283. code {
  3284. word-wrap: break-word;
  3285. word-wrap: anywhere; /* Firefox. Allow breaking long words anywhere */
  3286. word-break: break-word; /* Webkit: Treated similarly to word-wrap: break-word */
  3287. }
  3288. /* General Metabox */
  3289. .postbox {
  3290. font-size: 14px;
  3291. }
  3292. .metabox-holder h3.hndle, /* Back-compat for pre-4.4 */
  3293. .metabox-holder .stuffbox > h3, /* Back-compat for pre-4.4 */
  3294. .metabox-holder .postbox > h3, /* Back-compat for pre-4.4 */
  3295. .metabox-holder h2 {
  3296. padding: 12px;
  3297. }
  3298. .postbox .handlediv {
  3299. margin-top: 3px;
  3300. }
  3301. /* Subsubsub Nav */
  3302. .subsubsub {
  3303. font-size: 16px;
  3304. text-align: center;
  3305. margin-bottom: 15px;
  3306. }
  3307. /* Theme/Plugin File Editor */
  3308. #template textarea,
  3309. #template .CodeMirror {
  3310. box-sizing: border-box;
  3311. }
  3312. #templateside {
  3313. float: none;
  3314. width: auto;
  3315. }
  3316. #templateside > ul {
  3317. border-right: 1px solid #dcdcde;
  3318. }
  3319. #templateside li {
  3320. margin: 0;
  3321. }
  3322. #templateside li:not(.howto) a {
  3323. display: block;
  3324. padding: 5px;
  3325. }
  3326. #templateside li.howto {
  3327. padding: 12px;
  3328. }
  3329. #templateside .highlight {
  3330. padding: 5px;
  3331. margin-right: -5px;
  3332. margin-top: -5px;
  3333. }
  3334. #template > div,
  3335. #template .notice {
  3336. float: none;
  3337. margin: 1em 0;
  3338. width: auto;
  3339. }
  3340. #template .CodeMirror,
  3341. #template textarea {
  3342. width: 100%;
  3343. }
  3344. #templateside ul ul {
  3345. padding-right: 1.5em;
  3346. }
  3347. [role="treeitem"] .folder-label {
  3348. display: block;
  3349. padding: 5px;
  3350. }
  3351. .tree-folder > li::before,
  3352. .tree-folder > li::after,
  3353. .tree-folder .tree-folder::after {
  3354. right: -8px;
  3355. }
  3356. .tree-folder > li::before {
  3357. top: 0;
  3358. height: 13px;
  3359. }
  3360. .tree-folder > .current-file::before {
  3361. right: -5px;
  3362. top: 7px;
  3363. width: 4px;
  3364. }
  3365. .tree-folder > .current-file::after {
  3366. height: 9px;
  3367. right: -8px;
  3368. }
  3369. .wrap #templateside span.notice {
  3370. margin-right: -5px;
  3371. width: 100%;
  3372. }
  3373. .fileedit-sub .alignright {
  3374. float: right;
  3375. margin-top: 15px;
  3376. width: 100%;
  3377. text-align: right;
  3378. }
  3379. .fileedit-sub .alignright label {
  3380. display: block;
  3381. }
  3382. .fileedit-sub #theme,
  3383. .fileedit-sub #plugin {
  3384. margin-right: 0;
  3385. max-width: 70%;
  3386. }
  3387. .fileedit-sub input[type="submit"] {
  3388. margin-bottom: 0;
  3389. }
  3390. #documentation label[for="docs-list"] {
  3391. display: block;
  3392. }
  3393. #documentation select[name="docs-list"] {
  3394. margin-right: 0;
  3395. max-width: 60%;
  3396. }
  3397. #documentation input[type="button"] {
  3398. margin-bottom: 0;
  3399. }
  3400. #wpfooter {
  3401. display: none;
  3402. }
  3403. #comments-form .checkforspam {
  3404. display: none;
  3405. }
  3406. .edit-comment-author {
  3407. margin: 2px 0 0;
  3408. }
  3409. .filter-drawer .filter-group-feature input,
  3410. .filter-drawer .filter-group-feature label {
  3411. line-height: 2.1;
  3412. }
  3413. .filter-drawer .filter-group-feature label {
  3414. margin-right: 32px;
  3415. }
  3416. .wp-filter .button.drawer-toggle {
  3417. font-size: 13px;
  3418. line-height: 2;
  3419. height: 28px;
  3420. }
  3421. /* Fix help tab columns for smaller screens */
  3422. #screen-meta #contextual-help-wrap {
  3423. overflow: visible;
  3424. }
  3425. #screen-meta #contextual-help-back,
  3426. #screen-meta .contextual-help-sidebar {
  3427. display: none;
  3428. }
  3429. #screen-meta .contextual-help-tabs {
  3430. clear: both;
  3431. width: 100%;
  3432. float: none;
  3433. }
  3434. #screen-meta .contextual-help-tabs ul {
  3435. margin: 0 0 1em;
  3436. padding: 1em 0 0;
  3437. }
  3438. #screen-meta .contextual-help-tabs .active {
  3439. margin: 0;
  3440. }
  3441. #screen-meta .contextual-help-tabs-wrap {
  3442. clear: both;
  3443. max-width: 100%;
  3444. float: none;
  3445. }
  3446. #screen-meta,
  3447. #screen-meta-links {
  3448. margin-left: 10px;
  3449. }
  3450. #screen-meta-links {
  3451. margin-bottom: 20px; /* Add margins beneath links for better spacing between boxes and elements */
  3452. }
  3453. .wp-filter .search-form input[type="search"] {
  3454. width: 100%;
  3455. font-size: 1rem;
  3456. }
  3457. .wp-filter .search-form.search-plugins {
  3458. /* This element is a flex item. */
  3459. min-width: 100%;
  3460. }
  3461. }
  3462. /* Smartphone */
  3463. @media screen and (max-width: 600px) {
  3464. /* Disable horizontal scroll when responsive menu is open
  3465. since we push the main content off to the right. */
  3466. #wpwrap.wp-responsive-open {
  3467. overflow-x: hidden;
  3468. }
  3469. html.wp-toolbar {
  3470. padding-top: 0;
  3471. }
  3472. .screen-reader-shortcut:focus {
  3473. top: 7px;
  3474. }
  3475. #wpbody {
  3476. padding-top: 46px;
  3477. }
  3478. /* Keep full-width boxes on Edit Post page from causing horizontal scroll */
  3479. div#post-body.metabox-holder.columns-1 {
  3480. overflow-x: hidden;
  3481. }
  3482. h1.nav-tab-wrapper,
  3483. .wrap h2.nav-tab-wrapper,
  3484. .nav-tab-wrapper {
  3485. border-bottom: 0;
  3486. }
  3487. h1 .nav-tab,
  3488. h2 .nav-tab,
  3489. h3 .nav-tab,
  3490. nav .nav-tab {
  3491. margin: 10px 0 0 10px;
  3492. border-bottom: 1px solid #c3c4c7;
  3493. }
  3494. .nav-tab-active:hover,
  3495. .nav-tab-active:focus,
  3496. .nav-tab-active:focus:active {
  3497. border-bottom: 1px solid #c3c4c7;
  3498. }
  3499. }
  3500. @media screen and (max-width: 480px) {
  3501. .metabox-prefs-container {
  3502. display: grid;
  3503. }
  3504. .metabox-prefs-container > * {
  3505. display: inline-block;
  3506. padding: 2px;
  3507. }
  3508. }
  3509. @media screen and (max-width: 320px) {
  3510. /* Prevent default center alignment and larger font for the Right Now widget when
  3511. the network dashboard is viewed on a small mobile device. */
  3512. #network_dashboard_right_now .subsubsub {
  3513. font-size: 14px;
  3514. text-align: right;
  3515. }
  3516. }