html/admin-web
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化

Browse Source
This commit is contained in:
ouyangxq
2026-10-21 07:53:28 +08:00
parent 876930b07e
commit db3b5f7157
10 changed files with 161 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/styles/adminDensity.css
+8 -3
View File
@@ -76,9 +76,14 @@
.admin-density-dialog.admin-density-dialog--comfortable.el-dialog > .el-dialog__header > .el-dialog__headerbtn { top: 6px; }
.admin-density-dialog.admin-density-dialog--comfortable.el-dialog > .el-dialog__body { padding: 24px; }
.admin-density-dialog.admin-density-dialog--comfortable.el-dialog > .el-dialog__footer { padding: 16px 24px; background: var(--admin-label-bg); }
.admin-density-dialog.admin-density-dialog--comfortable.el-dialog .el-form-item { margin-bottom: 20px; }
.admin-density-dialog.admin-density-dialog--comfortable.el-dialog .el-form-item__label { margin-bottom: 8px; font-weight: 500; }
.admin-density-dialog.admin-density-dialog--comfortable.el-dialog .el-select__wrapper { min-height: 40px; }
/* Short forms opt in through the body's own form, with direct fields or one grid wrapper.
Never cross a nested overlay/dialog/drawer while styling its fields. */
.admin-density-dialog--comfortable.el-dialog > .el-dialog__body > .app-dialog__body > .el-form > .el-form-item,
.admin-density-dialog--comfortable.el-dialog > .el-dialog__body > .app-dialog__body > .el-form > :where(div):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper)) > .el-form-item { margin-bottom: 20px; }
.admin-density-dialog--comfortable.el-dialog > .el-dialog__body > .app-dialog__body > .el-form > .el-form-item > .el-form-item__label,
.admin-density-dialog--comfortable.el-dialog > .el-dialog__body > .app-dialog__body > .el-form > :where(div):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper)) > .el-form-item > .el-form-item__label { margin-bottom: 8px; font-weight: 500; }
.admin-density-dialog--comfortable.el-dialog > .el-dialog__body > .app-dialog__body > .el-form > .el-form-item > .el-form-item__content > .el-select > .el-select__wrapper,
.admin-density-dialog--comfortable.el-dialog > .el-dialog__body > .app-dialog__body > .el-form > :where(div):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper)) > .el-form-item > .el-form-item__content > .el-select > .el-select__wrapper { min-height: 40px; }
.admin-density-dialog.admin-density-dialog--comfortable.el-dialog > .el-dialog__footer > .app-dialog__footer > .el-button { min-width: 88px; height: 38px; }
/* Opted-in detail and editor content reuse the existing compact drawer frame. */
src/styles/adminDensity.test.ts
+3 -1
View File
@@ -1127,7 +1127,9 @@ describe('approved Admin density ownership', () => {
expect(source).toContain("'admin-density-dialog--comfortable': dense")
expect(source).toContain('width="min(800px, calc(100vw - 32px))"')
expect(shared).toContain('.admin-density-dialog.admin-density-dialog--comfortable.el-dialog { --el-component-size: 40px; border-radius: 12px; }')
expect(shared).toContain('.admin-density-dialog.admin-density-dialog--comfortable.el-dialog .el-select__wrapper { min-height: 40px; }')
expect(shared).toContain('> .el-form-item__content > .el-select > .el-select__wrapper { min-height: 40px; }')
expect(shared).not.toContain('.admin-density-dialog.admin-density-dialog--comfortable.el-dialog .el-form-item')
expect(shared).not.toContain('.admin-density-dialog.admin-density-dialog--comfortable.el-dialog .el-select__wrapper')
})
it('keeps conditional shared consumers opt-in instead of enabling other menus', () => {
src/styles/adminWorkbench.css
+13 -3
View File
@@ -448,8 +448,15 @@
flex-wrap: wrap;
}
.admin-workbench .workbench-table.is-page-surface > .data-table > .data-table__toolbar .el-button,
.admin-workbench .workbench-toolbar.is-page-surface > .data-table > .data-table__toolbar .el-button {
/* Action wrappers and dropdown/button groups are bounded before floating roots. */
.admin-workbench :is(.workbench-table, .workbench-toolbar).is-page-surface > .data-table > .data-table__toolbar > .data-table__toolbar-start > .el-button,
.admin-workbench :is(.workbench-table, .workbench-toolbar).is-page-surface > .data-table > .data-table__toolbar > .data-table__toolbar-start > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > .el-button,
.admin-workbench :is(.workbench-table, .workbench-toolbar).is-page-surface > .data-table > .data-table__toolbar > .data-table__toolbar-start > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > .el-button,
.admin-workbench :is(.workbench-table, .workbench-toolbar).is-page-surface > .data-table > .data-table__toolbar > .data-table__toolbar-start > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > .el-button,
.admin-workbench :is(.workbench-table, .workbench-toolbar).is-page-surface > .data-table > .data-table__toolbar > .data-table__toolbar-actions > :is(.data-table__business-actions, .data-table__utility-actions) > .el-button,
.admin-workbench :is(.workbench-table, .workbench-toolbar).is-page-surface > .data-table > .data-table__toolbar > .data-table__toolbar-actions > :is(.data-table__business-actions, .data-table__utility-actions) > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > .el-button,
.admin-workbench :is(.workbench-table, .workbench-toolbar).is-page-surface > .data-table > .data-table__toolbar > .data-table__toolbar-actions > :is(.data-table__business-actions, .data-table__utility-actions) > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > .el-button,
.admin-workbench :is(.workbench-table, .workbench-toolbar).is-page-surface > .data-table > .data-table__toolbar > .data-table__toolbar-actions > :is(.data-table__business-actions, .data-table__utility-actions) > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > .el-button {
min-height: var(--admin-control-height, 32px);
height: var(--admin-control-height, 32px);
}
@@ -522,7 +529,10 @@
}
.admin-workbench .workbench-table .data-table .data-table__page-button[aria-current='page']:not(:disabled),
.admin-workbench .workbench-table .data-table__business-actions .el-button--primary:not(:disabled) {
.admin-workbench .workbench-table > .data-table > .data-table__toolbar > .data-table__toolbar-actions > .data-table__business-actions > .el-button--primary:not(:disabled),
.admin-workbench .workbench-table > .data-table > .data-table__toolbar > .data-table__toolbar-actions > .data-table__business-actions > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > .el-button--primary:not(:disabled),
.admin-workbench .workbench-table > .data-table > .data-table__toolbar > .data-table__toolbar-actions > .data-table__business-actions > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > .el-button--primary:not(:disabled),
.admin-workbench .workbench-table > .data-table > .data-table__toolbar > .data-table__toolbar-actions > .data-table__business-actions > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > :where(div, span):not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table)) > .el-button--primary:not(:disabled) {
box-shadow: var(--workbench-shadow);
}
src/styles/adminWorkbench.test.ts
+4 -2
View File
@@ -66,8 +66,10 @@ describe('Admin workbench opt-in styles', () => {
for (const selector of rule.selectors) {
expect(selector).toMatch(/^\.admin-workbench(?:\s|\.|:|\[|$)/)
expect(selector).not.toMatch(/:global|:root/)
if (selector.includes('.el-dialog')) expect(selector).toMatch(/^\.admin-workbench\.is-dialog\.el-dialog/)
if (selector.includes('.el-drawer')) expect(selector).toMatch(/^\.admin-workbench\.is-drawer\.el-drawer/)
// Excluding floating roots from a toolbar is not a selector targeting their chrome.
const targetSelector = selector.replaceAll(':not(:where(.el-overlay, .el-dialog, .el-drawer, .el-popper, .data-table))', '')
if (targetSelector.includes('.el-dialog')) expect(targetSelector).toMatch(/^\.admin-workbench\.is-dialog\.el-dialog/)
if (targetSelector.includes('.el-drawer')) expect(targetSelector).toMatch(/^\.admin-workbench\.is-drawer\.el-drawer/)
}
})
root(source).walkDecls(declaration => {