@wordpress/edit-site 7.3.0 → 7.4.0

package/build-style/style-rtl.css

@@ -242,6 +242,10 @@
   flex-grow: 1;
 }
 
+.dataviews__search .dataviews-search {
+  flex-basis: 210px;
+}
+
 .dataviews-no-results,
 .dataviews-loading {
   padding: 0 var(--wpds-dimension-padding-2xl, 24px);
@@ -513,7 +517,7 @@
 }
 
 .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove svg {
-  fill: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
+  color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
 }
 
 .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus {
@@ -521,11 +525,11 @@
 }
 
 .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover svg, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus svg {
-  fill: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
+  color: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
 }
 
 .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values svg {
-  fill: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
+  color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
 }
 
 .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values:hover {
@@ -589,8 +593,9 @@
 }
 
 .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-multi-selection, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-multi-selection, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-multi-selection {
+  /* stylelint-disable-next-line plugin-wpds/no-token-fallback-values -- Preserve custom background theming with older @wordpress/theme runtimes that do not set this token. */
+  background-color: var(--wpds-color-background-interactive-neutral, var(--wpds-color-background-surface-neutral-strong, #fff));
   border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
-  background: var(--wpds-color-background-surface-neutral-strong, #fff);
 }
 
 .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-multi-selection.is-selected, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-multi-selection.is-selected, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-multi-selection.is-selected {
@@ -738,10 +743,6 @@
   box-shadow: none;
 }
 
-.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection::-moz-placeholder {
-  color: rgba(30, 30, 30, 0.62);
-}
-
 .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection::placeholder {
   color: rgba(30, 30, 30, 0.62);
 }
@@ -799,7 +800,8 @@
 
 .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection {
   position: relative;
-  background: var(--wpds-color-background-interactive-neutral-weak, rgba(0, 0, 0, 0));
+  /* stylelint-disable-next-line plugin-wpds/no-token-fallback-values -- Preserve custom background theming with older @wordpress/theme runtimes that do not set this token. */
+  background: var(--wpds-color-background-interactive-neutral, var(--wpds-color-background-surface-neutral-strong, #fff));
   color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
   margin: 0;
   padding: 0;
@@ -824,7 +826,7 @@
 
 .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection.is-selected svg {
   --checkmark-size: var(--checkbox-size);
-  fill: var(--wpds-color-foreground-interactive-neutral-strong, #f0f0f0);
+  color: var(--wpds-color-foreground-interactive-neutral-strong, #f0f0f0);
   position: absolute;
   right: 50%;
   top: 50%;
@@ -872,10 +874,6 @@
   box-shadow: none;
 }
 
-.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-moz-placeholder {
-  color: rgba(30, 30, 30, 0.62);
-}
-
 .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder {
   color: rgba(30, 30, 30, 0.62);
 }
@@ -900,10 +898,6 @@
   background: var(--wpds-color-background-surface-neutral-strong, #fff);
 }
 
-.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-moz-placeholder {
-  color: var(--wpds-color-foreground-content-neutral-weak, #707070);
-}
-
 .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder {
   color: var(--wpds-color-foreground-content-neutral-weak, #707070);
 }
@@ -950,10 +944,6 @@
   box-sizing: border-box;
 }
 
-.dataviews-search {
-  flex-basis: 210px;
-}
-
 .dataviews-filters__user-input-widget {
   padding: var(--wpds-dimension-padding-lg, 16px);
 }
@@ -1232,7 +1222,6 @@
 
 .dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__title-field--clickable,
 .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card .dataviews-view-grid__title-field--clickable {
-  width: -moz-fit-content;
   width: fit-content;
 }
 
@@ -1268,7 +1257,6 @@
 
 .dataviews-view-grid .dataviews-view-grid__media img,
 .dataviews-view-grid-infinite-scroll .dataviews-view-grid__media img {
-  -o-object-fit: cover;
   object-fit: cover;
   width: 100%;
   height: 100%;
@@ -1304,7 +1292,6 @@
 
 .dataviews-view-grid.has-media-fit-contain .dataviews-view-grid__media img,
 .dataviews-view-grid-infinite-scroll.has-media-fit-contain .dataviews-view-grid__media img {
-  -o-object-fit: contain;
   object-fit: contain;
 }
 
@@ -1470,7 +1457,6 @@ div.dataviews-view-list {
 .dataviews-view-list div[role=row] .dataviews-view-list__item-actions,
 .dataviews-view-list div[role=article] .dataviews-view-list__item-actions {
   display: flex;
-  width: -moz-max-content;
   width: max-content;
   flex: 0 0 auto;
   gap: var(--wpds-dimension-gap-xs, 4px);
@@ -1565,8 +1551,6 @@ div.dataviews-view-list {
   z-index: 1;
   inset: 0;
   scroll-margin: var(--wpds-dimension-gap-sm, 8px) 0;
-  -webkit-appearance: none;
-  -moz-appearance: none;
   appearance: none;
   border: none;
   background: none;
@@ -1611,7 +1595,6 @@ div.dataviews-view-list {
 .dataviews-view-list .dataviews-view-list__media-wrapper img {
   width: 100%;
   height: 100%;
-  -o-object-fit: cover;
   object-fit: cover;
 }
 
@@ -1996,7 +1979,6 @@ div.dataviews-view-list {
 .dataviews-column-primary__media img {
   width: var(--wpds-dimension-size-md, 32px);
   height: var(--wpds-dimension-size-md, 32px);
-  -o-object-fit: cover;
   object-fit: cover;
 }
 
@@ -2077,7 +2059,6 @@ div.dataviews-view-list {
 }
 
 .dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__title-field--clickable {
-  width: -moz-fit-content;
   width: fit-content;
 }
 
@@ -2120,7 +2101,6 @@ div.dataviews-view-list {
 }
 
 .dataviews-view-picker-grid .dataviews-view-picker-grid__media img {
-  -o-object-fit: cover;
   object-fit: cover;
   width: 100%;
   height: 100%;
@@ -2143,7 +2123,6 @@ div.dataviews-view-list {
 }
 
 .dataviews-view-picker-grid.has-media-fit-contain .dataviews-view-picker-grid__media img {
-  -o-object-fit: contain;
   object-fit: contain;
 }
 
@@ -2310,7 +2289,6 @@ div.dataviews-view-list {
 
 .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__primary-actions {
   display: flex;
-  width: -moz-max-content;
   width: max-content;
   flex: 0 0 auto;
 }
@@ -2444,7 +2422,6 @@ div.dataviews-view-list {
   width: 100%;
   height: 100%;
   margin: 0 auto;
-  -o-object-fit: cover;
   object-fit: cover;
   border-radius: 50%;
   box-sizing: border-box;
@@ -2661,7 +2638,6 @@ div.dataviews-view-list {
   width: 100%;
   height: 100%;
   margin: 0 auto;
-  -o-object-fit: cover;
   object-fit: cover;
   border-radius: 50%;
   box-sizing: border-box;
@@ -2718,25 +2694,17 @@ div.dataviews-view-list {
 }
 
 .dataviews-validated-control__wrapper-with-error-delegate:has(input[type=radio]:invalid[data-validity-visible]), .dataviews-validated-control__wrapper-with-error-delegate:has(input:invalid[data-validity-visible]) .components-form-token-field__input-container:not(:has([aria-expanded=true])), .dataviews-validated-control .components-combobox-control__suggestions-container:has(input:invalid[data-validity-visible]):not(:has([aria-expanded=true])), .dataviews-validated-control:has(:is(input, select):invalid[data-validity-visible]) .components-input-control__backdrop {
-  --focus-color: #cc1818;
-}
-
-.dataviews-validated-control:has(:is(input, select):invalid[data-validity-visible]) .components-input-control__backdrop {
-  border-color: #cc1818;
+  --focus-color: var(--wpds-color-stroke-interactive-error, #cc1818);
 }
 
-.dataviews-validated-control .components-combobox-control__suggestions-container:has(input:invalid[data-validity-visible]):not(:has([aria-expanded=true])) {
-  border-color: #cc1818;
+.dataviews-validated-control__wrapper-with-error-delegate:has(input:invalid[data-validity-visible]) .components-form-token-field__input-container:not(:has([aria-expanded=true])), .dataviews-validated-control .components-combobox-control__suggestions-container:has(input:invalid[data-validity-visible]):not(:has([aria-expanded=true])), .dataviews-validated-control:has(:is(input, select):invalid[data-validity-visible]) .components-input-control__backdrop {
+  border-color: var(--wpds-color-stroke-interactive-error, #cc1818);
 }
 
 .dataviews-validated-control__wrapper-with-error-delegate {
   position: relative;
 }
 
-.dataviews-validated-control__wrapper-with-error-delegate:has(input:invalid[data-validity-visible]) .components-form-token-field__input-container:not(:has([aria-expanded=true])) {
-  border-color: #cc1818;
-}
-
 .dataviews-validated-control__error-delegate {
   position: absolute;
   top: 0;
@@ -3130,7 +3098,7 @@ div.dataviews-view-list {
   display: grid;
   align-items: center;
   grid-template-columns: min-content 1fr min-content;
-  grid-gap: 4px 8px;
+  gap: 4px 8px;
   color: #1e1e1e;
 }
 
@@ -3415,9 +3383,7 @@ fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-exp
 fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-thumbnail {
   width: 100%;
   height: 100%;
-  -o-object-fit: cover;
   object-fit: cover;
-  -o-object-position: 50% 50%;
   object-position: 50% 50%;
 }
 
@@ -3479,7 +3445,6 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
 .fields-controls__author-avatar img {
   width: 16px;
   height: 16px;
-  -o-object-fit: cover;
   object-fit: cover;
   opacity: 0;
   border-radius: 100%;
@@ -3517,10 +3482,6 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
   margin: 0;
 }
 
-.fields-controls__slug .fields-controls__slug-external-icon {
-  margin-right: 5ch;
-}
-
 .fields-controls__slug .fields-controls__slug-input input.components-input-control__input {
   padding-inline-start: 0 !important;
 }
@@ -4418,11 +4379,6 @@ button.font-library__upload-area {
 .edit-site-custom-template-modal__contents-wrapper > * {
   width: 100%;
 }
-.edit-site-custom-template-modal__contents-wrapper__suggestions_list {
-  margin-right: -12px;
-  margin-left: -12px;
-  width: calc(100% + 24px);
-}
 .edit-site-custom-template-modal__contents > .components-button {
   height: auto;
   justify-content: center;
@@ -4434,8 +4390,12 @@ button.font-library__upload-area {
 }
 @media (min-width: 600px) {
   .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list {
-    max-height: 224px;
     overflow-y: auto;
+    max-height: calc(224px + 4 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
+    padding: calc(2 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
+    margin-inline: calc(-2 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
+    width: calc(100% + 4 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
+    scroll-padding-block: calc(2 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
   }
 }
 .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item {
@@ -4463,9 +4423,6 @@ button.font-library__upload-area {
 .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item:focus {
   background-color: #f0f0f0;
 }
-.edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item:focus:not(:disabled) {
-  box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color) inset;
-}
 .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item__title, .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item__info {
   overflow: hidden;
   text-overflow: ellipsis;
@@ -4499,7 +4456,7 @@ button.font-library__upload-area {
 }
 .edit-site-add-new-template__modal .edit-site-add-new-template__template-button svg,
 .edit-site-add-new-template__modal .edit-site-add-new-template__custom-template-button svg {
-  fill: var(--wp-admin-theme-color);
+  color: var(--wp-admin-theme-color);
 }
 .edit-site-add-new-template__modal .edit-site-add-new-template__custom-template-button .edit-site-add-new-template__template-name {
   flex-grow: 1;
@@ -4520,7 +4477,6 @@ button.font-library__upload-area {
   flex-direction: column;
   border: 1px solid #ddd;
   justify-content: center;
-  outline: 1px solid transparent;
 }
 .edit-site-custom-template-modal__contents > .components-button span:first-child,
 .edit-site-add-new-template__template-list__contents > .components-button span:first-child {
@@ -4540,12 +4496,6 @@ button.font-library__upload-area {
 .edit-site-add-new-template__template-list__contents > .components-button:hover span {
   color: var(--wp-admin-theme-color);
 }
-.edit-site-custom-template-modal__contents > .components-button:focus,
-.edit-site-add-new-template__template-list__contents > .components-button:focus {
-  box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
-  border-color: transparent;
-  outline: 3px solid transparent;
-}
 .edit-site-custom-template-modal__contents > .components-button:focus span:first-child,
 .edit-site-add-new-template__template-list__contents > .components-button:focus span:first-child {
   color: var(--wp-admin-theme-color);
@@ -4771,8 +4721,7 @@ button.font-library__upload-area {
 .edit-site-welcome-guide__image > img {
   display: block;
   max-width: 100%;
-  -o-object-fit: cover;
-     object-fit: cover;
+  object-fit: cover;
 }
 .edit-site-welcome-guide__heading {
   font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
@@ -4795,7 +4744,7 @@ button.font-library__upload-area {
   vertical-align: text-top;
 }
 .edit-site-welcome-guide .components-button:hover svg {
-  fill: #fff;
+  color: #fff;
 }
 
 .edit-site-layout {
@@ -5364,11 +5313,6 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
   margin-left: -16px;
 }
 
-.edit-site-sidebar-navigation-screen-templates-browse {
-  margin-right: -16px;
-  margin-left: -16px;
-}
-
 .edit-site-sidebar-dataviews {
   margin-right: -16px;
   margin-left: -16px;
@@ -5478,7 +5422,6 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
 body:has(.edit-site-resizable-frame__inner.is-resizing) {
   cursor: col-resize;
   -webkit-user-select: none;
-     -moz-user-select: none;
           user-select: none;
 }
 
@@ -5564,6 +5507,12 @@ body:has(.edit-site-resizable-frame__inner.is-resizing) {
   color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
 }
 
+.edit-site-styles__content {
+  flex-grow: 1;
+  min-height: 0;
+  background-color: var(--wpds-color-background-surface-neutral-strong, #fff);
+}
+
 .show-icon-labels .edit-site-styles__header-actions .components-button.has-icon {
   width: auto;
   padding: 0 var(--wpds-dimension-padding-xs, 4px);
@@ -5576,6 +5525,14 @@ body:has(.edit-site-resizable-frame__inner.is-resizing) {
   font-size: var(--wpds-typography-font-size-sm, 12px);
 }
 
+.edit-site-sidebar-identity__form {
+  flex-grow: 1;
+  min-height: 0;
+  overflow: auto;
+  background-color: var(--wpds-color-background-surface-neutral-strong, #fff);
+  padding: var(--wpds-dimension-padding-lg, 16px) var(--wpds-dimension-padding-2xl, 24px);
+}
+
 ::view-transition-image-pair(root) {
   isolation: auto;
 }