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.

3934 lines
103 KiB

1 year ago
  1. :root{
  2. --wp-admin-theme-color:#007cba;
  3. --wp-admin-theme-color--rgb:0, 124, 186;
  4. --wp-admin-theme-color-darker-10:#006ba1;
  5. --wp-admin-theme-color-darker-10--rgb:0, 107, 161;
  6. --wp-admin-theme-color-darker-20:#005a87;
  7. --wp-admin-theme-color-darker-20--rgb:0, 90, 135;
  8. --wp-admin-border-width-focus:2px;
  9. --wp-block-synced-color:#7a00df;
  10. --wp-block-synced-color--rgb:122, 0, 223;
  11. }
  12. @media (min-resolution:192dpi){
  13. :root{
  14. --wp-admin-border-width-focus:1.5px;
  15. }
  16. }
  17. .components-panel__header.interface-complementary-area-header__small{
  18. background:#fff;
  19. padding-right:4px;
  20. }
  21. .components-panel__header.interface-complementary-area-header__small .interface-complementary-area-header__small-title{
  22. overflow:hidden;
  23. text-overflow:ellipsis;
  24. white-space:nowrap;
  25. width:100%;
  26. }
  27. @media (min-width:782px){
  28. .components-panel__header.interface-complementary-area-header__small{
  29. display:none;
  30. }
  31. }
  32. .interface-complementary-area-header{
  33. background:#fff;
  34. padding-right:4px;
  35. }
  36. .interface-complementary-area-header .components-button.has-icon{
  37. display:none;
  38. margin-left:auto;
  39. }
  40. .interface-complementary-area-header .components-button.has-icon~.components-button{
  41. margin-left:0;
  42. }
  43. @media (min-width:782px){
  44. .interface-complementary-area-header .components-button.has-icon{
  45. display:flex;
  46. }
  47. .components-panel__header+.interface-complementary-area-header{
  48. margin-top:0;
  49. }
  50. }
  51. .interface-complementary-area{
  52. background:#fff;
  53. color:#1e1e1e;
  54. }
  55. @media (min-width:600px){
  56. .interface-complementary-area{
  57. -webkit-overflow-scrolling:touch;
  58. }
  59. }
  60. @media (min-width:782px){
  61. .interface-complementary-area{
  62. width:280px;
  63. }
  64. }
  65. .interface-complementary-area .components-panel{
  66. border:none;
  67. position:relative;
  68. z-index:0;
  69. }
  70. .interface-complementary-area .components-panel__header{
  71. position:sticky;
  72. top:0;
  73. z-index:1;
  74. }
  75. .interface-complementary-area .components-panel__header.edit-post-sidebar__panel-tabs{
  76. top:48px;
  77. }
  78. @media (min-width:782px){
  79. .interface-complementary-area .components-panel__header.edit-post-sidebar__panel-tabs{
  80. top:0;
  81. }
  82. }
  83. .interface-complementary-area p:not(.components-base-control__help){
  84. margin-top:0;
  85. }
  86. .interface-complementary-area h2{
  87. color:#1e1e1e;
  88. font-size:13px;
  89. margin-bottom:1.5em;
  90. }
  91. .interface-complementary-area h3{
  92. color:#1e1e1e;
  93. font-size:11px;
  94. font-weight:500;
  95. margin-bottom:1.5em;
  96. text-transform:uppercase;
  97. }
  98. .interface-complementary-area hr{
  99. border-bottom:1px solid #f0f0f0;
  100. border-top:none;
  101. margin:1.5em 0;
  102. }
  103. .interface-complementary-area div.components-toolbar,.interface-complementary-area div.components-toolbar-group{
  104. box-shadow:none;
  105. margin-bottom:1.5em;
  106. }
  107. .interface-complementary-area div.components-toolbar-group:last-child,.interface-complementary-area div.components-toolbar:last-child{
  108. margin-bottom:0;
  109. }
  110. .interface-complementary-area .block-editor-skip-to-selected-block:focus{
  111. bottom:10px;
  112. left:auto;
  113. right:10px;
  114. top:auto;
  115. }
  116. @media (min-width:782px){
  117. body.js.is-fullscreen-mode{
  118. height:calc(100% + 32px);
  119. margin-top:-32px;
  120. }
  121. body.js.is-fullscreen-mode #adminmenumain,body.js.is-fullscreen-mode #wpadminbar{
  122. display:none;
  123. }
  124. body.js.is-fullscreen-mode #wpcontent,body.js.is-fullscreen-mode #wpfooter{
  125. margin-left:0;
  126. }
  127. }
  128. html.interface-interface-skeleton__html-container{
  129. position:fixed;
  130. width:100%;
  131. }
  132. @media (min-width:782px){
  133. html.interface-interface-skeleton__html-container{
  134. position:static;
  135. width:auto;
  136. }
  137. }
  138. .interface-interface-skeleton{
  139. bottom:0;
  140. display:flex;
  141. flex-direction:row;
  142. height:auto;
  143. max-height:100%;
  144. position:fixed;
  145. right:0;
  146. top:46px;
  147. }
  148. @media (min-width:783px){
  149. .interface-interface-skeleton{
  150. top:32px;
  151. }
  152. .is-fullscreen-mode .interface-interface-skeleton{
  153. top:0;
  154. }
  155. }
  156. .interface-interface-skeleton__editor{
  157. display:flex;
  158. flex:0 1 100%;
  159. flex-direction:column;
  160. overflow:hidden;
  161. }
  162. .interface-interface-skeleton{
  163. left:0;
  164. }
  165. @media (min-width:783px){
  166. .interface-interface-skeleton{
  167. left:160px;
  168. }
  169. }
  170. @media (min-width:783px){
  171. .auto-fold .interface-interface-skeleton{
  172. left:36px;
  173. }
  174. }
  175. @media (min-width:961px){
  176. .auto-fold .interface-interface-skeleton{
  177. left:160px;
  178. }
  179. }
  180. .folded .interface-interface-skeleton{
  181. left:0;
  182. }
  183. @media (min-width:783px){
  184. .folded .interface-interface-skeleton{
  185. left:36px;
  186. }
  187. }
  188. body.is-fullscreen-mode .interface-interface-skeleton{
  189. left:0 !important;
  190. }
  191. .interface-interface-skeleton__body{
  192. display:flex;
  193. flex-grow:1;
  194. overflow:auto;
  195. overscroll-behavior-y:none;
  196. }
  197. @media (min-width:782px){
  198. .has-footer .interface-interface-skeleton__body{
  199. padding-bottom:25px;
  200. }
  201. }
  202. .interface-interface-skeleton__content{
  203. display:flex;
  204. flex-direction:column;
  205. flex-grow:1;
  206. overflow:auto;
  207. z-index:20;
  208. }
  209. @media (min-width:782px){
  210. .interface-interface-skeleton__content{
  211. z-index:auto;
  212. }
  213. }
  214. .interface-interface-skeleton__secondary-sidebar,.interface-interface-skeleton__sidebar{
  215. background:#fff;
  216. bottom:0;
  217. color:#1e1e1e;
  218. flex-shrink:0;
  219. left:0;
  220. position:absolute;
  221. right:0;
  222. top:0;
  223. z-index:100000;
  224. }
  225. @media (min-width:782px){
  226. .interface-interface-skeleton__secondary-sidebar,.interface-interface-skeleton__sidebar{
  227. position:relative !important;
  228. width:auto;
  229. }
  230. .is-sidebar-opened .interface-interface-skeleton__secondary-sidebar,.is-sidebar-opened .interface-interface-skeleton__sidebar{
  231. z-index:90;
  232. }
  233. }
  234. .interface-interface-skeleton__sidebar{
  235. overflow:auto;
  236. }
  237. @media (min-width:782px){
  238. .interface-interface-skeleton__sidebar{
  239. border-left:1px solid #e0e0e0;
  240. }
  241. .interface-interface-skeleton__secondary-sidebar{
  242. border-right:1px solid #e0e0e0;
  243. }
  244. }
  245. .interface-interface-skeleton__header{
  246. border-bottom:1px solid #e0e0e0;
  247. color:#1e1e1e;
  248. flex-shrink:0;
  249. height:auto;
  250. z-index:30;
  251. }
  252. .interface-interface-skeleton__footer{
  253. background-color:#fff;
  254. border-top:1px solid #e0e0e0;
  255. bottom:0;
  256. color:#1e1e1e;
  257. display:none;
  258. flex-shrink:0;
  259. height:auto;
  260. left:0;
  261. position:absolute;
  262. width:100%;
  263. z-index:90;
  264. }
  265. @media (min-width:782px){
  266. .interface-interface-skeleton__footer{
  267. display:flex;
  268. }
  269. }
  270. .interface-interface-skeleton__footer .block-editor-block-breadcrumb{
  271. align-items:center;
  272. background:#fff;
  273. display:flex;
  274. font-size:13px;
  275. height:24px;
  276. padding:0 18px;
  277. z-index:30;
  278. }
  279. .interface-interface-skeleton__actions{
  280. background:#fff;
  281. bottom:auto;
  282. color:#1e1e1e;
  283. left:auto;
  284. position:fixed !important;
  285. right:0;
  286. top:-9999em;
  287. width:100vw;
  288. z-index:100000;
  289. }
  290. @media (min-width:782px){
  291. .interface-interface-skeleton__actions{
  292. width:280px;
  293. }
  294. }
  295. .interface-interface-skeleton__actions:focus,.interface-interface-skeleton__actions:focus-within{
  296. bottom:0;
  297. top:auto;
  298. }
  299. .is-entity-save-view-open .interface-interface-skeleton__actions:focus,.is-entity-save-view-open .interface-interface-skeleton__actions:focus-within{
  300. top:46px;
  301. }
  302. @media (min-width:782px){
  303. .is-entity-save-view-open .interface-interface-skeleton__actions:focus,.is-entity-save-view-open .interface-interface-skeleton__actions:focus-within{
  304. border-left:1px solid #ddd;
  305. top:32px;
  306. }
  307. .is-fullscreen-mode .is-entity-save-view-open .interface-interface-skeleton__actions:focus,.is-fullscreen-mode .is-entity-save-view-open .interface-interface-skeleton__actions:focus-within{
  308. top:0;
  309. }
  310. }
  311. .interface-more-menu-dropdown{
  312. margin-left:-4px;
  313. }
  314. .interface-more-menu-dropdown .components-button{
  315. padding:0 2px;
  316. width:auto;
  317. }
  318. @media (min-width:600px){
  319. .interface-more-menu-dropdown{
  320. margin-left:0;
  321. }
  322. .interface-more-menu-dropdown .components-button{
  323. padding:0 4px;
  324. }
  325. }
  326. .interface-more-menu-dropdown__content .components-popover__content{
  327. min-width:280px;
  328. }
  329. @media (min-width:480px){
  330. .interface-more-menu-dropdown__content .components-popover__content{
  331. max-width:480px;
  332. }
  333. }
  334. .interface-more-menu-dropdown__content .components-popover__content .components-dropdown-menu__menu{
  335. padding:0;
  336. }
  337. .components-popover.interface-more-menu-dropdown__content{
  338. z-index:99998;
  339. }
  340. .interface-pinned-items{
  341. display:flex;
  342. gap:4px;
  343. margin-right:-4px;
  344. }
  345. .interface-pinned-items .components-button{
  346. display:none;
  347. margin:0;
  348. }
  349. .interface-pinned-items .components-button[aria-controls="edit-post:block"],.interface-pinned-items .components-button[aria-controls="edit-post:document"],.interface-pinned-items .components-button[aria-controls="edit-site:block-inspector"],.interface-pinned-items .components-button[aria-controls="edit-site:global-styles"],.interface-pinned-items .components-button[aria-controls="edit-site:template"]{
  350. display:flex;
  351. }
  352. .interface-pinned-items .components-button svg{
  353. max-height:24px;
  354. max-width:24px;
  355. }
  356. @media (min-width:600px){
  357. .interface-pinned-items .components-button{
  358. display:flex;
  359. }
  360. .interface-preferences-modal{
  361. height:calc(100% - 120px);
  362. width:calc(100% - 32px);
  363. }
  364. }
  365. @media (min-width:782px){
  366. .interface-preferences-modal{
  367. width:750px;
  368. }
  369. }
  370. @media (min-width:960px){
  371. .interface-preferences-modal{
  372. height:70%;
  373. }
  374. }
  375. @media (max-width:781px){
  376. .interface-preferences-modal .components-modal__content{
  377. padding:0;
  378. }
  379. }
  380. .interface-preferences__tabs .components-tab-panel__tabs{
  381. left:16px;
  382. position:absolute;
  383. top:84px;
  384. width:160px;
  385. }
  386. .interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item{
  387. border-radius:2px;
  388. font-weight:400;
  389. }
  390. .interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item.is-active{
  391. background:#f0f0f0;
  392. box-shadow:none;
  393. font-weight:500;
  394. }
  395. .interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item.is-active:after{
  396. content:none;
  397. }
  398. .interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item:focus:not(:disabled){
  399. box-shadow:inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
  400. outline:2px solid transparent;
  401. }
  402. .interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item:focus-visible:before{
  403. content:none;
  404. }
  405. .interface-preferences__tabs .components-tab-panel__tab-content{
  406. margin-left:160px;
  407. padding-left:24px;
  408. }
  409. @media (max-width:781px){
  410. .interface-preferences__provider{
  411. height:100%;
  412. }
  413. }
  414. .interface-preferences-modal__section{
  415. margin:0 0 2.5rem;
  416. }
  417. .interface-preferences-modal__section:last-child{
  418. margin:0;
  419. }
  420. .interface-preferences-modal__section-legend{
  421. margin-bottom:8px;
  422. }
  423. .interface-preferences-modal__section-title{
  424. font-size:.9rem;
  425. font-weight:600;
  426. margin-top:0;
  427. }
  428. .interface-preferences-modal__section-description{
  429. color:#757575;
  430. font-size:12px;
  431. font-style:normal;
  432. margin:-8px 0 8px;
  433. }
  434. .interface-preferences-modal__option+.interface-preferences-modal__option{
  435. margin-top:16px;
  436. }
  437. .interface-preferences-modal__option .components-base-control__help{
  438. margin-left:48px;
  439. margin-top:0;
  440. }
  441. .edit-site-custom-template-modal__contents-wrapper{
  442. height:100%;
  443. justify-content:flex-start !important;
  444. }
  445. .edit-site-custom-template-modal__contents-wrapper>*{
  446. width:100%;
  447. }
  448. .edit-site-custom-template-modal__contents-wrapper__suggestions_list{
  449. margin-left:-12px;
  450. margin-right:-12px;
  451. width:calc(100% + 24px);
  452. }
  453. .edit-site-custom-template-modal__contents>.components-button{
  454. height:auto;
  455. justify-content:center;
  456. }
  457. .edit-site-custom-template-modal .components-search-control input[type=search].components-search-control__input{
  458. background:#fff;
  459. border:1px solid #ddd;
  460. }
  461. .edit-site-custom-template-modal .components-search-control input[type=search].components-search-control__input:focus{
  462. border-color:var(--wp-admin-theme-color);
  463. box-shadow:0 0 0 1px var(--wp-admin-theme-color);
  464. }
  465. @media (min-width:782px){
  466. .edit-site-custom-template-modal{
  467. width:456px;
  468. }
  469. }
  470. @media (min-width:600px){
  471. .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list{
  472. overflow:scroll;
  473. }
  474. }
  475. .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item{
  476. display:block;
  477. height:auto;
  478. overflow-wrap:break-word;
  479. padding:8px 12px;
  480. text-align:left;
  481. white-space:pre-wrap;
  482. width:100%;
  483. }
  484. .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item mark{
  485. background:none;
  486. font-weight:700;
  487. }
  488. .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item:hover{
  489. background:rgba(var(--wp-admin-theme-color--rgb), .04);
  490. }
  491. .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item:hover *,.edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item:hover mark{
  492. color:var(--wp-admin-theme-color);
  493. }
  494. .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item:focus{
  495. background-color:#f0f0f0;
  496. }
  497. .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item:focus:not(:disabled){
  498. box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color) inset;
  499. }
  500. .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item__info,.edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item__title{
  501. display:block;
  502. overflow:hidden;
  503. text-overflow:ellipsis;
  504. }
  505. .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item__info{
  506. color:#757575;
  507. word-break:break-all;
  508. }
  509. .edit-site-custom-template-modal__no-results{
  510. border:1px solid #ccc;
  511. border-radius:2px;
  512. padding:16px;
  513. }
  514. .edit-site-custom-generic-template__modal .components-modal__header{
  515. border-bottom:none;
  516. }
  517. .edit-site-custom-generic-template__modal .components-modal__content:before{
  518. margin-bottom:4px;
  519. }
  520. .edit-site-template-actions-loading-screen-modal{
  521. -webkit-backdrop-filter:none;
  522. backdrop-filter:none;
  523. background-color:transparent;
  524. }
  525. .edit-site-template-actions-loading-screen-modal.is-full-screen{
  526. background-color:#fff;
  527. box-shadow:0 0 0 transparent;
  528. min-height:100%;
  529. min-width:100%;
  530. }
  531. .edit-site-template-actions-loading-screen-modal__content{
  532. align-items:center;
  533. display:flex;
  534. height:100%;
  535. justify-content:center;
  536. left:50%;
  537. position:absolute;
  538. transform:translateX(-50%);
  539. }
  540. .edit-site-add-new-template__modal{
  541. margin-top:64px;
  542. max-height:calc(100% - 128px);
  543. max-width:832px;
  544. width:calc(100% - 64px);
  545. }
  546. @media (min-width:960px){
  547. .edit-site-add-new-template__modal{
  548. width:calc(100% - 128px);
  549. }
  550. }
  551. .edit-site-add-new-template__modal .edit-site-add-new-template__custom-template-button svg,.edit-site-add-new-template__modal .edit-site-add-new-template__template-button svg{
  552. fill:var(--wp-admin-theme-color);
  553. }
  554. .edit-site-add-new-template__modal .edit-site-add-new-template__custom-template-button .edit-site-add-new-template__template-name{
  555. align-items:flex-start;
  556. flex-grow:1;
  557. }
  558. .edit-site-add-new-template__modal .edit-site-add-new-template__template-icon{
  559. background:rgba(var(--wp-admin-theme-color--rgb), .04);
  560. border-radius:100%;
  561. max-height:40px;
  562. max-width:40px;
  563. padding:8px;
  564. }
  565. .edit-site-add-new-template__template-list__contents>.components-button,.edit-site-custom-template-modal__contents>.components-button{
  566. border:1px solid #ddd;
  567. border-radius:2px;
  568. display:flex;
  569. flex-direction:column;
  570. justify-content:center;
  571. outline:1px solid transparent;
  572. padding:32px;
  573. }
  574. .edit-site-add-new-template__template-list__contents>.components-button span:first-child,.edit-site-custom-template-modal__contents>.components-button span:first-child{
  575. color:#1e1e1e;
  576. }
  577. .edit-site-add-new-template__template-list__contents>.components-button span,.edit-site-custom-template-modal__contents>.components-button span{
  578. color:#757575;
  579. }
  580. .edit-site-add-new-template__template-list__contents>.components-button:hover,.edit-site-custom-template-modal__contents>.components-button:hover{
  581. background:rgba(var(--wp-admin-theme-color--rgb), .04);
  582. border-color:transparent;
  583. color:var(--wp-admin-theme-color-darker-10);
  584. }
  585. .edit-site-add-new-template__template-list__contents>.components-button:hover span,.edit-site-custom-template-modal__contents>.components-button:hover span{
  586. color:var(--wp-admin-theme-color);
  587. }
  588. .edit-site-add-new-template__template-list__contents>.components-button:focus,.edit-site-custom-template-modal__contents>.components-button:focus{
  589. border-color:transparent;
  590. box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
  591. outline:3px solid transparent;
  592. }
  593. .edit-site-add-new-template__template-list__contents>.components-button:focus span:first-child,.edit-site-custom-template-modal__contents>.components-button:focus span:first-child{
  594. color:var(--wp-admin-theme-color);
  595. }
  596. .edit-site-add-new-template__template-list__contents .edit-site-add-new-template__custom-template-button,.edit-site-add-new-template__template-list__contents .edit-site-add-new-template__template-list__prompt,.edit-site-custom-template-modal__contents .edit-site-add-new-template__custom-template-button,.edit-site-custom-template-modal__contents .edit-site-add-new-template__template-list__prompt{
  597. grid-column-end:4;
  598. grid-column-start:1;
  599. }
  600. .edit-site-add-new-template__template-list__contents>.components-button{
  601. align-items:flex-start;
  602. height:100%;
  603. text-align:start;
  604. }
  605. .edit-site-block-editor__editor-styles-wrapper .components-button{
  606. font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;
  607. font-size:13px;
  608. padding:6px 12px;
  609. }
  610. .edit-site-block-editor__editor-styles-wrapper .components-button.has-icon,.edit-site-block-editor__editor-styles-wrapper .components-button.is-tertiary{
  611. padding:6px;
  612. }
  613. .edit-site-block-editor__block-list.is-navigation-block{
  614. padding:24px;
  615. }
  616. .edit-site-visual-editor{
  617. align-items:center;
  618. background-color:#1e1e1e;
  619. display:block;
  620. height:100%;
  621. overflow:hidden;
  622. position:relative;
  623. }
  624. .edit-site-visual-editor iframe{
  625. background:#fff;
  626. display:block;
  627. height:100%;
  628. width:100%;
  629. }
  630. .edit-site-visual-editor .edit-site-visual-editor__editor-canvas{
  631. height:100%;
  632. }
  633. .edit-site-visual-editor .edit-site-visual-editor__editor-canvas.is-focused{
  634. outline:calc(var(--wp-admin-border-width-focus)*2) solid var(--wp-admin-theme-color);
  635. outline-offset:calc(var(--wp-admin-border-width-focus)*-2);
  636. }
  637. .edit-site-layout.is-full-canvas .edit-site-visual-editor.is-focus-mode{
  638. padding:48px;
  639. }
  640. .edit-site-visual-editor.is-focus-mode .edit-site-visual-editor__editor-canvas{
  641. border-radius:2px;
  642. max-height:100%;
  643. }
  644. .edit-site-visual-editor.is-focus-mode .components-resizable-box__container{
  645. overflow:visible;
  646. }
  647. .edit-site-visual-editor .components-resizable-box__container{
  648. margin:0 auto;
  649. overflow:auto;
  650. }
  651. .edit-site-visual-editor.is-view-mode{
  652. box-shadow:0 20px 25px -5px rgba(0,0,0,.8),0 8px 10px -6px rgba(0,0,0,.8);
  653. }
  654. .edit-site-visual-editor.is-view-mode .block-editor-block-contextual-toolbar.is-fixed{
  655. display:none;
  656. }
  657. .edit-site-visual-editor__back-button{
  658. color:#fff;
  659. left:8px;
  660. position:absolute;
  661. top:8px;
  662. }
  663. .edit-site-visual-editor__back-button:active:not([aria-disabled=true]),.edit-site-visual-editor__back-button:focus:not([aria-disabled=true]),.edit-site-visual-editor__back-button:hover{
  664. color:#f0f0f0;
  665. }
  666. .resizable-editor__drag-handle{
  667. -webkit-appearance:none;
  668. appearance:none;
  669. background:none;
  670. border:0;
  671. border-radius:2px;
  672. bottom:0;
  673. cursor:ew-resize;
  674. margin:auto 0;
  675. outline:none;
  676. padding:0;
  677. position:absolute;
  678. top:0;
  679. width:12px;
  680. }
  681. .resizable-editor__drag-handle.is-variation-default{
  682. height:100px;
  683. }
  684. .resizable-editor__drag-handle.is-variation-separator{
  685. height:100%;
  686. right:0;
  687. width:24px;
  688. }
  689. .resizable-editor__drag-handle.is-variation-separator:after{
  690. background:transparent;
  691. border-radius:0;
  692. left:50%;
  693. right:0;
  694. transform:translateX(-1px);
  695. transition:all .2s ease;
  696. transition-delay:.1s;
  697. width:2px;
  698. }
  699. @media (prefers-reduced-motion:reduce){
  700. .resizable-editor__drag-handle.is-variation-separator:after{
  701. animation-delay:0s;
  702. animation-duration:1ms;
  703. transition-delay:0s;
  704. transition-duration:0s;
  705. }
  706. }
  707. .resizable-editor__drag-handle:after{
  708. background:#949494;
  709. border-radius:2px;
  710. bottom:24px;
  711. content:"";
  712. left:4px;
  713. position:absolute;
  714. right:0;
  715. top:24px;
  716. width:4px;
  717. }
  718. .resizable-editor__drag-handle.is-left{
  719. left:-16px;
  720. }
  721. .resizable-editor__drag-handle.is-right{
  722. right:-16px;
  723. }
  724. .resizable-editor__drag-handle:active,.resizable-editor__drag-handle:hover{
  725. opacity:1;
  726. }
  727. .resizable-editor__drag-handle:active.is-variation-default:after,.resizable-editor__drag-handle:hover.is-variation-default:after{
  728. background:#ccc;
  729. }
  730. .resizable-editor__drag-handle:active.is-variation-separator:after,.resizable-editor__drag-handle:hover.is-variation-separator:after{
  731. background:var(--wp-admin-theme-color);
  732. }
  733. .resizable-editor__drag-handle:focus:after{
  734. box-shadow:0 0 0 1px #2f2f2f, 0 0 0 calc(var(--wp-admin-border-width-focus) + 1px) var(--wp-admin-theme-color);
  735. }
  736. .resizable-editor__drag-handle.is-variation-separator:focus:after{
  737. border-radius:2px;
  738. box-shadow:inset 0 0 0 2px var(--wp-admin-theme-color);
  739. }
  740. .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{
  741. left:0;
  742. }
  743. @media (min-width:783px){
  744. .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{
  745. left:160px;
  746. }
  747. }
  748. @media (min-width:783px){
  749. .auto-fold .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{
  750. left:36px;
  751. }
  752. }
  753. @media (min-width:961px){
  754. .auto-fold .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{
  755. left:160px;
  756. }
  757. }
  758. .folded .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{
  759. left:0;
  760. }
  761. @media (min-width:783px){
  762. .folded .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{
  763. left:36px;
  764. }
  765. }
  766. body.is-fullscreen-mode .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{
  767. left:0 !important;
  768. }
  769. .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{
  770. display:block;
  771. position:sticky;
  772. top:0;
  773. width:100%;
  774. z-index:31;
  775. }
  776. @media (min-width:782px){
  777. .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{
  778. align-items:center;
  779. display:flex;
  780. height:60px;
  781. margin-left:180px;
  782. min-height:auto;
  783. position:fixed;
  784. top:32px;
  785. width:calc(100% - 180px);
  786. }
  787. .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed.is-collapsed,.edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed:empty{
  788. width:auto;
  789. }
  790. .is-fullscreen-mode .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{
  791. margin-left:240px;
  792. top:0;
  793. }
  794. .is-fullscreen-mode .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed.is-collapsed,.is-fullscreen-mode .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed:empty{
  795. width:auto;
  796. }
  797. .show-icon-labels .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{
  798. margin-left:80px;
  799. width:calc(100% - 140px);
  800. }
  801. .is-fullscreen-mode .show-icon-labels .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{
  802. margin-left:144px;
  803. }
  804. }
  805. @media (min-width:960px){
  806. .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed,.show-icon-labels .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{
  807. width:auto;
  808. }
  809. .is-fullscreen-mode .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{
  810. width:calc(100% - 536px);
  811. }
  812. }
  813. .edit-site-canvas-loader{
  814. align-items:center;
  815. animation:edit-site-canvas-loader__fade-in-animation .5s ease .2s;
  816. animation-fill-mode:forwards;
  817. display:flex;
  818. height:100%;
  819. justify-content:center;
  820. left:0;
  821. opacity:0;
  822. position:absolute;
  823. top:0;
  824. width:100%;
  825. }
  826. @media (prefers-reduced-motion:reduce){
  827. .edit-site-canvas-loader{
  828. animation-delay:0s;
  829. animation-duration:1ms;
  830. }
  831. }
  832. .edit-site-canvas-loader>div{
  833. width:160px;
  834. }
  835. @keyframes edit-site-canvas-loader__fade-in-animation{
  836. 0%{
  837. opacity:0;
  838. }
  839. to{
  840. opacity:1;
  841. }
  842. }
  843. .edit-site-code-editor{
  844. background-color:#fff;
  845. min-height:100%;
  846. position:relative;
  847. width:100%;
  848. }
  849. .edit-site-code-editor__body{
  850. margin-left:auto;
  851. margin-right:auto;
  852. max-width:1080px;
  853. padding:12px;
  854. width:100%;
  855. }
  856. @media (min-width:960px){
  857. .edit-site-code-editor__body{
  858. padding:24px;
  859. }
  860. }
  861. .edit-site-code-editor__toolbar{
  862. background:hsla(0,0%,100%,.8);
  863. display:flex;
  864. left:0;
  865. padding:4px 12px;
  866. position:sticky;
  867. right:0;
  868. top:0;
  869. z-index:1;
  870. }
  871. @media (min-width:600px){
  872. .edit-site-code-editor__toolbar{
  873. padding:12px;
  874. }
  875. }
  876. @media (min-width:960px){
  877. .edit-site-code-editor__toolbar{
  878. padding:12px 24px;
  879. }
  880. }
  881. .edit-site-code-editor__toolbar h2{
  882. color:#1e1e1e;
  883. font-size:13px;
  884. line-height:36px;
  885. margin:0 auto 0 0;
  886. }
  887. .edit-site-code-editor__toolbar .components-button svg{
  888. order:1;
  889. }
  890. textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area{
  891. border:1px solid #949494;
  892. border-radius:0;
  893. box-shadow:none;
  894. display:block;
  895. font-family:Menlo,Consolas,monaco,monospace;
  896. font-size:16px !important;
  897. line-height:2.4;
  898. margin:0;
  899. min-height:200px;
  900. overflow:hidden;
  901. padding:16px;
  902. resize:none;
  903. transition:border .1s ease-out,box-shadow .1s linear;
  904. width:100%;
  905. }
  906. @media (prefers-reduced-motion:reduce){
  907. textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area{
  908. transition-delay:0s;
  909. transition-duration:0s;
  910. }
  911. }
  912. @media (min-width:600px){
  913. textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area{
  914. font-size:15px !important;
  915. padding:24px;
  916. }
  917. }
  918. textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:focus{
  919. border-color:var(--wp-admin-theme-color);
  920. box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
  921. position:relative;
  922. }
  923. textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area::-webkit-input-placeholder{
  924. color:rgba(30,30,30,.62);
  925. }
  926. textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area::-moz-placeholder{
  927. color:rgba(30,30,30,.62);
  928. opacity:1;
  929. }
  930. textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:-ms-input-placeholder{
  931. color:rgba(30,30,30,.62);
  932. }
  933. .edit-site-global-styles-preview{
  934. align-items:center;
  935. cursor:pointer;
  936. display:flex;
  937. justify-content:center;
  938. line-height:1;
  939. }
  940. .edit-site-global-styles-preview__iframe{
  941. display:block;
  942. max-width:100%;
  943. }
  944. .edit-site-typography-preview{
  945. align-items:center;
  946. background:#f0f0f0;
  947. border-radius:2px;
  948. display:flex;
  949. justify-content:center;
  950. margin-bottom:16px;
  951. min-height:100px;
  952. overflow:hidden;
  953. }
  954. .edit-site-typography-panel__full-width-control{
  955. grid-column:1 / -1;
  956. max-width:100%;
  957. }
  958. .edit-site-global-styles-screen-css,.edit-site-global-styles-screen-typography{
  959. margin:16px;
  960. }
  961. .edit-site-global-styles-screen-typography__indicator{
  962. align-items:center;
  963. border-radius:2px;
  964. display:flex !important;
  965. font-size:14px;
  966. height:24px;
  967. justify-content:center;
  968. width:24px;
  969. }
  970. .edit-site-global-styles-screen-colors{
  971. margin:16px;
  972. }
  973. .edit-site-global-styles-screen-colors .color-block-support-panel{
  974. border-top:none;
  975. padding-left:0;
  976. padding-right:0;
  977. }
  978. .edit-site-global-styles-header__description{
  979. padding:0 16px;
  980. }
  981. .edit-site-block-types-search{
  982. margin-bottom:8px;
  983. padding:0 16px;
  984. }
  985. .edit-site-global-styles-header{
  986. margin-bottom:0 !important;
  987. }
  988. .edit-site-global-styles-subtitle{
  989. font-size:11px !important;
  990. font-weight:500 !important;
  991. margin-bottom:0 !important;
  992. text-transform:uppercase;
  993. }
  994. .edit-site-global-styles-section-title{
  995. color:#2f2f2f;
  996. font-weight:600;
  997. line-height:1.2;
  998. margin:0;
  999. padding:16px 16px 0;
  1000. }
  1001. .edit-site-global-styles-variations_item{
  1002. border-radius:2px;
  1003. box-sizing:border-box;
  1004. }
  1005. .edit-site-global-styles-variations_item .edit-site-global-styles-variations_item-preview{
  1006. border-radius:2px;
  1007. box-shadow:0 0 0 1px #e0e0e0;
  1008. outline:1px solid transparent;
  1009. padding:2px;
  1010. }
  1011. .edit-site-global-styles-variations_item.is-active .edit-site-global-styles-variations_item-preview{
  1012. box-shadow:0 0 0 1px #1e1e1e;
  1013. outline-width:3px;
  1014. }
  1015. .edit-site-global-styles-variations_item:hover .edit-site-global-styles-variations_item-preview{
  1016. box-shadow:0 0 0 1px var(--wp-admin-theme-color);
  1017. }
  1018. .edit-site-global-styles-variations_item:focus .edit-site-global-styles-variations_item-preview{
  1019. box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
  1020. }
  1021. .edit-site-global-styles-variations_item:focus-visible{
  1022. outline:3px solid transparent;
  1023. outline-offset:0;
  1024. }
  1025. .edit-site-global-styles-icon-with-current-color{
  1026. fill:currentColor;
  1027. }
  1028. .edit-site-global-styles__color-indicator-wrapper{
  1029. flex-shrink:0;
  1030. height:24px;
  1031. }
  1032. .edit-site-global-styles__block-preview-panel{
  1033. border:1px solid #e0e0e0;
  1034. border-radius:2px;
  1035. overflow:auto;
  1036. position:relative;
  1037. width:100%;
  1038. }
  1039. .edit-site-global-styles-screen-css{
  1040. display:flex;
  1041. flex:1 1 auto;
  1042. flex-direction:column;
  1043. }
  1044. .edit-site-global-styles-screen-css .components-v-stack{
  1045. flex:1 1 auto;
  1046. }
  1047. .edit-site-global-styles-screen-css .components-v-stack .block-editor-global-styles-advanced-panel__custom-css-input,.edit-site-global-styles-screen-css .components-v-stack .block-editor-global-styles-advanced-panel__custom-css-input .components-base-control__field{
  1048. display:flex;
  1049. flex:1 1 auto;
  1050. flex-direction:column;
  1051. }
  1052. .edit-site-global-styles-screen-css .components-v-stack .block-editor-global-styles-advanced-panel__custom-css-input .components-base-control__field .components-textarea-control__input{
  1053. direction:ltr;
  1054. flex:1 1 auto;
  1055. }
  1056. .edit-site-global-styles-screen-css-help-link{
  1057. display:block;
  1058. margin-top:8px;
  1059. }
  1060. .edit-site-global-styles-screen-variations{
  1061. border-top:1px solid #ddd;
  1062. margin-top:16px;
  1063. }
  1064. .edit-site-global-styles-screen-variations>*{
  1065. margin:24px 16px;
  1066. }
  1067. .edit-site-global-styles-sidebar__navigator-screen{
  1068. display:flex;
  1069. flex-direction:column;
  1070. }
  1071. .edit-site-global-styles-screen-root.edit-site-global-styles-screen-root,.edit-site-global-styles-screen-style-variations.edit-site-global-styles-screen-style-variations{
  1072. background:unset;
  1073. color:inherit;
  1074. }
  1075. .edit-site-global-styles-sidebar__panel .block-editor-block-icon svg{
  1076. fill:currentColor;
  1077. }
  1078. [class][class].edit-site-global-styles-sidebar__revisions-count-badge{
  1079. align-items:center;
  1080. background:#2f2f2f;
  1081. border-radius:2px;
  1082. color:#fff;
  1083. display:inline-flex;
  1084. justify-content:center;
  1085. min-height:24px;
  1086. min-width:24px;
  1087. }
  1088. .edit-site-global-styles-screen-revisions{
  1089. margin:16px;
  1090. }
  1091. .edit-site-global-styles-screen-revisions__revisions-list{
  1092. list-style:none;
  1093. margin:0;
  1094. }
  1095. .edit-site-global-styles-screen-revisions__revisions-list li{
  1096. border-left:1px solid #ddd;
  1097. margin-bottom:0;
  1098. }
  1099. .edit-site-global-styles-screen-revisions__revision-item{
  1100. padding:8px 0 8px 12px;
  1101. position:relative;
  1102. }
  1103. .edit-site-global-styles-screen-revisions__revision-item:first-child{
  1104. padding-top:0;
  1105. }
  1106. .edit-site-global-styles-screen-revisions__revision-item:last-child{
  1107. padding-bottom:0;
  1108. }
  1109. .edit-site-global-styles-screen-revisions__revision-item:before{
  1110. background:#ddd;
  1111. border-radius:50%;
  1112. content:"\a";
  1113. display:inline-block;
  1114. height:8px;
  1115. left:0;
  1116. position:absolute;
  1117. top:50%;
  1118. transform:translate(-50%, -50%);
  1119. width:8px;
  1120. }
  1121. .edit-site-global-styles-screen-revisions__revision-item.is-selected:before{
  1122. background:var(--wp-components-color-accent, var(--wp-admin-theme-color, #007cba));
  1123. }
  1124. .edit-site-global-styles-screen-revisions__revision-button{
  1125. display:block;
  1126. height:auto;
  1127. padding:8px 12px;
  1128. width:100%;
  1129. }
  1130. .edit-site-global-styles-screen-revisions__revision-button:hover{
  1131. background:rgba(var(--wp-admin-theme-color--rgb), .04);
  1132. }
  1133. .edit-site-global-styles-screen-revisions__revision-button:hover .edit-site-global-styles-screen-revisions__date{
  1134. color:var(--wp-admin-theme-color);
  1135. }
  1136. .is-selected .edit-site-global-styles-screen-revisions__revision-button{
  1137. background:rgba(var(--wp-admin-theme-color--rgb), .04);
  1138. color:var(--wp-components-color-accent, var(--wp-admin-theme-color, #007cba));
  1139. opacity:1;
  1140. }
  1141. .is-selected .edit-site-global-styles-screen-revisions__meta{
  1142. color:var(--wp-admin-theme-color);
  1143. }
  1144. .edit-site-global-styles-screen-revisions__button{
  1145. justify-content:center;
  1146. width:100%;
  1147. }
  1148. .edit-site-global-styles-screen-revisions__description{
  1149. align-items:flex-start;
  1150. display:flex;
  1151. flex-direction:column;
  1152. gap:8px;
  1153. }
  1154. .edit-site-global-styles-screen-revisions__meta{
  1155. align-items:center;
  1156. color:#757575;
  1157. display:flex;
  1158. justify-content:space-between;
  1159. text-align:left;
  1160. width:100%;
  1161. }
  1162. .edit-site-global-styles-screen-revisions__meta img{
  1163. border-radius:100%;
  1164. height:16px;
  1165. width:16px;
  1166. }
  1167. .edit-site-global-styles-screen-revisions__loading{
  1168. margin:24px auto !important;
  1169. }
  1170. .edit-site-header-edit-mode{
  1171. align-items:center;
  1172. background-color:#fff;
  1173. border-bottom:1px solid #e0e0e0;
  1174. box-sizing:border-box;
  1175. color:#1e1e1e;
  1176. display:flex;
  1177. height:60px;
  1178. justify-content:space-between;
  1179. padding-left:60px;
  1180. width:100%;
  1181. }
  1182. .edit-site-header-edit-mode .edit-site-header-edit-mode__start{
  1183. border:none;
  1184. display:flex;
  1185. }
  1186. .edit-site-header-edit-mode .edit-site-header-edit-mode__end{
  1187. display:flex;
  1188. justify-content:flex-end;
  1189. }
  1190. .edit-site-header-edit-mode .edit-site-header-edit-mode__center{
  1191. align-items:center;
  1192. display:flex;
  1193. flex-grow:1;
  1194. height:100%;
  1195. justify-content:center;
  1196. margin:0 8px;
  1197. min-width:0;
  1198. }
  1199. .edit-site-header-edit-mode__toolbar{
  1200. align-items:center;
  1201. display:flex;
  1202. padding-left:8px;
  1203. }
  1204. @media (min-width:600px){
  1205. .edit-site-header-edit-mode__toolbar{
  1206. padding-left:24px;
  1207. }
  1208. }
  1209. @media (min-width:1280px){
  1210. .edit-site-header-edit-mode__toolbar{
  1211. padding-right:8px;
  1212. }
  1213. }
  1214. .edit-site-header-edit-mode__toolbar .edit-site-header-edit-mode__inserter-toggle{
  1215. height:32px;
  1216. margin-right:8px;
  1217. min-width:32px;
  1218. padding:0;
  1219. width:32px;
  1220. }
  1221. .edit-site-header-edit-mode__toolbar .edit-site-header-edit-mode__inserter-toggle svg{
  1222. transition:transform .2s cubic-bezier(.165, .84, .44, 1);
  1223. }
  1224. @media (prefers-reduced-motion:reduce){
  1225. .edit-site-header-edit-mode__toolbar .edit-site-header-edit-mode__inserter-toggle svg{
  1226. transition-delay:0s;
  1227. transition-duration:0s;
  1228. }
  1229. }
  1230. .edit-site-header-edit-mode__toolbar .edit-site-header-edit-mode__inserter-toggle.is-pressed svg{
  1231. transform:rotate(45deg);
  1232. }
  1233. .edit-site-header-edit-mode__actions{
  1234. align-items:center;
  1235. display:inline-flex;
  1236. gap:4px;
  1237. padding-right:4px;
  1238. }
  1239. @media (min-width:600px){
  1240. .edit-site-header-edit-mode__actions{
  1241. gap:8px;
  1242. padding-right:10px;
  1243. }
  1244. }
  1245. .edit-site-header-edit-mode__preview-options{
  1246. opacity:1;
  1247. transition:opacity .3s;
  1248. }
  1249. .edit-site-header-edit-mode__preview-options.is-zoomed-out{
  1250. opacity:0;
  1251. }
  1252. .edit-site-header-edit-mode__start{
  1253. border:none;
  1254. display:flex;
  1255. }
  1256. .edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.components-button.has-icon,.edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.components-dropdown>.components-button.has-icon{
  1257. height:36px;
  1258. min-width:36px;
  1259. padding:6px;
  1260. }
  1261. .edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.components-button.has-icon.is-pressed,.edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.components-dropdown>.components-button.has-icon.is-pressed{
  1262. background:#1e1e1e;
  1263. }
  1264. .edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.components-button.has-icon:focus:not(:disabled),.edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.components-dropdown>.components-button.has-icon:focus:not(:disabled){
  1265. box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 0 0 1px #fff;
  1266. outline:1px solid transparent;
  1267. }
  1268. .edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.components-button.has-icon:before,.edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.components-dropdown>.components-button.has-icon:before{
  1269. display:none;
  1270. }
  1271. .edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.edit-site-header-edit-mode__inserter-toggle.has-icon{
  1272. height:32px;
  1273. margin-right:8px;
  1274. min-width:32px;
  1275. padding:0;
  1276. width:32px;
  1277. }
  1278. .edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.edit-site-header-edit-mode__inserter-toggle.has-text.has-icon{
  1279. padding:0 8px;
  1280. width:auto;
  1281. }
  1282. .edit-site-header-edit-mode.show-icon-labels .components-button.has-icon{
  1283. width:auto;
  1284. }
  1285. .edit-site-header-edit-mode.show-icon-labels .components-button.has-icon svg{
  1286. display:none;
  1287. }
  1288. .edit-site-header-edit-mode.show-icon-labels .components-button.has-icon:after{
  1289. content:attr(aria-label);
  1290. }
  1291. .edit-site-header-edit-mode.show-icon-labels .components-button.has-icon[aria-disabled=true]{
  1292. background-color:transparent;
  1293. }
  1294. .edit-site-header-edit-mode.show-icon-labels .is-tertiary:active{
  1295. background-color:transparent;
  1296. box-shadow:0 0 0 1.5px var(--wp-admin-theme-color);
  1297. }
  1298. .edit-site-header-edit-mode.show-icon-labels .edit-site-save-button__button{
  1299. padding-left:6px;
  1300. padding-right:6px;
  1301. }
  1302. .edit-site-header-edit-mode.show-icon-labels .edit-site-document-actions__get-info.edit-site-document-actions__get-info.edit-site-document-actions__get-info:after{
  1303. content:none;
  1304. }
  1305. .edit-site-header-edit-mode.show-icon-labels .edit-site-document-actions__get-info.edit-site-document-actions__get-info.edit-site-document-actions__get-info,.edit-site-header-edit-mode.show-icon-labels .edit-site-header-edit-mode__inserter-toggle.edit-site-header-edit-mode__inserter-toggle{
  1306. height:36px;
  1307. padding:0 8px;
  1308. }
  1309. .edit-site-header-edit-mode.show-icon-labels .edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>*+*{
  1310. margin-left:8px;
  1311. }
  1312. .edit-site-document-actions{
  1313. align-items:center;
  1314. background:#f0f0f0;
  1315. border-radius:4px;
  1316. display:flex;
  1317. height:36px;
  1318. justify-content:space-between;
  1319. min-width:0;
  1320. width:min(100%, 450px);
  1321. }
  1322. .has-fixed-toolbar .edit-site-document-actions{
  1323. width:min(100%, 380px);
  1324. }
  1325. .edit-site-document-actions:hover{
  1326. background-color:#e0e0e0;
  1327. }
  1328. .edit-site-document-actions .components-button{
  1329. border-radius:4px;
  1330. }
  1331. .edit-site-document-actions .components-button:hover{
  1332. background:#e0e0e0;
  1333. color:var(--wp-block-synced-color);
  1334. }
  1335. @media (min-width:960px){
  1336. .edit-site-document-actions{
  1337. width:min(100%, 450px);
  1338. }
  1339. }
  1340. .edit-site-document-actions.is-synced-entity .edit-site-document-actions__title,.edit-site-document-actions.is-synced-entity .edit-site-document-actions__title h1{
  1341. color:var(--wp-block-synced-color);
  1342. }
  1343. .edit-site-document-actions__command{
  1344. color:var(--wp-block-synced-color);
  1345. flex-grow:1;
  1346. overflow:hidden;
  1347. }
  1348. .edit-site-document-actions__title{
  1349. flex-grow:1;
  1350. overflow:hidden;
  1351. }
  1352. @media (min-width:600px){
  1353. .edit-site-document-actions__title{
  1354. padding-left:32px;
  1355. }
  1356. }
  1357. .edit-site-document-actions__title:hover{
  1358. color:var(--wp-block-synced-color);
  1359. }
  1360. .edit-site-document-actions__title .block-editor-block-icon{
  1361. flex-shrink:0;
  1362. min-width:24px;
  1363. }
  1364. .edit-site-document-actions__title h1{
  1365. max-width:50%;
  1366. overflow:hidden;
  1367. text-overflow:ellipsis;
  1368. white-space:nowrap;
  1369. }
  1370. .edit-site-document-actions.is-page .edit-site-document-actions__title,.edit-site-document-actions.is-page .edit-site-document-actions__title h1{
  1371. color:#2f2f2f;
  1372. }
  1373. .edit-site-document-actions.is-animated .edit-site-document-actions__title{
  1374. animation:edit-site-document-actions__slide-in-left .3s;
  1375. }
  1376. @media (prefers-reduced-motion:reduce){
  1377. .edit-site-document-actions.is-animated .edit-site-document-actions__title{
  1378. animation-delay:0s;
  1379. animation-duration:1ms;
  1380. }
  1381. }
  1382. .edit-site-document-actions.is-animated.is-page .edit-site-document-actions__title{
  1383. animation:edit-site-document-actions__slide-in-right .3s;
  1384. }
  1385. @media (prefers-reduced-motion:reduce){
  1386. .edit-site-document-actions.is-animated.is-page .edit-site-document-actions__title{
  1387. animation-delay:0s;
  1388. animation-duration:1ms;
  1389. }
  1390. }
  1391. .edit-site-document-actions__shortcut{
  1392. color:#2f2f2f;
  1393. display:none;
  1394. min-width:32px;
  1395. }
  1396. @media (min-width:600px){
  1397. .edit-site-document-actions__shortcut{
  1398. display:initial;
  1399. }
  1400. }
  1401. .edit-site-document-actions__back.components-button.has-icon.has-text{
  1402. color:#757575;
  1403. flex-shrink:0;
  1404. gap:0;
  1405. min-width:36px;
  1406. position:absolute;
  1407. z-index:1;
  1408. }
  1409. .edit-site-document-actions__back.components-button.has-icon.has-text:hover{
  1410. background-color:transparent;
  1411. color:currentColor;
  1412. }
  1413. .edit-site-document-actions.is-animated .edit-site-document-actions__back.components-button.has-icon.has-text{
  1414. animation:edit-site-document-actions__slide-in-left .3s;
  1415. }
  1416. @media (prefers-reduced-motion:reduce){
  1417. .edit-site-document-actions.is-animated .edit-site-document-actions__back.components-button.has-icon.has-text{
  1418. animation-delay:0s;
  1419. animation-duration:1ms;
  1420. }
  1421. }
  1422. @keyframes edit-site-document-actions__slide-in-right{
  1423. 0%{
  1424. opacity:0;
  1425. transform:translateX(-15%);
  1426. }
  1427. to{
  1428. opacity:1;
  1429. transform:translateX(0);
  1430. }
  1431. }
  1432. @keyframes edit-site-document-actions__slide-in-left{
  1433. 0%{
  1434. opacity:0;
  1435. transform:translateX(15%);
  1436. }
  1437. to{
  1438. opacity:1;
  1439. transform:translateX(0);
  1440. }
  1441. }
  1442. .edit-site-list-header{
  1443. align-items:center;
  1444. box-sizing:border-box;
  1445. display:flex;
  1446. height:60px;
  1447. justify-content:flex-end;
  1448. padding-right:16px;
  1449. position:relative;
  1450. width:100%;
  1451. }
  1452. body.is-fullscreen-mode .edit-site-list-header{
  1453. padding-left:60px;
  1454. transition:padding-left 20ms linear;
  1455. transition-delay:80ms;
  1456. }
  1457. @media (prefers-reduced-motion:reduce){
  1458. body.is-fullscreen-mode .edit-site-list-header{
  1459. transition-delay:0s;
  1460. transition-duration:0s;
  1461. }
  1462. }
  1463. .edit-site-list-header .edit-site-list-header__title{
  1464. font-size:20px;
  1465. left:0;
  1466. margin:0;
  1467. padding:0;
  1468. position:absolute;
  1469. text-align:center;
  1470. width:100%;
  1471. }
  1472. .edit-site-list-header__right{
  1473. position:relative;
  1474. }
  1475. .edit-site .edit-site-list{
  1476. background:#fff;
  1477. border-radius:8px;
  1478. box-shadow:0 20px 25px -5px rgba(0,0,0,.8),0 8px 10px -6px rgba(0,0,0,.8);
  1479. flex-grow:1;
  1480. }
  1481. .edit-site .edit-site-list .interface-interface-skeleton__editor{
  1482. min-width:100%;
  1483. }
  1484. @media (min-width:782px){
  1485. .edit-site .edit-site-list .interface-interface-skeleton__editor{
  1486. min-width:0;
  1487. }
  1488. }
  1489. .edit-site .edit-site-list .interface-interface-skeleton__content{
  1490. align-items:center;
  1491. background:#fff;
  1492. padding:16px;
  1493. }
  1494. @media (min-width:782px){
  1495. .edit-site .edit-site-list .interface-interface-skeleton__content{
  1496. padding:72px;
  1497. }
  1498. }
  1499. .edit-site-list-table{
  1500. border:1px solid #ddd;
  1501. border-radius:2px;
  1502. border-spacing:0;
  1503. margin:0 auto;
  1504. max-width:960px;
  1505. min-width:100%;
  1506. overflow:hidden;
  1507. }
  1508. .edit-site-list-table tr{
  1509. align-items:center;
  1510. border-top:1px solid #f0f0f0;
  1511. box-sizing:border-box;
  1512. display:flex;
  1513. margin:0;
  1514. padding:16px;
  1515. }
  1516. .edit-site-list-table tr:first-child{
  1517. border-top:0;
  1518. }
  1519. @media (min-width:782px){
  1520. .edit-site-list-table tr{
  1521. padding:24px 32px;
  1522. }
  1523. }
  1524. .edit-site-list-table tr .edit-site-list-table-column:first-child{
  1525. padding-right:24px;
  1526. width:calc(60% - 18px);
  1527. }
  1528. .edit-site-list-table tr .edit-site-list-table-column:first-child a{
  1529. display:inline-block;
  1530. font-weight:500;
  1531. margin-bottom:4px;
  1532. text-decoration:none;
  1533. }
  1534. .edit-site-list-table tr .edit-site-list-table-column:nth-child(2){
  1535. width:calc(40% - 18px);
  1536. word-break:break-word;
  1537. }
  1538. .edit-site-list-table tr .edit-site-list-table-column:nth-child(3){
  1539. flex-shrink:0;
  1540. min-width:36px;
  1541. }
  1542. .edit-site-list-table tr.edit-site-list-table-head{
  1543. border-bottom:1px solid #ddd;
  1544. border-top:none;
  1545. color:#1e1e1e;
  1546. font-size:16px;
  1547. font-weight:600;
  1548. text-align:left;
  1549. }
  1550. .edit-site-list-table tr.edit-site-list-table-head th{
  1551. font-weight:inherit;
  1552. }
  1553. @media (min-width:782px){
  1554. .edit-site-list.is-navigation-open .components-snackbar-list{
  1555. margin-left:360px;
  1556. }
  1557. }
  1558. .edit-site-list__rename-modal{
  1559. z-index:1000001;
  1560. }
  1561. @media (min-width:782px){
  1562. .edit-site-list__rename-modal .components-base-control{
  1563. width:320px;
  1564. }
  1565. }
  1566. .edit-site-template__actions button:not(:last-child){
  1567. margin-right:8px;
  1568. }
  1569. .edit-site-list-added-by__icon{
  1570. align-items:center;
  1571. background:#2f2f2f;
  1572. border-radius:100%;
  1573. display:flex;
  1574. flex-shrink:0;
  1575. height:32px;
  1576. justify-content:center;
  1577. width:32px;
  1578. }
  1579. .edit-site-list-added-by__icon svg{
  1580. fill:#fff;
  1581. }
  1582. .edit-site-list-added-by__avatar{
  1583. background:#2f2f2f;
  1584. border-radius:100%;
  1585. flex-shrink:0;
  1586. height:32px;
  1587. overflow:hidden;
  1588. width:32px;
  1589. }
  1590. .edit-site-list-added-by__avatar img{
  1591. height:32px;
  1592. object-fit:cover;
  1593. opacity:0;
  1594. transition:opacity .1s linear;
  1595. width:32px;
  1596. }
  1597. @media (prefers-reduced-motion:reduce){
  1598. .edit-site-list-added-by__avatar img{
  1599. transition-delay:0s;
  1600. transition-duration:0s;
  1601. }
  1602. }
  1603. .edit-site-list-added-by__avatar.is-loaded img{
  1604. opacity:1;
  1605. }
  1606. .edit-site-list-added-by__customized-info{
  1607. color:#757575;
  1608. display:block;
  1609. }
  1610. .edit-site-page{
  1611. background:#fff;
  1612. color:#2f2f2f;
  1613. flex-grow:1;
  1614. margin:60px 0 0;
  1615. overflow:hidden;
  1616. }
  1617. @media (min-width:782px){
  1618. .edit-site-page{
  1619. border-radius:8px;
  1620. margin:24px 24px 24px 0;
  1621. }
  1622. }
  1623. .edit-site-page-header{
  1624. background:#fff;
  1625. border-bottom:1px solid #f0f0f0;
  1626. min-height:60px;
  1627. padding:0 32px;
  1628. position:sticky;
  1629. top:0;
  1630. z-index:2;
  1631. }
  1632. .edit-site-page-header .components-text{
  1633. color:#2f2f2f;
  1634. }
  1635. .edit-site-page-header .components-heading{
  1636. color:#1e1e1e;
  1637. }
  1638. .edit-site-page-header .edit-site-page-header__sub-title{
  1639. color:#757575;
  1640. margin-top:8px;
  1641. }
  1642. .edit-site-page-content{
  1643. display:flex;
  1644. flex-flow:column;
  1645. height:100%;
  1646. overflow:auto;
  1647. position:relative;
  1648. z-index:1;
  1649. }
  1650. .edit-site-patterns{
  1651. background:none;
  1652. border-left:1px solid #2f2f2f;
  1653. border-radius:0;
  1654. margin:60px 0 0;
  1655. overflow-x:auto;
  1656. padding:0;
  1657. }
  1658. .edit-site-patterns .components-base-control{
  1659. width:100%;
  1660. }
  1661. @media (min-width:782px){
  1662. .edit-site-patterns .components-base-control{
  1663. width:auto;
  1664. }
  1665. }
  1666. .edit-site-patterns .components-text{
  1667. color:#949494;
  1668. }
  1669. .edit-site-patterns .components-heading{
  1670. color:#e0e0e0;
  1671. }
  1672. @media (min-width:782px){
  1673. .edit-site-patterns{
  1674. margin:0;
  1675. }
  1676. }
  1677. .edit-site-patterns .edit-site-patterns__search-block{
  1678. flex-grow:1;
  1679. min-width:-moz-fit-content;
  1680. min-width:fit-content;
  1681. }
  1682. .edit-site-patterns .edit-site-patterns__search input[type=search]{
  1683. background:#2f2f2f;
  1684. color:#e0e0e0;
  1685. height:40px;
  1686. }
  1687. .edit-site-patterns .edit-site-patterns__search input[type=search]:focus{
  1688. background:#2f2f2f;
  1689. }
  1690. .edit-site-patterns .edit-site-patterns__search svg{
  1691. fill:#949494;
  1692. }
  1693. .edit-site-patterns .edit-site-patterns__sync-status-filter{
  1694. background:#2f2f2f;
  1695. border:none;
  1696. height:40px;
  1697. max-width:100%;
  1698. min-width:max-content;
  1699. width:100%;
  1700. }
  1701. @media (min-width:782px){
  1702. .edit-site-patterns .edit-site-patterns__sync-status-filter{
  1703. width:300px;
  1704. }
  1705. }
  1706. .edit-site-patterns .edit-site-patterns__sync-status-filter-option:not([aria-checked=true]){
  1707. color:#949494;
  1708. }
  1709. .edit-site-patterns .edit-site-patterns__sync-status-filter-option:active{
  1710. background:#757575;
  1711. color:#f0f0f0;
  1712. }
  1713. .edit-site-patterns .edit-site-patterns__grid-pagination{
  1714. background:#1e1e1e;
  1715. border-top:1px solid #2f2f2f;
  1716. bottom:0;
  1717. padding:24px 32px;
  1718. position:sticky;
  1719. z-index:2;
  1720. }
  1721. .edit-site-patterns .edit-site-patterns__grid-pagination .components-button.is-tertiary{
  1722. background-color:#2f2f2f;
  1723. color:#f0f0f0;
  1724. height:32px;
  1725. justify-content:center;
  1726. width:32px;
  1727. }
  1728. .edit-site-patterns .edit-site-patterns__grid-pagination .components-button.is-tertiary:disabled{
  1729. background:none;
  1730. color:#949494;
  1731. }
  1732. .edit-site-patterns .edit-site-patterns__grid-pagination .components-button.is-tertiary:hover:not(:disabled){
  1733. background-color:#757575;
  1734. }
  1735. .edit-site-patterns__header{
  1736. background:#1e1e1e;
  1737. padding:32px 32px 16px;
  1738. position:sticky;
  1739. top:0;
  1740. z-index:2;
  1741. }
  1742. .edit-site-patterns__section{
  1743. flex:1;
  1744. padding:24px 32px;
  1745. }
  1746. .edit-site-patterns__section-header .screen-reader-shortcut:focus{
  1747. top:0;
  1748. }
  1749. .edit-site-patterns__grid{
  1750. display:grid;
  1751. gap:32px;
  1752. grid-template-columns:1fr;
  1753. margin-bottom:0;
  1754. margin-top:0;
  1755. }
  1756. @media (min-width:960px){
  1757. .edit-site-patterns__grid{
  1758. grid-template-columns:1fr 1fr;
  1759. }
  1760. }
  1761. @media (min-width:1440px){
  1762. .edit-site-patterns__grid{
  1763. grid-template-columns:1fr 1fr 1fr;
  1764. }
  1765. }
  1766. @media (min-width:1920px){
  1767. .edit-site-patterns__grid{
  1768. grid-template-columns:1fr 1fr 1fr 1fr;
  1769. }
  1770. }
  1771. .edit-site-patterns__grid .edit-site-patterns__pattern{
  1772. break-inside:avoid-column;
  1773. display:flex;
  1774. flex-direction:column;
  1775. }
  1776. .edit-site-patterns__grid .edit-site-patterns__pattern .edit-site-patterns__preview{
  1777. background-color:unset;
  1778. border:none;
  1779. border-radius:4px;
  1780. box-shadow:none;
  1781. box-sizing:border-box;
  1782. cursor:pointer;
  1783. overflow:hidden;
  1784. padding:0;
  1785. }
  1786. .edit-site-patterns__grid .edit-site-patterns__pattern .edit-site-patterns__preview:focus{
  1787. box-shadow:inset 0 0 0 0 #fff, 0 0 0 2px var(--wp-admin-theme-color);
  1788. outline:2px solid transparent;
  1789. }
  1790. .edit-site-patterns__grid .edit-site-patterns__pattern .edit-site-patterns__preview.is-inactive{
  1791. cursor:default;
  1792. }
  1793. .edit-site-patterns__grid .edit-site-patterns__pattern .edit-site-patterns__preview.is-inactive:focus{
  1794. box-shadow:0 0 0 var(--wp-admin-border-width-focus) #2f2f2f;
  1795. opacity:.8;
  1796. }
  1797. .edit-site-patterns__grid .edit-site-patterns__pattern .edit-site-patterns__button,.edit-site-patterns__grid .edit-site-patterns__pattern .edit-site-patterns__footer{
  1798. color:#949494;
  1799. }
  1800. .edit-site-patterns__grid .edit-site-patterns__pattern .edit-site-patterns__dropdown{
  1801. flex-shrink:0;
  1802. }
  1803. .edit-site-patterns__grid .edit-site-patterns__pattern.is-placeholder .edit-site-patterns__preview{
  1804. align-items:center;
  1805. border:1px dashed #2f2f2f;
  1806. color:#949494;
  1807. display:flex;
  1808. justify-content:center;
  1809. min-height:64px;
  1810. }
  1811. .edit-site-patterns__grid .edit-site-patterns__pattern.is-placeholder .edit-site-patterns__preview:focus{
  1812. box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
  1813. }
  1814. .edit-site-patterns__grid .edit-site-patterns__preview{
  1815. flex:0 1 auto;
  1816. margin-bottom:12px;
  1817. }
  1818. .edit-site-patterns__load-more{
  1819. align-self:center;
  1820. }
  1821. .edit-site-patterns__pattern-title{
  1822. color:#e0e0e0;
  1823. }
  1824. .edit-site-patterns__pattern-title .is-link{
  1825. color:#e0e0e0;
  1826. text-decoration:none;
  1827. }
  1828. .edit-site-patterns__pattern-title .is-link:focus,.edit-site-patterns__pattern-title .is-link:hover{
  1829. color:#fff;
  1830. }
  1831. .edit-site-patterns__pattern-title .edit-site-patterns__pattern-icon{
  1832. fill:#fff;
  1833. background:var(--wp-block-synced-color);
  1834. border-radius:4px;
  1835. }
  1836. .edit-site-patterns__pattern-title .edit-site-patterns__pattern-lock-icon{
  1837. fill:currentcolor;
  1838. }
  1839. .edit-site-patterns__no-results{
  1840. color:#949494;
  1841. }
  1842. .edit-site-table-wrapper{
  1843. padding:32px;
  1844. width:100%;
  1845. }
  1846. .edit-site-table{
  1847. border-collapse:collapse;
  1848. border-color:inherit;
  1849. position:relative;
  1850. text-indent:0;
  1851. width:100%;
  1852. }
  1853. .edit-site-table a{
  1854. text-decoration:none;
  1855. }
  1856. .edit-site-table th{
  1857. color:#757575;
  1858. font-weight:400;
  1859. padding:0 16px 16px;
  1860. text-align:left;
  1861. }
  1862. .edit-site-table td{
  1863. padding:16px;
  1864. }
  1865. .edit-site-table td,.edit-site-table th{
  1866. vertical-align:center;
  1867. }
  1868. .edit-site-table td:first-child,.edit-site-table th:first-child{
  1869. padding-left:0;
  1870. }
  1871. .edit-site-table td:last-child,.edit-site-table th:last-child{
  1872. padding-right:0;
  1873. text-align:right;
  1874. }
  1875. .edit-site-table tr{
  1876. border-bottom:1px solid #f0f0f0;
  1877. }
  1878. .edit-site-sidebar-edit-mode{
  1879. width:280px;
  1880. }
  1881. .edit-site-sidebar-edit-mode>.components-panel{
  1882. border-left:0;
  1883. border-right:0;
  1884. margin-bottom:-1px;
  1885. margin-top:-1px;
  1886. }
  1887. .edit-site-sidebar-edit-mode>.components-panel>.components-panel__header{
  1888. background:#f0f0f0;
  1889. }
  1890. .edit-site-sidebar-edit-mode .block-editor-block-inspector__card{
  1891. margin:0;
  1892. }
  1893. .edit-site-global-styles-sidebar{
  1894. display:flex;
  1895. flex-direction:column;
  1896. min-height:100%;
  1897. }
  1898. .edit-site-global-styles-sidebar__navigator-provider,.edit-site-global-styles-sidebar__panel{
  1899. display:flex;
  1900. flex:1;
  1901. flex-direction:column;
  1902. }
  1903. .edit-site-global-styles-sidebar__navigator-screen{
  1904. flex:1;
  1905. }
  1906. .edit-site-global-styles-sidebar .interface-complementary-area-header .components-button.has-icon{
  1907. margin-left:0;
  1908. }
  1909. .edit-site-global-styles-sidebar__reset-button.components-button{
  1910. margin-left:auto;
  1911. }
  1912. .edit-site-global-styles-sidebar .components-navigation__menu-title-heading{
  1913. font-size:15.6px;
  1914. font-weight:500;
  1915. }
  1916. .edit-site-global-styles-sidebar .components-navigation__item>button span{
  1917. font-weight:500;
  1918. }
  1919. .edit-site-global-styles-sidebar .block-editor-panel-color-gradient-settings,.edit-site-typography-panel{
  1920. border:0;
  1921. }
  1922. .edit-site-global-styles-sidebar .single-column{
  1923. grid-column:span 1;
  1924. }
  1925. .edit-site-global-styles-sidebar .components-tools-panel .span-columns{
  1926. grid-column:1 / -1;
  1927. }
  1928. .edit-site-global-styles-sidebar__blocks-group{
  1929. border-top:1px solid #e0e0e0;
  1930. padding-top:24px;
  1931. }
  1932. .edit-site-global-styles-sidebar__blocks-group-help{
  1933. padding:0 16px;
  1934. }
  1935. .edit-site-global-styles-color-palette-panel,.edit-site-global-styles-gradient-palette-panel{
  1936. padding:16px;
  1937. }
  1938. .edit-site-global-styles-sidebar hr{
  1939. margin:0;
  1940. }
  1941. .show-icon-labels .edit-site-global-styles-sidebar__header .components-button.has-icon svg{
  1942. display:none;
  1943. }
  1944. .show-icon-labels .edit-site-global-styles-sidebar__header .components-button.has-icon:after{
  1945. content:attr(aria-label);
  1946. font-size:12px;
  1947. }
  1948. .edit-site-sidebar-fixed-bottom-slot{
  1949. background:#fff;
  1950. border-top:1px solid #ddd;
  1951. bottom:0;
  1952. box-sizing:content-box;
  1953. display:flex;
  1954. padding:16px;
  1955. position:sticky;
  1956. }
  1957. .edit-site-swap-template-modal{
  1958. z-index:1000001;
  1959. }
  1960. .edit-site-page-panels__swap-template__confirm-modal__actions{
  1961. margin-top:24px;
  1962. }
  1963. .edit-site-page-panels__swap-template__modal-content .block-editor-block-patterns-list{
  1964. column-count:2;
  1965. column-gap:24px;
  1966. padding-top:2px;
  1967. }
  1968. @media (min-width:782px){
  1969. .edit-site-page-panels__swap-template__modal-content .block-editor-block-patterns-list{
  1970. column-count:3;
  1971. }
  1972. }
  1973. @media (min-width:1280px){
  1974. .edit-site-page-panels__swap-template__modal-content .block-editor-block-patterns-list{
  1975. column-count:4;
  1976. }
  1977. }
  1978. .edit-site-page-panels__swap-template__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item{
  1979. break-inside:avoid-column;
  1980. }
  1981. .edit-site-page-panels__swap-template__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__item:not(:focus):not(:hover) .block-editor-block-preview__container{
  1982. box-shadow:0 0 0 1px #ddd;
  1983. }
  1984. .edit-site-change-status__content .components-popover__content{
  1985. min-width:320px;
  1986. padding:16px;
  1987. }
  1988. .edit-site-change-status__content .edit-site-change-status__options .components-base-control__field>.components-v-stack{
  1989. gap:8px;
  1990. }
  1991. .edit-site-change-status__content .edit-site-change-status__options label .components-text{
  1992. display:block;
  1993. margin-left:26px;
  1994. }
  1995. .edit-site-change-status__content .edit-site-change-status__password-legend{
  1996. margin-bottom:8px;
  1997. padding:0;
  1998. }
  1999. .edit-site-summary-field .components-dropdown{
  2000. width:70%;
  2001. }
  2002. .edit-site-summary-field .edit-site-summary-field__trigger{
  2003. display:block;
  2004. max-width:100%;
  2005. overflow:hidden;
  2006. text-align:left;
  2007. text-overflow:ellipsis;
  2008. white-space:nowrap;
  2009. }
  2010. .edit-site-summary-field .edit-site-summary-field__label{
  2011. width:30%;
  2012. }
  2013. .edit-site-page-panels-edit-template__dropdown .components-popover__content{
  2014. min-width:240px;
  2015. }
  2016. .components-panel__header.edit-site-sidebar-edit-mode__panel-tabs{
  2017. border-top:0;
  2018. justify-content:flex-start;
  2019. margin-top:0;
  2020. padding-left:0;
  2021. padding-right:16px;
  2022. }
  2023. .components-panel__header.edit-site-sidebar-edit-mode__panel-tabs ul{
  2024. display:flex;
  2025. }
  2026. .components-panel__header.edit-site-sidebar-edit-mode__panel-tabs li{
  2027. margin:0;
  2028. }
  2029. .components-panel__header.edit-site-sidebar-edit-mode__panel-tabs .components-button.has-icon{
  2030. display:none;
  2031. height:24px;
  2032. margin:0 0 0 auto;
  2033. min-width:24px;
  2034. padding:0;
  2035. }
  2036. @media (min-width:782px){
  2037. .components-panel__header.edit-site-sidebar-edit-mode__panel-tabs .components-button.has-icon{
  2038. display:flex;
  2039. }
  2040. }
  2041. .components-button.edit-site-sidebar-edit-mode__panel-tab{
  2042. background:transparent;
  2043. border:none;
  2044. border-radius:0;
  2045. box-shadow:none;
  2046. cursor:pointer;
  2047. font-weight:500;
  2048. height:48px;
  2049. margin-left:0;
  2050. padding:3px 16px;
  2051. position:relative;
  2052. }
  2053. .components-button.edit-site-sidebar-edit-mode__panel-tab:focus:not(:disabled){
  2054. box-shadow:none;
  2055. outline:none;
  2056. position:relative;
  2057. }
  2058. .components-button.edit-site-sidebar-edit-mode__panel-tab:after{
  2059. background:var(--wp-admin-theme-color);
  2060. border-radius:0;
  2061. bottom:0;
  2062. content:"";
  2063. height:calc(var(--wp-admin-border-width-focus)*0);
  2064. left:0;
  2065. pointer-events:none;
  2066. position:absolute;
  2067. right:0;
  2068. transition:all .1s linear;
  2069. }
  2070. @media (prefers-reduced-motion:reduce){
  2071. .components-button.edit-site-sidebar-edit-mode__panel-tab:after{
  2072. transition-delay:0s;
  2073. transition-duration:0s;
  2074. }
  2075. }
  2076. .components-button.edit-site-sidebar-edit-mode__panel-tab.is-active:after{
  2077. height:calc(var(--wp-admin-border-width-focus)*1);
  2078. outline:2px solid transparent;
  2079. outline-offset:-1px;
  2080. }
  2081. .components-button.edit-site-sidebar-edit-mode__panel-tab:before{
  2082. border-radius:2px;
  2083. bottom:12px;
  2084. box-shadow:0 0 0 0 transparent;
  2085. content:"";
  2086. left:12px;
  2087. pointer-events:none;
  2088. position:absolute;
  2089. right:12px;
  2090. top:12px;
  2091. transition:all .1s linear;
  2092. }
  2093. @media (prefers-reduced-motion:reduce){
  2094. .components-button.edit-site-sidebar-edit-mode__panel-tab:before{
  2095. transition-delay:0s;
  2096. transition-duration:0s;
  2097. }
  2098. }
  2099. .components-button.edit-site-sidebar-edit-mode__panel-tab:focus-visible:before{
  2100. box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
  2101. outline:2px solid transparent;
  2102. }
  2103. .edit-site-sidebar-card{
  2104. align-items:flex-start;
  2105. display:flex;
  2106. }
  2107. .edit-site-sidebar-card__content{
  2108. flex-grow:1;
  2109. margin-bottom:4px;
  2110. }
  2111. .edit-site-sidebar-card__title{
  2112. font-weight:500;
  2113. line-height:24px;
  2114. }
  2115. .edit-site-sidebar-card__title.edit-site-sidebar-card__title{
  2116. margin:0;
  2117. }
  2118. .edit-site-sidebar-card__description{
  2119. font-size:13px;
  2120. }
  2121. .edit-site-sidebar-card__icon{
  2122. flex:0 0 24px;
  2123. height:24px;
  2124. margin-right:12px;
  2125. width:24px;
  2126. }
  2127. .edit-site-sidebar-card__header{
  2128. display:flex;
  2129. justify-content:space-between;
  2130. margin:0 0 4px;
  2131. }
  2132. .edit-site-template-card__template-areas{
  2133. margin-top:16px;
  2134. }
  2135. .edit-site-template-card__template-areas-list,.edit-site-template-card__template-areas-list>li{
  2136. margin:0;
  2137. }
  2138. .edit-site-template-card__template-areas-item{
  2139. width:100%;
  2140. }
  2141. .edit-site-template-card__template-areas-item.components-button.has-icon{
  2142. padding:0;
  2143. }
  2144. .edit-site-template-card__actions{
  2145. line-height:0;
  2146. }
  2147. .edit-site-template-card__actions>.components-button.is-small.has-icon{
  2148. min-width:auto;
  2149. padding:0;
  2150. }
  2151. .edit-site-template-revisions{
  2152. margin-left:-4px;
  2153. }
  2154. h3.edit-site-template-card__template-areas-title{
  2155. font-weight:500;
  2156. margin:0 0 8px;
  2157. }
  2158. .edit-site-template-panel__replace-template-modal{
  2159. z-index:1000001;
  2160. }
  2161. .edit-site-template-panel__replace-template-modal__content{
  2162. column-count:2;
  2163. column-gap:24px;
  2164. }
  2165. @media (min-width:782px){
  2166. .edit-site-template-panel__replace-template-modal__content{
  2167. column-count:3;
  2168. }
  2169. }
  2170. @media (min-width:1280px){
  2171. .edit-site-template-panel__replace-template-modal__content{
  2172. column-count:4;
  2173. }
  2174. }
  2175. .edit-site-editor__interface-skeleton{
  2176. opacity:1;
  2177. transition:opacity .1s ease-out;
  2178. }
  2179. @media (prefers-reduced-motion:reduce){
  2180. .edit-site-editor__interface-skeleton{
  2181. transition-delay:0s;
  2182. transition-duration:0s;
  2183. }
  2184. }
  2185. .edit-site-editor__interface-skeleton.is-loading{
  2186. opacity:0;
  2187. }
  2188. .edit-site-editor__interface-skeleton .interface-interface-skeleton__header{
  2189. border:0;
  2190. }
  2191. .edit-site-editor__toggle-save-panel{
  2192. background-color:#fff;
  2193. border:1px dotted #ddd;
  2194. box-sizing:border-box;
  2195. display:flex;
  2196. justify-content:center;
  2197. padding:24px;
  2198. width:280px;
  2199. }
  2200. .edit-site .components-editor-notices__snackbar{
  2201. bottom:40px;
  2202. left:0;
  2203. padding-left:16px;
  2204. padding-right:16px;
  2205. position:absolute;
  2206. right:0;
  2207. }
  2208. @media (min-width:783px){
  2209. .edit-site .components-editor-notices__snackbar{
  2210. left:160px;
  2211. }
  2212. }
  2213. @media (min-width:783px){
  2214. .auto-fold .edit-site .components-editor-notices__snackbar{
  2215. left:36px;
  2216. }
  2217. }
  2218. @media (min-width:961px){
  2219. .auto-fold .edit-site .components-editor-notices__snackbar{
  2220. left:160px;
  2221. }
  2222. }
  2223. .folded .edit-site .components-editor-notices__snackbar{
  2224. left:0;
  2225. }
  2226. @media (min-width:783px){
  2227. .folded .edit-site .components-editor-notices__snackbar{
  2228. left:36px;
  2229. }
  2230. }
  2231. body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{
  2232. left:0 !important;
  2233. }
  2234. .edit-site-create-template-part-modal{
  2235. z-index:1000001;
  2236. }
  2237. @media (min-width:600px){
  2238. .edit-site-create-template-part-modal .components-modal__frame{
  2239. max-width:500px;
  2240. }
  2241. }
  2242. .edit-site-create-template-part-modal__area-radio-group{
  2243. border:1px solid #757575;
  2244. border-radius:2px;
  2245. width:100%;
  2246. }
  2247. .edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio{
  2248. display:block;
  2249. height:100%;
  2250. padding:12px;
  2251. text-align:left;
  2252. width:100%;
  2253. }
  2254. .edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio,.edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio.is-primary:hover,.edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio.is-secondary:hover{
  2255. background-color:inherit;
  2256. border-bottom:1px solid #757575;
  2257. border-radius:0;
  2258. margin:0;
  2259. }
  2260. .edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio.is-primary:hover:not(:focus),.edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio.is-secondary:hover:not(:focus),.edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio:not(:focus){
  2261. box-shadow:none;
  2262. }
  2263. .edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio.is-primary:hover:focus,.edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio.is-secondary:hover:focus,.edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio:focus{
  2264. border-bottom:1px solid #fff;
  2265. }
  2266. .edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio.is-primary:hover:last-of-type,.edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio.is-secondary:hover:last-of-type,.edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio:last-of-type{
  2267. border-bottom:none;
  2268. }
  2269. .edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio:not(:hover),.edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio[aria-checked=true]{
  2270. color:#1e1e1e;
  2271. cursor:auto;
  2272. }
  2273. .edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio:not(:hover) .edit-site-create-template-part-modal__option-label div,.edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio[aria-checked=true] .edit-site-create-template-part-modal__option-label div{
  2274. color:#949494;
  2275. }
  2276. .edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio .edit-site-create-template-part-modal__option-label{
  2277. padding-top:4px;
  2278. white-space:normal;
  2279. }
  2280. .edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio .edit-site-create-template-part-modal__option-label div{
  2281. font-size:12px;
  2282. padding-top:4px;
  2283. }
  2284. .edit-site-create-template-part-modal__area-radio-group .components-button.edit-site-create-template-part-modal__area-radio .edit-site-create-template-part-modal__checkbox{
  2285. margin-left:auto;
  2286. min-width:24px;
  2287. }
  2288. .edit-site-editor__inserter-panel,.edit-site-editor__list-view-panel{
  2289. display:flex;
  2290. flex-direction:column;
  2291. height:100%;
  2292. }
  2293. @media (min-width:782px){
  2294. .edit-site-editor__list-view-panel{
  2295. width:350px;
  2296. }
  2297. }
  2298. .edit-site-editor__inserter-panel-header{
  2299. display:flex;
  2300. justify-content:flex-end;
  2301. padding-right:8px;
  2302. padding-top:8px;
  2303. }
  2304. .edit-site-editor__inserter-panel-content,.edit-site-editor__list-view-panel-content{
  2305. height:calc(100% - 44px);
  2306. }
  2307. @media (min-width:782px){
  2308. .edit-site-editor__inserter-panel-content{
  2309. height:100%;
  2310. }
  2311. }
  2312. .edit-site-editor__list-view-panel-header{
  2313. align-items:center;
  2314. border-bottom:1px solid #ddd;
  2315. display:flex;
  2316. height:48px;
  2317. justify-content:space-between;
  2318. padding-left:16px;
  2319. padding-right:4px;
  2320. }
  2321. .edit-site-editor__list-view-panel-content{
  2322. height:100%;
  2323. overflow:auto;
  2324. padding:8px 6px;
  2325. scrollbar-color:transparent transparent;
  2326. scrollbar-gutter:stable both-edges;
  2327. scrollbar-gutter:auto;
  2328. scrollbar-width:thin;
  2329. will-change:transform;
  2330. }
  2331. .edit-site-editor__list-view-panel-content::-webkit-scrollbar{
  2332. height:12px;
  2333. width:12px;
  2334. }
  2335. .edit-site-editor__list-view-panel-content::-webkit-scrollbar-track{
  2336. background-color:transparent;
  2337. }
  2338. .edit-site-editor__list-view-panel-content::-webkit-scrollbar-thumb{
  2339. background-clip:padding-box;
  2340. background-color:transparent;
  2341. border:3px solid transparent;
  2342. border-radius:8px;
  2343. }
  2344. .edit-site-editor__list-view-panel-content:focus-within::-webkit-scrollbar-thumb,.edit-site-editor__list-view-panel-content:focus::-webkit-scrollbar-thumb,.edit-site-editor__list-view-panel-content:hover::-webkit-scrollbar-thumb{
  2345. background-color:#949494;
  2346. }
  2347. .edit-site-editor__list-view-panel-content:focus,.edit-site-editor__list-view-panel-content:focus-within,.edit-site-editor__list-view-panel-content:hover{
  2348. scrollbar-color:#949494 transparent;
  2349. }
  2350. @media (hover:none){
  2351. .edit-site-editor__list-view-panel-content{
  2352. scrollbar-color:#949494 transparent;
  2353. }
  2354. }
  2355. .edit-site-welcome-guide{
  2356. width:312px;
  2357. }
  2358. .edit-site-welcome-guide.guide-editor .edit-site-welcome-guide__image .edit-site-welcome-guide.guide-styles .edit-site-welcome-guide__image{
  2359. background:#00a0d2;
  2360. }
  2361. .edit-site-welcome-guide.guide-page .edit-site-welcome-guide__video{
  2362. border-right:16px solid #3858e9;
  2363. border-top:16px solid #3858e9;
  2364. }
  2365. .edit-site-welcome-guide.guide-template .edit-site-welcome-guide__video{
  2366. border-left:16px solid #3858e9;
  2367. border-top:16px solid #3858e9;
  2368. }
  2369. .edit-site-welcome-guide__image{
  2370. margin:0 0 16px;
  2371. }
  2372. .edit-site-welcome-guide__image>img{
  2373. display:block;
  2374. max-width:100%;
  2375. object-fit:cover;
  2376. }
  2377. .edit-site-welcome-guide__heading{
  2378. font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;
  2379. font-size:24px;
  2380. line-height:1.4;
  2381. margin:16px 0;
  2382. padding:0 32px;
  2383. }
  2384. .edit-site-welcome-guide__text{
  2385. font-size:13px;
  2386. line-height:1.4;
  2387. margin:0 0 16px;
  2388. padding:0 32px;
  2389. }
  2390. .edit-site-welcome-guide__text img{
  2391. vertical-align:bottom;
  2392. }
  2393. .edit-site-welcome-guide__inserter-icon{
  2394. margin:0 4px;
  2395. vertical-align:text-top;
  2396. }
  2397. .edit-site-start-template-options__modal .edit-site-start-template-options__modal__actions{
  2398. background-color:#fff;
  2399. border-top:1px solid #ddd;
  2400. bottom:0;
  2401. height:92px;
  2402. margin-left:-32px;
  2403. margin-right:-32px;
  2404. padding-left:32px;
  2405. padding-right:32px;
  2406. position:absolute;
  2407. width:100%;
  2408. z-index:1;
  2409. }
  2410. .edit-site-start-template-options__modal .block-editor-block-patterns-list{
  2411. padding-bottom:92px;
  2412. }
  2413. .edit-site-start-template-options__modal-content .block-editor-block-patterns-list{
  2414. column-count:2;
  2415. column-gap:24px;
  2416. }
  2417. @media (min-width:782px){
  2418. .edit-site-start-template-options__modal-content .block-editor-block-patterns-list{
  2419. column-count:3;
  2420. }
  2421. }
  2422. @media (min-width:1280px){
  2423. .edit-site-start-template-options__modal-content .block-editor-block-patterns-list{
  2424. column-count:4;
  2425. }
  2426. }
  2427. .edit-site-start-template-options__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item{
  2428. break-inside:avoid-column;
  2429. }
  2430. .edit-site-start-template-options__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item .block-editor-block-patterns-list__item-title{
  2431. display:none;
  2432. }
  2433. .edit-site-start-template-options__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__item:not(:focus):not(:hover) .block-editor-block-preview__container{
  2434. box-shadow:0 0 0 1px #ddd;
  2435. }
  2436. .edit-site-keyboard-shortcut-help-modal__section{
  2437. margin:0 0 2rem;
  2438. }
  2439. .edit-site-keyboard-shortcut-help-modal__section-title{
  2440. font-size:.9rem;
  2441. font-weight:600;
  2442. }
  2443. .edit-site-keyboard-shortcut-help-modal__shortcut{
  2444. align-items:baseline;
  2445. border-top:1px solid #ddd;
  2446. display:flex;
  2447. margin-bottom:0;
  2448. padding:.6rem 0;
  2449. }
  2450. .edit-site-keyboard-shortcut-help-modal__shortcut:last-child{
  2451. border-bottom:1px solid #ddd;
  2452. }
  2453. .edit-site-keyboard-shortcut-help-modal__shortcut:empty{
  2454. display:none;
  2455. }
  2456. .edit-site-keyboard-shortcut-help-modal__shortcut-term{
  2457. font-weight:600;
  2458. margin:0 0 0 1rem;
  2459. text-align:right;
  2460. }
  2461. .edit-site-keyboard-shortcut-help-modal__shortcut-description{
  2462. flex:1;
  2463. flex-basis:auto;
  2464. margin:0;
  2465. }
  2466. .edit-site-keyboard-shortcut-help-modal__shortcut-key-combination{
  2467. background:none;
  2468. display:block;
  2469. margin:0;
  2470. padding:0;
  2471. }
  2472. .edit-site-keyboard-shortcut-help-modal__shortcut-key-combination+.edit-site-keyboard-shortcut-help-modal__shortcut-key-combination{
  2473. margin-top:10px;
  2474. }
  2475. .edit-site-keyboard-shortcut-help-modal__shortcut-key{
  2476. border-radius:8%;
  2477. margin:0 .2rem;
  2478. padding:.25rem .5rem;
  2479. }
  2480. .edit-site-keyboard-shortcut-help-modal__shortcut-key:last-child{
  2481. margin:0 0 0 .2rem;
  2482. }
  2483. .edit-site-layout{
  2484. background:#1e1e1e;
  2485. color:#ccc;
  2486. display:flex;
  2487. flex-direction:column;
  2488. height:100%;
  2489. }
  2490. .edit-site-layout__hub{
  2491. height:60px;
  2492. left:0;
  2493. position:fixed;
  2494. top:0;
  2495. width:calc(100vw - 48px);
  2496. z-index:3;
  2497. }
  2498. .edit-site-layout.is-full-canvas.is-edit-mode .edit-site-layout__hub{
  2499. padding-right:0;
  2500. width:60px;
  2501. }
  2502. @media (min-width:782px){
  2503. .edit-site-layout__hub{
  2504. width:336px;
  2505. }
  2506. }
  2507. .edit-site-layout.is-full-canvas .edit-site-layout__hub{
  2508. border-radius:0;
  2509. box-shadow:none;
  2510. padding-right:16px;
  2511. width:100vw;
  2512. }
  2513. @media (min-width:782px){
  2514. .edit-site-layout.is-full-canvas .edit-site-layout__hub{
  2515. padding-right:0;
  2516. width:auto;
  2517. }
  2518. }
  2519. .edit-site-layout__header-container{
  2520. z-index:4;
  2521. }
  2522. .edit-site-layout__header{
  2523. display:flex;
  2524. height:60px;
  2525. z-index:2;
  2526. }
  2527. .edit-site-layout:not(.is-full-canvas) .edit-site-layout__header{
  2528. position:fixed;
  2529. width:100vw;
  2530. }
  2531. .edit-site-layout__content{
  2532. display:flex;
  2533. flex-grow:1;
  2534. height:100%;
  2535. }
  2536. .edit-site-layout__sidebar-region{
  2537. flex-shrink:0;
  2538. width:100vw;
  2539. z-index:1;
  2540. }
  2541. @media (min-width:782px){
  2542. .edit-site-layout__sidebar-region{
  2543. width:360px;
  2544. }
  2545. }
  2546. .edit-site-layout.is-full-canvas .edit-site-layout__sidebar-region{
  2547. height:100vh;
  2548. left:0;
  2549. position:fixed !important;
  2550. top:0;
  2551. }
  2552. .edit-site-layout__sidebar-region .edit-site-layout__sidebar{
  2553. display:flex;
  2554. flex-direction:column;
  2555. height:100%;
  2556. }
  2557. .edit-site-layout__sidebar-region .resizable-editor__drag-handle{
  2558. right:0;
  2559. }
  2560. .edit-site-layout__main{
  2561. display:flex;
  2562. flex-direction:column;
  2563. flex-grow:1;
  2564. overflow:hidden;
  2565. }
  2566. .edit-site-layout__canvas-container{
  2567. flex-grow:1;
  2568. position:relative;
  2569. z-index:2;
  2570. }
  2571. .edit-site-layout__canvas-container.is-resizing:after{
  2572. bottom:0;
  2573. content:"";
  2574. left:0;
  2575. position:absolute;
  2576. right:0;
  2577. top:0;
  2578. z-index:100;
  2579. }
  2580. .edit-site-layout__canvas{
  2581. align-items:center;
  2582. bottom:0;
  2583. display:flex;
  2584. justify-content:center;
  2585. left:0;
  2586. position:absolute;
  2587. top:0;
  2588. width:100%;
  2589. }
  2590. .edit-site-layout__canvas.is-right-aligned{
  2591. justify-content:flex-end;
  2592. }
  2593. .edit-site-layout__canvas>div{
  2594. color:#1e1e1e;
  2595. }
  2596. @media (min-width:782px){
  2597. .edit-site-layout__canvas{
  2598. bottom:24px;
  2599. top:24px;
  2600. width:calc(100% - 24px);
  2601. }
  2602. .edit-site-layout:not(.is-full-canvas) .edit-site-layout__canvas>div .edit-site-visual-editor__editor-canvas,.edit-site-layout:not(.is-full-canvas) .edit-site-layout__canvas>div .interface-interface-skeleton__content,.edit-site-layout__canvas>div{
  2603. border-radius:8px;
  2604. }
  2605. }
  2606. .edit-site-layout.is-full-canvas .edit-site-layout__canvas{
  2607. bottom:0;
  2608. top:0;
  2609. width:100%;
  2610. }
  2611. .edit-site-layout.is-full-canvas .edit-site-layout__canvas>div{
  2612. border-radius:0;
  2613. }
  2614. .edit-site-layout__canvas .interface-interface-skeleton{
  2615. min-height:100% !important;
  2616. position:relative !important;
  2617. }
  2618. .edit-site-layout__view-mode-toggle.components-button{
  2619. align-items:center;
  2620. border-bottom:1px solid transparent;
  2621. border-radius:0;
  2622. color:#fff;
  2623. display:flex;
  2624. height:60px;
  2625. justify-content:center;
  2626. overflow:hidden;
  2627. padding:0;
  2628. position:relative;
  2629. width:60px;
  2630. }
  2631. .edit-site-layout.is-full-canvas.is-edit-mode .edit-site-layout__view-mode-toggle.components-button{
  2632. border-bottom-color:#e0e0e0;
  2633. transition:border-bottom-color .15s ease-out .4s;
  2634. }
  2635. .edit-site-layout__view-mode-toggle.components-button:active,.edit-site-layout__view-mode-toggle.components-button:hover{
  2636. color:#fff;
  2637. }
  2638. .edit-site-layout__view-mode-toggle.components-button:focus{
  2639. box-shadow:none;
  2640. }
  2641. .edit-site-layout__view-mode-toggle.components-button:before{
  2642. border-radius:4px;
  2643. bottom:9px;
  2644. box-shadow:none;
  2645. content:"";
  2646. display:block;
  2647. left:9px;
  2648. position:absolute;
  2649. right:9px;
  2650. top:9px;
  2651. transition:box-shadow .1s ease;
  2652. }
  2653. @media (prefers-reduced-motion:reduce){
  2654. .edit-site-layout__view-mode-toggle.components-button:before{
  2655. transition-delay:0s;
  2656. transition-duration:0s;
  2657. }
  2658. }
  2659. .edit-site-layout__view-mode-toggle.components-button:focus:before{
  2660. box-shadow:inset 0 0 0 var(--wp-admin-border-width-focus) hsla(0,0%,100%,.1), inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
  2661. }
  2662. .edit-site-layout__view-mode-toggle.components-button .edit-site-layout__view-mode-toggle-icon{
  2663. align-items:center;
  2664. border-radius:2px;
  2665. display:flex;
  2666. height:64px;
  2667. justify-content:center;
  2668. width:64px;
  2669. }
  2670. .edit-site-layout__actions{
  2671. background:#fff;
  2672. bottom:auto;
  2673. color:#1e1e1e;
  2674. left:auto;
  2675. position:fixed !important;
  2676. right:0;
  2677. top:-9999em;
  2678. width:280px;
  2679. z-index:100000;
  2680. }
  2681. .edit-site-layout__actions:focus,.edit-site-layout__actions:focus-within{
  2682. bottom:0;
  2683. top:auto;
  2684. }
  2685. .edit-site-layout__actions.is-entity-save-view-open:focus,.edit-site-layout__actions.is-entity-save-view-open:focus-within{
  2686. top:0;
  2687. }
  2688. @media (min-width:782px){
  2689. .edit-site-layout__actions{
  2690. border-left:1px solid #ddd;
  2691. }
  2692. .edit-site-layout.has-fixed-toolbar .edit-site-layout__canvas-container{
  2693. z-index:5;
  2694. }
  2695. .edit-site-layout.has-fixed-toolbar .edit-site-site-hub{
  2696. z-index:4;
  2697. }
  2698. }
  2699. @media (min-width:782px){
  2700. .edit-site-layout.has-fixed-toolbar .edit-site-layout__header:focus-within{
  2701. z-index:3;
  2702. }
  2703. }
  2704. .is-edit-mode.is-distraction-free .edit-site-layout__header-container{
  2705. height:60px;
  2706. left:0;
  2707. position:absolute;
  2708. right:0;
  2709. top:0;
  2710. width:100%;
  2711. z-index:4;
  2712. }
  2713. .is-edit-mode.is-distraction-free .edit-site-layout__header-container:focus-within{
  2714. opacity:1 !important;
  2715. }
  2716. .is-edit-mode.is-distraction-free .edit-site-layout__header-container:focus-within div{
  2717. transform:translateX(0) translateY(0) translateZ(0) !important;
  2718. }
  2719. .is-edit-mode.is-distraction-free .edit-site-layout__header-container:focus-within .edit-site-layout__header{
  2720. opacity:1 !important;
  2721. }
  2722. .is-edit-mode.is-distraction-free .edit-site-layout__header,.is-edit-mode.is-distraction-free .edit-site-site-hub{
  2723. position:absolute;
  2724. top:0;
  2725. z-index:2;
  2726. }
  2727. .is-edit-mode.is-distraction-free .edit-site-site-hub{
  2728. z-index:3;
  2729. }
  2730. .is-edit-mode.is-distraction-free .edit-site-layout__header{
  2731. width:100%;
  2732. }
  2733. .edit-site-save-hub{
  2734. border-top:1px solid #2f2f2f;
  2735. color:#949494;
  2736. flex-shrink:0;
  2737. margin:0;
  2738. padding:20px 24px;
  2739. }
  2740. .edit-site-save-hub__button{
  2741. color:inherit;
  2742. justify-content:center;
  2743. width:100%;
  2744. }
  2745. .edit-site-save-hub__button[aria-disabled=true]{
  2746. opacity:1;
  2747. }
  2748. .edit-site-save-hub__button[aria-disabled=true]:hover{
  2749. color:inherit;
  2750. }
  2751. @media (min-width:600px){
  2752. .edit-site-save-panel__modal{
  2753. width:600px;
  2754. }
  2755. }
  2756. .edit-site-sidebar__content{
  2757. flex-grow:1;
  2758. overflow-y:auto;
  2759. }
  2760. .edit-site-sidebar__content .components-navigator-screen{
  2761. display:flex;
  2762. flex-direction:column;
  2763. height:100%;
  2764. scrollbar-color:transparent transparent;
  2765. scrollbar-gutter:stable both-edges;
  2766. scrollbar-gutter:stable;
  2767. scrollbar-width:thin;
  2768. will-change:transform;
  2769. }
  2770. .edit-site-sidebar__content .components-navigator-screen::-webkit-scrollbar{
  2771. height:12px;
  2772. width:12px;
  2773. }
  2774. .edit-site-sidebar__content .components-navigator-screen::-webkit-scrollbar-track{
  2775. background-color:transparent;
  2776. }
  2777. .edit-site-sidebar__content .components-navigator-screen::-webkit-scrollbar-thumb{
  2778. background-clip:padding-box;
  2779. background-color:transparent;
  2780. border:3px solid transparent;
  2781. border-radius:8px;
  2782. }
  2783. .edit-site-sidebar__content .components-navigator-screen:focus-within::-webkit-scrollbar-thumb,.edit-site-sidebar__content .components-navigator-screen:focus::-webkit-scrollbar-thumb,.edit-site-sidebar__content .components-navigator-screen:hover::-webkit-scrollbar-thumb{
  2784. background-color:#757575;
  2785. }
  2786. .edit-site-sidebar__content .components-navigator-screen:focus,.edit-site-sidebar__content .components-navigator-screen:focus-within,.edit-site-sidebar__content .components-navigator-screen:hover{
  2787. scrollbar-color:#757575 transparent;
  2788. }
  2789. @media (hover:none){
  2790. .edit-site-sidebar__content .components-navigator-screen{
  2791. scrollbar-color:#757575 transparent;
  2792. }
  2793. }
  2794. .edit-site-sidebar__footer{
  2795. border-top:1px solid #2f2f2f;
  2796. flex-shrink:0;
  2797. margin:0 24px;
  2798. padding:24px 0;
  2799. }
  2800. .edit-site-sidebar__content>div{
  2801. padding:0 12px;
  2802. }
  2803. .edit-site-sidebar-button{
  2804. color:#e0e0e0;
  2805. flex-shrink:0;
  2806. }
  2807. .edit-site-sidebar-button:focus:not(:disabled){
  2808. box-shadow:none;
  2809. outline:none;
  2810. }
  2811. .edit-site-sidebar-button:focus-visible:not(:disabled){
  2812. box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, #007cba));
  2813. outline:3px solid transparent;
  2814. }
  2815. .edit-site-sidebar-button:focus,.edit-site-sidebar-button:focus-visible,.edit-site-sidebar-button:hover,.edit-site-sidebar-button:not([aria-disabled=true]):active,.edit-site-sidebar-button[aria-expanded=true]{
  2816. color:#f0f0f0;
  2817. }
  2818. .edit-site-sidebar-navigation-item.components-item{
  2819. border:none;
  2820. border-radius:2px;
  2821. color:#949494;
  2822. min-height:40px;
  2823. padding:8px 6px 8px 16px;
  2824. }
  2825. .edit-site-sidebar-navigation-item.components-item:focus,.edit-site-sidebar-navigation-item.components-item:hover,.edit-site-sidebar-navigation-item.components-item[aria-current]{
  2826. background:#2f2f2f;
  2827. color:#e0e0e0;
  2828. }
  2829. .edit-site-sidebar-navigation-item.components-item:focus .edit-site-sidebar-navigation-item__drilldown-indicator,.edit-site-sidebar-navigation-item.components-item:hover .edit-site-sidebar-navigation-item__drilldown-indicator,.edit-site-sidebar-navigation-item.components-item[aria-current] .edit-site-sidebar-navigation-item__drilldown-indicator{
  2830. fill:#e0e0e0;
  2831. }
  2832. .edit-site-sidebar-navigation-item.components-item[aria-current]{
  2833. background:var(--wp-admin-theme-color);
  2834. color:#fff;
  2835. }
  2836. .edit-site-sidebar-navigation-item.components-item .edit-site-sidebar-navigation-item__drilldown-indicator{
  2837. fill:#949494;
  2838. }
  2839. .edit-site-sidebar-navigation-item.components-item.with-suffix{
  2840. padding-right:16px;
  2841. }
  2842. .edit-site-sidebar-navigation-screen__content .block-editor-list-view-block-select-button{
  2843. cursor:grab;
  2844. padding:8px;
  2845. }
  2846. .edit-site-sidebar-navigation-screen{
  2847. display:flex;
  2848. flex-direction:column;
  2849. overflow-x:unset !important;
  2850. position:relative;
  2851. }
  2852. .edit-site-sidebar-navigation-screen__main{
  2853. flex-grow:1;
  2854. margin-bottom:16px;
  2855. }
  2856. .edit-site-sidebar-navigation-screen__main.has-footer{
  2857. margin-bottom:0;
  2858. }
  2859. .edit-site-sidebar-navigation-screen__content{
  2860. padding:0 16px;
  2861. }
  2862. .edit-site-sidebar-navigation-screen__content .components-item-group{
  2863. margin-left:-16px;
  2864. margin-right:-16px;
  2865. }
  2866. .edit-site-sidebar-navigation-screen__content .components-text{
  2867. color:#ccc;
  2868. }
  2869. .edit-site-sidebar-navigation-screen__content .components-heading{
  2870. margin-bottom:8px;
  2871. }
  2872. .edit-site-sidebar-navigation-screen__meta{
  2873. color:#ccc;
  2874. margin:0 0 16px 16px;
  2875. }
  2876. .edit-site-sidebar-navigation-screen__meta .components-text{
  2877. color:#ccc;
  2878. }
  2879. .edit-site-sidebar-navigation-screen__page-link{
  2880. color:#949494;
  2881. display:inline-block;
  2882. }
  2883. .edit-site-sidebar-navigation-screen__page-link:focus,.edit-site-sidebar-navigation-screen__page-link:hover{
  2884. color:#fff;
  2885. }
  2886. .edit-site-sidebar-navigation-screen__page-link .components-external-link__icon{
  2887. margin-left:4px;
  2888. }
  2889. .edit-site-sidebar-navigation-screen__title-icon{
  2890. background:#1e1e1e;
  2891. margin-bottom:8px;
  2892. padding-bottom:8px;
  2893. padding-top:108px;
  2894. position:sticky;
  2895. top:0;
  2896. z-index:1;
  2897. }
  2898. .edit-site-sidebar-navigation-screen__title{
  2899. flex-grow:1;
  2900. overflow-wrap:break-word;
  2901. padding:6px 0 0;
  2902. }
  2903. .edit-site-sidebar-navigation-screen__actions{
  2904. flex-shrink:0;
  2905. }
  2906. @media (min-width:782px){
  2907. .edit-site-sidebar-navigation-screen__content .edit-site-global-styles-style-variations-container{
  2908. max-width:292px;
  2909. }
  2910. }
  2911. .edit-site-sidebar-navigation-screen__content .edit-site-global-styles-style-variations-container .edit-site-global-styles-variations_item-preview{
  2912. box-shadow:0 0 0 1px #1e1e1e;
  2913. }
  2914. .edit-site-sidebar-navigation-screen__content .edit-site-global-styles-style-variations-container .edit-site-global-styles-variations_item.is-active .edit-site-global-styles-variations_item-preview{
  2915. box-shadow:0 0 0 1px #f0f0f0;
  2916. }
  2917. .edit-site-sidebar-navigation-screen__content .edit-site-global-styles-style-variations-container .edit-site-global-styles-variations_item:hover .edit-site-global-styles-variations_item-preview{
  2918. box-shadow:0 0 0 1px var(--wp-admin-theme-color);
  2919. }
  2920. .edit-site-sidebar-navigation-screen__content .edit-site-global-styles-style-variations-container .edit-site-global-styles-variations_item:focus .edit-site-global-styles-variations_item-preview{
  2921. box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
  2922. }
  2923. .edit-site-sidebar-navigation-screen__footer{
  2924. background-color:#1e1e1e;
  2925. border-top:1px solid #2f2f2f;
  2926. bottom:0;
  2927. gap:0;
  2928. margin:16px 0 0;
  2929. padding:16px 0;
  2930. position:sticky;
  2931. }
  2932. .edit-site-sidebar__notice{
  2933. background:#2f2f2f;
  2934. color:#ddd;
  2935. margin:24px 0;
  2936. }
  2937. .edit-site-sidebar__notice.is-dismissible{
  2938. padding-right:8px;
  2939. }
  2940. .edit-site-sidebar__notice .components-notice__dismiss:not(:disabled):not([aria-disabled=true]){
  2941. color:#ccc;
  2942. }
  2943. .edit-site-sidebar__notice .components-notice__dismiss:not(:disabled):not([aria-disabled=true]):focus,.edit-site-sidebar__notice .components-notice__dismiss:not(:disabled):not([aria-disabled=true]):not(.is-secondary):active,.edit-site-sidebar__notice .components-notice__dismiss:not(:disabled):not([aria-disabled=true]):not(.is-secondary):hover{
  2944. color:#fff;
  2945. }
  2946. .edit-site-sidebar-navigation-screen__input-control{
  2947. width:100%;
  2948. }
  2949. .edit-site-sidebar-navigation-screen__input-control .components-input-control__container{
  2950. background:#2f2f2f;
  2951. }
  2952. .edit-site-sidebar-navigation-screen__input-control .components-input-control__container .components-button{
  2953. color:#e0e0e0 !important;
  2954. }
  2955. .edit-site-sidebar-navigation-screen__input-control .components-input-control__input{
  2956. background:#2f2f2f !important;
  2957. border-radius:2px;
  2958. color:#e0e0e0 !important;
  2959. }
  2960. .edit-site-sidebar-navigation-screen__input-control .components-input-control__backdrop{
  2961. border:4px !important;
  2962. }
  2963. .edit-site-sidebar-navigation-screen__input-control .components-base-control__help{
  2964. color:#949494;
  2965. }
  2966. .edit-site-sidebar-navigation-screen-details-footer div.edit-site-sidebar-navigation-item.components-item:focus,.edit-site-sidebar-navigation-screen-details-footer div.edit-site-sidebar-navigation-item.components-item:hover,.edit-site-sidebar-navigation-screen-details-footer div.edit-site-sidebar-navigation-item.components-item[aria-current]{
  2967. background:none;
  2968. }
  2969. .edit-site-sidebar-navigation-screen-details-footer .edit-site-sidebar-navigation-screen-details-footer__icon{
  2970. fill:#949494;
  2971. margin-left:auto;
  2972. }
  2973. .sidebar-navigation__more-menu .components-button{
  2974. color:#e0e0e0;
  2975. }
  2976. .sidebar-navigation__more-menu .components-button:focus,.sidebar-navigation__more-menu .components-button:hover,.sidebar-navigation__more-menu .components-button[aria-current]{
  2977. color:#f0f0f0;
  2978. }
  2979. .edit-site-sidebar-navigation-screen-page__featured-image-wrapper{
  2980. background-color:#2f2f2f;
  2981. border-radius:4px;
  2982. margin-bottom:16px;
  2983. min-height:128px;
  2984. }
  2985. .edit-site-sidebar-navigation-screen-page__featured-image{
  2986. align-items:center;
  2987. background-position:50% 50%;
  2988. background-size:cover;
  2989. border-radius:2px;
  2990. color:#949494;
  2991. display:flex;
  2992. height:128px;
  2993. justify-content:center;
  2994. overflow:hidden;
  2995. width:100%;
  2996. }
  2997. .edit-site-sidebar-navigation-screen-page__featured-image img{
  2998. height:100%;
  2999. object-fit:cover;
  3000. object-position:50% 50%;
  3001. width:100%;
  3002. }
  3003. .edit-site-sidebar-navigation-screen-page__featured-image-description{
  3004. font-size:12px;
  3005. }
  3006. .edit-site-sidebar-navigation-screen-page__excerpt{
  3007. font-size:12px;
  3008. margin-bottom:24px;
  3009. }
  3010. .edit-site-sidebar-navigation-screen-page__modified{
  3011. color:#949494;
  3012. margin:0 0 16px 16px;
  3013. }
  3014. .edit-site-sidebar-navigation-screen-page__modified .components-text{
  3015. color:#949494;
  3016. }
  3017. .edit-site-sidebar-navigation-screen-page__status{
  3018. display:inline-flex;
  3019. }
  3020. .edit-site-sidebar-navigation-screen-page__status time{
  3021. display:contents;
  3022. }
  3023. .edit-site-sidebar-navigation-screen-page__status svg{
  3024. fill:#f0b849;
  3025. height:16px;
  3026. margin-right:8px;
  3027. width:16px;
  3028. }
  3029. .edit-site-sidebar-navigation-screen-page__status.has-future-status svg,.edit-site-sidebar-navigation-screen-page__status.has-publish-status svg{
  3030. fill:#4ab866;
  3031. }
  3032. .edit-site-sidebar-navigation-details-screen-panel{
  3033. margin:24px 0;
  3034. }
  3035. .edit-site-sidebar-navigation-details-screen-panel:last-of-type{
  3036. margin-bottom:0;
  3037. }
  3038. .edit-site-sidebar-navigation-details-screen-panel .edit-site-sidebar-navigation-details-screen-panel__heading{
  3039. color:#ccc;
  3040. font-size:11px;
  3041. font-weight:500;
  3042. margin-bottom:0;
  3043. padding:0;
  3044. text-transform:uppercase;
  3045. }
  3046. .edit-site-sidebar-navigation-details-screen-panel__label.edit-site-sidebar-navigation-details-screen-panel__label{
  3047. color:#949494;
  3048. flex-shrink:0;
  3049. width:100px;
  3050. }
  3051. .edit-site-sidebar-navigation-details-screen-panel__value.edit-site-sidebar-navigation-details-screen-panel__value{
  3052. color:#e0e0e0;
  3053. }
  3054. .edit-site-sidebar-navigation-screen-pattern__added-by-description{
  3055. align-items:center;
  3056. display:flex;
  3057. justify-content:space-between;
  3058. margin-top:24px;
  3059. }
  3060. .edit-site-sidebar-navigation-screen-pattern__added-by-description-author{
  3061. align-items:center;
  3062. display:inline-flex;
  3063. }
  3064. .edit-site-sidebar-navigation-screen-pattern__added-by-description-author img{
  3065. border-radius:12px;
  3066. }
  3067. .edit-site-sidebar-navigation-screen-pattern__added-by-description-author svg{
  3068. fill:#949494;
  3069. }
  3070. .edit-site-sidebar-navigation-screen-pattern__added-by-description-author-icon{
  3071. height:24px;
  3072. margin-right:8px;
  3073. width:24px;
  3074. }
  3075. .edit-site-sidebar-navigation-screen-patterns__group{
  3076. margin-bottom:24px;
  3077. }
  3078. .edit-site-sidebar-navigation-screen-patterns__group:last-of-type{
  3079. border-bottom:0;
  3080. margin-bottom:0;
  3081. padding-bottom:0;
  3082. }
  3083. .edit-site-sidebar-navigation-screen-patterns__group-header{
  3084. margin-top:16px;
  3085. }
  3086. .edit-site-sidebar-navigation-screen-patterns__group-header p{
  3087. color:#949494;
  3088. }
  3089. .edit-site-sidebar-navigation-screen-patterns__group-header h2{
  3090. font-size:11px;
  3091. font-weight:500;
  3092. text-transform:uppercase;
  3093. }
  3094. .edit-site-sidebar-navigation-screen-template__added-by-description{
  3095. align-items:center;
  3096. display:flex;
  3097. justify-content:space-between;
  3098. margin-top:24px;
  3099. }
  3100. .edit-site-sidebar-navigation-screen-template__added-by-description-author{
  3101. align-items:center;
  3102. display:inline-flex;
  3103. }
  3104. .edit-site-sidebar-navigation-screen-template__added-by-description-author img{
  3105. border-radius:12px;
  3106. }
  3107. .edit-site-sidebar-navigation-screen-template__added-by-description-author svg{
  3108. fill:#949494;
  3109. }
  3110. .edit-site-sidebar-navigation-screen-template__added-by-description-author-icon{
  3111. height:24px;
  3112. margin-right:8px;
  3113. width:24px;
  3114. }
  3115. .edit-site-sidebar-navigation-screen-template__template-area-button{
  3116. align-items:center;
  3117. border-radius:4px;
  3118. color:#fff;
  3119. display:flex;
  3120. flex-wrap:nowrap;
  3121. width:100%;
  3122. }
  3123. .edit-site-sidebar-navigation-screen-template__template-area-button:focus,.edit-site-sidebar-navigation-screen-template__template-area-button:hover{
  3124. background:#2f2f2f;
  3125. color:#fff;
  3126. }
  3127. .edit-site-sidebar-navigation-screen-template__template-area-label-text{
  3128. flex-grow:1;
  3129. margin:0 16px 0 4px;
  3130. }
  3131. .edit-site-sidebar-navigation-screen-template__template-icon{
  3132. display:flex;
  3133. }
  3134. .edit-site-site-hub{
  3135. align-items:center;
  3136. display:flex;
  3137. gap:8px;
  3138. justify-content:space-between;
  3139. }
  3140. .edit-site-site-hub .edit-site-site-hub__container{
  3141. gap:0;
  3142. }
  3143. .edit-site-site-hub .edit-site-site-hub__site-title,.edit-site-site-hub .edit-site-site-hub_toggle-command-center{
  3144. transition:opacity .1s ease;
  3145. }
  3146. .edit-site-site-hub .edit-site-site-hub__site-title.is-transparent,.edit-site-site-hub .edit-site-site-hub_toggle-command-center.is-transparent{
  3147. opacity:0 !important;
  3148. }
  3149. .edit-site-site-hub .edit-site-site-hub__site-view-link{
  3150. flex-grow:0;
  3151. margin-right:var(--wp-admin-border-width-focus);
  3152. }
  3153. @media (min-width:480px){
  3154. .edit-site-site-hub .edit-site-site-hub__site-view-link{
  3155. opacity:0;
  3156. transition:opacity .2s ease-in-out;
  3157. }
  3158. }
  3159. .edit-site-site-hub .edit-site-site-hub__site-view-link:focus{
  3160. opacity:1;
  3161. }
  3162. .edit-site-site-hub .edit-site-site-hub__site-view-link svg{
  3163. fill:#e0e0e0;
  3164. }
  3165. .edit-site-site-hub:hover .edit-site-site-hub__site-view-link{
  3166. opacity:1;
  3167. }
  3168. .edit-site-site-hub__post-type{
  3169. opacity:.6;
  3170. }
  3171. .edit-site-site-hub__view-mode-toggle-container{
  3172. background:#1e1e1e;
  3173. flex-shrink:0;
  3174. height:60px;
  3175. width:60px;
  3176. }
  3177. .edit-site-site-hub__view-mode-toggle-container.has-transparent-background{
  3178. background:transparent;
  3179. }
  3180. .edit-site-site-hub__text-content{
  3181. overflow:hidden;
  3182. }
  3183. .edit-site-site-hub__title{
  3184. overflow:hidden;
  3185. text-overflow:ellipsis;
  3186. white-space:nowrap;
  3187. }
  3188. .edit-site-site-hub__site-title{
  3189. color:#e0e0e0;
  3190. flex-grow:1;
  3191. margin-left:4px;
  3192. }
  3193. .edit-site-site-hub_toggle-command-center{
  3194. color:#e0e0e0;
  3195. }
  3196. .edit-site-site-hub_toggle-command-center:hover{
  3197. color:#f0f0f0;
  3198. }
  3199. .edit-site-sidebar-navigation-screen__description{
  3200. margin:0 0 32px;
  3201. }
  3202. .edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf{
  3203. border-radius:2px;
  3204. max-width:calc(100% - 4px);
  3205. }
  3206. .edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf:focus,.edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf:hover,.edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf[aria-current]{
  3207. background:#2f2f2f;
  3208. }
  3209. .edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf .block-editor-list-view-block__menu{
  3210. margin-left:-8px;
  3211. }
  3212. .edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf.is-selected>td{
  3213. background:transparent;
  3214. }
  3215. .edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents{
  3216. color:inherit;
  3217. }
  3218. .edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf.is-selected:not(:hover) .block-editor-list-view-block__menu{
  3219. opacity:0;
  3220. }
  3221. .edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf.is-selected:focus,.edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf.is-selected:hover{
  3222. color:#fff;
  3223. }
  3224. .edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf.is-selected .block-editor-list-view-block__menu,.edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf.is-selected:focus .block-editor-list-view-block__menu-cell,.edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf.is-selected:hover .block-editor-list-view-block__menu-cell{
  3225. opacity:1;
  3226. }
  3227. .edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf .block-editor-list-view-block-contents:focus:after,.edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf.is-selected .block-editor-list-view-block__menu:focus{
  3228. box-shadow:inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
  3229. }
  3230. .edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf.is-branch-selected:not(.is-selected):not(.is-synced-branch){
  3231. background:transparent;
  3232. }
  3233. .edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf.is-branch-selected:not(.is-selected):not(.is-synced-branch):hover{
  3234. background:#2f2f2f;
  3235. }
  3236. .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-list-view-leaf .block-editor-list-view-block__contents-cell{
  3237. width:100%;
  3238. }
  3239. .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-list-view-leaf .block-editor-list-view-block-contents{
  3240. white-space:normal;
  3241. }
  3242. .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-list-view-block__title{
  3243. margin-top:3px;
  3244. }
  3245. .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-list-view-block__menu-cell{
  3246. padding-right:0;
  3247. }
  3248. .edit-site-sidebar-navigation-screen-navigation-menus__content .components-button{
  3249. color:#949494;
  3250. }
  3251. .edit-site-sidebar-navigation-screen-navigation-menus__content .components-button:focus,.edit-site-sidebar-navigation-screen-navigation-menus__content .components-button:hover,.edit-site-sidebar-navigation-screen-navigation-menus__content .components-button[aria-current]{
  3252. color:#fff;
  3253. }
  3254. .edit-site-sidebar-navigation-screen-navigation-menus__loading.components-spinner{
  3255. display:block;
  3256. margin-left:auto;
  3257. margin-right:auto;
  3258. }
  3259. .edit-site-sidebar-navigation-screen-navigation-menus__helper-block-editor{
  3260. display:none;
  3261. }
  3262. .edit-site-site-icon__icon{
  3263. fill:currentColor;
  3264. }
  3265. .edit-site-site-icon__image{
  3266. background:#333;
  3267. border-radius:4px;
  3268. height:auto;
  3269. object-fit:cover;
  3270. width:100%;
  3271. }
  3272. .edit-site-layout.is-full-canvas.is-edit-mode .edit-site-site-icon__image{
  3273. border-radius:0;
  3274. }
  3275. .edit-site-style-book{
  3276. height:100%;
  3277. }
  3278. .edit-site-style-book.is-button,.edit-site-style-book__iframe.is-button{
  3279. border-radius:8px;
  3280. }
  3281. .edit-site-style-book__iframe.is-focused{
  3282. outline:calc(var(--wp-admin-border-width-focus)*2) solid var(--wp-admin-theme-color);
  3283. outline-offset:calc(var(--wp-admin-border-width-focus)*-2);
  3284. }
  3285. .edit-site-style-book__tab-panel .components-tab-panel__tabs{
  3286. background:#fff;
  3287. color:#1e1e1e;
  3288. }
  3289. .edit-site-style-book__tab-panel .components-tab-panel__tab-content{
  3290. bottom:0;
  3291. left:0;
  3292. overflow:auto;
  3293. padding:0;
  3294. position:absolute;
  3295. right:0;
  3296. top:48px;
  3297. }
  3298. .edit-site-editor-canvas-container{
  3299. background:#fff;
  3300. border-radius:2px;
  3301. bottom:0;
  3302. left:0;
  3303. overflow:hidden;
  3304. position:absolute;
  3305. right:0;
  3306. top:0;
  3307. transition:all .3s;
  3308. }
  3309. .edit-site-editor-canvas-container__close-button{
  3310. background:#fff;
  3311. position:absolute;
  3312. right:8px;
  3313. top:6px;
  3314. z-index:1;
  3315. }
  3316. .edit-site-resizable-frame__inner{
  3317. position:relative;
  3318. }
  3319. body:has(.edit-site-resizable-frame__inner.is-resizing){
  3320. cursor:col-resize;
  3321. user-select:none;
  3322. -webkit-user-select:none;
  3323. }
  3324. .edit-site-resizable-frame__inner.is-resizing:before{
  3325. content:"";
  3326. inset:0;
  3327. position:absolute;
  3328. z-index:1;
  3329. }
  3330. .edit-site-resizable-frame__inner-content{
  3331. inset:0;
  3332. position:absolute;
  3333. z-index:0;
  3334. }
  3335. .edit-site-resizable-frame__handle{
  3336. align-items:center;
  3337. background-color:hsla(0,0%,46%,.4);
  3338. border:0;
  3339. border-radius:4px;
  3340. cursor:col-resize;
  3341. display:flex;
  3342. height:64px;
  3343. justify-content:flex-end;
  3344. padding:0;
  3345. position:absolute;
  3346. top:calc(50% - 32px);
  3347. width:4px;
  3348. z-index:100;
  3349. }
  3350. .edit-site-resizable-frame__handle:before{
  3351. content:"";
  3352. height:100%;
  3353. left:100%;
  3354. position:absolute;
  3355. width:32px;
  3356. }
  3357. .edit-site-resizable-frame__handle:after{
  3358. content:"";
  3359. height:100%;
  3360. position:absolute;
  3361. right:100%;
  3362. width:32px;
  3363. }
  3364. .edit-site-resizable-frame__handle:focus-visible{
  3365. outline:2px solid transparent;
  3366. }
  3367. .edit-site-resizable-frame__handle.is-resizing,.edit-site-resizable-frame__handle:focus,.edit-site-resizable-frame__handle:hover{
  3368. background-color:var(--wp-admin-theme-color);
  3369. }
  3370. .edit-site-push-changes-to-global-styles-control .components-button{
  3371. justify-content:center;
  3372. width:100%;
  3373. }
  3374. @media (min-width:782px){
  3375. .font-library-modal.font-library-modal{
  3376. width:65vw;
  3377. }
  3378. }
  3379. .font-library-modal .components-modal__header{
  3380. border-bottom:none;
  3381. }
  3382. .font-library-modal .components-modal__content{
  3383. padding-top:0;
  3384. }
  3385. .font-library-modal .font-library-modal__subtitle{
  3386. font-size:11px;
  3387. font-weight:500;
  3388. text-transform:uppercase;
  3389. }
  3390. .font-library-modal__tab-layout main{
  3391. padding-bottom:4rem;
  3392. }
  3393. .font-library-modal__tab-layout footer{
  3394. background-color:#fff;
  3395. border-top:1px solid #e5e5e5;
  3396. bottom:32px;
  3397. margin:0 -32px -32px;
  3398. padding:16px 32px;
  3399. position:absolute;
  3400. width:100%;
  3401. }
  3402. .font-library-modal__fonts-grid .font-library-modal__fonts-grid__main{
  3403. display:flex;
  3404. flex-direction:column;
  3405. }
  3406. .font-library-modal__font-card{
  3407. border:1px solid #e5e5e5;
  3408. height:auto;
  3409. margin-top:-1px;
  3410. padding:1rem;
  3411. }
  3412. .font-library-modal__font-card .font-library-modal__font-card__name{
  3413. font-weight:700;
  3414. }
  3415. .font-library-modal__font-card .font-library-modal__font-card__count{
  3416. color:#6e6e6e;
  3417. }
  3418. .font-library-modal__library-font-variant{
  3419. border:1px solid #e5e5e5;
  3420. margin-top:-1px;
  3421. padding:1rem;
  3422. }
  3423. .font-library-modal__font-variant{
  3424. border-bottom:1px solid #e5e5e5;
  3425. padding-bottom:1rem;
  3426. }
  3427. .font-library-modal__tab-panel [role=tablist]{
  3428. background:#fff;
  3429. border-bottom:1px solid #e6e6e6;
  3430. margin:0 -32px;
  3431. padding:0 16px;
  3432. position:sticky;
  3433. top:0;
  3434. width:calc(100% + 64px);
  3435. z-index:1;
  3436. }
  3437. .font-library-modal__upload-area{
  3438. align-items:center;
  3439. background-color:#f0f0f0;
  3440. display:flex;
  3441. height:250px;
  3442. justify-content:center;
  3443. width:100%;
  3444. }
  3445. .font-library-modal__local-fonts{
  3446. margin:0 auto;
  3447. width:80%;
  3448. }
  3449. .font-library-modal__local-fonts .font-library-modal__upload-area__text{
  3450. color:#6e6e6e;
  3451. }
  3452. .font-library-modal__local-fonts .font-library-modal__upload-area__notice{
  3453. margin:0;
  3454. }
  3455. .font-library-modal__font-name{
  3456. font-weight:700;
  3457. }
  3458. .font-library-modal__font-filename{
  3459. color:#6e6e6e;
  3460. }
  3461. .font-library-modal__font-variant_demo-wrapper{
  3462. overflow:hidden;
  3463. position:relative;
  3464. white-space:nowrap;
  3465. width:100%;
  3466. }
  3467. .font-library-modal__font-variant_demo-wrapper:after{
  3468. background:linear-gradient(90deg, hsla(0,0%,100%,0), #fff);
  3469. bottom:0;
  3470. content:"";
  3471. height:100%;
  3472. position:absolute;
  3473. right:0;
  3474. width:30vw;
  3475. }
  3476. .font-library__google-fonts-confirm{
  3477. align-items:center;
  3478. display:flex;
  3479. justify-content:center;
  3480. }
  3481. .font-library__google-fonts-confirm h3{
  3482. font-size:1.4rem;
  3483. }
  3484. .font-library__google-fonts-confirm .components-card{
  3485. max-width:350px;
  3486. min-width:250px;
  3487. width:50%;
  3488. }
  3489. .font-library-modal__font-collection__notice{
  3490. margin:0;
  3491. }
  3492. body.js #wpadminbar{
  3493. display:none;
  3494. }
  3495. body.js #wpbody{
  3496. padding-top:0;
  3497. }
  3498. body.js.appearance_page_gutenberg-template-parts,body.js.site-editor-php{
  3499. background:#fff;
  3500. }
  3501. body.js.appearance_page_gutenberg-template-parts #wpcontent,body.js.site-editor-php #wpcontent{
  3502. padding-left:0;
  3503. }
  3504. body.js.appearance_page_gutenberg-template-parts #wpbody-content,body.js.site-editor-php #wpbody-content{
  3505. padding-bottom:0;
  3506. }
  3507. body.js.appearance_page_gutenberg-template-parts #wpbody-content>div:not(.edit-site):not(#screen-meta),body.js.appearance_page_gutenberg-template-parts #wpfooter,body.js.site-editor-php #wpbody-content>div:not(.edit-site):not(#screen-meta),body.js.site-editor-php #wpfooter{
  3508. display:none;
  3509. }
  3510. body.js.appearance_page_gutenberg-template-parts .a11y-speak-region,body.js.site-editor-php .a11y-speak-region{
  3511. left:-1px;
  3512. top:-1px;
  3513. }
  3514. body.js.appearance_page_gutenberg-template-parts ul#adminmenu a.wp-has-current-submenu:after,body.js.appearance_page_gutenberg-template-parts ul#adminmenu>li.current>a.current:after,body.js.site-editor-php ul#adminmenu a.wp-has-current-submenu:after,body.js.site-editor-php ul#adminmenu>li.current>a.current:after{
  3515. border-right-color:#fff;
  3516. }
  3517. body.js.appearance_page_gutenberg-template-parts .media-frame select.attachment-filters:last-of-type,body.js.site-editor-php .media-frame select.attachment-filters:last-of-type{
  3518. max-width:100%;
  3519. width:auto;
  3520. }
  3521. body.js.site-editor-php{
  3522. background:#1e1e1e;
  3523. }
  3524. .components-modal__frame,.edit-site{
  3525. box-sizing:border-box;
  3526. }
  3527. .components-modal__frame *,.components-modal__frame :after,.components-modal__frame :before,.edit-site *,.edit-site :after,.edit-site :before{
  3528. box-sizing:inherit;
  3529. }
  3530. .edit-site{
  3531. height:100vh;
  3532. }
  3533. @media (min-width:600px){
  3534. .edit-site{
  3535. bottom:0;
  3536. left:0;
  3537. min-height:100vh;
  3538. position:fixed;
  3539. right:0;
  3540. top:0;
  3541. }
  3542. }
  3543. .no-js .edit-site{
  3544. min-height:0;
  3545. position:static;
  3546. }
  3547. .edit-site .interface-interface-skeleton{
  3548. top:0;
  3549. }
  3550. .edit-site .interface-complementary-area__pin-unpin-item.components-button{
  3551. display:none;
  3552. }
  3553. .edit-site .interface-interface-skeleton__content{
  3554. background-color:#1e1e1e;
  3555. }
  3556. @keyframes edit-post__fade-in-animation{
  3557. 0%{
  3558. opacity:0;
  3559. }
  3560. to{
  3561. opacity:1;
  3562. }
  3563. }
  3564. body.admin-color-light{
  3565. --wp-admin-theme-color:#0085ba;
  3566. --wp-admin-theme-color--rgb:0, 133, 186;
  3567. --wp-admin-theme-color-darker-10:#0073a1;
  3568. --wp-admin-theme-color-darker-10--rgb:0, 115, 161;
  3569. --wp-admin-theme-color-darker-20:#006187;
  3570. --wp-admin-theme-color-darker-20--rgb:0, 97, 135;
  3571. --wp-admin-border-width-focus:2px;
  3572. }
  3573. @media (min-resolution:192dpi){
  3574. body.admin-color-light{
  3575. --wp-admin-border-width-focus:1.5px;
  3576. }
  3577. }
  3578. body.admin-color-modern{
  3579. --wp-admin-theme-color:#3858e9;
  3580. --wp-admin-theme-color--rgb:56, 88, 233;
  3581. --wp-admin-theme-color-darker-10:#2145e6;
  3582. --wp-admin-theme-color-darker-10--rgb:33, 69, 230;
  3583. --wp-admin-theme-color-darker-20:#183ad6;
  3584. --wp-admin-theme-color-darker-20--rgb:24, 58, 214;
  3585. --wp-admin-border-width-focus:2px;
  3586. }
  3587. @media (min-resolution:192dpi){
  3588. body.admin-color-modern{
  3589. --wp-admin-border-width-focus:1.5px;
  3590. }
  3591. }
  3592. body.admin-color-blue{
  3593. --wp-admin-theme-color:#096484;
  3594. --wp-admin-theme-color--rgb:9, 100, 132;
  3595. --wp-admin-theme-color-darker-10:#07526c;
  3596. --wp-admin-theme-color-darker-10--rgb:7, 82, 108;
  3597. --wp-admin-theme-color-darker-20:#064054;
  3598. --wp-admin-theme-color-darker-20--rgb:6, 64, 84;
  3599. --wp-admin-border-width-focus:2px;
  3600. }
  3601. @media (min-resolution:192dpi){
  3602. body.admin-color-blue{
  3603. --wp-admin-border-width-focus:1.5px;
  3604. }
  3605. }
  3606. body.admin-color-coffee{
  3607. --wp-admin-theme-color:#46403c;
  3608. --wp-admin-theme-color--rgb:70, 64, 60;
  3609. --wp-admin-theme-color-darker-10:#383330;
  3610. --wp-admin-theme-color-darker-10--rgb:56, 51, 48;
  3611. --wp-admin-theme-color-darker-20:#2b2724;
  3612. --wp-admin-theme-color-darker-20--rgb:43, 39, 36;
  3613. --wp-admin-border-width-focus:2px;
  3614. }
  3615. @media (min-resolution:192dpi){
  3616. body.admin-color-coffee{
  3617. --wp-admin-border-width-focus:1.5px;
  3618. }
  3619. }
  3620. body.admin-color-ectoplasm{
  3621. --wp-admin-theme-color:#523f6d;
  3622. --wp-admin-theme-color--rgb:82, 63, 109;
  3623. --wp-admin-theme-color-darker-10:#46365d;
  3624. --wp-admin-theme-color-darker-10--rgb:70, 54, 93;
  3625. --wp-admin-theme-color-darker-20:#3a2c4d;
  3626. --wp-admin-theme-color-darker-20--rgb:58, 44, 77;
  3627. --wp-admin-border-width-focus:2px;
  3628. }
  3629. @media (min-resolution:192dpi){
  3630. body.admin-color-ectoplasm{
  3631. --wp-admin-border-width-focus:1.5px;
  3632. }
  3633. }
  3634. body.admin-color-midnight{
  3635. --wp-admin-theme-color:#e14d43;
  3636. --wp-admin-theme-color--rgb:225, 77, 67;
  3637. --wp-admin-theme-color-darker-10:#dd382d;
  3638. --wp-admin-theme-color-darker-10--rgb:221, 56, 45;
  3639. --wp-admin-theme-color-darker-20:#d02c21;
  3640. --wp-admin-theme-color-darker-20--rgb:208, 44, 33;
  3641. --wp-admin-border-width-focus:2px;
  3642. }
  3643. @media (min-resolution:192dpi){
  3644. body.admin-color-midnight{
  3645. --wp-admin-border-width-focus:1.5px;
  3646. }
  3647. }
  3648. body.admin-color-ocean{
  3649. --wp-admin-theme-color:#627c83;
  3650. --wp-admin-theme-color--rgb:98, 124, 131;
  3651. --wp-admin-theme-color-darker-10:#576e74;
  3652. --wp-admin-theme-color-darker-10--rgb:87, 110, 116;
  3653. --wp-admin-theme-color-darker-20:#4c6066;
  3654. --wp-admin-theme-color-darker-20--rgb:76, 96, 102;
  3655. --wp-admin-border-width-focus:2px;
  3656. }
  3657. @media (min-resolution:192dpi){
  3658. body.admin-color-ocean{
  3659. --wp-admin-border-width-focus:1.5px;
  3660. }
  3661. }
  3662. body.admin-color-sunrise{
  3663. --wp-admin-theme-color:#dd823b;
  3664. --wp-admin-theme-color--rgb:221, 130, 59;
  3665. --wp-admin-theme-color-darker-10:#d97426;
  3666. --wp-admin-theme-color-darker-10--rgb:217, 116, 38;
  3667. --wp-admin-theme-color-darker-20:#c36922;
  3668. --wp-admin-theme-color-darker-20--rgb:195, 105, 34;
  3669. --wp-admin-border-width-focus:2px;
  3670. }
  3671. @media (min-resolution:192dpi){
  3672. body.admin-color-sunrise{
  3673. --wp-admin-border-width-focus:1.5px;
  3674. }
  3675. }