audio/website
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: lift focused admin select fields above overlapping controls

Browse Source
This commit is contained in:
Codex
2026-04-23 12:10:20 +08:00
parent 1506867c90
commit 6250d787e0
1 changed files with 86 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/(payload)/admin-theme.css
+86 -3
View File
@@ -191,7 +191,7 @@ html[data-theme] .react-select__menu,
html[data-theme] .react-select__menu-portal,
html[data-theme] [class*='rs__menu'],
html[data-theme] [class*='react-select__menu'] {
z-index: 9999 !important;
z-index: 2147483000 !important;
}
html[data-theme] .popup--active,
@@ -203,10 +203,59 @@ html[data-theme] .field-type {
overflow: visible;
}
html[data-theme] .row,
html[data-theme] .row__fields,
html[data-theme] .field-type__wrap,
html[data-theme] .field-type__wrap > div,
html[data-theme] .tabs-field,
html[data-theme] .tabs-field__content,
html[data-theme] .tabs-field__content-wrap,
html[data-theme] .group-field,
html[data-theme] .array-field,
html[data-theme] .doc-controls,
html[data-theme] .gutter--right {
overflow: visible !important;
}
html[data-theme] .field-type:has(.rs__control),
html[data-theme] .field-type:has([class*='rs__control']),
html[data-theme] .field-type:has(.react-select__control),
html[data-theme] .field-type:has(select),
html[data-theme] .doc-controls .field-type {
position: relative;
z-index: 40;
}
html[data-theme] .rs__control,
html[data-theme] [class*='rs__control'],
html[data-theme] .react-select__control,
html[data-theme] .doc-controls .rs__control,
html[data-theme] .doc-controls [class*='rs__control'],
html[data-theme] .doc-controls .react-select__control {
position: relative;
z-index: 50;
}
html[data-theme] .doc-controls:focus-within,
html[data-theme] .row:focus-within,
html[data-theme] .row__fields:focus-within,
html[data-theme] .tabs-field:focus-within,
html[data-theme] .tabs-field__content:focus-within,
html[data-theme] .tabs-field__content-wrap:focus-within,
html[data-theme] .group-field:focus-within,
html[data-theme] .array-field:focus-within,
html[data-theme] .field-type:focus-within,
html[data-theme] .field-type__wrap:focus-within,
html[data-theme] .field-type__wrap > div:focus-within {
position: relative;
z-index: 2147482500 !important;
isolation: isolate;
}
html[data-theme] .doc-controls {
position: sticky;
top: 20px;
z-index: 6;
z-index: 120;
border-radius: 12px;
padding: 12px 14px;
background: rgba(255, 252, 247, 0.88);
@@ -295,6 +344,10 @@ html[data-theme] .field-type.row,
html[data-theme] .field-type.tabs-field,
html[data-theme] .field-type.group,
html[data-theme] .field-type.collapsible-field,
html[data-theme] .field-type.group-field,
html[data-theme] .field-type.group-field.group-field--top-level,
html[data-theme] .field-type.array-field,
html[data-theme] .field-type.array-field.array-field--has-no-error,
html[data-theme] .field-type.row:has(input[type='checkbox']),
html[data-theme] .field-type.row:has(select),
html[data-theme] .field-type.row:has(input[type='date']),
@@ -307,6 +360,10 @@ html[data-theme] .field-type.group:has(.array-field),
html[data-theme] .field-type.group:has(.blocks-field),
html[data-theme] .field-type.group:has(.relationship-field),
html[data-theme] .field-type.group:has(.upload-field),
html[data-theme] .field-type.group-field:has(.render-fields),
html[data-theme] .field-type.group-field.group-field--top-level:has(.render-fields),
html[data-theme] .field-type.array-field:has(.array-field__rows),
html[data-theme] .field-type.array-field.array-field--has-no-error:has(.array-field__rows),
html[data-theme] .field-type.collapsible-field:has(.render-fields),
html[data-theme] .field-type.tabs-field:has(input[type='checkbox']),
html[data-theme] .field-type.tabs-field:has(select),
@@ -339,12 +396,38 @@ html[data-theme] .tabs-field__content-wrap .field-type:has(.upload-field) {
html[data-theme] .field-type.group > .field-type__wrap,
html[data-theme] .field-type.collapsible-field > .field-type__wrap,
html[data-theme] .field-type.group-field > .field-type__wrap,
html[data-theme] .field-type.group-field.group-field--top-level > .field-type__wrap,
html[data-theme] .field-type.array-field > .field-type__wrap,
html[data-theme] .field-type.array-field.array-field--has-no-error > .field-type__wrap,
html[data-theme] .field-type.group .render-fields,
html[data-theme] .field-type.collapsible-field .render-fields {
html[data-theme] .field-type.collapsible-field .render-fields,
html[data-theme] .field-type.group-field .render-fields,
html[data-theme] .field-type.group-field.group-field--top-level .render-fields,
html[data-theme] .field-type.array-field .array-field,
html[data-theme] .field-type.array-field.array-field--has-no-error .array-field {
max-width: none;
width: 100%;
}
html[data-theme] .field-type:has(.rich-text-lexical),
html[data-theme] .field-type:has(.lexical-editor),
html[data-theme] .field-type:has(.fixed-toolbar),
html[data-theme] .field-type:has(.inline-toolbar-popup) {
max-width: none;
}
html[data-theme] .field-type:has(.rich-text-lexical) > .field-type__wrap,
html[data-theme] .field-type:has(.lexical-editor) > .field-type__wrap,
html[data-theme] .rich-text-lexical,
html[data-theme] .rich-text-lexical .editor-container,
html[data-theme] .rich-text-lexical .editor-scroller,
html[data-theme] .rich-text-lexical .editor,
html[data-theme] .lexical-editor {
max-width: none !important;
width: 100%;
}
html[data-theme] .row {
gap: 10px;
}