diff options
Diffstat (limited to 'wp-includes/css/dist/edit-post/style.css')
| -rw-r--r-- | wp-includes/css/dist/edit-post/style.css | 895 |
1 files changed, 116 insertions, 779 deletions
diff --git a/wp-includes/css/dist/edit-post/style.css b/wp-includes/css/dist/edit-post/style.css index abd9051..fe4060f 100644 --- a/wp-includes/css/dist/edit-post/style.css +++ b/wp-includes/css/dist/edit-post/style.css @@ -8,6 +8,7 @@ --wp-admin-border-width-focus:2px; --wp-block-synced-color:#7a00df; --wp-block-synced-color--rgb:122, 0, 223; + --wp-bound-block-color:#9747ff; } @media (min-resolution:192dpi){ :root{ @@ -342,7 +343,7 @@ body.is-fullscreen-mode .interface-interface-skeleton{ } .interface-more-menu-dropdown__content .components-popover__content{ - min-width:280px; + min-width:300px; } @media (min-width:480px){ .interface-more-menu-dropdown__content .components-popover__content{ @@ -359,8 +360,7 @@ body.is-fullscreen-mode .interface-interface-skeleton{ .interface-pinned-items{ display:flex; - gap:4px; - margin-right:-4px; + gap:8px; } .interface-pinned-items .components-button{ display:none; @@ -377,92 +377,6 @@ body.is-fullscreen-mode .interface-interface-skeleton{ .interface-pinned-items .components-button{ display:flex; } - .interface-preferences-modal{ - height:calc(100% - 120px); - width:calc(100% - 32px); - } -} -@media (min-width:782px){ - .interface-preferences-modal{ - width:750px; - } -} -@media (min-width:960px){ - .interface-preferences-modal{ - height:70%; - } -} -@media (max-width:781px){ - .interface-preferences-modal .components-modal__content{ - padding:0; - } -} - -.interface-preferences__tabs .components-tab-panel__tabs{ - left:16px; - position:absolute; - top:84px; - width:160px; -} -.interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item{ - border-radius:2px; - font-weight:400; -} -.interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item.is-active{ - background:#f0f0f0; - box-shadow:none; - font-weight:500; -} -.interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item.is-active:after{ - content:none; -} -.interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item:focus:not(:disabled){ - box-shadow:inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); - outline:2px solid transparent; -} -.interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item:focus-visible:before{ - content:none; -} -.interface-preferences__tabs .components-tab-panel__tab-content{ - margin-left:160px; - padding-left:24px; -} - -@media (max-width:781px){ - .interface-preferences__provider{ - height:100%; - } -} -.interface-preferences-modal__section{ - margin:0 0 2.5rem; -} -.interface-preferences-modal__section:last-child{ - margin:0; -} - -.interface-preferences-modal__section-legend{ - margin-bottom:8px; -} - -.interface-preferences-modal__section-title{ - font-size:.9rem; - font-weight:600; - margin-top:0; -} - -.interface-preferences-modal__section-description{ - color:#757575; - font-size:12px; - font-style:normal; - margin:-8px 0 8px; -} - -.interface-preferences-modal__option+.interface-preferences-modal__option{ - margin-top:16px; -} -.interface-preferences-modal__option .components-base-control__help{ - margin-left:48px; - margin-top:0; } .edit-post-header{ @@ -471,6 +385,7 @@ body.is-fullscreen-mode .interface-interface-skeleton{ display:flex; flex-wrap:wrap; height:60px; + justify-content:space-between; max-width:100vw; } @media (min-width:280px){ @@ -478,18 +393,14 @@ body.is-fullscreen-mode .interface-interface-skeleton{ flex-wrap:nowrap; } } -.edit-post-header>.edit-post-header__settings{ - order:1; -} -@supports (position:sticky){ - .edit-post-header>.edit-post-header__settings{ - order:0; - } -} .edit-post-header__toolbar{ + align-items:center; display:flex; - flex-grow:1; + flex-grow:3; + flex-shrink:8; + overflow:hidden; + padding:2px 0; } .edit-post-header__toolbar .table-of-contents{ display:none; @@ -499,46 +410,82 @@ body.is-fullscreen-mode .interface-interface-skeleton{ display:block; } } +.edit-post-header__toolbar .selected-block-tools-wrapper{ + align-items:center; + display:flex; + height:60px; + overflow:hidden; +} +.edit-post-header__toolbar .selected-block-tools-wrapper .block-editor-block-contextual-toolbar{ + border-bottom:0; + height:100%; +} +.edit-post-header__toolbar .selected-block-tools-wrapper .block-editor-block-toolbar{ + height:100%; + padding-top:15px; +} +.edit-post-header__toolbar .selected-block-tools-wrapper .block-editor-block-toolbar .components-button:not(.block-editor-block-mover-button){ + height:32px; +} +.edit-post-header__toolbar .selected-block-tools-wrapper:after{ + background-color:#ddd; + content:""; + height:24px; + margin-left:8px; + width:1px; +} +.edit-post-header__toolbar .selected-block-tools-wrapper .components-toolbar,.edit-post-header__toolbar .selected-block-tools-wrapper .components-toolbar-group{ + border-right:none; +} +.edit-post-header__toolbar .selected-block-tools-wrapper .components-toolbar-group:after,.edit-post-header__toolbar .selected-block-tools-wrapper .components-toolbar:after{ + background-color:#ddd; + content:""; + height:24px; + margin-left:8px; + margin-top:4px; + width:1px; +} +.edit-post-header__toolbar .selected-block-tools-wrapper .components-toolbar .components-toolbar-group.components-toolbar-group:after,.edit-post-header__toolbar .selected-block-tools-wrapper .components-toolbar-group .components-toolbar-group.components-toolbar-group:after{ + display:none; +} +.edit-post-header__toolbar .selected-block-tools-wrapper .block-editor-block-mover.is-horizontal .block-editor-block-mover-button{ + height:32px; + overflow:visible; +} +@media (min-width:600px){ + .edit-post-header__toolbar .selected-block-tools-wrapper .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container{ + position:relative; + top:-10px; + } +} +.edit-post-header__toolbar .selected-block-tools-wrapper.is-collapsed{ + display:none; +} + +.edit-post-header__block-tools-toggle{ + margin-left:2px; +} .edit-post-header__center{ display:flex; flex-grow:1; justify-content:center; } +.edit-post-header__center.is-collapsed{ + display:none; +} .edit-post-header__settings{ align-items:center; display:inline-flex; - flex-wrap:wrap; - gap:4px; + flex-wrap:nowrap; + gap:8px; padding-right:4px; } @media (min-width:600px){ .edit-post-header__settings{ - gap:8px; - padding-right:10px; + padding-right:8px; } } - -.edit-post-header-preview__grouping-external{ - display:flex; - padding-bottom:0; - position:relative; -} - -.edit-post-header-preview__button-external{ - display:flex; - justify-content:flex-start; - margin-right:auto; - padding-left:8px; - width:100%; -} -.edit-post-header-preview__button-external svg{ - margin-left:auto; -} - -.edit-post-post-preview-dropdown .components-popover__content{ - padding-bottom:0; -} .edit-post-header__dropdown .components-button.has-icon,.show-icon-labels .edit-post-header .components-button.has-icon,.show-icon-labels.interface-pinned-items .components-button.has-icon{ width:auto; } @@ -549,10 +496,10 @@ body.is-fullscreen-mode .interface-interface-skeleton{ content:attr(aria-label); } .edit-post-header__dropdown .components-button.has-icon[aria-disabled=true],.show-icon-labels .edit-post-header .components-button.has-icon[aria-disabled=true],.show-icon-labels.interface-pinned-items .components-button.has-icon[aria-disabled=true]{ - background-color:transparent; + background-color:initial; } .edit-post-header__dropdown .is-tertiary:active,.show-icon-labels .edit-post-header .is-tertiary:active,.show-icon-labels.interface-pinned-items .is-tertiary:active{ - background-color:transparent; + background-color:initial; box-shadow:0 0 0 1.5px var(--wp-admin-theme-color); } .edit-post-header__dropdown .components-button.has-icon.button-toggle svg,.edit-post-header__dropdown .edit-post-fullscreen-mode-close.has-icon svg,.show-icon-labels .edit-post-header .components-button.has-icon.button-toggle svg,.show-icon-labels .edit-post-header .edit-post-fullscreen-mode-close.has-icon svg,.show-icon-labels.interface-pinned-items .components-button.has-icon.button-toggle svg,.show-icon-labels.interface-pinned-items .edit-post-fullscreen-mode-close.has-icon svg{ @@ -567,12 +514,12 @@ body.is-fullscreen-mode .interface-interface-skeleton{ .edit-post-header__dropdown .components-menu-items-choice .components-menu-items__item-icon.components-menu-items__item-icon,.show-icon-labels .edit-post-header .components-menu-items-choice .components-menu-items__item-icon.components-menu-items__item-icon,.show-icon-labels.interface-pinned-items .components-menu-items-choice .components-menu-items__item-icon.components-menu-items__item-icon{ display:block; } -.edit-post-header__dropdown .edit-post-header-toolbar__inserter-toggle.edit-post-header-toolbar__inserter-toggle,.edit-post-header__dropdown .interface-pinned-items .components-button,.show-icon-labels .edit-post-header .edit-post-header-toolbar__inserter-toggle.edit-post-header-toolbar__inserter-toggle,.show-icon-labels .edit-post-header .interface-pinned-items .components-button,.show-icon-labels.interface-pinned-items .edit-post-header-toolbar__inserter-toggle.edit-post-header-toolbar__inserter-toggle,.show-icon-labels.interface-pinned-items .interface-pinned-items .components-button{ +.edit-post-header__dropdown .editor-document-tools__inserter-toggle.editor-document-tools__inserter-toggle,.edit-post-header__dropdown .interface-pinned-items .components-button,.show-icon-labels .edit-post-header .editor-document-tools__inserter-toggle.editor-document-tools__inserter-toggle,.show-icon-labels .edit-post-header .interface-pinned-items .components-button,.show-icon-labels.interface-pinned-items .editor-document-tools__inserter-toggle.editor-document-tools__inserter-toggle,.show-icon-labels.interface-pinned-items .interface-pinned-items .components-button{ padding-left:8px; padding-right:8px; } @media (min-width:600px){ - .edit-post-header__dropdown .edit-post-header-toolbar__inserter-toggle.edit-post-header-toolbar__inserter-toggle,.edit-post-header__dropdown .interface-pinned-items .components-button,.show-icon-labels .edit-post-header .edit-post-header-toolbar__inserter-toggle.edit-post-header-toolbar__inserter-toggle,.show-icon-labels .edit-post-header .interface-pinned-items .components-button,.show-icon-labels.interface-pinned-items .edit-post-header-toolbar__inserter-toggle.edit-post-header-toolbar__inserter-toggle,.show-icon-labels.interface-pinned-items .interface-pinned-items .components-button{ + .edit-post-header__dropdown .editor-document-tools__inserter-toggle.editor-document-tools__inserter-toggle,.edit-post-header__dropdown .interface-pinned-items .components-button,.show-icon-labels .edit-post-header .editor-document-tools__inserter-toggle.editor-document-tools__inserter-toggle,.show-icon-labels .edit-post-header .interface-pinned-items .components-button,.show-icon-labels.interface-pinned-items .editor-document-tools__inserter-toggle.editor-document-tools__inserter-toggle,.show-icon-labels.interface-pinned-items .interface-pinned-items .components-button{ padding-left:12px; padding-right:12px; } @@ -581,6 +528,23 @@ body.is-fullscreen-mode .interface-interface-skeleton{ content:none; } +.show-icon-labels .edit-post-header__toolbar .block-editor-block-mover{ + border-left:none; +} +.show-icon-labels .edit-post-header__toolbar .block-editor-block-mover:before{ + background-color:#ddd; + content:""; + height:24px; + margin-left:8px; + margin-top:4px; + width:1px; +} +.show-icon-labels .edit-post-header__toolbar .block-editor-block-mover .block-editor-block-mover__move-button-container:before{ + background:#ddd; + left:calc(50% + 1px); + width:calc(100% - 24px); +} + .edit-post-header__dropdown .components-button.block-editor-list-view,.edit-post-header__dropdown .components-button.editor-history__redo,.edit-post-header__dropdown .components-button.editor-history__undo,.edit-post-header__dropdown .components-menu-item__button.components-menu-item__button,.edit-post-header__dropdown .table-of-contents .components-button{ justify-content:flex-start; margin:0; @@ -612,21 +576,27 @@ body.is-fullscreen-mode .interface-interface-skeleton{ margin-right:8px; } +@media (min-width:600px){ + .edit-post-header__post-preview-button{ + display:none; + } +} + .is-distraction-free .interface-interface-skeleton__header{ border-bottom:none; } .is-distraction-free .edit-post-header{ -webkit-backdrop-filter:blur(20px) !important; backdrop-filter:blur(20px) !important; - background-color:hsla(0,0%,100%,.9); + background-color:#ffffffe6; border-bottom:1px solid #e0e0e0; position:absolute; width:100%; } -.is-distraction-free .edit-post-header>.edit-post-header__settings>.editor-post-preview{ +.is-distraction-free .edit-post-header>.edit-post-header__settings>.edit-post-header__post-preview-button{ visibility:hidden; } -.is-distraction-free .edit-post-header>.edit-post-header__settings>.block-editor-post-preview__dropdown,.is-distraction-free .edit-post-header>.edit-post-header__settings>.interface-pinned-items,.is-distraction-free .edit-post-header>.edit-post-header__toolbar .edit-post-header-toolbar__document-overview-toggle,.is-distraction-free .edit-post-header>.edit-post-header__toolbar .edit-post-header-toolbar__inserter-toggle{ +.is-distraction-free .edit-post-header>.edit-post-header__settings>.editor-preview-dropdown,.is-distraction-free .edit-post-header>.edit-post-header__settings>.interface-pinned-items,.is-distraction-free .edit-post-header>.edit-post-header__toolbar .editor-document-tools__document-overview-toggle,.is-distraction-free .edit-post-header>.edit-post-header__toolbar .editor-document-tools__inserter-toggle{ display:none; } .is-distraction-free .interface-interface-skeleton__header:focus-within{ @@ -690,7 +660,7 @@ body.is-fullscreen-mode .interface-interface-skeleton{ box-shadow:none; } .edit-post-fullscreen-mode-close.components-button:focus:before{ - 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); + box-shadow:inset 0 0 0 var(--wp-admin-border-width-focus) #ffffff1a, inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); } } .edit-post-fullscreen-mode-close.components-button .edit-post-fullscreen-mode-close_site-icon{ @@ -701,157 +671,6 @@ body.is-fullscreen-mode .interface-interface-skeleton{ width:36px; } -.edit-post-header-toolbar{ - align-items:center; - border:none; - display:inline-flex; -} -.edit-post-header-toolbar .edit-post-header-toolbar__left>.components-button{ - display:none; -} -@media (min-width:600px){ - .edit-post-header-toolbar .edit-post-header-toolbar__left>.components-button{ - display:inline-flex; - } -} -.edit-post-header-toolbar .edit-post-header-toolbar__left>.edit-post-header-toolbar__inserter-toggle{ - display:inline-flex; -} -.edit-post-header-toolbar .edit-post-header-toolbar__left>.edit-post-header-toolbar__inserter-toggle svg{ - transition:transform .2s cubic-bezier(.165, .84, .44, 1); -} -@media (prefers-reduced-motion:reduce){ - .edit-post-header-toolbar .edit-post-header-toolbar__left>.edit-post-header-toolbar__inserter-toggle svg{ - transition-delay:0s; - transition-duration:0s; - } -} -.edit-post-header-toolbar .edit-post-header-toolbar__left>.edit-post-header-toolbar__inserter-toggle.is-pressed svg{ - transform:rotate(45deg); -} -.edit-post-header-toolbar .block-editor-list-view{ - display:none; -} -@media (min-width:600px){ - .edit-post-header-toolbar .block-editor-list-view{ - display:flex; - } -} -.edit-post-header-toolbar .edit-post-header-toolbar__left>.components-button.has-icon,.edit-post-header-toolbar .edit-post-header-toolbar__left>.components-dropdown>.components-button.has-icon{ - height:36px; - min-width:36px; - padding:6px; -} -.edit-post-header-toolbar .edit-post-header-toolbar__left>.components-button.has-icon.is-pressed,.edit-post-header-toolbar .edit-post-header-toolbar__left>.components-dropdown>.components-button.has-icon.is-pressed{ - background:#1e1e1e; -} -.edit-post-header-toolbar .edit-post-header-toolbar__left>.components-button.has-icon:focus:not(:disabled),.edit-post-header-toolbar .edit-post-header-toolbar__left>.components-dropdown>.components-button.has-icon:focus:not(:disabled){ - box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 0 0 1px #fff; - outline:1px solid transparent; -} -.edit-post-header-toolbar .edit-post-header-toolbar__left>.components-button.has-icon:before,.edit-post-header-toolbar .edit-post-header-toolbar__left>.components-dropdown>.components-button.has-icon:before{ - display:none; -} - -@media (min-width:600px){ - .edit-post-header.has-reduced-ui .edit-post-header-toolbar__left>*+.components-button,.edit-post-header.has-reduced-ui .edit-post-header-toolbar__left>*+.components-dropdown>[aria-expanded=false]{ - transition:opacity .1s linear; - } -} -@media (min-width:600px) and (prefers-reduced-motion:reduce){ - .edit-post-header.has-reduced-ui .edit-post-header-toolbar__left>*+.components-button,.edit-post-header.has-reduced-ui .edit-post-header-toolbar__left>*+.components-dropdown>[aria-expanded=false]{ - transition-delay:0s; - transition-duration:0s; - } -} -@media (min-width:600px){ - .edit-post-header.has-reduced-ui:not(:hover) .edit-post-header-toolbar__left>*+.components-button,.edit-post-header.has-reduced-ui:not(:hover) .edit-post-header-toolbar__left>*+.components-dropdown>[aria-expanded=false]{ - opacity:0; - } -} - -.edit-post-header-toolbar__left{ - align-items:center; - display:inline-flex; - margin-right:8px; - padding-left:8px; -} -@media (min-width:600px){ - .edit-post-header-toolbar__left{ - padding-left:24px; - } -} -@media (min-width:1280px){ - .edit-post-header-toolbar__left{ - padding-right:8px; - } -} - -.edit-post-header-toolbar .edit-post-header-toolbar__left>.edit-post-header-toolbar__inserter-toggle.has-icon{ - height:32px; - margin-right:8px; - min-width:32px; - padding:0; - width:32px; -} -.show-icon-labels .edit-post-header-toolbar .edit-post-header-toolbar__left>.edit-post-header-toolbar__inserter-toggle.has-icon{ - height:36px; - padding:0 8px; - width:auto; -} - -.show-icon-labels .edit-post-header-toolbar__left>*+*{ - margin-left:8px; -} - -.edit-post-document-actions{ - align-items:center; - background:#f0f0f0; - border-radius:4px; - display:flex; - gap:8px; - height:36px; - justify-content:space-between; - min-width:0; - width:min(100%, 450px); -} -.edit-post-document-actions .components-button:hover{ - background:#e0e0e0; - color:var(--wp-block-synced-color); -} - -.edit-post-document-actions__command,.edit-post-document-actions__title{ - color:var(--wp-block-synced-color); - flex-grow:1; - overflow:hidden; -} -.edit-post-document-actions__title:hover{ - color:var(--wp-block-synced-color); -} -.edit-post-document-actions__title .block-editor-block-icon{ - flex-shrink:0; -} -.edit-post-document-actions__title h1{ - color:var(--wp-block-synced-color); - overflow:hidden; - text-overflow:ellipsis; - white-space:nowrap; -} - -.edit-post-document-actions__shortcut{ - color:#2f2f2f; -} - -.edit-post-document-actions__back.components-button.has-icon.has-text{ - color:#757575; - flex-shrink:0; - gap:0; - min-width:36px; -} -.edit-post-document-actions__back.components-button.has-icon.has-text:hover{ - color:currentColor; -} - .edit-post-keyboard-shortcut-help-modal__section{ margin:0 0 2rem; } @@ -1009,12 +828,7 @@ body.is-fullscreen-mode .edit-post-layout .components-editor-notices__snackbar{ z-index:100000; } -.interface-interface-skeleton__sidebar:focus .edit-post-layout__toggle-sidebar-panel,.interface-interface-skeleton__sidebar:focus-within .edit-post-layout__toggle-sidebar-panel{ - bottom:0; - top:auto; -} - -.interface-interface-skeleton__actions:focus .edit-post-layout__toggle-entities-saved-states-panel,.interface-interface-skeleton__actions:focus .edit-post-layout__toggle-publish-panel,.interface-interface-skeleton__actions:focus-within .edit-post-layout__toggle-entities-saved-states-panel,.interface-interface-skeleton__actions:focus-within .edit-post-layout__toggle-publish-panel{ +.interface-interface-skeleton__actions:focus .edit-post-layout__toggle-entities-saved-states-panel,.interface-interface-skeleton__actions:focus .edit-post-layout__toggle-publish-panel,.interface-interface-skeleton__actions:focus-within .edit-post-layout__toggle-entities-saved-states-panel,.interface-interface-skeleton__actions:focus-within .edit-post-layout__toggle-publish-panel,.interface-interface-skeleton__sidebar:focus .edit-post-layout__toggle-sidebar-panel,.interface-interface-skeleton__sidebar:focus-within .edit-post-layout__toggle-sidebar-panel{ bottom:0; top:auto; } @@ -1023,91 +837,11 @@ body.is-fullscreen-mode .edit-post-layout .components-editor-notices__snackbar{ height:61px; } -@media (min-width:782px){ - .edit-post-layout.has-fixed-toolbar .interface-interface-skeleton__header:not(:focus-within){ - z-index:19; - } -} - -.edit-post-block-manager__no-results{ - font-style:italic; - padding:24px 0; - text-align:center; -} - -.edit-post-block-manager__search{ - margin:16px 0; -} - -.edit-post-block-manager__disabled-blocks-count{ - background-color:#fff; - border:1px solid #ddd; - border-width:1px 0; - box-shadow:-32px 0 0 0 #fff,32px 0 0 0 #fff; - padding:8px; - position:sticky; - text-align:center; - top:-1px; - z-index:2; -} -.edit-post-block-manager__disabled-blocks-count~.edit-post-block-manager__results .edit-post-block-manager__category-title{ - top:35px; -} -.edit-post-block-manager__disabled-blocks-count .is-link{ - margin-left:12px; -} - -.edit-post-block-manager__category{ - margin:0 0 24px; -} - -.edit-post-block-manager__category-title{ - background-color:#fff; - padding:16px 0; - position:sticky; - top:-4px; - z-index:1; -} -.edit-post-block-manager__category-title .components-checkbox-control__label{ - font-weight:600; -} - -.edit-post-block-manager__checklist{ - margin-top:0; -} - -.edit-post-block-manager__category-title,.edit-post-block-manager__checklist-item{ - border-bottom:1px solid #ddd; -} - -.edit-post-block-manager__checklist-item{ - align-items:center; - display:flex; - justify-content:space-between; - margin-bottom:0; - padding:8px 0 8px 16px; -} -.components-modal__content .edit-post-block-manager__checklist-item.components-checkbox-control__input-container{ - margin:0 8px; -} -.edit-post-block-manager__checklist-item .block-editor-block-icon{ - fill:#1e1e1e; - margin-right:10px; -} - -.edit-post-block-manager__results{ - border-top:1px solid #ddd; -} - -.edit-post-block-manager__disabled-blocks-count+.edit-post-block-manager__results{ - border-top-width:0; -} - .edit-post-meta-boxes-area{ position:relative; } .edit-post-meta-boxes-area .inside,.edit-post-meta-boxes-area__container{ - box-sizing:content-box; + box-sizing:initial; } .edit-post-meta-boxes-area input,.edit-post-meta-boxes-area textarea{ box-sizing:border-box; @@ -1145,7 +879,7 @@ body.is-fullscreen-mode .edit-post-layout .components-editor-notices__snackbar{ width:44px; } .edit-post-meta-boxes-area.is-loading:before{ - background:transparent; + background:#0000; bottom:0; content:""; left:0; @@ -1177,146 +911,13 @@ body.is-fullscreen-mode .edit-post-layout .components-editor-notices__snackbar{ .edit-post-meta-boxes-area__clear{ clear:both; } -.edit-post-editor__document-overview-panel,.edit-post-editor__inserter-panel{ - display:flex; - flex-direction:column; - height:100%; -} - -@media (min-width:782px){ - .edit-post-editor__document-overview-panel{ - width:350px; - } -} -.edit-post-editor__document-overview-panel .edit-post-editor__document-overview-panel__close-button{ - background:#fff; - position:absolute; - right:8px; - top:6px; - z-index:1; -} -.edit-post-editor__document-overview-panel .components-tab-panel__tabs{ - border-bottom:1px solid #ddd; - box-sizing:border-box; - display:flex; - padding-right:56px; - width:100%; -} -.edit-post-editor__document-overview-panel .components-tab-panel__tabs .edit-post-sidebar__panel-tab{ - margin-bottom:-1px; - width:50%; -} -.edit-post-editor__document-overview-panel .components-tab-panel__tab-content{ - height:calc(100% - 47px); -} - -.edit-post-editor__inserter-panel-header{ - display:flex; - justify-content:flex-end; - padding-right:8px; - padding-top:8px; -} - -.edit-post-editor__inserter-panel-content{ - height:calc(100% - 44px); -} -@media (min-width:782px){ - .edit-post-editor__inserter-panel-content{ - height:100%; - } -} - -.edit-post-editor__list-view-container>.document-outline,.edit-post-editor__list-view-empty-headings,.edit-post-editor__list-view-panel-content{ - height:100%; - overflow:auto; - padding:8px 6px; - scrollbar-color:transparent transparent; - scrollbar-gutter:stable both-edges; - scrollbar-gutter:auto; - scrollbar-width:thin; - will-change:transform; -} -.edit-post-editor__list-view-container>.document-outline::-webkit-scrollbar,.edit-post-editor__list-view-empty-headings::-webkit-scrollbar,.edit-post-editor__list-view-panel-content::-webkit-scrollbar{ - height:12px; - width:12px; -} -.edit-post-editor__list-view-container>.document-outline::-webkit-scrollbar-track,.edit-post-editor__list-view-empty-headings::-webkit-scrollbar-track,.edit-post-editor__list-view-panel-content::-webkit-scrollbar-track{ - background-color:transparent; -} -.edit-post-editor__list-view-container>.document-outline::-webkit-scrollbar-thumb,.edit-post-editor__list-view-empty-headings::-webkit-scrollbar-thumb,.edit-post-editor__list-view-panel-content::-webkit-scrollbar-thumb{ - background-clip:padding-box; - background-color:transparent; - border:3px solid transparent; - border-radius:8px; -} -.edit-post-editor__list-view-container>.document-outline:focus-within::-webkit-scrollbar-thumb,.edit-post-editor__list-view-container>.document-outline:focus::-webkit-scrollbar-thumb,.edit-post-editor__list-view-container>.document-outline:hover::-webkit-scrollbar-thumb,.edit-post-editor__list-view-empty-headings:focus-within::-webkit-scrollbar-thumb,.edit-post-editor__list-view-empty-headings:focus::-webkit-scrollbar-thumb,.edit-post-editor__list-view-empty-headings:hover::-webkit-scrollbar-thumb,.edit-post-editor__list-view-panel-content:focus-within::-webkit-scrollbar-thumb,.edit-post-editor__list-view-panel-content:focus::-webkit-scrollbar-thumb,.edit-post-editor__list-view-panel-content:hover::-webkit-scrollbar-thumb{ - background-color:#949494; -} -.edit-post-editor__list-view-container>.document-outline:focus,.edit-post-editor__list-view-container>.document-outline:focus-within,.edit-post-editor__list-view-container>.document-outline:hover,.edit-post-editor__list-view-empty-headings:focus,.edit-post-editor__list-view-empty-headings:focus-within,.edit-post-editor__list-view-empty-headings:hover,.edit-post-editor__list-view-panel-content:focus,.edit-post-editor__list-view-panel-content:focus-within,.edit-post-editor__list-view-panel-content:hover{ - scrollbar-color:#949494 transparent; -} -@media (hover:none){ - .edit-post-editor__list-view-container>.document-outline,.edit-post-editor__list-view-empty-headings,.edit-post-editor__list-view-panel-content{ - scrollbar-color:#949494 transparent; - } -} - -.edit-post-editor__list-view-empty-headings{ - color:#757575; - text-align:center; -} -.edit-post-editor__list-view-empty-headings>svg{ - margin-top:28px; -} -.edit-post-editor__list-view-empty-headings>p{ - padding-left:32px; - padding-right:32px; -} - -.edit-post-editor__list-view-overview{ - border-bottom:1px solid #ddd; - display:flex; - flex-direction:column; - gap:8px; - padding:16px; -} -.edit-post-editor__list-view-overview>div>span:first-child{ - display:inline-block; - width:90px; -} -.edit-post-editor__list-view-overview>div>span{ - color:#757575; - font-size:12px; - line-height:1.4; -} - -.edit-post-editor__list-view-container{ - display:flex; - flex-direction:column; - height:100%; -} - -.edit-post-editor__document-overview-panel__tab-panel{ - height:100%; -} .components-panel__header.edit-post-sidebar__panel-tabs{ - border-top:0; - justify-content:flex-start; - margin-top:0; padding-left:0; padding-right:16px; } -.components-panel__header.edit-post-sidebar__panel-tabs ul{ - display:flex; -} -.components-panel__header.edit-post-sidebar__panel-tabs li{ - margin:0; -} .components-panel__header.edit-post-sidebar__panel-tabs .components-button.has-icon{ - display:none; height:24px; - margin:0 0 0 auto; min-width:24px; padding:0; } @@ -1326,197 +927,21 @@ body.is-fullscreen-mode .edit-post-layout .components-editor-notices__snackbar{ } } -.components-panel__body.is-opened.edit-post-last-revision__panel{ - height:48px; - padding:0; -} - -.editor-post-last-revision__title.components-button{ - padding:16px; -} - -.edit-post-post-author,.edit-post-post-format{ - align-items:stretch; - display:flex; - flex-direction:column; -} - -.edit-post-post-schedule{ - align-items:flex-start; - justify-content:flex-start; - position:relative; - width:100%; -} -.edit-post-post-schedule span{ - display:block; - flex-shrink:0; - padding:6px 0; - width:45%; -} - -.components-button.edit-post-post-schedule__toggle{ - height:auto; - text-align:left; - white-space:normal; -} -.components-button.edit-post-post-schedule__toggle span{ - width:0; -} - -.edit-post-post-schedule__dialog .block-editor-publish-date-time-picker{ - margin:8px; +.edit-post-sidebar__panel{ + margin-top:-1px; } -.edit-post-post-slug{ +.edit-post-post-format,.edit-post-post-slug{ align-items:stretch; display:flex; flex-direction:column; } -.edit-post-post-status .edit-post-post-publish-dropdown__switch-to-draft{ - margin-top:15px; - text-align:center; - width:100%; -} - -.edit-post-post-template{ - justify-content:flex-start; - width:100%; -} -.edit-post-post-template span{ - display:block; - padding:6px 0; - width:45%; -} - -.edit-post-post-template__dropdown{ - max-width:55%; -} - -.components-button.edit-post-post-template__toggle{ - display:inline-block; - overflow:hidden; - text-overflow:ellipsis; - width:100%; -} - -.edit-post-post-template__dialog{ - z-index:99999; -} - -.edit-post-post-template__form{ - margin:8px; - min-width:248px; -} - -@media (min-width:782px){ - .edit-post-post-template__create-form{ - width:320px; - } -} - -.edit-post-post-url{ - align-items:flex-start; - justify-content:flex-start; - width:100%; -} -.edit-post-post-url span{ - display:block; - flex-shrink:0; - padding:6px 0; - width:45%; -} - -.components-button.edit-post-post-url__toggle{ - height:auto; - text-align:left; - white-space:normal; - word-break:break-word; -} - -.edit-post-post-url__dialog .editor-post-url{ - margin:8px; - min-width:248px; -} - -.edit-post-post-visibility{ - justify-content:flex-start; - width:100%; -} -.edit-post-post-visibility span{ - display:block; - padding:6px 0; - width:45%; -} - .edit-post-post-visibility__dialog .editor-post-visibility{ margin:8px; min-width:248px; } -.components-button.edit-post-sidebar__panel-tab{ - background:transparent; - border:none; - border-radius:0; - box-shadow:none; - cursor:pointer; - font-weight:500; - height:48px; - margin-left:0; - padding:3px 16px; - position:relative; -} -.components-button.edit-post-sidebar__panel-tab:focus:not(:disabled){ - box-shadow:none; - outline:none; - position:relative; -} -.components-button.edit-post-sidebar__panel-tab:after{ - background:var(--wp-admin-theme-color); - border-radius:0; - bottom:0; - content:""; - height:calc(var(--wp-admin-border-width-focus)*0); - left:0; - pointer-events:none; - position:absolute; - right:0; - transition:all .1s linear; -} -@media (prefers-reduced-motion:reduce){ - .components-button.edit-post-sidebar__panel-tab:after{ - transition-delay:0s; - transition-duration:0s; - } -} -.components-button.edit-post-sidebar__panel-tab.is-active:after{ - height:calc(var(--wp-admin-border-width-focus)*1); - outline:2px solid transparent; - outline-offset:-1px; -} -.components-button.edit-post-sidebar__panel-tab:before{ - border-radius:2px; - bottom:12px; - box-shadow:0 0 0 0 transparent; - content:""; - left:12px; - pointer-events:none; - position:absolute; - right:12px; - top:12px; - transition:all .1s linear; -} -@media (prefers-reduced-motion:reduce){ - .components-button.edit-post-sidebar__panel-tab:before{ - transition-delay:0s; - transition-duration:0s; - } -} -.components-button.edit-post-sidebar__panel-tab:focus-visible:before{ - box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); - outline:2px solid transparent; -} - h2.edit-post-template-summary__title{ font-weight:500; line-height:24px; @@ -1529,8 +954,9 @@ h2.edit-post-template-summary__title{ position:relative; width:100%; } -.edit-post-text-editor .editor-post-title{ +.edit-post-text-editor .editor-post-title.is-raw-text textarea,.edit-post-text-editor .editor-post-title:not(.is-raw-text){ border:1px solid #949494; + border-radius:0; font-family:Menlo,Consolas,monaco,monospace; font-size:2.5em; font-weight:400; @@ -1539,11 +965,11 @@ h2.edit-post-template-summary__title{ padding:16px; } @media (min-width:600px){ - .edit-post-text-editor .editor-post-title{ + .edit-post-text-editor .editor-post-title.is-raw-text textarea,.edit-post-text-editor .editor-post-title:not(.is-raw-text){ padding:24px; } } -.edit-post-text-editor .editor-post-title:focus{ +.edit-post-text-editor .editor-post-title.is-raw-text textarea:focus,.edit-post-text-editor .editor-post-title:not(.is-raw-text):focus{ border-color:var(--wp-admin-theme-color); box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); } @@ -1562,7 +988,7 @@ h2.edit-post-template-summary__title{ } .edit-post-text-editor__toolbar{ - background:hsla(0,0%,100%,.8); + background:#fffc; display:flex; left:0; padding:4px 12px; @@ -1587,12 +1013,9 @@ h2.edit-post-template-summary__title{ line-height:36px; margin:0 auto 0 0; } -.edit-post-text-editor__toolbar .components-button svg{ - order:1; -} .edit-post-visual-editor{ - background-color:#1e1e1e; + background-color:#ddd; display:flex; flex:1 0 auto; flex-flow:column; @@ -1606,19 +1029,10 @@ h2.edit-post-template-summary__title{ font-size:13px; padding:6px 12px; } -.edit-post-visual-editor .components-button.has-icon,.edit-post-visual-editor .components-button.is-tertiary{ +.edit-post-visual-editor .components-button.has-icon{ padding:6px; } -.edit-post-visual-editor__post-title-wrapper{ - margin-bottom:var(--wp--style--block-gap); - margin-top:4rem; -} -.edit-post-visual-editor__post-title-wrapper .editor-post-title{ - margin-left:auto; - margin-right:auto; -} - .edit-post-visual-editor__content-area{ box-sizing:border-box; display:flex; @@ -1628,83 +1042,6 @@ h2.edit-post-template-summary__title{ width:100%; } -.edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - left:0; -} -@media (min-width:783px){ - .edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - left:160px; - } -} -@media (min-width:783px){ - .auto-fold .edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - left:36px; - } -} -@media (min-width:961px){ - .auto-fold .edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - left:160px; - } -} -.folded .edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - left:0; -} -@media (min-width:783px){ - .folded .edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - left:36px; - } -} - -body.is-fullscreen-mode .edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - left:0 !important; -} - -.edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - display:block; - position:sticky; - top:0; - width:100%; - z-index:31; -} -@media (min-width:782px){ - .edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - align-items:center; - border-bottom:none; - display:flex; - height:60px; - margin-left:180px; - min-height:auto; - position:fixed; - top:32px; - width:calc(100% - 180px); - } - .edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed.is-collapsed,.edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed:empty{ - width:auto; - } - .is-fullscreen-mode .edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - margin-left:240px; - top:0; - } - .is-fullscreen-mode .edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed.is-collapsed,.is-fullscreen-mode .edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed:empty{ - width:auto; - } - .show-icon-labels .edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - margin-left:80px; - width:calc(100% - 140px); - } - .is-fullscreen-mode .show-icon-labels .edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - margin-left:144px; - } -} -@media (min-width:960px){ - .edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed,.show-icon-labels .edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - width:auto; - } - .is-fullscreen-mode .edit-post-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - width:calc(100% - 536px); - } -} - .edit-post-welcome-guide,.edit-template-welcome-guide{ width:312px; } @@ -1804,10 +1141,10 @@ body.js.block-editor-page .media-frame select.attachment-filters:last-of-type{ } } -.components-modal__frame,.components-popover,.edit-post-editor__inserter-panel,.edit-post-header,.edit-post-sidebar,.edit-post-text-editor,.editor-post-publish-panel{ +.components-modal__frame,.edit-post-header,.edit-post-sidebar,.edit-post-text-editor,.editor-post-publish-panel{ box-sizing:border-box; } -.components-modal__frame *,.components-modal__frame :after,.components-modal__frame :before,.components-popover *,.components-popover :after,.components-popover :before,.edit-post-editor__inserter-panel *,.edit-post-editor__inserter-panel :after,.edit-post-editor__inserter-panel :before,.edit-post-header *,.edit-post-header :after,.edit-post-header :before,.edit-post-sidebar *,.edit-post-sidebar :after,.edit-post-sidebar :before,.edit-post-text-editor *,.edit-post-text-editor :after,.edit-post-text-editor :before,.editor-post-publish-panel *,.editor-post-publish-panel :after,.editor-post-publish-panel :before{ +.components-modal__frame *,.components-modal__frame :after,.components-modal__frame :before,.edit-post-header *,.edit-post-header :after,.edit-post-header :before,.edit-post-sidebar *,.edit-post-sidebar :after,.edit-post-sidebar :before,.edit-post-text-editor *,.edit-post-text-editor :after,.edit-post-text-editor :before,.editor-post-publish-panel *,.editor-post-publish-panel :after,.editor-post-publish-panel :before{ box-sizing:inherit; } |