wp/wp-includes/css/dist/edit-post/style.css
changeset 19 3d72ae0968f4
parent 18 be944660c56a
child 21 48c4eec2b7e6
equal deleted inserted replaced
18:be944660c56a 19:3d72ae0968f4
    39 /**
    39 /**
    40  * React Native specific.
    40  * React Native specific.
    41  * These variables do not appear to be used anywhere else.
    41  * These variables do not appear to be used anywhere else.
    42  */
    42  */
    43 /**
    43 /**
       
    44 *  Converts a hex value into the rgb equivalent.
       
    45 *
       
    46 * @param {string} hex - the hexadecimal value to convert
       
    47 * @return {string} comma separated rgb values
       
    48 */
       
    49 /**
    44  * Breakpoint mixins
    50  * Breakpoint mixins
    45  */
    51  */
    46 /**
    52 /**
    47  * Long content fade mixin
    53  * Long content fade mixin
    48  *
    54  *
    68 /**
    74 /**
    69  * Reset the WP Admin page styles for Gutenberg-like pages.
    75  * Reset the WP Admin page styles for Gutenberg-like pages.
    70  */
    76  */
    71 :root {
    77 :root {
    72   --wp-admin-theme-color: #007cba;
    78   --wp-admin-theme-color: #007cba;
       
    79   --wp-admin-theme-color--rgb: 0, 124, 186;
    73   --wp-admin-theme-color-darker-10: #006ba1;
    80   --wp-admin-theme-color-darker-10: #006ba1;
       
    81   --wp-admin-theme-color-darker-10--rgb: 0, 107, 161;
    74   --wp-admin-theme-color-darker-20: #005a87;
    82   --wp-admin-theme-color-darker-20: #005a87;
       
    83   --wp-admin-theme-color-darker-20--rgb: 0, 90, 135;
    75   --wp-admin-border-width-focus: 2px;
    84   --wp-admin-border-width-focus: 2px;
    76 }
    85 }
    77 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    86 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    78   :root {
    87   :root {
    79     --wp-admin-border-width-focus: 1.5px;
    88     --wp-admin-border-width-focus: 1.5px;
   111   .interface-complementary-area-header .components-button.has-icon {
   120   .interface-complementary-area-header .components-button.has-icon {
   112     display: flex;
   121     display: flex;
   113   }
   122   }
   114 }
   123 }
   115 
   124 
       
   125 @media (min-width: 782px) {
       
   126   .components-panel__header + .interface-complementary-area-header {
       
   127     margin-top: 0;
       
   128   }
       
   129 }
       
   130 
   116 .interface-complementary-area {
   131 .interface-complementary-area {
   117   background: #fff;
   132   background: #fff;
   118   color: #1e1e1e;
   133   color: #1e1e1e;
   119 }
   134 }
   120 @media (min-width: 600px) {
   135 @media (min-width: 600px) {
   146   }
   161   }
   147 }
   162 }
   148 .interface-complementary-area p {
   163 .interface-complementary-area p {
   149   margin-top: 0;
   164   margin-top: 0;
   150 }
   165 }
   151 .interface-complementary-area h2,
   166 .interface-complementary-area h2 {
       
   167   font-size: 13px;
       
   168   color: #1e1e1e;
       
   169   margin-bottom: 1.5em;
       
   170 }
   152 .interface-complementary-area h3 {
   171 .interface-complementary-area h3 {
   153   font-size: 13px;
   172   font-size: 11px;
       
   173   text-transform: uppercase;
       
   174   font-weight: 500;
   154   color: #1e1e1e;
   175   color: #1e1e1e;
   155   margin-bottom: 1.5em;
   176   margin-bottom: 1.5em;
   156 }
   177 }
   157 .interface-complementary-area hr {
   178 .interface-complementary-area hr {
   158   border-top: none;
   179   border-top: none;
   372 .interface-interface-skeleton__actions:focus {
   393 .interface-interface-skeleton__actions:focus {
   373   top: auto;
   394   top: auto;
   374   bottom: 0;
   395   bottom: 0;
   375 }
   396 }
   376 
   397 
       
   398 .interface-more-menu-dropdown {
       
   399   margin-left: -4px;
       
   400 }
       
   401 .interface-more-menu-dropdown .components-button {
       
   402   width: auto;
       
   403   padding: 0 2px;
       
   404 }
       
   405 @media (min-width: 600px) {
       
   406   .interface-more-menu-dropdown {
       
   407     margin-left: 0;
       
   408   }
       
   409   .interface-more-menu-dropdown .components-button {
       
   410     padding: 0 4px;
       
   411   }
       
   412 }
       
   413 
       
   414 .interface-more-menu-dropdown__content .components-popover__content {
       
   415   min-width: 280px;
       
   416 }
       
   417 @media (min-width: 480px) {
       
   418   .interface-more-menu-dropdown__content .components-popover__content {
       
   419     width: auto;
       
   420     max-width: 480px;
       
   421   }
       
   422 }
       
   423 .interface-more-menu-dropdown__content .components-popover__content .components-dropdown-menu__menu {
       
   424   padding: 0;
       
   425 }
       
   426 
       
   427 .components-popover.interface-more-menu-dropdown__content {
       
   428   z-index: 99998;
       
   429 }
       
   430 
   377 .interface-pinned-items {
   431 .interface-pinned-items {
   378   display: flex;
   432   display: flex;
   379 }
   433 }
   380 .interface-pinned-items .components-button:not(:first-child) {
   434 .interface-pinned-items .components-button:not(:first-child) {
   381   display: none;
   435   display: none;
   389   margin-left: 4px;
   443   margin-left: 4px;
   390 }
   444 }
   391 .interface-pinned-items .components-button svg {
   445 .interface-pinned-items .components-button svg {
   392   max-width: 24px;
   446   max-width: 24px;
   393   max-height: 24px;
   447   max-height: 24px;
       
   448 }
       
   449 
       
   450 @media (min-width: 600px) {
       
   451   .interface-preferences-modal {
       
   452     width: calc(100% - 32px);
       
   453     height: calc(100% - 120px);
       
   454   }
       
   455 }
       
   456 @media (min-width: 782px) {
       
   457   .interface-preferences-modal {
       
   458     width: 750px;
       
   459   }
       
   460 }
       
   461 @media (min-width: 960px) {
       
   462   .interface-preferences-modal {
       
   463     height: 70%;
       
   464   }
       
   465 }
       
   466 @media (max-width: 781px) {
       
   467   .interface-preferences-modal .components-modal__content {
       
   468     padding: 0;
       
   469   }
       
   470   .interface-preferences-modal .components-modal__content::before {
       
   471     content: none;
       
   472   }
       
   473 }
       
   474 
       
   475 .interface-preferences__tabs .components-tab-panel__tabs {
       
   476   position: absolute;
       
   477   top: 84px;
       
   478   left: 16px;
       
   479   width: 160px;
       
   480 }
       
   481 .interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item {
       
   482   border-radius: 2px;
       
   483   font-weight: 400;
       
   484 }
       
   485 .interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item.is-active {
       
   486   background: #f0f0f0;
       
   487   box-shadow: none;
       
   488   font-weight: 500;
       
   489 }
       
   490 .interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item:focus:not(:disabled) {
       
   491   box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
       
   492 }
       
   493 .interface-preferences__tabs .components-tab-panel__tab-content {
       
   494   padding-left: 24px;
       
   495   margin-left: 160px;
       
   496 }
       
   497 
       
   498 @media (max-width: 781px) {
       
   499   .interface-preferences__provider {
       
   500     height: 100%;
       
   501   }
       
   502 }
       
   503 .interface-preferences-modal__section {
       
   504   margin: 0 0 2.5rem 0;
       
   505 }
       
   506 .interface-preferences-modal__section:last-child {
       
   507   margin: 0;
       
   508 }
       
   509 
       
   510 .interface-preferences-modal__section-title {
       
   511   font-size: 0.9rem;
       
   512   font-weight: 600;
       
   513   margin-top: 0;
       
   514 }
       
   515 
       
   516 .interface-preferences-modal__section-description {
       
   517   margin: -8px 0 8px 0;
       
   518   font-size: 12px;
       
   519   font-style: normal;
       
   520   color: #757575;
       
   521 }
       
   522 
       
   523 .interface-preferences-modal__option .components-base-control .components-base-control__field {
       
   524   align-items: center;
       
   525   display: flex;
       
   526   margin-bottom: 0;
       
   527 }
       
   528 .interface-preferences-modal__option .components-base-control .components-base-control__field > label {
       
   529   flex-grow: 1;
       
   530   padding: 0.6rem 0 0.6rem 10px;
       
   531 }
       
   532 .interface-preferences-modal__option .components-base-control__help {
       
   533   margin: -8px 0 8px 58px;
       
   534   font-size: 12px;
       
   535   font-style: normal;
       
   536   color: #757575;
   394 }
   537 }
   395 
   538 
   396 .edit-post-header {
   539 .edit-post-header {
   397   height: 60px;
   540   height: 60px;
   398   background: #fff;
   541   background: #fff;
   454 }
   597 }
   455 .edit-post-header__settings .editor-post-saved-state,
   598 .edit-post-header__settings .editor-post-saved-state,
   456 .edit-post-header__settings .components-button.is-tertiary {
   599 .edit-post-header__settings .components-button.is-tertiary {
   457   padding: 0 6px;
   600   padding: 0 6px;
   458 }
   601 }
   459 .edit-post-header__settings .edit-post-more-menu .components-button,
   602 .edit-post-header__settings .interface-more-menu-dropdown .components-button,
   460 .edit-post-header__settings .interface-pinned-items .components-button {
   603 .edit-post-header__settings .interface-pinned-items .components-button {
   461   margin-right: 0;
   604   margin-right: 0;
   462 }
   605 }
   463 
   606 
   464 .edit-post-header-preview__grouping-external {
   607 .edit-post-header-preview__grouping-external {
   590 
   733 
   591 .edit-post-header__dropdown .components-menu-item__button.components-menu-item__button,
   734 .edit-post-header__dropdown .components-menu-item__button.components-menu-item__button,
   592 .edit-post-header__dropdown .components-button.editor-history__undo,
   735 .edit-post-header__dropdown .components-button.editor-history__undo,
   593 .edit-post-header__dropdown .components-button.editor-history__redo,
   736 .edit-post-header__dropdown .components-button.editor-history__redo,
   594 .edit-post-header__dropdown .table-of-contents .components-button,
   737 .edit-post-header__dropdown .table-of-contents .components-button,
   595 .edit-post-header__dropdown .components-button.block-editor-block-navigation {
   738 .edit-post-header__dropdown .components-button.block-editor-list-view {
   596   margin: 0;
   739   margin: 0;
   597   padding: 6px 6px 6px 40px;
   740   padding: 6px 6px 6px 40px;
   598   width: 14.625rem;
   741   width: 14.625rem;
   599   text-align: left;
   742   text-align: left;
   600   justify-content: flex-start;
   743   justify-content: flex-start;
   624 }
   767 }
   625 .show-icon-labels.interface-pinned-items > .components-button.has-icon svg {
   768 .show-icon-labels.interface-pinned-items > .components-button.has-icon svg {
   626   margin-right: 8px;
   769   margin-right: 8px;
   627 }
   770 }
   628 
   771 
   629 .edit-post-fullscreen-mode-close.has-icon {
   772 .edit-post-fullscreen-mode-close.components-button {
   630   display: none;
   773   display: none;
   631 }
   774 }
   632 @media (min-width: 782px) {
   775 @media (min-width: 782px) {
   633   .edit-post-fullscreen-mode-close.has-icon {
   776   .edit-post-fullscreen-mode-close.components-button {
   634     display: flex;
   777     display: flex;
   635     align-items: center;
   778     align-items: center;
   636     align-self: stretch;
   779     align-self: stretch;
   637     border: none;
   780     border: none;
   638     background: #23282e;
   781     background: #1e1e1e;
   639     color: #fff;
   782     color: #fff;
   640     border-radius: 0;
   783     border-radius: 0;
   641     height: 61px;
   784     height: 61px;
   642     width: 60px;
   785     width: 60px;
   643     position: relative;
   786     position: relative;
   644     margin-bottom: -1px;
   787     margin-bottom: -1px;
   645   }
   788   }
   646   .edit-post-fullscreen-mode-close.has-icon:active {
   789   .edit-post-fullscreen-mode-close.components-button:active {
   647     color: #fff;
   790     color: #fff;
   648   }
   791   }
   649   .edit-post-fullscreen-mode-close.has-icon:focus {
   792   .edit-post-fullscreen-mode-close.components-button:focus {
   650     box-shadow: none;
   793     box-shadow: none;
   651   }
   794   }
   652   .edit-post-fullscreen-mode-close.has-icon::before {
   795   .edit-post-fullscreen-mode-close.components-button::before {
   653     transition: box-shadow 0.1s ease;
   796     transition: box-shadow 0.1s ease;
   654     content: "";
   797     content: "";
   655     display: block;
   798     display: block;
   656     position: absolute;
   799     position: absolute;
   657     top: 9px;
   800     top: 9px;
   658     right: 9px;
   801     right: 9px;
   659     bottom: 9px;
   802     bottom: 9px;
   660     left: 9px;
   803     left: 9px;
   661     border-radius: 4px;
   804     border-radius: 4px;
   662     box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) #23282e;
   805     box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) #1e1e1e;
   663   }
   806   }
   664 }
   807 }
   665 @media (min-width: 782px) and (prefers-reduced-motion: reduce) {
   808 @media (min-width: 782px) and (prefers-reduced-motion: reduce) {
   666   .edit-post-fullscreen-mode-close.has-icon::before {
   809   .edit-post-fullscreen-mode-close.components-button::before {
   667     transition-duration: 0s;
   810     transition-duration: 0s;
   668     transition-delay: 0s;
   811     transition-delay: 0s;
   669   }
   812   }
   670 }
   813 }
   671 @media (min-width: 782px) {
   814 @media (min-width: 782px) {
   672   .edit-post-fullscreen-mode-close.has-icon:hover::before {
   815   .edit-post-fullscreen-mode-close.components-button:hover::before {
   673     box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) #757575;
   816     box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) #757575;
   674   }
   817   }
   675 }
   818 }
   676 @media (min-width: 782px) {
   819 @media (min-width: 782px) {
   677   .edit-post-fullscreen-mode-close.has-icon:focus::before {
   820   .edit-post-fullscreen-mode-close.components-button.has-icon:hover::before {
       
   821     box-shadow: none;
       
   822   }
       
   823 }
       
   824 @media (min-width: 782px) {
       
   825   .edit-post-fullscreen-mode-close.components-button:focus::before {
   678     box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) rgba(255, 255, 255, 0.1), inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
   826     box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) rgba(255, 255, 255, 0.1), inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
   679   }
   827   }
   680 }
   828 }
   681 
   829 .edit-post-fullscreen-mode-close.components-button .edit-post-fullscreen-mode-close_site-icon {
   682 .edit-post-fullscreen-mode-close_site-icon {
       
   683   width: 36px;
   830   width: 36px;
       
   831   height: 36px;
   684   border-radius: 2px;
   832   border-radius: 2px;
       
   833   -o-object-fit: cover;
       
   834      object-fit: cover;
       
   835   margin-top: -1px;
   685 }
   836 }
   686 
   837 
   687 .edit-post-header-toolbar {
   838 .edit-post-header-toolbar {
   688   display: inline-flex;
   839   display: inline-flex;
   689   flex-grow: 1;
   840   flex-grow: 1;
   711   }
   862   }
   712 }
   863 }
   713 .edit-post-header-toolbar .edit-post-header-toolbar__left > .edit-post-header-toolbar__inserter-toggle.is-pressed svg {
   864 .edit-post-header-toolbar .edit-post-header-toolbar__left > .edit-post-header-toolbar__inserter-toggle.is-pressed svg {
   714   transform: rotate(45deg);
   865   transform: rotate(45deg);
   715 }
   866 }
   716 .edit-post-header-toolbar .block-editor-block-navigation {
   867 .edit-post-header-toolbar .block-editor-list-view {
   717   display: none;
   868   display: none;
   718 }
   869 }
   719 @media (min-width: 600px) {
   870 @media (min-width: 600px) {
   720   .edit-post-header-toolbar .block-editor-block-navigation {
   871   .edit-post-header-toolbar .block-editor-list-view {
   721     display: flex;
   872     display: flex;
   722   }
   873   }
   723 }
   874 }
   724 .edit-post-header-toolbar .edit-post-header-toolbar__left > .components-button.has-icon,
   875 .edit-post-header-toolbar .edit-post-header-toolbar__left > .components-button.has-icon,
   725 .edit-post-header-toolbar .edit-post-header-toolbar__left > .components-dropdown > .components-button.has-icon {
   876 .edit-post-header-toolbar .edit-post-header-toolbar__left > .components-dropdown > .components-button.has-icon {
   792   padding: 0 8px;
   943   padding: 0 8px;
   793 }
   944 }
   794 
   945 
   795 .show-icon-labels .edit-post-header-toolbar__left > * + * {
   946 .show-icon-labels .edit-post-header-toolbar__left > * + * {
   796   margin-left: 8px;
   947   margin-left: 8px;
   797 }
       
   798 
       
   799 .edit-post-more-menu {
       
   800   margin-left: -4px;
       
   801 }
       
   802 .edit-post-more-menu .components-button {
       
   803   width: auto;
       
   804   padding: 0 2px;
       
   805 }
       
   806 @media (min-width: 600px) {
       
   807   .edit-post-more-menu {
       
   808     margin-left: 0;
       
   809   }
       
   810   .edit-post-more-menu .components-button {
       
   811     padding: 0 4px;
       
   812   }
       
   813 }
       
   814 
       
   815 .edit-post-more-menu__content .components-popover__content {
       
   816   min-width: 280px;
       
   817 }
       
   818 @media (min-width: 480px) {
       
   819   .edit-post-more-menu__content .components-popover__content {
       
   820     width: auto;
       
   821     max-width: 480px;
       
   822   }
       
   823 }
       
   824 .edit-post-more-menu__content .components-popover__content .components-dropdown-menu__menu {
       
   825   padding: 0;
       
   826 }
       
   827 
       
   828 .components-popover.edit-post-more-menu__content {
       
   829   z-index: 99998;
       
   830 }
   948 }
   831 
   949 
   832 .edit-post-template-top-area {
   950 .edit-post-template-top-area {
   833   display: flex;
   951   display: flex;
   834   flex-direction: column;
   952   flex-direction: column;
   866   left: 0;
   984   left: 0;
   867   right: 0;
   985   right: 0;
   868 }
   986 }
   869 @media (min-width: 1080px) {
   987 @media (min-width: 1080px) {
   870   .edit-post-template-top-area .edit-post-template-post-title {
   988   .edit-post-template-top-area .edit-post-template-post-title {
   871     max-width: none;
   989     max-width: 400px;
   872   }
   990   }
   873 }
   991 }
   874 
   992 
   875 .edit-post-template-top-area__popover .components-popover__content {
   993 .edit-post-template-top-area__popover .components-popover__content {
   876   min-width: 280px;
   994   min-width: 280px;
       
   995   padding: 8px;
       
   996 }
       
   997 .edit-post-template-top-area__popover .edit-post-template-details__description {
       
   998   color: #757575;
   877 }
   999 }
   878 
  1000 
   879 .edit-post-template-top-area__second-menu-group {
  1001 .edit-post-template-top-area__second-menu-group {
   880   margin-left: -12px;
  1002   margin-left: -16px;
   881   margin-right: -12px;
  1003   margin-right: -16px;
   882   padding: 12px;
  1004   padding: 16px;
   883   padding-bottom: 0;
  1005   padding-bottom: 0;
   884   border-top: 1px solid #ddd;
  1006   border-top: 1px solid #ddd;
   885 }
  1007 }
   886 .edit-post-template-top-area__second-menu-group .edit-post-template-top-area__delete-template-button {
  1008 .edit-post-template-top-area__second-menu-group .edit-post-template-top-area__delete-template-button {
   887   display: flex;
  1009   display: flex;
   888   justify-content: center;
  1010   justify-content: center;
   889 }
  1011 }
   890 .edit-post-template-top-area__second-menu-group .edit-post-template-top-area__delete-template-button .components-menu-item__item {
  1012 .edit-post-template-top-area__second-menu-group .edit-post-template-top-area__delete-template-button .components-menu-item__item {
   891   margin-right: 0;
  1013   margin-right: 0;
       
  1014   min-width: 0;
   892 }
  1015 }
   893 
  1016 
   894 .edit-post-keyboard-shortcut-help-modal__section {
  1017 .edit-post-keyboard-shortcut-help-modal__section {
   895   margin: 0 0 2rem 0;
  1018   margin: 0 0 2rem 0;
   896 }
  1019 }
   942   margin: 0 0 0 0.2rem;
  1065   margin: 0 0 0 0.2rem;
   943 }
  1066 }
   944 
  1067 
   945 .edit-post-layout__metaboxes {
  1068 .edit-post-layout__metaboxes {
   946   flex-shrink: 0;
  1069   flex-shrink: 0;
   947 }
       
   948 
       
   949 .edit-post-layout__metaboxes:not(:empty) {
       
   950   border-top: 1px solid #ddd;
       
   951   padding: 10px 0 10px;
       
   952   clear: both;
  1070   clear: both;
   953 }
       
   954 .edit-post-layout__metaboxes:not(:empty) .edit-post-meta-boxes-area {
       
   955   margin: auto 20px;
       
   956 }
  1071 }
   957 
  1072 
   958 .edit-post-layout .components-editor-notices__snackbar {
  1073 .edit-post-layout .components-editor-notices__snackbar {
   959   position: fixed;
  1074   position: fixed;
   960   right: 0;
  1075   right: 0;
  1071 .interface-interface-skeleton__actions:focus-within .edit-post-layout__toggle-entities-saved-states-panel {
  1186 .interface-interface-skeleton__actions:focus-within .edit-post-layout__toggle-entities-saved-states-panel {
  1072   top: auto;
  1187   top: auto;
  1073   bottom: 0;
  1188   bottom: 0;
  1074 }
  1189 }
  1075 
  1190 
  1076 @media (min-width: 600px) {
  1191 .edit-post-block-manager__no-results {
  1077   .edit-post-manage-blocks-modal {
       
  1078     height: calc(100% - 60px - 60px);
       
  1079   }
       
  1080 }
       
  1081 
       
  1082 .edit-post-manage-blocks-modal .components-modal__content {
       
  1083   padding-bottom: 0;
       
  1084   display: flex;
       
  1085   flex-direction: column;
       
  1086 }
       
  1087 
       
  1088 .edit-post-manage-blocks-modal .components-modal__header {
       
  1089   flex-shrink: 0;
       
  1090   margin-bottom: 0;
       
  1091 }
       
  1092 
       
  1093 .edit-post-manage-blocks-modal__content {
       
  1094   display: flex;
       
  1095   flex-direction: column;
       
  1096   flex: 0 1 100%;
       
  1097   min-height: 0;
       
  1098 }
       
  1099 
       
  1100 .edit-post-manage-blocks-modal__no-results {
       
  1101   font-style: italic;
  1192   font-style: italic;
  1102   padding: 24px 0;
  1193   padding: 24px 0;
  1103   text-align: center;
  1194   text-align: center;
  1104 }
  1195 }
  1105 
  1196 
  1106 .edit-post-manage-blocks-modal__search {
  1197 .edit-post-block-manager__search {
  1107   margin: 16px 0;
  1198   margin: 16px 0;
  1108 }
  1199 }
  1109 .edit-post-manage-blocks-modal__search .components-base-control__field {
  1200 
  1110   margin-bottom: 0;
  1201 .edit-post-block-manager__disabled-blocks-count {
  1111 }
  1202   border: 1px solid #ddd;
  1112 .edit-post-manage-blocks-modal__search .components-base-control__label {
  1203   border-width: 1px 0;
  1113   margin-top: -4px;
  1204   box-shadow: -32px 0 0 0 #fff, 32px 0 0 0 #fff;
  1114 }
       
  1115 .edit-post-manage-blocks-modal__search input[type=search].components-text-control__input {
       
  1116   padding: 8px;
  1205   padding: 8px;
  1117   border-radius: 2px;
  1206   background-color: #fff;
  1118 }
  1207   text-align: center;
  1119 
  1208   font-style: italic;
  1120 .edit-post-manage-blocks-modal__disabled-blocks-count {
  1209   position: sticky;
  1121   border-top: 1px solid #ddd;
  1210   top: -1px;
  1122   margin-left: -24px;
  1211   z-index: 2;
  1123   margin-right: -24px;
  1212 }
  1124   padding-top: 0.6rem;
  1213 .edit-post-block-manager__disabled-blocks-count ~ .edit-post-block-manager__results .edit-post-block-manager__category-title {
  1125   padding-bottom: 0.6rem;
  1214   top: 35px;
  1126   padding-left: 24px;
  1215 }
  1127   padding-right: 24px;
  1216 
  1128   background-color: #f0f0f0;
  1217 .edit-post-block-manager__category {
  1129 }
  1218   margin: 0 0 24px 0;
  1130 
  1219 }
  1131 .edit-post-manage-blocks-modal__category {
  1220 
  1132   margin: 0 0 2rem 0;
  1221 .edit-post-block-manager__category-title {
  1133 }
       
  1134 
       
  1135 .edit-post-manage-blocks-modal__category-title {
       
  1136   position: sticky;
  1222   position: sticky;
  1137   top: 0;
  1223   top: 0;
  1138   padding: 16px 0;
  1224   padding: 16px 0;
  1139   background-color: #fff;
  1225   background-color: #fff;
  1140   z-index: 1;
  1226   z-index: 1;
  1141 }
  1227 }
  1142 .edit-post-manage-blocks-modal__category-title .components-base-control__field {
  1228 .edit-post-block-manager__category-title .components-checkbox-control__label {
  1143   margin-bottom: 0;
       
  1144 }
       
  1145 .edit-post-manage-blocks-modal__category-title .components-checkbox-control__label {
       
  1146   font-size: 0.9rem;
       
  1147   font-weight: 600;
  1229   font-weight: 600;
  1148 }
  1230 }
  1149 
  1231 
  1150 .edit-post-manage-blocks-modal__show-all {
  1232 .edit-post-block-manager__show-all {
  1151   margin-right: 8px;
  1233   margin-right: 8px;
  1152 }
  1234 }
  1153 
  1235 
  1154 .edit-post-manage-blocks-modal__checklist {
  1236 .edit-post-block-manager__checklist {
  1155   margin-top: 0;
  1237   margin-top: 0;
  1156 }
  1238 }
  1157 
  1239 
  1158 .edit-post-manage-blocks-modal__checklist-item {
  1240 .edit-post-block-manager__category-title,
       
  1241 .edit-post-block-manager__checklist-item {
       
  1242   border-bottom: 1px solid #ddd;
       
  1243 }
       
  1244 .edit-post-block-manager__category-title .components-base-control__field,
       
  1245 .edit-post-block-manager__checklist-item .components-base-control__field {
       
  1246   align-items: center;
       
  1247   display: flex;
       
  1248   margin: 0;
       
  1249 }
       
  1250 
       
  1251 .edit-post-block-manager__checklist-item {
  1159   margin-bottom: 0;
  1252   margin-bottom: 0;
  1160   padding-left: 16px;
  1253   padding-left: 16px;
  1161   border-top: 1px solid #ddd;
  1254 }
  1162 }
  1255 .components-modal__content .edit-post-block-manager__checklist-item.components-checkbox-control__input-container {
  1163 .edit-post-manage-blocks-modal__checklist-item:last-child {
       
  1164   border-bottom: 1px solid #ddd;
       
  1165 }
       
  1166 .edit-post-manage-blocks-modal__checklist-item .components-base-control__field {
       
  1167   align-items: center;
       
  1168   display: flex;
       
  1169   margin: 0;
       
  1170 }
       
  1171 .components-modal__content .edit-post-manage-blocks-modal__checklist-item.components-checkbox-control__input-container {
       
  1172   margin: 0 8px;
  1256   margin: 0 8px;
  1173 }
  1257 }
  1174 .edit-post-manage-blocks-modal__checklist-item .components-checkbox-control__label {
  1258 .edit-post-block-manager__checklist-item .components-checkbox-control__label {
  1175   display: flex;
  1259   display: flex;
  1176   align-items: center;
  1260   align-items: center;
  1177   justify-content: space-between;
  1261   justify-content: space-between;
  1178   flex-grow: 1;
  1262   flex-grow: 1;
  1179   padding: 0.6rem 0 0.6rem 10px;
  1263   padding: 8px 0;
  1180 }
  1264 }
  1181 .edit-post-manage-blocks-modal__checklist-item .block-editor-block-icon {
  1265 .edit-post-block-manager__checklist-item .block-editor-block-icon {
  1182   margin-right: 10px;
  1266   margin-right: 10px;
  1183   fill: #1e1e1e;
  1267   fill: #1e1e1e;
  1184 }
  1268 }
  1185 
  1269 
  1186 .edit-post-manage-blocks-modal__results {
  1270 .edit-post-block-manager__results {
  1187   height: 100%;
       
  1188   overflow: auto;
       
  1189   margin-left: -32px;
       
  1190   margin-right: -32px;
       
  1191   padding-left: 32px;
       
  1192   padding-right: 32px;
       
  1193   border-top: 1px solid #ddd;
  1271   border-top: 1px solid #ddd;
       
  1272 }
       
  1273 
       
  1274 .edit-post-block-manager__disabled-blocks-count + .edit-post-block-manager__results {
       
  1275   border-top-width: 0;
  1194 }
  1276 }
  1195 
  1277 
  1196 .edit-post-meta-boxes-area {
  1278 .edit-post-meta-boxes-area {
  1197   position: relative;
  1279   position: relative;
  1198   /**
  1280   /**
  1211 }
  1293 }
  1212 .edit-post-meta-boxes-area textarea,
  1294 .edit-post-meta-boxes-area textarea,
  1213 .edit-post-meta-boxes-area input {
  1295 .edit-post-meta-boxes-area input {
  1214   box-sizing: border-box;
  1296   box-sizing: border-box;
  1215 }
  1297 }
       
  1298 .edit-post-meta-boxes-area .postbox-header {
       
  1299   border-top: 1px solid #ddd;
       
  1300   border-bottom: 0;
       
  1301 }
  1216 .edit-post-meta-boxes-area #poststuff {
  1302 .edit-post-meta-boxes-area #poststuff {
  1217   margin: 0 auto;
  1303   margin: 0 auto;
  1218   padding-top: 0;
  1304   padding-top: 0;
  1219   min-width: auto;
  1305   min-width: auto;
  1220 }
  1306 }
  1224   /* WordPress selectors yolo */
  1310   /* WordPress selectors yolo */
  1225   box-sizing: border-box;
  1311   box-sizing: border-box;
  1226   color: inherit;
  1312   color: inherit;
  1227   font-weight: 600;
  1313   font-weight: 600;
  1228   outline: none;
  1314   outline: none;
  1229   padding: 15px;
  1315   padding: 0 24px;
  1230   position: relative;
  1316   position: relative;
  1231   width: 100%;
  1317   width: 100%;
  1232 }
  1318 }
  1233 .edit-post-meta-boxes-area .postbox {
  1319 .edit-post-meta-boxes-area .postbox {
  1234   border: 0;
  1320   border: 0;
  1235   color: inherit;
  1321   color: inherit;
  1236   margin-bottom: 0;
  1322   margin-bottom: 0;
  1237 }
  1323 }
  1238 .edit-post-meta-boxes-area .postbox > .inside {
  1324 .edit-post-meta-boxes-area .postbox > .inside {
  1239   border-bottom: 1px solid #ddd;
       
  1240   color: inherit;
  1325   color: inherit;
  1241   padding: 0 14px 14px;
  1326   padding: 0 24px 24px;
  1242   margin: 0;
  1327   margin: 0;
  1243 }
  1328 }
  1244 .edit-post-meta-boxes-area .postbox .handlediv {
  1329 .edit-post-meta-boxes-area .postbox .handlediv {
  1245   height: 44px;
  1330   height: 44px;
  1246   width: 44px;
  1331   width: 44px;
  1277 
  1362 
  1278 .edit-post-meta-boxes-area__clear {
  1363 .edit-post-meta-boxes-area__clear {
  1279   clear: both;
  1364   clear: both;
  1280 }
  1365 }
  1281 
  1366 
  1282 .edit-post-preferences-modal {
       
  1283   min-width: 360px;
       
  1284   width: 100%;
       
  1285 }
       
  1286 @media (min-width: 782px) {
       
  1287   .edit-post-preferences-modal {
       
  1288     width: auto;
       
  1289   }
       
  1290 }
       
  1291 @media (min-width: 600px) {
       
  1292   .edit-post-preferences-modal {
       
  1293     height: calc(100% - 60px - 60px);
       
  1294   }
       
  1295 }
       
  1296 .edit-post-preferences-modal .components-navigation {
       
  1297   background-color: #fff;
       
  1298   margin: -8px;
       
  1299   padding: 8px;
       
  1300 }
       
  1301 .edit-post-preferences-modal .components-navigation .components-navigation__menu {
       
  1302   margin: 0;
       
  1303   color: #1e1e1e;
       
  1304 }
       
  1305 .edit-post-preferences-modal .components-navigation .components-navigation__menu .components-navigation__item {
       
  1306   color: #1e1e1e;
       
  1307 }
       
  1308 .edit-post-preferences-modal .components-navigation .components-navigation__menu .components-navigation__item > button {
       
  1309   color: inherit;
       
  1310   padding: 3px 16px;
       
  1311   height: 48px;
       
  1312 }
       
  1313 .edit-post-preferences-modal .components-navigation .components-navigation__menu .components-navigation__item > button:focus {
       
  1314   background: #f0f0f0;
       
  1315   font-weight: 500;
       
  1316 }
       
  1317 .edit-post-preferences-modal .components-navigation .components-navigation__menu .components-navigation__item > button:hover {
       
  1318   color: var(--wp-admin-theme-color);
       
  1319 }
       
  1320 .edit-post-preferences-modal .components-navigation .components-navigation__menu .components-navigation__item .components-toggle-control__label {
       
  1321   color: inherit;
       
  1322 }
       
  1323 .edit-post-preferences-modal .components-navigation .components-navigation__menu .components-navigation__menu-title-heading {
       
  1324   color: inherit;
       
  1325   border-bottom: 1px solid #ddd;
       
  1326   padding-left: 0;
       
  1327   padding-right: 0;
       
  1328 }
       
  1329 .edit-post-preferences-modal .components-navigation .components-navigation__menu .components-navigation__back-button {
       
  1330   color: inherit;
       
  1331   padding-left: 0;
       
  1332 }
       
  1333 .edit-post-preferences-modal .components-navigation .components-navigation__menu .components-navigation__back-button:hover {
       
  1334   color: var(--wp-admin-theme-color);
       
  1335 }
       
  1336 .edit-post-preferences-modal .components-navigation .components-navigation__menu .edit-post-preferences-modal__custom-fields-confirmation-button {
       
  1337   width: auto;
       
  1338 }
       
  1339 .edit-post-preferences-modal .edit-post-preferences__tabs {
       
  1340   display: flex;
       
  1341   flex-direction: row;
       
  1342 }
       
  1343 .edit-post-preferences-modal .edit-post-preferences__tabs .components-tab-panel__tabs {
       
  1344   width: 160px;
       
  1345 }
       
  1346 .edit-post-preferences-modal .edit-post-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item {
       
  1347   border-radius: 2px;
       
  1348   font-weight: 400;
       
  1349 }
       
  1350 .edit-post-preferences-modal .edit-post-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item.is-active {
       
  1351   background: #f0f0f0;
       
  1352   box-shadow: none;
       
  1353   font-weight: 500;
       
  1354 }
       
  1355 .edit-post-preferences-modal .edit-post-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item:focus:not(:disabled) {
       
  1356   box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
       
  1357 }
       
  1358 .edit-post-preferences-modal .edit-post-preferences__tabs .components-tab-panel__tab-content {
       
  1359   width: 500px;
       
  1360   padding-left: 24px;
       
  1361 }
       
  1362 .edit-post-preferences-modal__section {
       
  1363   margin: 0 0 2.5rem 0;
       
  1364 }
       
  1365 .edit-post-preferences-modal__section-title {
       
  1366   font-size: 0.9rem;
       
  1367   font-weight: 600;
       
  1368 }
       
  1369 .edit-post-preferences-modal__option .components-base-control .components-base-control__field {
       
  1370   align-items: center;
       
  1371   display: flex;
       
  1372   margin-bottom: 0;
       
  1373 }
       
  1374 .edit-post-preferences-modal__option .components-base-control .components-base-control__field > label {
       
  1375   flex-grow: 1;
       
  1376   padding: 0.6rem 0 0.6rem 10px;
       
  1377 }
       
  1378 .edit-post-preferences-modal__custom-fields-confirmation-message, .edit-post-preferences-modal__custom-fields-confirmation-button {
       
  1379   margin: 0 0 0.6rem 48px;
       
  1380 }
       
  1381 @media (min-width: 782px) {
       
  1382   .edit-post-preferences-modal__custom-fields-confirmation-message, .edit-post-preferences-modal__custom-fields-confirmation-button {
       
  1383     margin-left: 38px;
       
  1384   }
       
  1385 }
       
  1386 @media (min-width: 600px) {
       
  1387   .edit-post-preferences-modal__custom-fields-confirmation-message, .edit-post-preferences-modal__custom-fields-confirmation-button {
       
  1388     max-width: 300px;
       
  1389   }
       
  1390 }
       
  1391 .edit-post-preferences-modal .components-base-control__help {
       
  1392   margin: -8px 0 8px 58px;
       
  1393   font-size: 12px;
       
  1394   font-style: normal;
       
  1395   color: #757575;
       
  1396 }
       
  1397 .edit-post-preferences-modal .edit-post-preferences-modal__section-description {
       
  1398   margin: -8px 0 8px 0;
       
  1399   font-size: 12px;
       
  1400   font-style: normal;
       
  1401   color: #757575;
       
  1402 }
       
  1403 
       
  1404 .edit-post-editor__inserter-panel,
  1367 .edit-post-editor__inserter-panel,
  1405 .edit-post-editor__list-view-panel {
  1368 .edit-post-editor__list-view-panel {
  1406   height: 100%;
  1369   height: 100%;
  1407   display: flex;
  1370   display: flex;
  1408   flex-direction: column;
  1371   flex-direction: column;
  1415 .edit-post-editor__inserter-panel-header {
  1378 .edit-post-editor__inserter-panel-header {
  1416   padding-top: 8px;
  1379   padding-top: 8px;
  1417   padding-right: 8px;
  1380   padding-right: 8px;
  1418   display: flex;
  1381   display: flex;
  1419   justify-content: flex-end;
  1382   justify-content: flex-end;
  1420 }
       
  1421 @media (min-width: 782px) {
       
  1422   .edit-post-editor__inserter-panel-header {
       
  1423     display: none;
       
  1424   }
       
  1425 }
  1383 }
  1426 
  1384 
  1427 .edit-post-editor__inserter-panel-content,
  1385 .edit-post-editor__inserter-panel-content,
  1428 .edit-post-editor__list-view-panel-content {
  1386 .edit-post-editor__list-view-panel-content {
  1429   height: calc(100% - 36px - 8px);
  1387   height: calc(100% - 36px - 8px);
  1445   padding-right: 4px;
  1403   padding-right: 4px;
  1446 }
  1404 }
  1447 
  1405 
  1448 .edit-post-editor__list-view-panel-content {
  1406 .edit-post-editor__list-view-panel-content {
  1449   overflow-y: auto;
  1407   overflow-y: auto;
  1450   padding: 8px;
  1408   padding: 8px 6px;
  1451 }
  1409 }
  1452 
  1410 
  1453 .components-panel__header.edit-post-sidebar__panel-tabs {
  1411 .components-panel__header.edit-post-sidebar__panel-tabs {
  1454   justify-content: flex-start;
  1412   justify-content: flex-start;
  1455   padding-left: 0;
  1413   padding-left: 0;
  1655   .edit-post-template-modal__tip {
  1613   .edit-post-template-modal__tip {
  1656     width: 240px;
  1614     width: 240px;
  1657   }
  1615   }
  1658 }
  1616 }
  1659 
  1617 
       
  1618 .edit-post-template__notice {
       
  1619   margin: 0 0 8px 0;
       
  1620 }
       
  1621 .edit-post-template__notice .components-notice__content {
       
  1622   margin: 0;
       
  1623 }
       
  1624 
  1660 .edit-post-template__actions button:not(:last-child) {
  1625 .edit-post-template__actions button:not(:last-child) {
  1661   margin-right: 8px;
  1626   margin-right: 8px;
  1662 }
  1627 }
  1663 
  1628 
  1664 h2.edit-post-template-summary__title {
  1629 h2.edit-post-template-summary__title {
  1665   margin: 0;
       
  1666   line-height: 24px;
  1630   line-height: 24px;
       
  1631   margin: 0 0 4px;
       
  1632   font-weight: 500;
  1667 }
  1633 }
  1668 
  1634 
  1669 .edit-post-text-editor {
  1635 .edit-post-text-editor {
  1670   position: relative;
  1636   position: relative;
  1671   width: 100%;
  1637   width: 100%;
  1672   background-color: #fff;
  1638   background-color: #fff;
  1673   flex-grow: 1;
  1639   flex-grow: 1;
  1674 }
  1640 }
  1675 .edit-post-text-editor .editor-post-title.editor-post-title__block {
  1641 .edit-post-text-editor .editor-post-title {
  1676   max-width: none;
  1642   max-width: none;
  1677   line-height: 1.4;
  1643   line-height: 1.4;
  1678 }
       
  1679 .edit-post-text-editor .editor-post-title.editor-post-title__block .editor-post-title__input.editor-post-title__input.editor-post-title__input {
       
  1680   font-family: Menlo, Consolas, monaco, monospace;
  1644   font-family: Menlo, Consolas, monaco, monospace;
  1681   font-size: 2.5em;
  1645   font-size: 2.5em;
  1682   font-weight: normal;
  1646   font-weight: normal;
  1683 }
       
  1684 .edit-post-text-editor .editor-post-title.editor-post-title__block .editor-post-title__input {
       
  1685   border: 1px solid #949494;
  1647   border: 1px solid #949494;
  1686   margin-bottom: -1px;
       
  1687   padding: 16px;
  1648   padding: 16px;
  1688 }
  1649 }
  1689 @media (min-width: 600px) {
  1650 @media (min-width: 600px) {
  1690   .edit-post-text-editor .editor-post-title.editor-post-title__block .editor-post-title__input {
  1651   .edit-post-text-editor .editor-post-title {
  1691     padding: 24px;
  1652     padding: 24px;
  1692   }
  1653   }
  1693 }
  1654 }
  1694 .edit-post-text-editor .editor-post-title.editor-post-title__block .editor-post-title__input:focus {
  1655 .edit-post-text-editor .editor-post-title:focus {
  1695   border-color: var(--wp-admin-theme-color);
  1656   border-color: var(--wp-admin-theme-color);
  1696   box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
  1657   box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
  1697 }
       
  1698 @media (min-width: 600px) {
       
  1699   .edit-post-text-editor .editor-post-title.editor-post-title__block {
       
  1700     padding: 0;
       
  1701   }
       
  1702 }
  1658 }
  1703 
  1659 
  1704 .edit-post-text-editor__body {
  1660 .edit-post-text-editor__body {
  1705   width: 100%;
  1661   width: 100%;
  1706   padding: 0 12px 12px 12px;
  1662   padding: 0 12px 12px 12px;
  1748 .edit-post-visual-editor {
  1704 .edit-post-visual-editor {
  1749   position: relative;
  1705   position: relative;
  1750   display: flex;
  1706   display: flex;
  1751   flex-flow: column;
  1707   flex-flow: column;
  1752   background-color: #2f2f2f;
  1708   background-color: #2f2f2f;
  1753   flex: 1 1 auto;
  1709   flex: 1 0 auto;
  1754 }
  1710 }
  1755 .edit-post-visual-editor .components-button {
  1711 .edit-post-visual-editor .components-button {
  1756   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  1712   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  1757   font-size: 13px;
  1713   font-size: 13px;
  1758   padding: 6px 12px;
  1714   padding: 6px 12px;
  1759 }
  1715 }
  1760 .edit-post-visual-editor .components-button.is-tertiary, .edit-post-visual-editor .components-button.has-icon {
  1716 .edit-post-visual-editor .components-button.is-tertiary, .edit-post-visual-editor .components-button.has-icon {
  1761   padding: 6px;
  1717   padding: 6px;
  1762 }
  1718 }
  1763 @supports (position: sticky) {
  1719 
  1764   .edit-post-visual-editor {
  1720 .edit-post-visual-editor__post-title-wrapper {
  1765     flex-basis: 100%;
  1721   margin-top: 4rem;
  1766   }
  1722   margin-bottom: var(--wp--style--block-gap);
  1767 }
  1723 }
  1768 
       
  1769 .edit-post-visual-editor__post-title-wrapper .editor-post-title {
  1724 .edit-post-visual-editor__post-title-wrapper .editor-post-title {
  1770   margin-top: 2em;
       
  1771   margin-left: auto;
  1725   margin-left: auto;
  1772   margin-right: auto;
  1726   margin-right: auto;
  1773   margin-bottom: 0;
       
  1774 }
  1727 }
  1775 
  1728 
  1776 .edit-post-visual-editor__exit-template-mode {
  1729 .edit-post-visual-editor__exit-template-mode {
  1777   position: absolute;
  1730   position: absolute;
  1778   top: 8px;
  1731   top: 8px;
  1785 
  1738 
  1786 .edit-post-visual-editor__content-area {
  1739 .edit-post-visual-editor__content-area {
  1787   width: 100%;
  1740   width: 100%;
  1788   height: 100%;
  1741   height: 100%;
  1789   position: relative;
  1742   position: relative;
  1790   display: flex;
  1743   box-sizing: border-box;
  1791 }
  1744   display: flex;
  1792 
  1745   flex-grow: 1;
  1793 .edit-post-welcome-guide {
  1746 }
       
  1747 
       
  1748 .edit-post-welcome-guide,
       
  1749 .edit-template-welcome-guide {
  1794   width: 312px;
  1750   width: 312px;
  1795 }
  1751 }
  1796 .edit-post-welcome-guide__image {
  1752 .edit-post-welcome-guide__image,
       
  1753 .edit-template-welcome-guide__image {
  1797   background: #00a0d2;
  1754   background: #00a0d2;
  1798   margin: 0 0 16px;
  1755   margin: 0 0 16px;
  1799 }
  1756 }
  1800 .edit-post-welcome-guide__heading {
  1757 .edit-post-welcome-guide__image > img,
       
  1758 .edit-template-welcome-guide__image > img {
       
  1759   display: block;
       
  1760   max-width: 100%;
       
  1761   -o-object-fit: cover;
       
  1762      object-fit: cover;
       
  1763 }
       
  1764 .edit-post-welcome-guide__heading,
       
  1765 .edit-template-welcome-guide__heading {
  1801   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  1766   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  1802   font-size: 24px;
  1767   font-size: 24px;
  1803   line-height: 1.4;
  1768   line-height: 1.4;
  1804   margin: 16px 0 16px 0;
  1769   margin: 16px 0 16px 0;
  1805   padding: 0 32px;
  1770   padding: 0 32px;
  1806 }
  1771 }
  1807 .edit-post-welcome-guide__text {
  1772 .edit-post-welcome-guide__text,
       
  1773 .edit-template-welcome-guide__text {
  1808   font-size: 13px;
  1774   font-size: 13px;
  1809   line-height: 1.4;
  1775   line-height: 1.4;
  1810   margin: 0 0 24px 0;
  1776   margin: 0 0 24px 0;
  1811   padding: 0 32px;
  1777   padding: 0 32px;
  1812 }
  1778 }
  1813 .edit-post-welcome-guide__inserter-icon {
  1779 .edit-post-welcome-guide__inserter-icon,
       
  1780 .edit-template-welcome-guide__inserter-icon {
  1814   margin: 0 4px;
  1781   margin: 0 4px;
  1815   vertical-align: text-top;
  1782   vertical-align: text-top;
       
  1783 }
       
  1784 
       
  1785 .edit-template-welcome-guide .components-button svg {
       
  1786   fill: #fff;
       
  1787 }
       
  1788 
       
  1789 @media (min-width: 600px) {
       
  1790   .edit-post-start-page-options__modal {
       
  1791     width: calc(100% - 32px);
       
  1792     height: calc(100% - 120px);
       
  1793   }
       
  1794 }
       
  1795 @media (min-width: 782px) {
       
  1796   .edit-post-start-page-options__modal {
       
  1797     width: 750px;
       
  1798   }
       
  1799 }
       
  1800 @media (min-width: 960px) {
       
  1801   .edit-post-start-page-options__modal {
       
  1802     height: 70%;
       
  1803   }
       
  1804 }
       
  1805 .edit-post-start-page-options__modal .components-modal__header {
       
  1806   border-bottom: none;
       
  1807 }
       
  1808 .edit-post-start-page-options__modal .components-modal__content::before {
       
  1809   content: none;
       
  1810 }
       
  1811 
       
  1812 .edit-post-start-page-options__modal-content .block-editor-block-patterns-list {
       
  1813   column-count: 2;
       
  1814   column-gap: 24px;
       
  1815 }
       
  1816 .edit-post-start-page-options__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
       
  1817   break-inside: avoid-column;
       
  1818   margin-bottom: 24px;
       
  1819 }
       
  1820 .edit-post-start-page-options__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item .block-editor-block-preview__container {
       
  1821   min-height: 100px;
       
  1822 }
       
  1823 .edit-post-start-page-options__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item .block-editor-block-preview__content {
       
  1824   width: 100%;
  1816 }
  1825 }
  1817 
  1826 
  1818 /**
  1827 /**
  1819  * Animations
  1828  * Animations
  1820  */
  1829  */
  1868     overflow-y: initial;
  1877     overflow-y: initial;
  1869   }
  1878   }
  1870 }
  1879 }
  1871 
  1880 
  1872 .edit-post-header,
  1881 .edit-post-header,
  1873 .edit-post-visual-editor,
       
  1874 .edit-post-text-editor,
  1882 .edit-post-text-editor,
  1875 .edit-post-sidebar,
  1883 .edit-post-sidebar,
  1876 .editor-post-publish-panel,
  1884 .editor-post-publish-panel,
  1877 .components-popover,
  1885 .components-popover,
  1878 .components-modal__frame,
  1886 .components-modal__frame,
  1880   box-sizing: border-box;
  1888   box-sizing: border-box;
  1881 }
  1889 }
  1882 .edit-post-header *,
  1890 .edit-post-header *,
  1883 .edit-post-header *::before,
  1891 .edit-post-header *::before,
  1884 .edit-post-header *::after,
  1892 .edit-post-header *::after,
  1885 .edit-post-visual-editor *,
       
  1886 .edit-post-visual-editor *::before,
       
  1887 .edit-post-visual-editor *::after,
       
  1888 .edit-post-text-editor *,
  1893 .edit-post-text-editor *,
  1889 .edit-post-text-editor *::before,
  1894 .edit-post-text-editor *::before,
  1890 .edit-post-text-editor *::after,
  1895 .edit-post-text-editor *::after,
  1891 .edit-post-sidebar *,
  1896 .edit-post-sidebar *,
  1892 .edit-post-sidebar *::before,
  1897 .edit-post-sidebar *::before,
  1926 }
  1931 }
  1927 .block-editor__container img {
  1932 .block-editor__container img {
  1928   max-width: 100%;
  1933   max-width: 100%;
  1929   height: auto;
  1934   height: auto;
  1930 }
  1935 }
  1931 .block-editor__container iframe {
       
  1932   width: 100%;
       
  1933 }
       
  1934 
  1936 
  1935 body.admin-color-light {
  1937 body.admin-color-light {
  1936   --wp-admin-theme-color: #0085ba;
  1938   --wp-admin-theme-color: #0085ba;
       
  1939   --wp-admin-theme-color--rgb: 0, 133, 186;
  1937   --wp-admin-theme-color-darker-10: #0073a1;
  1940   --wp-admin-theme-color-darker-10: #0073a1;
       
  1941   --wp-admin-theme-color-darker-10--rgb: 0, 115, 161;
  1938   --wp-admin-theme-color-darker-20: #006187;
  1942   --wp-admin-theme-color-darker-20: #006187;
       
  1943   --wp-admin-theme-color-darker-20--rgb: 0, 97, 135;
  1939   --wp-admin-border-width-focus: 2px;
  1944   --wp-admin-border-width-focus: 2px;
  1940 }
  1945 }
  1941 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  1946 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  1942   body.admin-color-light {
  1947   body.admin-color-light {
  1943     --wp-admin-border-width-focus: 1.5px;
  1948     --wp-admin-border-width-focus: 1.5px;
  1944   }
  1949   }
  1945 }
  1950 }
  1946 
  1951 
  1947 body.admin-color-modern {
  1952 body.admin-color-modern {
  1948   --wp-admin-theme-color: #3858e9;
  1953   --wp-admin-theme-color: #3858e9;
       
  1954   --wp-admin-theme-color--rgb: 56, 88, 233;
  1949   --wp-admin-theme-color-darker-10: #2145e6;
  1955   --wp-admin-theme-color-darker-10: #2145e6;
       
  1956   --wp-admin-theme-color-darker-10--rgb: 33, 69, 230;
  1950   --wp-admin-theme-color-darker-20: #183ad6;
  1957   --wp-admin-theme-color-darker-20: #183ad6;
       
  1958   --wp-admin-theme-color-darker-20--rgb: 24, 58, 214;
  1951   --wp-admin-border-width-focus: 2px;
  1959   --wp-admin-border-width-focus: 2px;
  1952 }
  1960 }
  1953 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  1961 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  1954   body.admin-color-modern {
  1962   body.admin-color-modern {
  1955     --wp-admin-border-width-focus: 1.5px;
  1963     --wp-admin-border-width-focus: 1.5px;
  1956   }
  1964   }
  1957 }
  1965 }
  1958 
  1966 
  1959 body.admin-color-blue {
  1967 body.admin-color-blue {
  1960   --wp-admin-theme-color: #096484;
  1968   --wp-admin-theme-color: #096484;
       
  1969   --wp-admin-theme-color--rgb: 9, 100, 132;
  1961   --wp-admin-theme-color-darker-10: #07526c;
  1970   --wp-admin-theme-color-darker-10: #07526c;
       
  1971   --wp-admin-theme-color-darker-10--rgb: 7, 82, 108;
  1962   --wp-admin-theme-color-darker-20: #064054;
  1972   --wp-admin-theme-color-darker-20: #064054;
       
  1973   --wp-admin-theme-color-darker-20--rgb: 6, 64, 84;
  1963   --wp-admin-border-width-focus: 2px;
  1974   --wp-admin-border-width-focus: 2px;
  1964 }
  1975 }
  1965 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  1976 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  1966   body.admin-color-blue {
  1977   body.admin-color-blue {
  1967     --wp-admin-border-width-focus: 1.5px;
  1978     --wp-admin-border-width-focus: 1.5px;
  1968   }
  1979   }
  1969 }
  1980 }
  1970 
  1981 
  1971 body.admin-color-coffee {
  1982 body.admin-color-coffee {
  1972   --wp-admin-theme-color: #46403c;
  1983   --wp-admin-theme-color: #46403c;
       
  1984   --wp-admin-theme-color--rgb: 70, 64, 60;
  1973   --wp-admin-theme-color-darker-10: #383330;
  1985   --wp-admin-theme-color-darker-10: #383330;
       
  1986   --wp-admin-theme-color-darker-10--rgb: 56, 51, 48;
  1974   --wp-admin-theme-color-darker-20: #2b2724;
  1987   --wp-admin-theme-color-darker-20: #2b2724;
       
  1988   --wp-admin-theme-color-darker-20--rgb: 43, 39, 36;
  1975   --wp-admin-border-width-focus: 2px;
  1989   --wp-admin-border-width-focus: 2px;
  1976 }
  1990 }
  1977 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  1991 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  1978   body.admin-color-coffee {
  1992   body.admin-color-coffee {
  1979     --wp-admin-border-width-focus: 1.5px;
  1993     --wp-admin-border-width-focus: 1.5px;
  1980   }
  1994   }
  1981 }
  1995 }
  1982 
  1996 
  1983 body.admin-color-ectoplasm {
  1997 body.admin-color-ectoplasm {
  1984   --wp-admin-theme-color: #523f6d;
  1998   --wp-admin-theme-color: #523f6d;
       
  1999   --wp-admin-theme-color--rgb: 82, 63, 109;
  1985   --wp-admin-theme-color-darker-10: #46365d;
  2000   --wp-admin-theme-color-darker-10: #46365d;
       
  2001   --wp-admin-theme-color-darker-10--rgb: 70, 54, 93;
  1986   --wp-admin-theme-color-darker-20: #3a2c4d;
  2002   --wp-admin-theme-color-darker-20: #3a2c4d;
       
  2003   --wp-admin-theme-color-darker-20--rgb: 58, 44, 77;
  1987   --wp-admin-border-width-focus: 2px;
  2004   --wp-admin-border-width-focus: 2px;
  1988 }
  2005 }
  1989 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  2006 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  1990   body.admin-color-ectoplasm {
  2007   body.admin-color-ectoplasm {
  1991     --wp-admin-border-width-focus: 1.5px;
  2008     --wp-admin-border-width-focus: 1.5px;
  1992   }
  2009   }
  1993 }
  2010 }
  1994 
  2011 
  1995 body.admin-color-midnight {
  2012 body.admin-color-midnight {
  1996   --wp-admin-theme-color: #e14d43;
  2013   --wp-admin-theme-color: #e14d43;
       
  2014   --wp-admin-theme-color--rgb: 225, 77, 67;
  1997   --wp-admin-theme-color-darker-10: #dd382d;
  2015   --wp-admin-theme-color-darker-10: #dd382d;
       
  2016   --wp-admin-theme-color-darker-10--rgb: 221, 56, 45;
  1998   --wp-admin-theme-color-darker-20: #d02c21;
  2017   --wp-admin-theme-color-darker-20: #d02c21;
       
  2018   --wp-admin-theme-color-darker-20--rgb: 208, 44, 33;
  1999   --wp-admin-border-width-focus: 2px;
  2019   --wp-admin-border-width-focus: 2px;
  2000 }
  2020 }
  2001 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  2021 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  2002   body.admin-color-midnight {
  2022   body.admin-color-midnight {
  2003     --wp-admin-border-width-focus: 1.5px;
  2023     --wp-admin-border-width-focus: 1.5px;
  2004   }
  2024   }
  2005 }
  2025 }
  2006 
  2026 
  2007 body.admin-color-ocean {
  2027 body.admin-color-ocean {
  2008   --wp-admin-theme-color: #627c83;
  2028   --wp-admin-theme-color: #627c83;
       
  2029   --wp-admin-theme-color--rgb: 98, 124, 131;
  2009   --wp-admin-theme-color-darker-10: #576e74;
  2030   --wp-admin-theme-color-darker-10: #576e74;
       
  2031   --wp-admin-theme-color-darker-10--rgb: 87, 110, 116;
  2010   --wp-admin-theme-color-darker-20: #4c6066;
  2032   --wp-admin-theme-color-darker-20: #4c6066;
       
  2033   --wp-admin-theme-color-darker-20--rgb: 76, 96, 102;
  2011   --wp-admin-border-width-focus: 2px;
  2034   --wp-admin-border-width-focus: 2px;
  2012 }
  2035 }
  2013 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  2036 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  2014   body.admin-color-ocean {
  2037   body.admin-color-ocean {
  2015     --wp-admin-border-width-focus: 1.5px;
  2038     --wp-admin-border-width-focus: 1.5px;
  2016   }
  2039   }
  2017 }
  2040 }
  2018 
  2041 
  2019 body.admin-color-sunrise {
  2042 body.admin-color-sunrise {
  2020   --wp-admin-theme-color: #dd823b;
  2043   --wp-admin-theme-color: #dd823b;
       
  2044   --wp-admin-theme-color--rgb: 221, 130, 59;
  2021   --wp-admin-theme-color-darker-10: #d97426;
  2045   --wp-admin-theme-color-darker-10: #d97426;
       
  2046   --wp-admin-theme-color-darker-10--rgb: 217, 116, 38;
  2022   --wp-admin-theme-color-darker-20: #c36922;
  2047   --wp-admin-theme-color-darker-20: #c36922;
       
  2048   --wp-admin-theme-color-darker-20--rgb: 195, 105, 34;
  2023   --wp-admin-border-width-focus: 2px;
  2049   --wp-admin-border-width-focus: 2px;
  2024 }
  2050 }
  2025 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  2051 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  2026   body.admin-color-sunrise {
  2052   body.admin-color-sunrise {
  2027     --wp-admin-border-width-focus: 1.5px;
  2053     --wp-admin-border-width-focus: 1.5px;