diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-17 07:57:26 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-17 07:57:26 +0000 |
commit | 30883c26bdceb9eaf32c8d4a1b0c1bce223b5226 (patch) | |
tree | 39a02e2aeb21ab5b7923c6f5757d66d55b708912 /wp-includes/css/dist/edit-site/style.css | |
parent | Adding upstream version 6.4.3+dfsg1. (diff) | |
download | wordpress-30883c26bdceb9eaf32c8d4a1b0c1bce223b5226.tar.xz wordpress-30883c26bdceb9eaf32c8d4a1b0c1bce223b5226.zip |
Adding upstream version 6.5+dfsg1.upstream/6.5+dfsg1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'wp-includes/css/dist/edit-site/style.css')
-rw-r--r-- | wp-includes/css/dist/edit-site/style.css | 2013 |
1 files changed, 1224 insertions, 789 deletions
diff --git a/wp-includes/css/dist/edit-site/style.css b/wp-includes/css/dist/edit-site/style.css index 0de7160..d7d01e0 100644 --- a/wp-includes/css/dist/edit-site/style.css +++ b/wp-includes/css/dist/edit-site/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,628 @@ 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; - } + +.dataviews-wrapper{ + box-sizing:border-box; + height:100%; + overflow:auto; + scroll-padding-bottom:64px; + width:100%; } -@media (min-width:960px){ - .interface-preferences-modal{ - height:70%; - } + +.dataviews-filters__view-actions{ + flex-shrink:0; + left:0; + margin-bottom:12px; + padding:12px 32px 0; + position:sticky; } -@media (max-width:781px){ - .interface-preferences-modal .components-modal__content{ - padding:0; - } +.dataviews-filters__view-actions .components-search-control .components-base-control__field{ + max-width:240px; } -.interface-preferences__tabs .components-tab-panel__tabs{ - left:16px; - position:absolute; - top:84px; - width:160px; +.dataviews-filters__container{ + padding-right:32px; } -.interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item{ - border-radius:2px; + +.dataviews-filters-button{ + position:relative; +} + +.dataviews-pagination{ + background-color:#fff; + border-top:1px solid #f0f0f0; + bottom:0; + color:#757575; + flex-shrink:0; + left:0; + padding:12px 32px; + position:sticky; +} + +.dataviews-pagination__page-selection{ + color:#1e1e1e; + font-size:11px; + font-weight:500; + text-transform:uppercase; +} + +.dataviews-filters-options{ + margin:32px 0 16px; +} + +.dataviews-view-table-wrapper{ + overflow-x:auto; +} + +.dataviews-view-table{ + border-collapse:collapse; + border-color:inherit; + color:#757575; + position:relative; + text-indent:0; + width:100%; +} +.dataviews-view-table a{ + color:#1e1e1e; + font-weight:500; + text-decoration:none; +} +.dataviews-view-table th{ + color:var(--wp-components-color-foreground, #1e1e1e); + font-size:13px; font-weight:400; + text-align:left; } -.interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item.is-active{ - background:#f0f0f0; - box-shadow:none; +.dataviews-view-table td,.dataviews-view-table th{ + padding:12px; + white-space:nowrap; +} +.dataviews-view-table td[data-field-id=actions],.dataviews-view-table th[data-field-id=actions]{ + text-align:right; +} +.dataviews-view-table td.dataviews-view-table__checkbox-column,.dataviews-view-table th.dataviews-view-table__checkbox-column{ + padding-right:0; +} +.dataviews-view-table td .components-checkbox-control__input-container,.dataviews-view-table th .components-checkbox-control__input-container{ + margin:4px; +} +.dataviews-view-table tr{ + border-bottom:1px solid #f0f0f0; +} +.dataviews-view-table tr .dataviews-view-table-header-button{ + gap:4px; +} +.dataviews-view-table tr td:first-child,.dataviews-view-table tr th:first-child{ + padding-left:32px; +} +.dataviews-view-table tr td:first-child .dataviews-view-table-header,.dataviews-view-table tr td:first-child .dataviews-view-table-header-button,.dataviews-view-table tr th:first-child .dataviews-view-table-header,.dataviews-view-table tr th:first-child .dataviews-view-table-header-button{ + margin-left:-8px; +} +.dataviews-view-table tr td:last-child,.dataviews-view-table tr th:last-child{ + padding-right:32px; +} +.dataviews-view-table tr:last-child{ + border-bottom:0; +} +.dataviews-view-table tr:hover{ + background-color:#f8f8f8; +} +.dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input{ + opacity:0; +} +.dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input:checked,.dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input:focus,.dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input:indeterminate,.dataviews-view-table tr:focus-within .components-checkbox-control__input,.dataviews-view-table tr:hover .components-checkbox-control__input{ + opacity:1; +} +.dataviews-view-table tr.is-selected{ + background-color:rgba(var(--wp-admin-theme-color--rgb), .04); + color:#757575; +} +.dataviews-view-table tr.is-selected:hover{ + background-color:rgba(var(--wp-admin-theme-color--rgb), .08); +} +.dataviews-view-table thead{ + inset-block-start:0; + position:sticky; + z-index:1; +} +.dataviews-view-table thead tr{ + border:0; +} +.dataviews-view-table thead th{ + background-color:#fff; + box-shadow:inset 0 -1px 0 #f0f0f0; + font-size:11px; font-weight:500; + padding-bottom:8px; + padding-left:4px; + padding-top:8px; + text-transform:uppercase; } -.interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item.is-active:after{ - content:none; +.dataviews-view-table tbody td{ + vertical-align:top; } -.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; +.dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper{ + align-items:center; + display:flex; + min-height:32px; } -.interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item:focus-visible:before{ - content:none; +.dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper>*{ + flex-grow:1; +} +.dataviews-view-table .dataviews-view-table-header-button{ + font-size:11px; + font-weight:500; + padding:4px 8px; + text-transform:uppercase; } -.interface-preferences__tabs .components-tab-panel__tab-content{ - margin-left:160px; - padding-left:24px; +.dataviews-view-table .dataviews-view-table-header-button:not(:hover){ + color:#1e1e1e; +} +.dataviews-view-table .dataviews-view-table-header-button span{ + speak:none; +} +.dataviews-view-table .dataviews-view-table-header-button span:empty{ + display:none; +} +.dataviews-view-table .dataviews-view-table-header{ + padding-left:4px; +} +.dataviews-view-table .dataviews-view-table__actions-column{ + width:1%; +} +.dataviews-view-table:has(tr.is-selected) .components-checkbox-control__input{ + opacity:1; } -@media (max-width:781px){ - .interface-preferences__provider{ - height:100%; +.dataviews-view-grid__primary-field,.dataviews-view-list__primary-field,.dataviews-view-table__primary-field{ + color:#1e1e1e; + display:block; + font-size:13px; + font-weight:500; + text-overflow:ellipsis; + white-space:nowrap; + width:100%; +} +.dataviews-view-grid__primary-field a,.dataviews-view-list__primary-field a,.dataviews-view-table__primary-field a{ + color:inherit; + display:block; + overflow:hidden; + text-decoration:none; + text-overflow:ellipsis; + white-space:nowrap; + width:100%; +} +.dataviews-view-grid__primary-field a:hover,.dataviews-view-list__primary-field a:hover,.dataviews-view-table__primary-field a:hover{ + color:#1e1e1e; +} +.dataviews-view-grid__primary-field a:focus,.dataviews-view-list__primary-field a:focus,.dataviews-view-table__primary-field a:focus{ + border-radius:2px; + box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color, #007cba); + color:var(--wp-admin-theme-color--rgb); +} +.dataviews-view-grid__primary-field button.components-button.is-link,.dataviews-view-list__primary-field button.components-button.is-link,.dataviews-view-table__primary-field button.components-button.is-link{ + color:inherit; + display:block; + font-weight:inherit; + overflow:hidden; + text-decoration:none; + text-overflow:ellipsis; + white-space:nowrap; + width:100%; +} + +.dataviews-view-grid{ + grid-template-columns:repeat(2, minmax(0, 1fr)) !important; + grid-template-rows:max-content; + margin-bottom:24px; + padding:0 32px; +} +@media (min-width:1080px){ + .dataviews-view-grid{ + grid-template-columns:repeat(3, minmax(0, 1fr)) !important; } } -.interface-preferences-modal__section{ - margin:0 0 2.5rem; +@media (min-width:1440px){ + .dataviews-view-grid{ + grid-template-columns:repeat(4, minmax(0, 1fr)) !important; + } +} +.dataviews-view-grid .dataviews-view-grid__card{ + border:1px solid #e0e0e0; + border-radius:4px; + height:100%; + justify-content:flex-start; +} +.dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__title-actions{ + padding:4px 8px 4px 4px; +} +.dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__primary-field{ + min-height:40px; +} +.dataviews-view-grid .dataviews-view-grid__card.is-selected{ + background-color:rgba(var(--wp-admin-theme-color--rgb), .04); + border-color:var(--wp-admin-theme-color); +} +.dataviews-view-grid .dataviews-view-grid__card.is-selected .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value{ + color:#1e1e1e; +} +.dataviews-view-grid .dataviews-view-grid__media{ + aspect-ratio:1/1; + background-color:#f0f0f0; + border-bottom:1px solid #e0e0e0; + border-radius:3px 3px 0 0; + min-height:200px; + width:100%; } -.interface-preferences-modal__section:last-child{ +.dataviews-view-grid .dataviews-view-grid__media img{ + height:100%; + object-fit:cover; + width:100%; +} +.dataviews-view-grid .dataviews-view-grid__fields{ + font-size:12px; + line-height:16px; + position:relative; +} +.dataviews-view-grid .dataviews-view-grid__fields:not(:empty){ + padding:0 12px 12px; +} +.dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value{ + color:#757575; +} + +.dataviews-view-list{ margin:0; + padding:8px; +} +.dataviews-view-list li{ + margin:0; +} +.dataviews-view-list li .dataviews-view-list__item-wrapper{ + border-radius:4px; + padding-right:24px; + position:relative; +} +.dataviews-view-list li .dataviews-view-list__item-wrapper:after{ + background:#f0f0f0; + content:""; + height:1px; + left:24px; + position:absolute; + right:24px; + top:100%; +} +.dataviews-view-list li:not(.is-selected):hover,.dataviews-view-list li:not(.is-selected):hover .dataviews-view-list__fields,.dataviews-view-list li:not(.is-selected):hover .dataviews-view-list__primary-field{ + color:var(--wp-admin-theme-color); +} +.dataviews-view-list li.is-selected .dataviews-view-list__item-wrapper,.dataviews-view-list li.is-selected:focus-within .dataviews-view-list__item-wrapper{ + background-color:var(--wp-admin-theme-color); + color:#fff; +} +.dataviews-view-list li.is-selected .dataviews-view-list__item-wrapper .components-button,.dataviews-view-list li.is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__fields,.dataviews-view-list li.is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__primary-field,.dataviews-view-list li.is-selected:focus-within .dataviews-view-list__item-wrapper .components-button,.dataviews-view-list li.is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__fields,.dataviews-view-list li.is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__primary-field{ + color:#fff; +} +.dataviews-view-list li.is-selected .dataviews-view-list__item-wrapper:after,.dataviews-view-list li.is-selected:focus-within .dataviews-view-list__item-wrapper:after{ + background:#0000; +} +.dataviews-view-list .dataviews-view-list__item{ + cursor:pointer; + padding:12px 0 12px 24px; + width:100%; +} +.dataviews-view-list .dataviews-view-list__item:focus:before{ + border-radius:4px; + bottom:-1px; + box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); + content:""; + left:-1px; + position:absolute; + right:-1px; + top:-1px; + z-index:-1; +} +.dataviews-view-list .dataviews-view-list__item .dataviews-view-list__primary-field{ + min-height:20px; +} +.dataviews-view-list .dataviews-view-list__media-wrapper{ + background-color:#f0f0f0; + border-radius:4px; + flex-shrink:0; + height:40px; + overflow:hidden; + position:relative; + width:40px; +} +.dataviews-view-list .dataviews-view-list__media-wrapper img{ + height:100%; + object-fit:cover; + width:100%; +} +.dataviews-view-list .dataviews-view-list__media-wrapper:after{ + border-radius:4px; + box-shadow:inset 0 0 0 1px #0000001a; + content:""; + height:100%; + left:0; + position:absolute; + top:0; + width:100%; +} +.dataviews-view-list .dataviews-view-list__media-placeholder{ + background-color:#e0e0e0; + height:32px; + min-width:32px; +} +.dataviews-view-list .dataviews-view-list__fields{ + color:#757575; + display:flex; + flex-wrap:wrap; + font-size:12px; + gap:8px; + line-height:16px; +} +.dataviews-view-list .dataviews-view-list__fields .dataviews-view-list__field:empty{ + display:none; +} +.dataviews-view-list+.dataviews-pagination{ + justify-content:space-between; +} +.dataviews-view-list .dataviews-view-list__details-button{ + align-self:center; + opacity:0; +} +.dataviews-view-list li.is-selected .dataviews-view-list__details-button,.dataviews-view-list li:focus-within .dataviews-view-list__details-button,.dataviews-view-list li:hover .dataviews-view-list__details-button{ + opacity:1; +} +.dataviews-view-list li.is-selected .dataviews-view-list__details-button:focus{ + box-shadow:0 0 0 var(--wp-admin-border-width-focus) currentColor; } -.interface-preferences-modal__section-legend{ - margin-bottom:8px; +.dataviews-action-modal{ + z-index:1000001; } -.interface-preferences-modal__section-title{ - font-size:.9rem; - font-weight:600; - margin-top:0; +.dataviews-loading,.dataviews-no-results{ + padding:0 32px; } -.interface-preferences-modal__section-description{ +.dataviews-view-table-selection-checkbox label{ + height:1px; + margin:-1px; + overflow:hidden; + padding:0; + position:absolute; + width:1px; + clip:rect(0, 0, 0, 0); + border:0; + white-space:nowrap; +} + +.dataviews-filters__custom-menu-radio-item-prefix{ + display:block; + width:24px; +} + +.dataviews-bulk-edit-button.components-button{ + flex-shrink:0; +} + +.dataviews-view-grid__title-actions .dataviews-view-table-selection-checkbox{ + margin-left:8px; +} + +.dataviews-view-grid__card.has-no-pointer-events *{ + pointer-events:none; +} + +.dataviews-filter-summary__popover .components-popover__content{ + border-radius:4px; + padding:0; + width:230px; +} + +.dataviews-search-widget-filter-combobox-list{ + border-top:1px solid #e0e0e0; + max-height:184px; + overflow:auto; + padding:4px; +} +.dataviews-search-widget-filter-combobox-list .dataviews-search-widget-filter-combobox-item{ + align-items:center; + border-radius:2px; + box-sizing:border-box; + cursor:default; + display:flex; + gap:8px; + margin-block-end:2px; + padding:8px 12px; +} +.dataviews-search-widget-filter-combobox-list .dataviews-search-widget-filter-combobox-item:last-child{ + margin-block-end:0; +} +.dataviews-search-widget-filter-combobox-list .dataviews-search-widget-filter-combobox-item:focus,.dataviews-search-widget-filter-combobox-list .dataviews-search-widget-filter-combobox-item:hover,.dataviews-search-widget-filter-combobox-list .dataviews-search-widget-filter-combobox-item[data-active-item]{ + background-color:var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9)); + color:#fff; +} +.dataviews-search-widget-filter-combobox-list .dataviews-search-widget-filter-combobox-item:focus .dataviews-search-widget-filter-combobox-item-check,.dataviews-search-widget-filter-combobox-list .dataviews-search-widget-filter-combobox-item:hover .dataviews-search-widget-filter-combobox-item-check,.dataviews-search-widget-filter-combobox-list .dataviews-search-widget-filter-combobox-item[data-active-item] .dataviews-search-widget-filter-combobox-item-check{ + fill:#fff; +} +.dataviews-search-widget-filter-combobox-list .dataviews-search-widget-filter-combobox-item:focus .dataviews-search-widget-filter-combobox-item-description,.dataviews-search-widget-filter-combobox-list .dataviews-search-widget-filter-combobox-item:hover .dataviews-search-widget-filter-combobox-item-description,.dataviews-search-widget-filter-combobox-list .dataviews-search-widget-filter-combobox-item[data-active-item] .dataviews-search-widget-filter-combobox-item-description{ + color:#fff; +} +.dataviews-search-widget-filter-combobox-list .dataviews-search-widget-filter-combobox-item .dataviews-search-widget-filter-combobox-item-check{ + flex-shrink:0; + height:24px; + width:24px; +} +.dataviews-search-widget-filter-combobox-list .dataviews-search-widget-filter-combobox-item .dataviews-search-widget-filter-combobox-item-value [data-user-value]{ + font-weight:600; +} +.dataviews-search-widget-filter-combobox-list .dataviews-search-widget-filter-combobox-item .dataviews-search-widget-filter-combobox-item-description{ color:#757575; + display:block; font-size:12px; - font-style:normal; - margin:-8px 0 8px; + line-height:16px; + overflow:hidden; + text-overflow:ellipsis; } -.interface-preferences-modal__option+.interface-preferences-modal__option{ - margin-top:16px; +.dataviews-search-widget-filter-combobox__wrapper{ + padding:8px; + position:relative; } -.interface-preferences-modal__option .components-base-control__help{ - margin-left:48px; - margin-top:0; +.dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input{ + background:#f0f0f0; + border:none; + border-radius:2px; + box-shadow:0 0 0 #0000; + display:block; + font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif; + font-size:16px; + height:32px; + line-height:normal; + margin-left:0; + margin-right:0; + padding:0 32px 0 8px; + transition:box-shadow .1s linear; + width:100%; +} +@media (prefers-reduced-motion:reduce){ + .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input{ + transition-delay:0s; + transition-duration:0s; + } +} +@media (min-width:600px){ + .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input{ + font-size:13px; + line-height:normal; + } +} +.dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input:focus{ + border-color:var(--wp-admin-theme-color); + box-shadow:0 0 0 .5px var(--wp-admin-theme-color); + outline:2px solid #0000; +} +.dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-webkit-input-placeholder{ + color:#1e1e1e9e; +} +.dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-moz-placeholder{ + color:#1e1e1e9e; + opacity:1; +} +.dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input:-ms-input-placeholder{ + color:#1e1e1e9e; +} +@media (min-width:600px){ + .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input{ + font-size:13px; + } +} +.dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input:focus{ + background:#fff; + box-shadow:inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, #007cba)); +} +.dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::placeholder{ + color:#757575; +} +.dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-webkit-search-cancel-button,.dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-webkit-search-decoration,.dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-webkit-search-results-button,.dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-webkit-search-results-decoration{ + -webkit-appearance:none; +} +.dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__icon{ + align-items:center; + display:flex; + justify-content:center; + position:absolute; + right:12px; + top:50%; + transform:translateY(-50%); + width:24px; +} + +.dataviews-filter-summary__operators-container{ + padding:8px 8px 0; +} +.dataviews-filter-summary__operators-container:empty{ + display:none; +} +.dataviews-filter-summary__operators-container .dataviews-filter-summary__operators-filter-name{ + color:#757575; +} + +.dataviews-filter-summary__chip-container{ + position:relative; + white-space:pre-wrap; +} +.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip{ + align-items:center; + background:#f0f0f0; + border:1px solid #0000; + border-radius:16px; + color:#757575; + cursor:pointer; + display:flex; + height:32px; + padding:0 12px; + position:relative; +} +.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip.has-reset{ + padding-inline-end:28px; +} +.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip:focus-visible,.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip:hover,.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip[aria-expanded=true]{ + background:#e0e0e0; + color:#1e1e1e; +} +.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip.has-values{ + background:rgba(var(--wp-admin-theme-color--rgb), .04); + color:var(--wp-admin-theme-color); +} +.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip.has-values:hover,.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip.has-values[aria-expanded=true]{ + background:rgba(var(--wp-admin-theme-color--rgb), .12); +} +.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip:focus-visible{ + box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); + outline:none; +} +.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip .dataviews-filter-summary__filter-text-name{ + font-weight:500; +} +.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove{ + align-items:center; + background:#0000; + border:0; + border-radius:50%; + cursor:pointer; + display:flex; + height:24px; + justify-content:center; + padding:0; + position:absolute; + right:4px; + top:50%; + transform:translateY(-50%); + width:24px; +} +.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove svg{ + fill:#757575; +} +.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove:focus,.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove:hover{ + background:#e0e0e0; +} +.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove:focus svg,.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove:hover svg{ + fill:#1e1e1e; +} +.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove.has-values svg{ + fill:var(--wp-admin-theme-color); +} +.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove.has-values:hover{ + background:rgba(var(--wp-admin-theme-color--rgb), .08); +} +.dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove:focus-visible{ + box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); + outline:none; } .edit-site-custom-template-modal__contents-wrapper{ @@ -481,14 +1017,6 @@ body.is-fullscreen-mode .interface-interface-skeleton{ height:auto; justify-content:center; } -.edit-site-custom-template-modal .components-search-control input[type=search].components-search-control__input{ - background:#fff; - border:1px solid #ddd; -} -.edit-site-custom-template-modal .components-search-control input[type=search].components-search-control__input:focus{ - border-color:var(--wp-admin-theme-color); - box-shadow:0 0 0 1px var(--wp-admin-theme-color); -} @media (min-width:782px){ .edit-site-custom-template-modal{ width:456px; @@ -496,7 +1024,8 @@ body.is-fullscreen-mode .interface-interface-skeleton{ } @media (min-width:600px){ .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list{ - overflow:scroll; + max-height:224px; + overflow-y:auto; } } .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item{ @@ -550,11 +1079,11 @@ body.is-fullscreen-mode .interface-interface-skeleton{ .edit-site-template-actions-loading-screen-modal{ -webkit-backdrop-filter:none; backdrop-filter:none; - background-color:transparent; + background-color:initial; } .edit-site-template-actions-loading-screen-modal.is-full-screen{ background-color:#fff; - box-shadow:0 0 0 transparent; + box-shadow:0 0 0 #0000; min-height:100%; min-width:100%; } @@ -600,7 +1129,7 @@ body.is-fullscreen-mode .interface-interface-skeleton{ display:flex; flex-direction:column; justify-content:center; - outline:1px solid transparent; + outline:1px solid #0000; padding:32px; } .edit-site-add-new-template__template-list__contents>.components-button span:first-child,.edit-site-custom-template-modal__contents>.components-button span:first-child{ @@ -611,16 +1140,16 @@ body.is-fullscreen-mode .interface-interface-skeleton{ } .edit-site-add-new-template__template-list__contents>.components-button:hover,.edit-site-custom-template-modal__contents>.components-button:hover{ background:rgba(var(--wp-admin-theme-color--rgb), .04); - border-color:transparent; + border-color:#0000; color:var(--wp-admin-theme-color-darker-10); } .edit-site-add-new-template__template-list__contents>.components-button:hover span,.edit-site-custom-template-modal__contents>.components-button:hover span{ color:var(--wp-admin-theme-color); } .edit-site-add-new-template__template-list__contents>.components-button:focus,.edit-site-custom-template-modal__contents>.components-button:focus{ - border-color:transparent; + border-color:#0000; box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); - outline:3px solid transparent; + outline:3px solid #0000; } .edit-site-add-new-template__template-list__contents>.components-button:focus span:first-child,.edit-site-custom-template-modal__contents>.components-button:focus span:first-child{ color:var(--wp-admin-theme-color); @@ -645,13 +1174,13 @@ body.is-fullscreen-mode .interface-interface-skeleton{ padding:6px; } -.edit-site-block-editor__block-list.is-navigation-block{ +.edit-site-editor-canvas__block-list.is-navigation-block{ padding:24px; } .edit-site-visual-editor{ align-items:center; - background-color:#1e1e1e; + background-color:#ddd; display:block; height:100%; overflow:hidden; @@ -663,15 +1192,12 @@ body.is-fullscreen-mode .interface-interface-skeleton{ height:100%; width:100%; } -.edit-site-visual-editor .edit-site-visual-editor__editor-canvas{ - height:100%; -} .edit-site-visual-editor .edit-site-visual-editor__editor-canvas.is-focused{ outline:calc(var(--wp-admin-border-width-focus)*2) solid var(--wp-admin-theme-color); outline-offset:calc(var(--wp-admin-border-width-focus)*-2); } .edit-site-layout.is-full-canvas .edit-site-visual-editor.is-focus-mode{ - padding:48px; + padding:24px; } .edit-site-visual-editor.is-focus-mode .edit-site-visual-editor__editor-canvas{ border-radius:2px; @@ -685,20 +1211,7 @@ body.is-fullscreen-mode .interface-interface-skeleton{ overflow:auto; } .edit-site-visual-editor.is-view-mode{ - box-shadow:0 20px 25px -5px rgba(0,0,0,.8),0 8px 10px -6px rgba(0,0,0,.8); -} -.edit-site-visual-editor.is-view-mode .block-editor-block-contextual-toolbar.is-fixed{ - display:none; -} - -.edit-site-visual-editor__back-button{ - color:#fff; - left:8px; - position:absolute; - top:8px; -} -.edit-site-visual-editor__back-button:active:not([aria-disabled=true]),.edit-site-visual-editor__back-button:focus:not([aria-disabled=true]),.edit-site-visual-editor__back-button:hover{ - color:#f0f0f0; + box-shadow:0 20px 25px -5px #000c,0 8px 10px -6px #000c; } .resizable-editor__drag-handle{ @@ -725,7 +1238,7 @@ body.is-fullscreen-mode .interface-interface-skeleton{ width:24px; } .resizable-editor__drag-handle.is-variation-separator:after{ - background:transparent; + background:#0000; border-radius:0; left:50%; right:0; @@ -776,82 +1289,6 @@ body.is-fullscreen-mode .interface-interface-skeleton{ box-shadow:inset 0 0 0 2px var(--wp-admin-theme-color); } -.edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - left:0; -} -@media (min-width:783px){ - .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - left:160px; - } -} -@media (min-width:783px){ - .auto-fold .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - left:36px; - } -} -@media (min-width:961px){ - .auto-fold .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - left:160px; - } -} -.folded .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - left:0; -} -@media (min-width:783px){ - .folded .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - left:36px; - } -} - -body.is-fullscreen-mode .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - left:0 !important; -} - -.edit-site-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-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - align-items:center; - display:flex; - height:60px; - margin-left:180px; - min-height:auto; - position:fixed; - top:32px; - width:calc(100% - 180px); - } - .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed.is-collapsed,.edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed:empty{ - width:auto; - } - .is-fullscreen-mode .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - margin-left:240px; - top:0; - } - .is-fullscreen-mode .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed.is-collapsed,.is-fullscreen-mode .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed:empty{ - width:auto; - } - .show-icon-labels .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - margin-left:80px; - width:calc(100% - 140px); - } - .is-fullscreen-mode .show-icon-labels .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - margin-left:144px; - } -} -@media (min-width:960px){ - .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed,.show-icon-labels .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - width:auto; - } - .is-fullscreen-mode .edit-site-visual-editor .block-editor-block-contextual-toolbar.is-fixed{ - width:calc(100% - 536px); - } -} - .edit-site-canvas-loader{ align-items:center; animation:edit-site-canvas-loader__fade-in-animation .5s ease .2s; @@ -902,7 +1339,7 @@ body.is-fullscreen-mode .edit-site-visual-editor .block-editor-block-contextual- } } .edit-site-code-editor__toolbar{ - background:hsla(0,0%,100%,.8); + background:#fffc; display:flex; left:0; padding:4px 12px; @@ -927,9 +1364,6 @@ body.is-fullscreen-mode .edit-site-visual-editor .block-editor-block-contextual- line-height:36px; margin:0 auto 0 0; } -.edit-site-code-editor__toolbar .components-button svg{ - order:1; -} textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area{ border:1px solid #949494; @@ -965,14 +1399,14 @@ textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:focus{ position:relative; } textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area::-webkit-input-placeholder{ - color:rgba(30,30,30,.62); + color:#1e1e1e9e; } textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area::-moz-placeholder{ - color:rgba(30,30,30,.62); + color:#1e1e1e9e; opacity:1; } textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:-ms-input-placeholder{ - color:rgba(30,30,30,.62); + color:#1e1e1e9e; } .edit-site-global-styles-preview{ @@ -1018,6 +1452,14 @@ textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:-ms-inp width:24px; } +.edit-site-global-styles-screen-typography__font-variants-count{ + color:#757575; +} + +.edit-site-global-styles-font-families__add-fonts{ + justify-content:center; +} + .edit-site-global-styles-screen-colors{ margin:16px; } @@ -1062,7 +1504,7 @@ textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:-ms-inp .edit-site-global-styles-variations_item .edit-site-global-styles-variations_item-preview{ border-radius:2px; box-shadow:0 0 0 1px #e0e0e0; - outline:1px solid transparent; + outline:1px solid #0000; padding:2px; } .edit-site-global-styles-variations_item.is-active .edit-site-global-styles-variations_item-preview{ @@ -1076,7 +1518,7 @@ textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:-ms-inp box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); } .edit-site-global-styles-variations_item:focus-visible{ - outline:3px solid transparent; + outline:3px solid #0000; outline-offset:0; } @@ -1142,81 +1584,93 @@ textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:-ms-inp fill:currentColor; } -[class][class].edit-site-global-styles-sidebar__revisions-count-badge{ - align-items:center; - background:#2f2f2f; - border-radius:2px; - color:#fff; - display:inline-flex; - justify-content:center; - min-height:24px; - min-width:24px; -} - -.edit-site-global-styles-screen-revisions{ - margin:16px; -} - .edit-site-global-styles-screen-revisions__revisions-list{ + flex-grow:1; list-style:none; - margin:0; + margin:0 16px 16px; } .edit-site-global-styles-screen-revisions__revisions-list li{ - border-left:1px solid #ddd; margin-bottom:0; } .edit-site-global-styles-screen-revisions__revision-item{ - padding:8px 0 8px 12px; + cursor:pointer; + display:flex; + flex-direction:column; position:relative; } -.edit-site-global-styles-screen-revisions__revision-item:first-child{ - padding-top:0; +.edit-site-global-styles-screen-revisions__revision-item:hover{ + background:rgba(var(--wp-admin-theme-color--rgb), .04); } -.edit-site-global-styles-screen-revisions__revision-item:last-child{ - padding-bottom:0; +.edit-site-global-styles-screen-revisions__revision-item:hover .edit-site-global-styles-screen-revisions__date{ + color:var(--wp-admin-theme-color); +} +.edit-site-global-styles-screen-revisions__revision-item:after,.edit-site-global-styles-screen-revisions__revision-item:before{ + content:"\a"; + display:block; + position:absolute; } .edit-site-global-styles-screen-revisions__revision-item:before{ background:#ddd; + border:4px solid #0000; border-radius:50%; - content:"\a"; - display:inline-block; height:8px; - left:0; - position:absolute; - top:50%; + left:17px; + top:18px; transform:translate(-50%, -50%); width:8px; + z-index:1; +} +.edit-site-global-styles-screen-revisions__revision-item.is-selected{ + background:rgba(var(--wp-admin-theme-color--rgb), .04); + border-radius:2px; + color:var(--wp-components-color-accent, var(--wp-admin-theme-color, #007cba)); + outline:3px solid #0000; + outline-offset:-2px; +} +.edit-site-global-styles-screen-revisions__revision-item.is-selected .edit-site-global-styles-screen-revisions__revision-button{ + opacity:1; +} +.edit-site-global-styles-screen-revisions__revision-item.is-selected .edit-site-global-styles-screen-revisions__date{ + color:var(--wp-admin-theme-color); } .edit-site-global-styles-screen-revisions__revision-item.is-selected:before{ background:var(--wp-components-color-accent, var(--wp-admin-theme-color, #007cba)); } - -.edit-site-global-styles-screen-revisions__revision-button{ +.edit-site-global-styles-screen-revisions__revision-item.is-selected .edit-site-global-styles-screen-revisions__applied-text,.edit-site-global-styles-screen-revisions__revision-item.is-selected .edit-site-global-styles-screen-revisions__changes>li,.edit-site-global-styles-screen-revisions__revision-item.is-selected .edit-site-global-styles-screen-revisions__meta{ + color:#1e1e1e; +} +.edit-site-global-styles-screen-revisions__revision-item:after{ + border:.5px solid #ddd; + height:100%; + left:16px; + top:0; + width:0; +} +.edit-site-global-styles-screen-revisions__revision-item:first-child:after{ + top:18px; +} +.edit-site-global-styles-screen-revisions__revision-item:last-child:after{ + height:18px; +} +.edit-site-global-styles-screen-revisions__revision-item .edit-site-global-styles-screen-revisions__revision-button{ display:block; height:auto; - padding:8px 12px; + outline-offset:-2px; + padding:12px 12px 4px 40px; + position:relative; width:100%; -} -.edit-site-global-styles-screen-revisions__revision-button:hover{ - background:rgba(var(--wp-admin-theme-color--rgb), .04); -} -.edit-site-global-styles-screen-revisions__revision-button:hover .edit-site-global-styles-screen-revisions__date{ - color:var(--wp-admin-theme-color); + z-index:1; } -.is-selected .edit-site-global-styles-screen-revisions__revision-button{ - background:rgba(var(--wp-admin-theme-color--rgb), .04); - color:var(--wp-components-color-accent, var(--wp-admin-theme-color, #007cba)); - opacity:1; -} -.is-selected .edit-site-global-styles-screen-revisions__meta{ - color:var(--wp-admin-theme-color); +.edit-site-global-styles-screen-revisions__applied-text,.edit-site-global-styles-screen-revisions__apply-button.is-primary{ + align-self:flex-start; + margin:4px 12px 12px 40px; } -.edit-site-global-styles-screen-revisions__button{ - justify-content:center; - width:100%; +.edit-site-global-styles-screen-revisions__applied-text,.edit-site-global-styles-screen-revisions__changes,.edit-site-global-styles-screen-revisions__meta{ + color:#757575; + font-size:12px; } .edit-site-global-styles-screen-revisions__description{ @@ -1225,18 +1679,24 @@ textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:-ms-inp flex-direction:column; gap:8px; } +.edit-site-global-styles-screen-revisions__description .edit-site-global-styles-screen-revisions__date{ + font-size:12px; + font-weight:600; + text-transform:uppercase; +} .edit-site-global-styles-screen-revisions__meta{ - align-items:center; - color:#757575; + align-items:flex-start; display:flex; - justify-content:space-between; + justify-content:start; + margin-bottom:4px; text-align:left; width:100%; } .edit-site-global-styles-screen-revisions__meta img{ border-radius:100%; height:16px; + margin-right:8px; width:16px; } @@ -1244,6 +1704,56 @@ textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:-ms-inp margin:24px auto !important; } +.edit-site-global-styles-screen-revisions__changes{ + line-height:1.4; + list-style:disc; + margin-left:12px; + text-align:left; +} +.edit-site-global-styles-screen-revisions__changes li{ + margin-bottom:4px; +} + +.edit-site-global-styles-screen-revisions__pagination.edit-site-global-styles-screen-revisions__pagination{ + gap:2px; + justify-content:space-between; +} +.edit-site-global-styles-screen-revisions__pagination.edit-site-global-styles-screen-revisions__pagination .edit-site-pagination__total{ + height:1px; + left:-1000px; + margin:-1px; + overflow:hidden; + position:absolute; +} +.edit-site-global-styles-screen-revisions__pagination.edit-site-global-styles-screen-revisions__pagination .components-text{ + font-size:12px; + will-change:opacity; +} +.edit-site-global-styles-screen-revisions__pagination.edit-site-global-styles-screen-revisions__pagination .components-button.is-tertiary{ + color:#1e1e1e; + font-size:28px; + font-weight:200; + line-height:1.2; + margin-bottom:4px; +} +.edit-site-global-styles-screen-revisions__pagination.edit-site-global-styles-screen-revisions__pagination .components-button.is-tertiary:disabled{ + color:#949494; +} +.edit-site-global-styles-screen-revisions__pagination.edit-site-global-styles-screen-revisions__pagination .components-button.is-tertiary:hover{ + background:#0000; +} + +.edit-site-global-styles-screen-revisions__footer{ + background:#fff; + border-top:1px solid #ddd; + bottom:0; + height:56px; + min-width:100%; + padding:12px; + position:sticky; + z-index:1; +} + .edit-site-header-edit-mode{ align-items:center; background-color:#fff; @@ -1257,8 +1767,17 @@ textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:-ms-inp width:100%; } .edit-site-header-edit-mode .edit-site-header-edit-mode__start{ + align-items:center; border:none; display:flex; + flex-shrink:2; + height:100%; + overflow:hidden; +} +@media (min-width:782px){ + .edit-site-header-edit-mode .edit-site-header-edit-mode__start{ + padding-right:2px; + } } .edit-site-header-edit-mode .edit-site-header-edit-mode__end{ display:flex; @@ -1270,18 +1789,19 @@ textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:-ms-inp flex-grow:1; height:100%; justify-content:center; - margin:0 8px; + margin:0 16px; min-width:0; } .edit-site-header-edit-mode__toolbar{ align-items:center; display:flex; - padding-left:8px; + gap:8px; + padding-left:16px; } -@media (min-width:600px){ +@media (min-width:782px){ .edit-site-header-edit-mode__toolbar{ - padding-left:24px; + padding-left:20px; } } @media (min-width:1280px){ @@ -1289,13 +1809,6 @@ textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:-ms-inp padding-right:8px; } } -.edit-site-header-edit-mode__toolbar .edit-site-header-edit-mode__inserter-toggle{ - height:32px; - margin-right:8px; - min-width:32px; - padding:0; - width:32px; -} .edit-site-header-edit-mode__toolbar .edit-site-header-edit-mode__inserter-toggle svg{ transition:transform .2s cubic-bezier(.165, .84, .44, 1); } @@ -1311,13 +1824,13 @@ textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:-ms-inp .edit-site-header-edit-mode__actions{ align-items:center; display:inline-flex; - gap:4px; + flex-wrap:nowrap; + gap:8px; padding-right:4px; } @media (min-width:600px){ .edit-site-header-edit-mode__actions{ - gap:8px; - padding-right:10px; + padding-right:8px; } } @@ -1329,37 +1842,6 @@ textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:-ms-inp opacity:0; } -.edit-site-header-edit-mode__start{ - border:none; - display:flex; -} -.edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.components-button.has-icon,.edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.components-dropdown>.components-button.has-icon{ - height:36px; - min-width:36px; - padding:6px; -} -.edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.components-button.has-icon.is-pressed,.edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.components-dropdown>.components-button.has-icon.is-pressed{ - background:#1e1e1e; -} -.edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.components-button.has-icon:focus:not(:disabled),.edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.components-dropdown>.components-button.has-icon:focus:not(:disabled){ - 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-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.components-button.has-icon:before,.edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.components-dropdown>.components-button.has-icon:before{ - display:none; -} -.edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.edit-site-header-edit-mode__inserter-toggle.has-icon{ - height:32px; - margin-right:8px; - min-width:32px; - padding:0; - width:32px; -} -.edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>.edit-site-header-edit-mode__inserter-toggle.has-text.has-icon{ - padding:0 8px; - width:auto; -} - .edit-site-header-edit-mode.show-icon-labels .components-button.has-icon{ width:auto; } @@ -1370,10 +1852,10 @@ textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:-ms-inp content:attr(aria-label); } .edit-site-header-edit-mode.show-icon-labels .components-button.has-icon[aria-disabled=true]{ - background-color:transparent; + background-color:initial; } .edit-site-header-edit-mode.show-icon-labels .is-tertiary:active{ - background-color:transparent; + background-color:initial; box-shadow:0 0 0 1.5px var(--wp-admin-theme-color); } .edit-site-header-edit-mode.show-icon-labels .edit-site-save-button__button{ @@ -1387,145 +1869,79 @@ textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:-ms-inp height:36px; padding:0 8px; } -.edit-site-header-edit-mode.show-icon-labels .edit-site-header-edit-mode__start .edit-site-header-edit-mode__toolbar>*+*{ +.edit-site-header-edit-mode.show-icon-labels .block-editor-block-mover{ + border-left:none; +} +.edit-site-header-edit-mode.show-icon-labels .block-editor-block-mover:before{ + background-color:#ddd; + content:""; + height:24px; margin-left:8px; + margin-top:4px; + width:1px; +} +.edit-site-header-edit-mode.show-icon-labels .block-editor-block-mover .block-editor-block-mover__move-button-container:before{ + background:#ddd; + left:calc(50% + 1px); + width:calc(100% - 24px); } -.edit-site-document-actions{ +.has-fixed-toolbar .selected-block-tools-wrapper{ align-items:center; - background:#f0f0f0; - border-radius:4px; display:flex; - height:36px; - justify-content:space-between; - min-width:0; - width:min(100%, 450px); -} -.has-fixed-toolbar .edit-site-document-actions{ - width:min(100%, 380px); -} -.edit-site-document-actions:hover{ - background-color:#e0e0e0; -} -.edit-site-document-actions .components-button{ - border-radius:4px; -} -.edit-site-document-actions .components-button:hover{ - background:#e0e0e0; - color:var(--wp-block-synced-color); -} -@media (min-width:960px){ - .edit-site-document-actions{ - width:min(100%, 450px); - } -} -.edit-site-document-actions.is-synced-entity .edit-site-document-actions__title,.edit-site-document-actions.is-synced-entity .edit-site-document-actions__title h1{ - color:var(--wp-block-synced-color); -} - -.edit-site-document-actions__command{ - color:var(--wp-block-synced-color); - flex-grow:1; - overflow:hidden; -} - -.edit-site-document-actions__title{ - flex-grow:1; + height:60px; overflow:hidden; } -@media (min-width:600px){ - .edit-site-document-actions__title{ - padding-left:32px; - } +.has-fixed-toolbar .selected-block-tools-wrapper .block-editor-block-contextual-toolbar{ + border-bottom:0; + height:100%; } -.edit-site-document-actions__title:hover{ - color:var(--wp-block-synced-color); +.has-fixed-toolbar .selected-block-tools-wrapper .block-editor-block-toolbar{ + height:100%; + padding-top:15px; } -.edit-site-document-actions__title .block-editor-block-icon{ - flex-shrink:0; - min-width:24px; +.has-fixed-toolbar .selected-block-tools-wrapper .block-editor-block-toolbar .components-button:not(.block-editor-block-mover-button){ + height:32px; } -.edit-site-document-actions__title h1{ - max-width:50%; - overflow:hidden; - text-overflow:ellipsis; - white-space:nowrap; +.has-fixed-toolbar .selected-block-tools-wrapper:after{ + background-color:#ddd; + content:""; + height:24px; + margin-left:8px; + width:1px; } -.edit-site-document-actions.is-page .edit-site-document-actions__title,.edit-site-document-actions.is-page .edit-site-document-actions__title h1{ - color:#2f2f2f; +.has-fixed-toolbar .selected-block-tools-wrapper .components-toolbar,.has-fixed-toolbar .selected-block-tools-wrapper .components-toolbar-group{ + border-right:none; } -.edit-site-document-actions.is-animated .edit-site-document-actions__title{ - animation:edit-site-document-actions__slide-in-left .3s; +.has-fixed-toolbar .selected-block-tools-wrapper .components-toolbar-group:after,.has-fixed-toolbar .selected-block-tools-wrapper .components-toolbar:after{ + background-color:#ddd; + content:""; + height:24px; + margin-left:8px; + margin-top:4px; + width:1px; } -@media (prefers-reduced-motion:reduce){ - .edit-site-document-actions.is-animated .edit-site-document-actions__title{ - animation-delay:0s; - animation-duration:1ms; - } +.has-fixed-toolbar .selected-block-tools-wrapper .components-toolbar .components-toolbar-group.components-toolbar-group:after,.has-fixed-toolbar .selected-block-tools-wrapper .components-toolbar-group .components-toolbar-group.components-toolbar-group:after{ + display:none; } -.edit-site-document-actions.is-animated.is-page .edit-site-document-actions__title{ - animation:edit-site-document-actions__slide-in-right .3s; +.has-fixed-toolbar .selected-block-tools-wrapper .block-editor-block-mover.is-horizontal .block-editor-block-mover-button{ + height:32px; + overflow:visible; } -@media (prefers-reduced-motion:reduce){ - .edit-site-document-actions.is-animated.is-page .edit-site-document-actions__title{ - animation-delay:0s; - animation-duration:1ms; +@media (min-width:600px){ + .has-fixed-toolbar .selected-block-tools-wrapper .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container{ + position:relative; + top:-10px; } } - -.edit-site-document-actions__shortcut{ - color:#2f2f2f; +.has-fixed-toolbar .edit-site-header-edit-mode__center.is-collapsed,.has-fixed-toolbar .selected-block-tools-wrapper.is-collapsed{ display:none; - min-width:32px; -} -@media (min-width:600px){ - .edit-site-document-actions__shortcut{ - display:initial; - } } -.edit-site-document-actions__back.components-button.has-icon.has-text{ - color:#757575; - flex-shrink:0; - gap:0; - min-width:36px; - position:absolute; - z-index:1; -} -.edit-site-document-actions__back.components-button.has-icon.has-text:hover{ - background-color:transparent; - color:currentColor; -} -.edit-site-document-actions.is-animated .edit-site-document-actions__back.components-button.has-icon.has-text{ - animation:edit-site-document-actions__slide-in-left .3s; -} -@media (prefers-reduced-motion:reduce){ - .edit-site-document-actions.is-animated .edit-site-document-actions__back.components-button.has-icon.has-text{ - animation-delay:0s; - animation-duration:1ms; - } +.edit-site-header-edit-mode__block-tools-toggle{ + margin-left:2px; } -@keyframes edit-site-document-actions__slide-in-right{ - 0%{ - opacity:0; - transform:translateX(-15%); - } - to{ - opacity:1; - transform:translateX(0); - } -} -@keyframes edit-site-document-actions__slide-in-left{ - 0%{ - opacity:0; - transform:translateX(15%); - } - to{ - opacity:1; - transform:translateX(0); - } -} .edit-site-list-header{ align-items:center; box-sizing:border-box; @@ -1564,7 +1980,7 @@ body.is-fullscreen-mode .edit-site-list-header{ .edit-site .edit-site-list{ background:#fff; border-radius:8px; - box-shadow:0 20px 25px -5px rgba(0,0,0,.8),0 8px 10px -6px rgba(0,0,0,.8); + box-shadow:0 20px 25px -5px #000c,0 8px 10px -6px #000c; flex-grow:1; } .edit-site .edit-site-list .interface-interface-skeleton__editor{ @@ -1661,33 +2077,31 @@ body.is-fullscreen-mode .edit-site-list-header{ } .edit-site-list-added-by__icon{ - align-items:center; - background:#2f2f2f; - border-radius:100%; display:flex; flex-shrink:0; - height:32px; - justify-content:center; - width:32px; + height:24px; + width:24px; } .edit-site-list-added-by__icon svg{ - fill:#fff; + fill:currentColor; } .edit-site-list-added-by__avatar{ - background:#2f2f2f; - border-radius:100%; + align-items:center; + display:flex; flex-shrink:0; - height:32px; + height:24px; + justify-content:center; overflow:hidden; - width:32px; + width:24px; } .edit-site-list-added-by__avatar img{ - height:32px; + border-radius:100%; + height:20px; object-fit:cover; opacity:0; transition:opacity .1s linear; - width:32px; + width:20px; } @media (prefers-reduced-motion:reduce){ .edit-site-list-added-by__avatar img{ @@ -1707,22 +2121,14 @@ body.is-fullscreen-mode .edit-site-list-header{ .edit-site-page{ background:#fff; color:#2f2f2f; - flex-grow:1; - margin:60px 0 0; - overflow:hidden; -} -@media (min-width:782px){ - .edit-site-page{ - border-radius:8px; - margin:24px 24px 24px 0; - } + height:100%; } .edit-site-page-header{ background:#fff; border-bottom:1px solid #f0f0f0; - min-height:60px; - padding:0 32px; + min-height:72px; + padding:16px 32px; position:sticky; top:0; z-index:2; @@ -1742,16 +2148,58 @@ body.is-fullscreen-mode .edit-site-list-header{ display:flex; flex-flow:column; height:100%; - overflow:auto; position:relative; z-index:1; } +.page-pages-preview-field__button{ + background-color:unset; + border:none; + border-radius:3px 3px 0 0; + box-shadow:none; + box-sizing:border-box; + cursor:pointer; + height:100%; + overflow:hidden; + padding:0; + width:100%; +} +.page-pages-preview-field__button:focus-visible{ + box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); + outline:2px solid #0000; +} +.page-pages-preview-field__button.edit-site-page-pages__media-wrapper{ + background-color:#f0f0f0; + border-radius:4px; + display:block; + flex-grow:0 !important; + height:32px; + overflow:hidden; + position:relative; + width:32px; +} +.page-pages-preview-field__button.edit-site-page-pages__media-wrapper .edit-site-page-pages__featured-image{ + height:100%; + object-fit:cover; + width:100%; +} +.page-pages-preview-field__button.edit-site-page-pages__media-wrapper:after{ + border-radius:4px; + box-shadow:inset 0 0 0 1px #0000001a; + content:""; + height:100%; + left:0; + position:absolute; + top:0; + width:100%; +} + .edit-site-patterns{ - background:none; + background:#1e1e1e; border-left:1px solid #2f2f2f; border-radius:0; margin:60px 0 0; + min-height:100%; overflow-x:auto; padding:0; } @@ -1779,12 +2227,10 @@ body.is-fullscreen-mode .edit-site-list-header{ min-width:-moz-fit-content; min-width:fit-content; } -.edit-site-patterns .edit-site-patterns__search input[type=search]{ - background:#2f2f2f; - color:#e0e0e0; - height:40px; +.edit-site-patterns .edit-site-patterns__search{ + --wp-components-color-foreground:#e0e0e0; } -.edit-site-patterns .edit-site-patterns__search input[type=search]:focus{ +.edit-site-patterns .edit-site-patterns__search .components-input-control__container{ background:#2f2f2f; } .edit-site-patterns .edit-site-patterns__search svg{ @@ -1810,28 +2256,6 @@ body.is-fullscreen-mode .edit-site-list-header{ background:#757575; color:#f0f0f0; } -.edit-site-patterns .edit-site-patterns__grid-pagination{ - background:#1e1e1e; - border-top:1px solid #2f2f2f; - bottom:0; - padding:24px 32px; - position:sticky; - z-index:2; -} -.edit-site-patterns .edit-site-patterns__grid-pagination .components-button.is-tertiary{ - background-color:#2f2f2f; - color:#f0f0f0; - height:32px; - justify-content:center; - width:32px; -} -.edit-site-patterns .edit-site-patterns__grid-pagination .components-button.is-tertiary:disabled{ - background:none; - color:#949494; -} -.edit-site-patterns .edit-site-patterns__grid-pagination .components-button.is-tertiary:hover:not(:disabled){ - background-color:#757575; -} .edit-site-patterns__header{ background:#1e1e1e; @@ -1840,6 +2264,9 @@ body.is-fullscreen-mode .edit-site-list-header{ top:0; z-index:2; } +.edit-site-patterns__header .edit-site-patterns__button{ + color:#949494; +} .edit-site-patterns__section{ flex:1; @@ -1889,7 +2316,7 @@ body.is-fullscreen-mode .edit-site-list-header{ } .edit-site-patterns__grid .edit-site-patterns__pattern .edit-site-patterns__preview:focus{ box-shadow:inset 0 0 0 0 #fff, 0 0 0 2px var(--wp-admin-theme-color); - outline:2px solid transparent; + outline:2px solid #0000; } .edit-site-patterns__grid .edit-site-patterns__pattern .edit-site-patterns__preview.is-inactive{ cursor:default; @@ -1935,9 +2362,9 @@ body.is-fullscreen-mode .edit-site-list-header{ color:#fff; } .edit-site-patterns__pattern-title .edit-site-patterns__pattern-icon{ - fill:#fff; background:var(--wp-block-synced-color); border-radius:4px; + fill:#fff; } .edit-site-patterns__pattern-title .edit-site-patterns__pattern-lock-icon{ fill:currentcolor; @@ -1947,6 +2374,170 @@ body.is-fullscreen-mode .edit-site-list-header{ color:#949494; } +.edit-site-patterns__delete-modal{ + width:384px; +} + +.edit-site-patterns__pagination{ + background:#1e1e1e; + border-top:1px solid #2f2f2f; + bottom:0; + color:#f0f0f0; + padding:24px 32px; + position:sticky; + z-index:2; +} +.edit-site-patterns__pagination .components-button.is-tertiary{ + background-color:#2f2f2f; + color:#f0f0f0; +} +.edit-site-patterns__pagination .components-button.is-tertiary:disabled{ + background:none; + color:#949494; +} +.edit-site-patterns__pagination .components-button.is-tertiary:hover:not(:disabled){ + background-color:#757575; +} +.edit-site-page-patterns-dataviews{ + margin-top:60px; +} +@media (min-width:782px){ + .edit-site-page-patterns-dataviews{ + margin-top:0; + } +} +.edit-site-page-patterns-dataviews .page-patterns-preview-field{ + border-radius:3px 3px 0 0; + display:flex; + flex-direction:column; + height:100%; +} +.edit-site-page-patterns-dataviews .page-patterns-preview-field.is-viewtype-grid .block-editor-block-preview__container{ + border-radius:3px 3px 0 0; + height:100%; +} +.edit-site-page-patterns-dataviews .page-patterns-preview-field .page-patterns-preview-field__button{ + background-color:unset; + border:none; + border-radius:3px 3px 0 0; + box-shadow:none; + box-sizing:border-box; + cursor:pointer; + height:100%; + overflow:hidden; + padding:0; +} +.edit-site-page-patterns-dataviews .page-patterns-preview-field .page-patterns-preview-field__button:focus-visible{ + box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); + outline:2px solid #0000; +} +.edit-site-page-patterns-dataviews .edit-site-patterns__pattern-icon{ + fill:var(--wp-block-synced-color); + flex-shrink:0; +} +.edit-site-page-patterns-dataviews .edit-site-patterns__pattern-lock-icon{ + min-width:min-content; +} +.edit-site-page-patterns-dataviews .edit-site-patterns__section-header{ + border-bottom:1px solid #f0f0f0; + min-height:72px; + padding:16px 32px; + position:sticky; + top:0; + z-index:2; +} +.edit-site-page-patterns-dataviews .edit-site-patterns__pattern-title{ + color:inherit; + display:block; + overflow:hidden; + text-overflow:ellipsis; + white-space:nowrap; + width:100%; +} +.edit-site-page-patterns-dataviews .dataviews-pagination{ + z-index:2; +} + +.dataviews-action-modal__duplicate-pattern [role=dialog]>[role=document]{ + width:350px; +} +.dataviews-action-modal__duplicate-pattern .patterns-menu-items__convert-modal-categories{ + position:relative; +} +.dataviews-action-modal__duplicate-pattern .components-form-token-field__suggestions-list:not(:empty){ + background-color:#fff; + border:1px solid var(--wp-admin-theme-color); + border-bottom-left-radius:2px; + border-bottom-right-radius:2px; + box-shadow:0 0 .5px .5px var(--wp-admin-theme-color); + box-sizing:border-box; + left:-1px; + max-height:96px; + min-width:auto; + position:absolute; + width:calc(100% + 2px); + z-index:1; +} + +@media (min-width:600px){ + .dataviews-action-modal__duplicate-template-part .components-modal__frame{ + max-width:500px; + } +} + +.page-templates-preview-field{ + border-radius:3px 3px 0 0; + display:flex; + flex-direction:column; + height:100%; +} +.page-templates-preview-field .page-templates-preview-field__button{ + background-color:unset; + border:none; + border-radius:3px; + box-shadow:none; + box-sizing:border-box; + cursor:pointer; + height:100%; + overflow:hidden; + padding:0; +} +.page-templates-preview-field .page-templates-preview-field__button:focus-visible{ + box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); + outline:2px solid #0000; +} +.page-templates-preview-field.is-viewtype-list .block-editor-block-preview__container{ + height:120px; +} +.page-templates-preview-field.is-viewtype-grid .block-editor-block-preview__container{ + height:auto; +} +.page-templates-preview-field.is-viewtype-grid .page-templates-preview-field__button{ + border-radius:3px 3px 0 0; +} +.page-templates-preview-field.is-viewtype-table{ + border-radius:2px; + position:relative; +} +.page-templates-preview-field.is-viewtype-table:after{ + border-radius:2px; + box-shadow:inset 0 0 0 1px #0000001a; + content:""; + height:100%; + left:0; + position:absolute; + top:0; + width:100%; +} + +.page-templates-description{ + white-space:normal; +} + +.edit-site-page-template-template-parts-dataviews .dataviews-pagination{ + z-index:2; +} + .edit-site-table-wrapper{ padding:32px; width:100%; @@ -2069,46 +2660,14 @@ body.is-fullscreen-mode .edit-site-list-header{ font-size:12px; } -.edit-site-sidebar-fixed-bottom-slot{ - background:#fff; - border-top:1px solid #ddd; - bottom:0; - box-sizing:content-box; - display:flex; - padding:16px; - position:sticky; -} - -.edit-site-swap-template-modal{ - z-index:1000001; +.edit-site-sidebar__panel{ + margin-top:-1px; } .edit-site-page-panels__swap-template__confirm-modal__actions{ margin-top:24px; } -.edit-site-page-panels__swap-template__modal-content .block-editor-block-patterns-list{ - column-count:2; - column-gap:24px; - padding-top:2px; -} -@media (min-width:782px){ - .edit-site-page-panels__swap-template__modal-content .block-editor-block-patterns-list{ - column-count:3; - } -} -@media (min-width:1280px){ - .edit-site-page-panels__swap-template__modal-content .block-editor-block-patterns-list{ - column-count:4; - } -} -.edit-site-page-panels__swap-template__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item{ - break-inside:avoid-column; -} -.edit-site-page-panels__swap-template__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__item:not(:focus):not(:hover) .block-editor-block-preview__container{ - box-shadow:0 0 0 1px #ddd; -} - .edit-site-change-status__content .components-popover__content{ min-width:320px; padding:16px; @@ -2118,17 +2677,13 @@ body.is-fullscreen-mode .edit-site-list-header{ } .edit-site-change-status__content .edit-site-change-status__options label .components-text{ display:block; - margin-left:26px; } .edit-site-change-status__content .edit-site-change-status__password-legend{ margin-bottom:8px; padding:0; } -.edit-site-summary-field .components-dropdown{ - width:70%; -} -.edit-site-summary-field .edit-site-summary-field__trigger{ +.edit-site-summary-field__trigger{ display:block; max-width:100%; overflow:hidden; @@ -2136,31 +2691,13 @@ body.is-fullscreen-mode .edit-site-list-header{ text-overflow:ellipsis; white-space:nowrap; } -.edit-site-summary-field .edit-site-summary-field__label{ - width:30%; -} - -.edit-site-page-panels-edit-template__dropdown .components-popover__content{ - min-width:240px; -} .components-panel__header.edit-site-sidebar-edit-mode__panel-tabs{ - border-top:0; - justify-content:flex-start; - margin-top:0; padding-left:0; padding-right:16px; } -.components-panel__header.edit-site-sidebar-edit-mode__panel-tabs ul{ - display:flex; -} -.components-panel__header.edit-site-sidebar-edit-mode__panel-tabs li{ - margin:0; -} .components-panel__header.edit-site-sidebar-edit-mode__panel-tabs .components-button.has-icon{ - display:none; height:24px; - margin:0 0 0 auto; min-width:24px; padding:0; } @@ -2170,69 +2707,6 @@ body.is-fullscreen-mode .edit-site-list-header{ } } -.components-button.edit-site-sidebar-edit-mode__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-site-sidebar-edit-mode__panel-tab:focus:not(:disabled){ - box-shadow:none; - outline:none; - position:relative; -} -.components-button.edit-site-sidebar-edit-mode__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-site-sidebar-edit-mode__panel-tab:after{ - transition-delay:0s; - transition-duration:0s; - } -} -.components-button.edit-site-sidebar-edit-mode__panel-tab.is-active:after{ - height:calc(var(--wp-admin-border-width-focus)*1); - outline:2px solid transparent; - outline-offset:-1px; -} -.components-button.edit-site-sidebar-edit-mode__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-site-sidebar-edit-mode__panel-tab:before{ - transition-delay:0s; - transition-duration:0s; - } -} -.components-button.edit-site-sidebar-edit-mode__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; -} - .edit-site-sidebar-card{ align-items:flex-start; display:flex; @@ -2246,7 +2720,10 @@ body.is-fullscreen-mode .edit-site-list-header{ line-height:24px; } .edit-site-sidebar-card__title.edit-site-sidebar-card__title{ + font-size:13px; + line-height:1.4; margin:0; + padding:3px 0; } .edit-site-sidebar-card__description{ font-size:13px; @@ -2283,10 +2760,6 @@ body.is-fullscreen-mode .edit-site-list-header{ padding:0; } -.edit-site-template-revisions{ - margin-left:-4px; -} - h3.edit-site-template-card__template-areas-title{ font-weight:500; margin:0 0 8px; @@ -2429,79 +2902,6 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ margin-left:auto; min-width:24px; } -.edit-site-editor__inserter-panel,.edit-site-editor__list-view-panel{ - display:flex; - flex-direction:column; - height:100%; -} - -@media (min-width:782px){ - .edit-site-editor__list-view-panel{ - width:350px; - } -} - -.edit-site-editor__inserter-panel-header{ - display:flex; - justify-content:flex-end; - padding-right:8px; - padding-top:8px; -} - -.edit-site-editor__inserter-panel-content,.edit-site-editor__list-view-panel-content{ - height:calc(100% - 44px); -} - -@media (min-width:782px){ - .edit-site-editor__inserter-panel-content{ - height:100%; - } -} - -.edit-site-editor__list-view-panel-header{ - align-items:center; - border-bottom:1px solid #ddd; - display:flex; - height:48px; - justify-content:space-between; - padding-left:16px; - padding-right:4px; -} - -.edit-site-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-site-editor__list-view-panel-content::-webkit-scrollbar{ - height:12px; - width:12px; -} -.edit-site-editor__list-view-panel-content::-webkit-scrollbar-track{ - background-color:transparent; -} -.edit-site-editor__list-view-panel-content::-webkit-scrollbar-thumb{ - background-clip:padding-box; - background-color:transparent; - border:3px solid transparent; - border-radius:8px; -} -.edit-site-editor__list-view-panel-content:focus-within::-webkit-scrollbar-thumb,.edit-site-editor__list-view-panel-content:focus::-webkit-scrollbar-thumb,.edit-site-editor__list-view-panel-content:hover::-webkit-scrollbar-thumb{ - background-color:#949494; -} -.edit-site-editor__list-view-panel-content:focus,.edit-site-editor__list-view-panel-content:focus-within,.edit-site-editor__list-view-panel-content:hover{ - scrollbar-color:#949494 transparent; -} -@media (hover:none){ - .edit-site-editor__list-view-panel-content{ - scrollbar-color:#949494 transparent; - } -} .edit-site-welcome-guide{ width:312px; @@ -2648,13 +3048,9 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ left:0; position:fixed; top:0; - width:calc(100vw - 48px); + width:calc(100vw - 32px); z-index:3; } -.edit-site-layout.is-full-canvas.is-edit-mode .edit-site-layout__hub{ - padding-right:0; - width:60px; -} @media (min-width:782px){ .edit-site-layout__hub{ width:336px; @@ -2663,14 +3059,8 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ .edit-site-layout.is-full-canvas .edit-site-layout__hub{ border-radius:0; box-shadow:none; - padding-right:16px; - width:100vw; -} -@media (min-width:782px){ - .edit-site-layout.is-full-canvas .edit-site-layout__hub{ - padding-right:0; - width:auto; - } + padding-right:0; + width:60px; } .edit-site-layout__header-container{ @@ -2725,6 +3115,12 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ overflow:hidden; } +.edit-site-layout__mobile{ + position:relative; + width:100%; + z-index:2; +} + .edit-site-layout__canvas-container{ flex-grow:1; position:relative; @@ -2758,9 +3154,9 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ } @media (min-width:782px){ .edit-site-layout__canvas{ - bottom:24px; - top:24px; - width:calc(100% - 24px); + bottom:16px; + top:16px; + width:calc(100% - 16px); } .edit-site-layout:not(.is-full-canvas) .edit-site-layout__canvas>div .edit-site-visual-editor__editor-canvas,.edit-site-layout:not(.is-full-canvas) .edit-site-layout__canvas>div .interface-interface-skeleton__content,.edit-site-layout__canvas>div{ border-radius:8px; @@ -2775,14 +3171,18 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ border-radius:0; } -.edit-site-layout__canvas .interface-interface-skeleton{ +.edit-site-layout__canvas .interface-interface-skeleton,.edit-site-layout__mobile .interface-interface-skeleton,.edit-site-template-pages-preview .interface-interface-skeleton{ min-height:100% !important; position:relative !important; } +.edit-site-template-pages-preview{ + height:100%; +} + .edit-site-layout__view-mode-toggle.components-button{ align-items:center; - border-bottom:1px solid transparent; + border-bottom:1px solid #0000; border-radius:0; color:#fff; display:flex; @@ -2793,7 +3193,7 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ position:relative; width:60px; } -.edit-site-layout.is-full-canvas.is-edit-mode .edit-site-layout__view-mode-toggle.components-button{ +.edit-site-layout.is-full-canvas .edit-site-layout__view-mode-toggle.components-button{ border-bottom-color:#e0e0e0; transition:border-bottom-color .15s ease-out .4s; } @@ -2822,7 +3222,7 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ } } .edit-site-layout__view-mode-toggle.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-site-layout__view-mode-toggle.components-button .edit-site-layout__view-mode-toggle-icon{ align-items:center; @@ -2855,21 +3255,9 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ .edit-site-layout__actions{ border-left:1px solid #ddd; } - .edit-site-layout.has-fixed-toolbar .edit-site-layout__canvas-container{ - z-index:5; - } - .edit-site-layout.has-fixed-toolbar .edit-site-site-hub{ - z-index:4; - } } -@media (min-width:782px){ - .edit-site-layout.has-fixed-toolbar .edit-site-layout__header:focus-within{ - z-index:3; - } -} - -.is-edit-mode.is-distraction-free .edit-site-layout__header-container{ +.edit-site-layout.is-distraction-free .edit-site-layout__header-container{ height:60px; left:0; position:absolute; @@ -2878,33 +3266,45 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ width:100%; z-index:4; } -.is-edit-mode.is-distraction-free .edit-site-layout__header-container:focus-within{ +.edit-site-layout.is-distraction-free .edit-site-layout__header-container:focus-within{ opacity:1 !important; } -.is-edit-mode.is-distraction-free .edit-site-layout__header-container:focus-within div{ +.edit-site-layout.is-distraction-free .edit-site-layout__header-container:focus-within div{ transform:translateX(0) translateY(0) translateZ(0) !important; } -.is-edit-mode.is-distraction-free .edit-site-layout__header-container:focus-within .edit-site-layout__header{ +.edit-site-layout.is-distraction-free .edit-site-layout__header-container:focus-within .edit-site-layout__header{ opacity:1 !important; } -.is-edit-mode.is-distraction-free .edit-site-layout__header,.is-edit-mode.is-distraction-free .edit-site-site-hub{ +.edit-site-layout.is-distraction-free .edit-site-layout__header,.edit-site-layout.is-distraction-free .edit-site-site-hub{ position:absolute; top:0; z-index:2; } -.is-edit-mode.is-distraction-free .edit-site-site-hub{ +.edit-site-layout.is-distraction-free .edit-site-site-hub{ z-index:3; } -.is-edit-mode.is-distraction-free .edit-site-layout__header{ +.edit-site-layout.is-distraction-free .edit-site-layout__header{ width:100%; } +.edit-site-layout__area{ + flex-grow:1; + margin:0; + overflow:hidden; +} +@media (min-width:782px){ + .edit-site-layout__area{ + border-radius:8px; + margin:16px 16px 16px 0; + } +} + .edit-site-save-hub{ border-top:1px solid #2f2f2f; color:#949494; flex-shrink:0; margin:0; - padding:20px 24px; + padding:20px 16px; } .edit-site-save-hub__button{ @@ -2918,6 +3318,9 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ .edit-site-save-hub__button[aria-disabled=true]:hover{ color:inherit; } +.edit-site-save-hub__button:not(.is-primary).is-busy,.edit-site-save-hub__button:not(.is-primary).is-busy[aria-disabled=true]:hover{ + color:#1e1e1e; +} @media (min-width:600px){ .edit-site-save-panel__modal{ @@ -2929,50 +3332,48 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ flex-grow:1; overflow-y:auto; } -.edit-site-sidebar__content .components-navigator-screen{ + +.edit-site-sidebar__screen-wrapper{ display:flex; flex-direction:column; height:100%; - scrollbar-color:transparent transparent; + padding:0 12px; + scrollbar-color:#0000 #0000; scrollbar-gutter:stable both-edges; scrollbar-gutter:stable; scrollbar-width:thin; will-change:transform; } -.edit-site-sidebar__content .components-navigator-screen::-webkit-scrollbar{ +.edit-site-sidebar__screen-wrapper::-webkit-scrollbar{ height:12px; width:12px; } -.edit-site-sidebar__content .components-navigator-screen::-webkit-scrollbar-track{ - background-color:transparent; +.edit-site-sidebar__screen-wrapper::-webkit-scrollbar-track{ + background-color:initial; } -.edit-site-sidebar__content .components-navigator-screen::-webkit-scrollbar-thumb{ +.edit-site-sidebar__screen-wrapper::-webkit-scrollbar-thumb{ background-clip:padding-box; - background-color:transparent; - border:3px solid transparent; + background-color:initial; + border:3px solid #0000; border-radius:8px; } -.edit-site-sidebar__content .components-navigator-screen:focus-within::-webkit-scrollbar-thumb,.edit-site-sidebar__content .components-navigator-screen:focus::-webkit-scrollbar-thumb,.edit-site-sidebar__content .components-navigator-screen:hover::-webkit-scrollbar-thumb{ +.edit-site-sidebar__screen-wrapper:focus-within::-webkit-scrollbar-thumb,.edit-site-sidebar__screen-wrapper:focus::-webkit-scrollbar-thumb,.edit-site-sidebar__screen-wrapper:hover::-webkit-scrollbar-thumb{ background-color:#757575; } -.edit-site-sidebar__content .components-navigator-screen:focus,.edit-site-sidebar__content .components-navigator-screen:focus-within,.edit-site-sidebar__content .components-navigator-screen:hover{ - scrollbar-color:#757575 transparent; +.edit-site-sidebar__screen-wrapper:focus,.edit-site-sidebar__screen-wrapper:focus-within,.edit-site-sidebar__screen-wrapper:hover{ + scrollbar-color:#757575 #0000; } @media (hover:none){ - .edit-site-sidebar__content .components-navigator-screen{ - scrollbar-color:#757575 transparent; + .edit-site-sidebar__screen-wrapper{ + scrollbar-color:#757575 #0000; } } .edit-site-sidebar__footer{ border-top:1px solid #2f2f2f; flex-shrink:0; - margin:0 24px; - padding:24px 0; -} - -.edit-site-sidebar__content>div{ - padding:0 12px; + margin:0 16px; + padding:16px 0; } .edit-site-sidebar-button{ @@ -2985,7 +3386,7 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ } .edit-site-sidebar-button:focus-visible:not(:disabled){ box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, #007cba)); - outline:3px solid transparent; + outline:3px solid #0000; } .edit-site-sidebar-button:focus,.edit-site-sidebar-button:focus-visible,.edit-site-sidebar-button:hover,.edit-site-sidebar-button:not([aria-disabled=true]):active,.edit-site-sidebar-button[aria-expanded=true]{ color:#f0f0f0; @@ -3018,7 +3419,7 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ .edit-site-sidebar-navigation-screen__content .block-editor-list-view-block-select-button{ cursor:grab; - padding:8px; + padding:8px 8px 8px 0; } .edit-site-sidebar-navigation-screen{ @@ -3061,6 +3462,7 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ .edit-site-sidebar-navigation-screen__page-link{ color:#949494; display:inline-block; + word-break:break-word; } .edit-site-sidebar-navigation-screen__page-link:focus,.edit-site-sidebar-navigation-screen__page-link:hover{ color:#fff; @@ -3086,6 +3488,7 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ } .edit-site-sidebar-navigation-screen__actions{ + display:flex; flex-shrink:0; } @@ -3156,8 +3559,8 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ background:none; } .edit-site-sidebar-navigation-screen-details-footer .edit-site-sidebar-navigation-screen-details-footer__icon{ - fill:#949494; margin-left:auto; + fill:#949494; } .sidebar-navigation__more-menu .components-button{ @@ -3217,15 +3620,24 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ display:contents; } .edit-site-sidebar-navigation-screen-page__status svg{ - fill:#f0b849; height:16px; margin-right:8px; width:16px; + fill:#f0b849; } .edit-site-sidebar-navigation-screen-page__status.has-future-status svg,.edit-site-sidebar-navigation-screen-page__status.has-publish-status svg{ fill:#4ab866; } +.edit-site-sidebar-navigation-screen-templates__templates-group-title.components-item{ + border-top:1px solid #2f2f2f; + color:#e0e0e0; + font-size:11px; + font-weight:500; + padding:24px 6px 16px 16px; + text-transform:uppercase; +} + .edit-site-sidebar-navigation-details-screen-panel{ margin:24px 0; } @@ -3309,14 +3721,19 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ } .edit-site-sidebar-navigation-screen-template__added-by-description-author img{ border-radius:12px; + height:20px; + width:20px; } .edit-site-sidebar-navigation-screen-template__added-by-description-author svg{ fill:#949494; } .edit-site-sidebar-navigation-screen-template__added-by-description-author-icon{ + align-items:center; + display:inline-flex; height:24px; - margin-right:8px; + justify-content:center; + margin-right:4px; width:24px; } @@ -3342,6 +3759,31 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ display:flex; } +.edit-site-sidebar-navigation-screen-dataviews__group-header{ + margin-top:32px; +} +.edit-site-sidebar-navigation-screen-dataviews__group-header h2{ + font-size:11px; + font-weight:500; + text-transform:uppercase; +} + +.edit-site-sidebar-dataviews-dataview-item{ + border-radius:2px; + padding-right:8px; +} +.edit-site-sidebar-dataviews-dataview-item .edit-site-sidebar-dataviews-dataview-item__dropdown-menu{ + min-width:auto; +} +.edit-site-sidebar-dataviews-dataview-item:focus,.edit-site-sidebar-dataviews-dataview-item:hover,.edit-site-sidebar-dataviews-dataview-item[aria-current]{ + background:#2f2f2f; + color:#e0e0e0; +} +.edit-site-sidebar-dataviews-dataview-item.is-selected{ + background:var(--wp-admin-theme-color); + color:#fff; +} + .edit-site-site-hub{ align-items:center; display:flex; @@ -3351,31 +3793,19 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ .edit-site-site-hub .edit-site-site-hub__container{ gap:0; } -.edit-site-site-hub .edit-site-site-hub__site-title,.edit-site-site-hub .edit-site-site-hub_toggle-command-center{ +.edit-site-site-hub .edit-site-site-hub__site-title,.edit-site-site-hub .edit-site-site-hub__site-view-link,.edit-site-site-hub .edit-site-site-hub_toggle-command-center{ transition:opacity .1s ease; } -.edit-site-site-hub .edit-site-site-hub__site-title.is-transparent,.edit-site-site-hub .edit-site-site-hub_toggle-command-center.is-transparent{ +.edit-site-site-hub .edit-site-site-hub__site-title.is-transparent,.edit-site-site-hub .edit-site-site-hub__site-view-link.is-transparent,.edit-site-site-hub .edit-site-site-hub_toggle-command-center.is-transparent{ opacity:0 !important; } .edit-site-site-hub .edit-site-site-hub__site-view-link{ flex-grow:0; margin-right:var(--wp-admin-border-width-focus); } -@media (min-width:480px){ - .edit-site-site-hub .edit-site-site-hub__site-view-link{ - opacity:0; - transition:opacity .2s ease-in-out; - } -} -.edit-site-site-hub .edit-site-site-hub__site-view-link:focus{ - opacity:1; -} .edit-site-site-hub .edit-site-site-hub__site-view-link svg{ fill:#e0e0e0; } -.edit-site-site-hub:hover .edit-site-site-hub__site-view-link{ - opacity:1; -} .edit-site-site-hub__post-type{ opacity:.6; @@ -3388,7 +3818,7 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ width:60px; } .edit-site-site-hub__view-mode-toggle-container.has-transparent-background{ - background:transparent; + background:#0000; } .edit-site-site-hub__text-content{ @@ -3404,14 +3834,13 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ .edit-site-site-hub__site-title{ color:#e0e0e0; flex-grow:1; - margin-left:4px; } .edit-site-site-hub_toggle-command-center{ color:#e0e0e0; } -.edit-site-site-hub_toggle-command-center:hover{ - color:#f0f0f0; +.edit-site-site-hub_toggle-command-center:active svg,.edit-site-site-hub_toggle-command-center:hover svg{ + fill:#f0f0f0; } .edit-site-sidebar-navigation-screen__description{ @@ -3429,7 +3858,7 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ margin-left:-8px; } .edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf.is-selected>td{ - background:transparent; + background:#0000; } .edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents{ color:inherit; @@ -3447,7 +3876,7 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ box-shadow:inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); } .edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf.is-branch-selected:not(.is-selected):not(.is-synced-branch){ - background:transparent; + background:#0000; } .edit-site-sidebar-navigation-screen-navigation-menus__content .offcanvas-editor-list-view-leaf.is-branch-selected:not(.is-selected):not(.is-synced-branch):hover{ background:#2f2f2f; @@ -3483,16 +3912,26 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ .edit-site-site-icon__icon{ fill:currentColor; + transition:padding .3s ease-out; +} +@media (prefers-reduced-motion:reduce){ + .edit-site-site-icon__icon{ + transition-delay:0s; + transition-duration:0s; + } +} +.edit-site-layout.is-full-canvas .edit-site-site-icon__icon{ + padding:6px; } .edit-site-site-icon__image{ background:#333; border-radius:4px; - height:auto; + height:100%; object-fit:cover; width:100%; } -.edit-site-layout.is-full-canvas.is-edit-mode .edit-site-site-icon__image{ +.edit-site-layout.is-full-canvas .edit-site-site-icon__image{ border-radius:0; } @@ -3508,11 +3947,11 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar{ outline-offset:calc(var(--wp-admin-border-width-focus)*-2); } -.edit-site-style-book__tab-panel .components-tab-panel__tabs{ +.edit-site-style-book__tabs [role=tablist]{ background:#fff; color:#1e1e1e; } -.edit-site-style-book__tab-panel .components-tab-panel__tab-content{ +.edit-site-style-book__tabs [role=tabpanel]{ bottom:0; left:0; overflow:auto; @@ -3566,7 +4005,7 @@ body:has(.edit-site-resizable-frame__inner.is-resizing){ .edit-site-resizable-frame__handle{ align-items:center; - background-color:hsla(0,0%,46%,.4); + background-color:#75757566; border:0; border-radius:4px; cursor:col-resize; @@ -3594,7 +4033,7 @@ body:has(.edit-site-resizable-frame__inner.is-resizing){ width:32px; } .edit-site-resizable-frame__handle:focus-visible{ - outline:2px solid transparent; + outline:2px solid #0000; } .edit-site-resizable-frame__handle.is-resizing,.edit-site-resizable-frame__handle:focus,.edit-site-resizable-frame__handle:hover{ background-color:var(--wp-admin-theme-color); @@ -3621,13 +4060,16 @@ body:has(.edit-site-resizable-frame__inner.is-resizing){ font-weight:500; text-transform:uppercase; } +.font-library-modal .components-navigator-screen{ + padding:3px; +} -.font-library-modal__tab-layout main{ - padding-bottom:4rem; +.font-library-modal__tabpanel-layout{ + margin-top:32px; } -.font-library-modal__tab-layout footer{ +.font-library-modal__tabpanel-layout .font-library-modal__tabpanel-layout__footer{ background-color:#fff; - border-top:1px solid #e5e5e5; + border-top:1px solid #ddd; bottom:32px; margin:0 -32px -32px; padding:16px 32px; @@ -3635,106 +4077,99 @@ body:has(.edit-site-resizable-frame__inner.is-resizing){ width:100%; } -.font-library-modal__fonts-grid .font-library-modal__fonts-grid__main{ - display:flex; - flex-direction:column; +.font-library-modal__tabpanel-layout .components-base-control__field{ + margin-bottom:0; } .font-library-modal__font-card{ - border:1px solid #e5e5e5; + border:1px solid #e0e0e0; height:auto; margin-top:-1px; - padding:1rem; + padding:16px; + width:100%; +} +.font-library-modal__font-card:hover{ + background-color:#f0f0f0; } .font-library-modal__font-card .font-library-modal__font-card__name{ font-weight:700; } .font-library-modal__font-card .font-library-modal__font-card__count{ - color:#6e6e6e; + color:#757575; } -.font-library-modal__library-font-variant{ - border:1px solid #e5e5e5; - margin-top:-1px; - padding:1rem; +.font-library-modal__font-variant_demo-image{ + display:block; + height:24px; + width:auto; +} + +.font-library-modal__font-variant_demo-text{ + flex-shrink:0; + transition:opacity .3s ease-in-out; + white-space:nowrap; +} +@media (prefers-reduced-motion:reduce){ + .font-library-modal__font-variant_demo-text{ + transition-delay:0s; + transition-duration:0s; + } } .font-library-modal__font-variant{ - border-bottom:1px solid #e5e5e5; - padding-bottom:1rem; + border-bottom:1px solid #e0e0e0; + padding-bottom:16px; } -.font-library-modal__tab-panel [role=tablist]{ +.font-library-modal__tabs [role=tablist]{ background:#fff; - border-bottom:1px solid #e6e6e6; + border-bottom:1px solid #ddd; margin:0 -32px; padding:0 16px; position:sticky; top:0; - width:calc(100% + 64px); z-index:1; } .font-library-modal__upload-area{ align-items:center; - background-color:#f0f0f0; display:flex; - height:250px; + height:256px; justify-content:center; width:100%; } +button.font-library-modal__upload-area{ + background-color:#f0f0f0; +} + .font-library-modal__local-fonts{ margin:0 auto; width:80%; } .font-library-modal__local-fonts .font-library-modal__upload-area__text{ - color:#6e6e6e; -} -.font-library-modal__local-fonts .font-library-modal__upload-area__notice{ - margin:0; -} - -.font-library-modal__font-name{ - font-weight:700; -} - -.font-library-modal__font-filename{ - color:#6e6e6e; -} - -.font-library-modal__font-variant_demo-wrapper{ - overflow:hidden; - position:relative; - white-space:nowrap; - width:100%; -} -.font-library-modal__font-variant_demo-wrapper:after{ - background:linear-gradient(90deg, hsla(0,0%,100%,0), #fff); - bottom:0; - content:""; - height:100%; - position:absolute; - right:0; - width:30vw; + color:#757575; } .font-library__google-fonts-confirm{ align-items:center; display:flex; justify-content:center; + margin-top:64px; } .font-library__google-fonts-confirm h3{ font-size:1.4rem; } .font-library__google-fonts-confirm .components-card{ - max-width:350px; - min-width:250px; + max-width:400px; + min-width:350px; width:50%; } -.font-library-modal__font-collection__notice{ - margin:0; +.edit-site-pagination .components-button.is-tertiary{ + height:32px; + justify-content:center; + width:32px; } body.js #wpadminbar{ |