Нет описания

style-rtl.css 25KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996
  1. @charset "UTF-8";
  2. /**
  3. * Colors
  4. */
  5. /**
  6. * Breakpoints & Media Queries
  7. */
  8. /**
  9. * SCSS Variables.
  10. *
  11. * Please use variables from this sheet to ensure consistency across the UI.
  12. * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
  13. * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
  14. */
  15. /**
  16. * Colors
  17. */
  18. /**
  19. * Fonts & basic variables.
  20. */
  21. /**
  22. * Grid System.
  23. * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  24. */
  25. /**
  26. * Dimensions.
  27. */
  28. /**
  29. * Shadows.
  30. */
  31. /**
  32. * Editor widths.
  33. */
  34. /**
  35. * Block & Editor UI.
  36. */
  37. /**
  38. * Block paddings.
  39. */
  40. /**
  41. * React Native specific.
  42. * These variables do not appear to be used anywhere else.
  43. */
  44. /**
  45. * Converts a hex value into the rgb equivalent.
  46. *
  47. * @param {string} hex - the hexadecimal value to convert
  48. * @return {string} comma separated rgb values
  49. */
  50. /**
  51. * Breakpoint mixins
  52. */
  53. /**
  54. * Long content fade mixin
  55. *
  56. * Creates a fading overlay to signify that the content is longer
  57. * than the space allows.
  58. */
  59. /**
  60. * Focus styles.
  61. */
  62. /**
  63. * Applies editor left position to the selector passed as argument
  64. */
  65. /**
  66. * Styles that are reused verbatim in a few places
  67. */
  68. /**
  69. * Allows users to opt-out of animations via OS-level preferences.
  70. */
  71. /**
  72. * Reset default styles for JavaScript UI based pages.
  73. * This is a WP-admin agnostic reset
  74. */
  75. /**
  76. * Reset the WP Admin page styles for Gutenberg-like pages.
  77. */
  78. :root {
  79. --wp-admin-theme-color: #007cba;
  80. --wp-admin-theme-color--rgb: 0, 124, 186;
  81. --wp-admin-theme-color-darker-10: #006ba1;
  82. --wp-admin-theme-color-darker-10--rgb: 0, 107, 161;
  83. --wp-admin-theme-color-darker-20: #005a87;
  84. --wp-admin-theme-color-darker-20--rgb: 0, 90, 135;
  85. --wp-admin-border-width-focus: 2px;
  86. }
  87. @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  88. :root {
  89. --wp-admin-border-width-focus: 1.5px;
  90. }
  91. }
  92. .editor-autocompleters__user .editor-autocompleters__no-avatar::before {
  93. /* stylelint-disable */
  94. font: normal 20px/1 dashicons;
  95. /* stylelint-enable */
  96. content: "";
  97. margin-left: 5px;
  98. vertical-align: middle;
  99. }
  100. .editor-autocompleters__user .editor-autocompleters__user-avatar {
  101. margin-left: 8px;
  102. flex-grow: 0;
  103. flex-shrink: 0;
  104. max-width: none;
  105. width: 24px;
  106. height: 24px;
  107. }
  108. .editor-autocompleters__user .editor-autocompleters__user-name {
  109. white-space: nowrap;
  110. text-overflow: ellipsis;
  111. overflow: hidden;
  112. max-width: 200px;
  113. flex-shrink: 0;
  114. flex-grow: 1;
  115. }
  116. .editor-autocompleters__user .editor-autocompleters__user-slug {
  117. margin-right: 8px;
  118. color: #757575;
  119. white-space: nowrap;
  120. text-overflow: ellipsis;
  121. overflow: none;
  122. max-width: 100px;
  123. flex-grow: 0;
  124. flex-shrink: 0;
  125. }
  126. .editor-autocompleters__user:hover .editor-autocompleters__user-slug {
  127. color: var(--wp-admin-theme-color);
  128. }
  129. .document-outline {
  130. margin: 20px 0;
  131. }
  132. .document-outline ul {
  133. margin: 0;
  134. padding: 0;
  135. }
  136. .document-outline__item {
  137. display: flex;
  138. margin: 4px 0;
  139. }
  140. .document-outline__item a {
  141. text-decoration: none;
  142. }
  143. .document-outline__item .document-outline__emdash::before {
  144. color: #ddd;
  145. margin-left: 4px;
  146. }
  147. .document-outline__item.is-h2 .document-outline__emdash::before {
  148. content: "—";
  149. }
  150. .document-outline__item.is-h3 .document-outline__emdash::before {
  151. content: "——";
  152. }
  153. .document-outline__item.is-h4 .document-outline__emdash::before {
  154. content: "———";
  155. }
  156. .document-outline__item.is-h5 .document-outline__emdash::before {
  157. content: "————";
  158. }
  159. .document-outline__item.is-h6 .document-outline__emdash::before {
  160. content: "—————";
  161. }
  162. .document-outline__button {
  163. cursor: pointer;
  164. background: none;
  165. border: none;
  166. display: flex;
  167. align-items: flex-start;
  168. margin: 0 -1px 0 0;
  169. padding: 2px 1px 2px 5px;
  170. color: #1e1e1e;
  171. text-align: right;
  172. border-radius: 2px;
  173. }
  174. .document-outline__button:disabled {
  175. cursor: default;
  176. }
  177. .document-outline__button:focus {
  178. box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
  179. outline: 2px solid transparent;
  180. }
  181. .document-outline__level {
  182. background: #ddd;
  183. color: #1e1e1e;
  184. border-radius: 3px;
  185. font-size: 13px;
  186. padding: 1px 6px;
  187. margin-left: 4px;
  188. }
  189. .is-invalid .document-outline__level {
  190. background: #f0b849;
  191. }
  192. .document-outline__item-content {
  193. padding: 1px 0;
  194. }
  195. .components-editor-notices__dismissible,
  196. .components-editor-notices__pinned {
  197. position: relative;
  198. right: 0;
  199. top: 0;
  200. left: 0;
  201. color: #1e1e1e;
  202. }
  203. .components-editor-notices__dismissible .components-notice,
  204. .components-editor-notices__pinned .components-notice {
  205. box-sizing: border-box;
  206. margin: 0;
  207. border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  208. padding: 0 12px;
  209. min-height: 60px;
  210. }
  211. .components-editor-notices__dismissible .components-notice .components-notice__dismiss,
  212. .components-editor-notices__pinned .components-notice .components-notice__dismiss {
  213. margin-top: 12px;
  214. }
  215. .entities-saved-states__panel {
  216. box-sizing: border-box;
  217. background: #fff;
  218. position: fixed;
  219. z-index: 100001;
  220. top: 46px;
  221. bottom: 0;
  222. left: 0;
  223. right: 0;
  224. overflow: auto;
  225. box-sizing: border-box;
  226. }
  227. .entities-saved-states__panel *,
  228. .entities-saved-states__panel *::before,
  229. .entities-saved-states__panel *::after {
  230. box-sizing: inherit;
  231. }
  232. .entities-saved-states__panel .entities-saved-states__find-entity {
  233. display: none;
  234. }
  235. .entities-saved-states__panel .entities-saved-states__find-entity-small {
  236. display: block;
  237. }
  238. @media (min-width: 782px) {
  239. .entities-saved-states__panel {
  240. top: 32px;
  241. right: auto;
  242. width: 280px;
  243. border-right: 1px solid #ddd;
  244. }
  245. body.is-fullscreen-mode .entities-saved-states__panel {
  246. top: 0;
  247. }
  248. .entities-saved-states__panel .entities-saved-states__find-entity {
  249. display: block;
  250. }
  251. .entities-saved-states__panel .entities-saved-states__find-entity-small {
  252. display: none;
  253. }
  254. }
  255. .entities-saved-states__panel .entities-saved-states__panel-header {
  256. background: #fff;
  257. padding-right: 8px;
  258. padding-left: 8px;
  259. height: 61px;
  260. border-bottom: 1px solid #ddd;
  261. }
  262. .entities-saved-states__panel .entities-saved-states__text-prompt {
  263. padding: 16px;
  264. padding-bottom: 4px;
  265. }
  266. .editor-error-boundary {
  267. margin: auto;
  268. max-width: 780px;
  269. padding: 20px;
  270. margin-top: 60px;
  271. box-shadow: 0 10px 10px rgba(0, 0, 0, 0.25);
  272. }
  273. .editor-page-attributes__order {
  274. width: 100%;
  275. }
  276. .editor-page-attributes__order .components-base-control__field {
  277. display: flex;
  278. justify-content: space-between;
  279. align-items: center;
  280. }
  281. .editor-page-attributes__order input {
  282. width: 66px;
  283. }
  284. .editor-post-excerpt__textarea {
  285. width: 100%;
  286. margin-bottom: 10px;
  287. }
  288. .editor-post-featured-image {
  289. padding: 0;
  290. }
  291. .editor-post-featured-image__container {
  292. margin-bottom: 1em;
  293. position: relative;
  294. }
  295. .editor-post-featured-image .components-spinner {
  296. position: absolute;
  297. top: 50%;
  298. right: 50%;
  299. margin-top: -9px;
  300. margin-right: -9px;
  301. }
  302. .editor-post-featured-image .components-button + .components-button {
  303. display: block;
  304. margin-top: 1em;
  305. }
  306. .editor-post-featured-image .components-responsive-wrapper__content {
  307. max-width: 100%;
  308. width: auto;
  309. }
  310. .editor-post-featured-image__toggle,
  311. .editor-post-featured-image__preview {
  312. display: block;
  313. width: 100%;
  314. padding: 0;
  315. transition: all 0.1s ease-out;
  316. box-shadow: 0 0 0 0 var(--wp-admin-theme-color);
  317. }
  318. @media (prefers-reduced-motion: reduce) {
  319. .editor-post-featured-image__toggle,
  320. .editor-post-featured-image__preview {
  321. transition-duration: 0s;
  322. transition-delay: 0s;
  323. }
  324. }
  325. .editor-post-featured-image__preview {
  326. height: auto;
  327. }
  328. .editor-post-featured-image__preview:not(:disabled):not([aria-disabled=true]):focus {
  329. box-shadow: 0 0 0 4px var(--wp-admin-theme-color);
  330. }
  331. .editor-post-featured-image__toggle {
  332. border-radius: 2px;
  333. background-color: #f0f0f0;
  334. min-height: 90px;
  335. line-height: 20px;
  336. padding: 8px 0;
  337. text-align: center;
  338. }
  339. .editor-post-featured-image__toggle:hover {
  340. background: #ddd;
  341. color: #1e1e1e;
  342. }
  343. .editor-post-format {
  344. flex-direction: column;
  345. align-items: stretch;
  346. width: 100%;
  347. }
  348. .editor-post-format__content {
  349. display: inline-flex;
  350. justify-content: space-between;
  351. align-items: center;
  352. width: 100%;
  353. }
  354. .editor-post-format__suggestion {
  355. padding: 6px;
  356. text-align: left;
  357. font-size: 13px;
  358. }
  359. .editor-post-last-revision__title {
  360. width: 100%;
  361. font-weight: 600;
  362. }
  363. .editor-post-last-revision__title .dashicon {
  364. margin-left: 5px;
  365. }
  366. .components-button.editor-post-last-revision__title {
  367. height: 100%;
  368. }
  369. .components-button.editor-post-last-revision__title:hover, .components-button.editor-post-last-revision__title:active {
  370. background: #f0f0f0;
  371. }
  372. .components-button.editor-post-last-revision__title:focus {
  373. box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
  374. border-radius: 0;
  375. }
  376. @media (min-width: 600px) {
  377. .editor-post-locked-modal {
  378. max-width: 480px;
  379. }
  380. }
  381. .editor-post-locked-modal .components-modal__content {
  382. display: flex;
  383. }
  384. .editor-post-locked-modal__buttons {
  385. margin-top: 24px;
  386. }
  387. .editor-post-locked-modal__avatar {
  388. border-radius: 2px;
  389. margin-top: 16px;
  390. margin-left: 24px;
  391. }
  392. .editor-post-publish-button__button.has-changes-dot::before {
  393. background: currentcolor;
  394. border-radius: 4px;
  395. content: "";
  396. height: 8px;
  397. margin: auto -3px auto 5px;
  398. width: 8px;
  399. }
  400. .editor-post-publish-panel {
  401. background: #fff;
  402. }
  403. .editor-post-publish-panel__content {
  404. min-height: calc(100% - 144px);
  405. }
  406. .editor-post-publish-panel__content .components-spinner {
  407. display: block;
  408. margin: 100px auto 0;
  409. }
  410. .editor-post-publish-panel__header {
  411. background: #fff;
  412. padding-right: 16px;
  413. padding-left: 16px;
  414. height: 61px;
  415. border-bottom: 1px solid #ddd;
  416. display: flex;
  417. align-items: center;
  418. align-content: space-between;
  419. }
  420. .editor-post-publish-panel__header .components-button {
  421. width: 100%;
  422. justify-content: center;
  423. }
  424. .editor-post-publish-panel__header .has-icon {
  425. margin-right: auto;
  426. width: auto;
  427. }
  428. .components-site-card {
  429. display: flex;
  430. align-items: center;
  431. margin: 16px 0;
  432. }
  433. .components-site-icon {
  434. border: none;
  435. border-radius: 2px;
  436. margin-left: 12px;
  437. height: 36px;
  438. width: 36px;
  439. }
  440. .components-site-name {
  441. display: block;
  442. font-size: 14px;
  443. }
  444. .components-site-home {
  445. display: block;
  446. color: #757575;
  447. font-size: 12px;
  448. }
  449. .editor-post-publish-panel__header-publish-button,
  450. .editor-post-publish-panel__header-cancel-button {
  451. flex-grow: 1;
  452. }
  453. @media (min-width: 480px) {
  454. .editor-post-publish-panel__header-publish-button,
  455. .editor-post-publish-panel__header-cancel-button {
  456. max-width: 160px;
  457. }
  458. }
  459. .editor-post-publish-panel__header-publish-button {
  460. padding-left: 4px;
  461. }
  462. .editor-post-publish-panel__header-cancel-button {
  463. padding-right: 4px;
  464. }
  465. .editor-post-publish-panel__header-published {
  466. flex-grow: 1;
  467. }
  468. .editor-post-publish-panel__footer {
  469. padding: 16px;
  470. }
  471. .components-button.editor-post-publish-panel__toggle.is-primary {
  472. display: inline-flex;
  473. align-items: center;
  474. }
  475. .components-button.editor-post-publish-panel__toggle.is-primary.is-busy .dashicon {
  476. display: none;
  477. }
  478. .components-button.editor-post-publish-panel__toggle.is-primary .dashicon {
  479. margin-left: -4px;
  480. }
  481. .editor-post-publish-panel__link {
  482. font-weight: 400;
  483. padding-right: 4px;
  484. }
  485. .editor-post-publish-panel__prepublish {
  486. padding: 16px;
  487. }
  488. .editor-post-publish-panel__prepublish strong {
  489. color: #1e1e1e;
  490. }
  491. .editor-post-publish-panel__prepublish .components-panel__body {
  492. background: #fff;
  493. margin-right: -16px;
  494. margin-left: -16px;
  495. }
  496. .editor-post-publish-panel__prepublish .editor-post-visibility__dialog-legend {
  497. display: none;
  498. }
  499. .post-publish-panel__postpublish .components-panel__body {
  500. border-bottom: 1px solid #e0e0e0;
  501. border-top: none;
  502. }
  503. .post-publish-panel__postpublish-buttons {
  504. display: flex;
  505. align-content: space-between;
  506. flex-wrap: wrap;
  507. margin: -5px;
  508. }
  509. .post-publish-panel__postpublish-buttons > * {
  510. flex-grow: 1;
  511. margin: 5px;
  512. }
  513. .post-publish-panel__postpublish-buttons .components-button {
  514. height: auto;
  515. justify-content: center;
  516. padding: 3px 10px 4px;
  517. flex: 1;
  518. line-height: 1.6;
  519. text-align: center;
  520. white-space: normal;
  521. }
  522. .post-publish-panel__postpublish-buttons .components-clipboard-button {
  523. width: 100%;
  524. }
  525. .post-publish-panel__postpublish-post-address-container {
  526. display: flex;
  527. align-items: flex-end;
  528. margin-bottom: 16px;
  529. }
  530. .post-publish-panel__postpublish-post-address-container .components-base-control__field {
  531. margin-bottom: 0;
  532. }
  533. .post-publish-panel__postpublish-post-address-container .post-publish-panel__postpublish-post-address {
  534. flex: 1;
  535. }
  536. .post-publish-panel__postpublish-post-address-container input[readonly] {
  537. padding: 10px;
  538. background: #ddd;
  539. overflow: hidden;
  540. text-overflow: ellipsis;
  541. }
  542. .post-publish-panel__postpublish-post-address__copy-button-wrap {
  543. flex-shrink: 0;
  544. margin-right: 8px;
  545. }
  546. .post-publish-panel__postpublish-post-address__copy-button-wrap .components-button {
  547. height: 38px;
  548. }
  549. .post-publish-panel__postpublish-header {
  550. font-weight: 500;
  551. }
  552. .post-publish-panel__postpublish-subheader {
  553. margin: 0 0 8px;
  554. }
  555. .post-publish-panel__tip {
  556. color: #f0b849;
  557. }
  558. @media screen and (max-width: 782px) {
  559. .post-publish-panel__postpublish-post-address__button-wrap .components-button {
  560. height: 40px;
  561. }
  562. }
  563. .editor-post-saved-state {
  564. display: flex;
  565. align-items: center;
  566. width: 28px;
  567. padding: 12px 4px;
  568. color: #757575;
  569. overflow: hidden;
  570. white-space: nowrap;
  571. }
  572. .editor-post-saved-state.is-saving[aria-disabled=true], .editor-post-saved-state.is-saving[aria-disabled=true]:hover, .editor-post-saved-state.is-saved[aria-disabled=true], .editor-post-saved-state.is-saved[aria-disabled=true]:hover {
  573. background: transparent;
  574. color: #757575;
  575. }
  576. .editor-post-saved-state svg {
  577. display: inline-block;
  578. flex: 0 0 auto;
  579. fill: currentColor;
  580. margin-left: 8px;
  581. }
  582. @media (min-width: 600px) {
  583. .editor-post-saved-state {
  584. width: auto;
  585. padding: 8px 12px;
  586. text-indent: inherit;
  587. }
  588. .editor-post-saved-state svg {
  589. margin-left: 0;
  590. }
  591. }
  592. .editor-post-taxonomies__hierarchical-terms-list {
  593. max-height: 14em;
  594. overflow: auto;
  595. margin-right: -6px;
  596. padding-right: 6px;
  597. margin-top: -6px;
  598. padding-top: 6px;
  599. }
  600. .editor-post-taxonomies__hierarchical-terms-choice {
  601. margin-bottom: 8px;
  602. }
  603. .editor-post-taxonomies__hierarchical-terms-subchoices {
  604. margin-top: 8px;
  605. margin-right: 16px;
  606. }
  607. .components-button.editor-post-taxonomies__hierarchical-terms-submit,
  608. .components-button.editor-post-taxonomies__hierarchical-terms-add {
  609. margin-top: 12px;
  610. }
  611. .editor-post-taxonomies__hierarchical-terms-label {
  612. display: inline-block;
  613. margin-top: 12px;
  614. }
  615. .editor-post-taxonomies__hierarchical-terms-input {
  616. margin-top: 8px;
  617. }
  618. .editor-post-taxonomies__hierarchical-terms-filter {
  619. margin-bottom: 8px;
  620. width: 100%;
  621. }
  622. .editor-post-taxonomies__flat-term-most-used .editor-post-taxonomies__flat-term-most-used-label {
  623. font-weight: 400;
  624. margin-bottom: 12px;
  625. }
  626. .editor-post-taxonomies__flat-term-most-used-list {
  627. margin: 0;
  628. }
  629. .editor-post-taxonomies__flat-term-most-used-list li {
  630. display: inline-block;
  631. margin-left: 8px;
  632. }
  633. .editor-post-taxonomies__flat-term-most-used-list .components-button {
  634. font-size: 12px;
  635. }
  636. .edit-post-text-editor__body textarea.editor-post-text-editor {
  637. border: 1px solid #949494;
  638. border-radius: 0;
  639. display: block;
  640. margin: 0;
  641. width: 100%;
  642. box-shadow: none;
  643. resize: none;
  644. overflow: hidden;
  645. font-family: Menlo, Consolas, monaco, monospace;
  646. line-height: 2.4;
  647. min-height: 200px;
  648. transition: border 0.1s ease-out, box-shadow 0.1s linear;
  649. padding: 16px;
  650. /* Fonts smaller than 16px causes mobile safari to zoom. */
  651. font-size: 16px !important;
  652. }
  653. @media (prefers-reduced-motion: reduce) {
  654. .edit-post-text-editor__body textarea.editor-post-text-editor {
  655. transition-duration: 0s;
  656. transition-delay: 0s;
  657. }
  658. }
  659. @media (min-width: 600px) {
  660. .edit-post-text-editor__body textarea.editor-post-text-editor {
  661. padding: 24px;
  662. }
  663. }
  664. @media (min-width: 600px) {
  665. .edit-post-text-editor__body textarea.editor-post-text-editor {
  666. font-size: 15px !important;
  667. }
  668. }
  669. .edit-post-text-editor__body textarea.editor-post-text-editor:focus {
  670. border-color: var(--wp-admin-theme-color);
  671. box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
  672. position: relative;
  673. }
  674. .edit-post-text-editor__body textarea.editor-post-text-editor::-webkit-input-placeholder {
  675. color: rgba(30, 30, 30, 0.62);
  676. }
  677. .edit-post-text-editor__body textarea.editor-post-text-editor::-moz-placeholder {
  678. color: rgba(30, 30, 30, 0.62);
  679. opacity: 1;
  680. }
  681. .edit-post-text-editor__body textarea.editor-post-text-editor:-ms-input-placeholder {
  682. color: rgba(30, 30, 30, 0.62);
  683. }
  684. .edit-post-post-visibility__dialog,
  685. .editor-post-visibility__dialog-fieldset {
  686. padding: 4px;
  687. padding-top: 0;
  688. }
  689. .edit-post-post-visibility__dialog .editor-post-visibility__dialog-legend,
  690. .editor-post-visibility__dialog-fieldset .editor-post-visibility__dialog-legend {
  691. font-weight: 600;
  692. margin-bottom: 1em;
  693. margin-top: 0.5em;
  694. padding: 0;
  695. }
  696. .edit-post-post-visibility__dialog .editor-post-visibility__dialog-radio[type=radio],
  697. .editor-post-visibility__dialog-fieldset .editor-post-visibility__dialog-radio[type=radio] {
  698. font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  699. padding: 6px 8px;
  700. box-shadow: 0 0 0 transparent;
  701. transition: box-shadow 0.1s linear;
  702. border-radius: 2px;
  703. border: 1px solid #757575;
  704. /* Fonts smaller than 16px causes mobile safari to zoom. */
  705. font-size: 16px;
  706. /* Override core line-height. To be reviewed. */
  707. line-height: normal;
  708. border: 1px solid #1e1e1e;
  709. margin-left: 12px;
  710. transition: none;
  711. border-radius: 50%;
  712. width: 24px;
  713. height: 24px;
  714. margin-top: 2px;
  715. }
  716. @media (prefers-reduced-motion: reduce) {
  717. .edit-post-post-visibility__dialog .editor-post-visibility__dialog-radio[type=radio],
  718. .editor-post-visibility__dialog-fieldset .editor-post-visibility__dialog-radio[type=radio] {
  719. transition-duration: 0s;
  720. transition-delay: 0s;
  721. }
  722. }
  723. @media (min-width: 600px) {
  724. .edit-post-post-visibility__dialog .editor-post-visibility__dialog-radio[type=radio],
  725. .editor-post-visibility__dialog-fieldset .editor-post-visibility__dialog-radio[type=radio] {
  726. font-size: 13px;
  727. /* Override core line-height. To be reviewed. */
  728. line-height: normal;
  729. }
  730. }
  731. .edit-post-post-visibility__dialog .editor-post-visibility__dialog-radio[type=radio]:focus,
  732. .editor-post-visibility__dialog-fieldset .editor-post-visibility__dialog-radio[type=radio]:focus {
  733. border-color: var(--wp-admin-theme-color);
  734. box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
  735. outline: 2px solid transparent;
  736. }
  737. .edit-post-post-visibility__dialog .editor-post-visibility__dialog-radio[type=radio]::-webkit-input-placeholder,
  738. .editor-post-visibility__dialog-fieldset .editor-post-visibility__dialog-radio[type=radio]::-webkit-input-placeholder {
  739. color: rgba(30, 30, 30, 0.62);
  740. }
  741. .edit-post-post-visibility__dialog .editor-post-visibility__dialog-radio[type=radio]::-moz-placeholder,
  742. .editor-post-visibility__dialog-fieldset .editor-post-visibility__dialog-radio[type=radio]::-moz-placeholder {
  743. opacity: 1;
  744. color: rgba(30, 30, 30, 0.62);
  745. }
  746. .edit-post-post-visibility__dialog .editor-post-visibility__dialog-radio[type=radio]:-ms-input-placeholder,
  747. .editor-post-visibility__dialog-fieldset .editor-post-visibility__dialog-radio[type=radio]:-ms-input-placeholder {
  748. color: rgba(30, 30, 30, 0.62);
  749. }
  750. @media (min-width: 600px) {
  751. .edit-post-post-visibility__dialog .editor-post-visibility__dialog-radio[type=radio],
  752. .editor-post-visibility__dialog-fieldset .editor-post-visibility__dialog-radio[type=radio] {
  753. height: 20px;
  754. width: 20px;
  755. }
  756. }
  757. .edit-post-post-visibility__dialog .editor-post-visibility__dialog-radio[type=radio]:checked::before,
  758. .editor-post-visibility__dialog-fieldset .editor-post-visibility__dialog-radio[type=radio]:checked::before {
  759. box-sizing: inherit;
  760. width: 8px;
  761. height: 8px;
  762. transform: translate(-7px, 7px);
  763. margin: 0;
  764. background-color: #fff;
  765. border: 4px solid #fff;
  766. }
  767. @media (min-width: 600px) {
  768. .edit-post-post-visibility__dialog .editor-post-visibility__dialog-radio[type=radio]:checked::before,
  769. .editor-post-visibility__dialog-fieldset .editor-post-visibility__dialog-radio[type=radio]:checked::before {
  770. transform: translate(-5px, 5px);
  771. }
  772. }
  773. .edit-post-post-visibility__dialog .editor-post-visibility__dialog-radio[type=radio]:focus,
  774. .editor-post-visibility__dialog-fieldset .editor-post-visibility__dialog-radio[type=radio]:focus {
  775. box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-admin-theme-color);
  776. outline: 2px solid transparent;
  777. }
  778. .edit-post-post-visibility__dialog .editor-post-visibility__dialog-radio[type=radio]:checked,
  779. .editor-post-visibility__dialog-fieldset .editor-post-visibility__dialog-radio[type=radio]:checked {
  780. background: var(--wp-admin-theme-color);
  781. border-color: var(--wp-admin-theme-color);
  782. }
  783. .edit-post-post-visibility__dialog .editor-post-visibility__dialog-label,
  784. .editor-post-visibility__dialog-fieldset .editor-post-visibility__dialog-label {
  785. font-weight: 600;
  786. }
  787. .edit-post-post-visibility__dialog .editor-post-visibility__dialog-info,
  788. .editor-post-visibility__dialog-fieldset .editor-post-visibility__dialog-info {
  789. margin-top: 0;
  790. margin-right: 32px;
  791. }
  792. .edit-post-post-visibility__dialog .editor-post-visibility__choice:last-child .editor-post-visibility__dialog-info,
  793. .editor-post-visibility__dialog-fieldset .editor-post-visibility__choice:last-child .editor-post-visibility__dialog-info {
  794. margin-bottom: 0;
  795. }
  796. .editor-post-visibility__dialog-password .editor-post-visibility__dialog-password-input[type=text] {
  797. font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  798. padding: 6px 8px;
  799. box-shadow: 0 0 0 transparent;
  800. transition: box-shadow 0.1s linear;
  801. border-radius: 2px;
  802. border: 1px solid #757575;
  803. /* Fonts smaller than 16px causes mobile safari to zoom. */
  804. font-size: 16px;
  805. /* Override core line-height. To be reviewed. */
  806. line-height: normal;
  807. margin-right: 36px;
  808. margin-top: 8px;
  809. }
  810. @media (prefers-reduced-motion: reduce) {
  811. .editor-post-visibility__dialog-password .editor-post-visibility__dialog-password-input[type=text] {
  812. transition-duration: 0s;
  813. transition-delay: 0s;
  814. }
  815. }
  816. @media (min-width: 600px) {
  817. .editor-post-visibility__dialog-password .editor-post-visibility__dialog-password-input[type=text] {
  818. font-size: 13px;
  819. /* Override core line-height. To be reviewed. */
  820. line-height: normal;
  821. }
  822. }
  823. .editor-post-visibility__dialog-password .editor-post-visibility__dialog-password-input[type=text]:focus {
  824. border-color: var(--wp-admin-theme-color);
  825. box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
  826. outline: 2px solid transparent;
  827. }
  828. .editor-post-visibility__dialog-password .editor-post-visibility__dialog-password-input[type=text]::-webkit-input-placeholder {
  829. color: rgba(30, 30, 30, 0.62);
  830. }
  831. .editor-post-visibility__dialog-password .editor-post-visibility__dialog-password-input[type=text]::-moz-placeholder {
  832. opacity: 1;
  833. color: rgba(30, 30, 30, 0.62);
  834. }
  835. .editor-post-visibility__dialog-password .editor-post-visibility__dialog-password-input[type=text]:-ms-input-placeholder {
  836. color: rgba(30, 30, 30, 0.62);
  837. }
  838. .editor-post-title {
  839. position: relative;
  840. }
  841. .editor-post-title.is-focus-mode {
  842. opacity: 0.5;
  843. transition: opacity 0.1s linear;
  844. }
  845. @media (prefers-reduced-motion: reduce) {
  846. .editor-post-title.is-focus-mode {
  847. transition-duration: 0s;
  848. transition-delay: 0s;
  849. }
  850. }
  851. .editor-post-title.is-focus-mode:focus {
  852. opacity: 1;
  853. }
  854. .editor-post-trash.components-button {
  855. margin-top: 4px;
  856. }
  857. .table-of-contents__popover.components-popover .components-popover__content {
  858. min-width: 380px;
  859. }
  860. .components-popover.table-of-contents__popover {
  861. z-index: 99998;
  862. }
  863. .table-of-contents__popover .components-popover__content > div {
  864. padding: 16px;
  865. }
  866. @media (min-width: 600px) {
  867. .table-of-contents__popover .components-popover__content {
  868. max-height: calc(100vh - 120px);
  869. overflow-y: auto;
  870. }
  871. }
  872. .table-of-contents__popover hr {
  873. margin: 10px -16px 0;
  874. }
  875. .table-of-contents__wrapper:focus::before {
  876. content: "";
  877. display: block;
  878. position: absolute;
  879. top: 0;
  880. left: 0;
  881. bottom: 0;
  882. right: 0;
  883. box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
  884. pointer-events: none;
  885. }
  886. .table-of-contents__counts {
  887. display: flex;
  888. flex-wrap: wrap;
  889. margin: 0;
  890. margin-top: -8px;
  891. }
  892. .table-of-contents__count {
  893. flex-basis: 33%;
  894. display: flex;
  895. flex-direction: column;
  896. font-size: 13px;
  897. color: #1e1e1e;
  898. padding-left: 8px;
  899. margin-bottom: 0;
  900. margin-top: 8px;
  901. }
  902. .table-of-contents__count:nth-child(4n) {
  903. padding-left: 0;
  904. }
  905. .table-of-contents__number,
  906. .table-of-contents__popover .word-count {
  907. font-size: 21px;
  908. font-weight: 400;
  909. line-height: 30px;
  910. color: #1e1e1e;
  911. }
  912. .table-of-contents__title {
  913. display: block;
  914. margin-top: 20px;
  915. font-size: 15px;
  916. font-weight: 600;
  917. }
  918. .editor-template-validation-notice {
  919. display: flex;
  920. justify-content: space-between;
  921. align-items: center;
  922. }
  923. .editor-template-validation-notice .components-button {
  924. margin-right: 5px;
  925. }