From dbce13ba83f28b1055c2be62d2cd40894ca3ddfe Mon Sep 17 00:00:00 2001 From: smail Date: Tue, 8 Sep 2026 10:26:51 +0800 Subject: [PATCH] =?UTF-8?q?=E5=8E=8B=E7=BC=A9=E9=82=AE=E4=BB=B6=E6=9C=8D?= =?UTF-8?q?=E5=8A=A1=E5=85=A8=E9=83=A8=E5=90=AF=E7=94=A8=E9=A1=B5=E9=9D=A2?= =?UTF-8?q?=E9=AB=98=E5=BA=A6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ConfigEditor/ConfigEditor.css | 5 ++++ .../ConfigSettings/ConfigForm/ConfigForm.css | 28 +++++++++++++++---- test/frontend/config-form.test.mjs | 15 ++++++++++ 3 files changed, 43 insertions(+), 5 deletions(-) diff --git a/frontend/src/views/components/ConfigSettings/ConfigEditor/ConfigEditor.css b/frontend/src/views/components/ConfigSettings/ConfigEditor/ConfigEditor.css index 05be4e3..c690289 100644 --- a/frontend/src/views/components/ConfigSettings/ConfigEditor/ConfigEditor.css +++ b/frontend/src/views/components/ConfigSettings/ConfigEditor/ConfigEditor.css @@ -187,4 +187,9 @@ .config-page[data-config-page="mail"] .editor-footer .action-row { margin-top: 0; } + + .config-page[data-config-page="mail"] .editor-footer { + margin-top: 4px; + padding-top: 4px; + } } diff --git a/frontend/src/views/components/ConfigSettings/ConfigForm/ConfigForm.css b/frontend/src/views/components/ConfigSettings/ConfigForm/ConfigForm.css index c745a40..fca3e48 100644 --- a/frontend/src/views/components/ConfigSettings/ConfigForm/ConfigForm.css +++ b/frontend/src/views/components/ConfigSettings/ConfigForm/ConfigForm.css @@ -94,20 +94,38 @@ /* 邮件服务页在桌面抽屉中采用紧凑双列，移除策略后可在常见高度内完整展示。 */ @container config-main (min-width: 360px) { .config-form[data-form-section="mail"] { - gap: 8px; + gap: 4px; } .config-form[data-form-section="mail"] .form-grid { - gap: 8px 12px; + gap: 5px 12px; } .config-form[data-form-section="mail"] .form-group + .form-group { - margin-top: 8px; - padding-top: 10px; + margin-top: 4px; + padding-top: 6px; } .config-form[data-form-section="mail"] .form-group-heading { - margin-bottom: 6px; + margin-bottom: 2px; + } + + .config-form[data-form-section="mail"] :deep(.config-field) { + gap: 2px; + } + + .config-form[data-form-section="mail"] :deep(.field-label) { + gap: 4px; + font-size: 12px; + line-height: 18px; + white-space: nowrap; + } + + .config-form[data-form-section="mail"] :deep(.field-port-guide) { + min-height: 18px; + gap: 4px 8px; + font-size: 11px; + line-height: 18px; } } diff --git a/test/frontend/config-form.test.mjs b/test/frontend/config-form.test.mjs index 1e99701..480ed12 100644 --- a/test/frontend/config-form.test.mjs +++ b/test/frontend/config-form.test.mjs @@ -89,6 +89,21 @@ test('邮件服务页面只管理监听和中继，邮件策略使用独立表 assert.ok(validateFormConfig('mail', { ...config, listener: { ...config.listener, tlsPort: 587 } })['listener.tlsPort']) }) +test('邮件服务全部启用时使用紧凑双列布局并完整保留字段与端口提示', () => { + const formCss = readFileSync(new URL('ConfigForm/ConfigForm.css', root), 'utf8') + const editorCss = readFileSync(new URL('ConfigEditor/ConfigEditor.css', root), 'utf8') + const compactBlock = formCss.match( + /@container config-main \(min-width: 360px\) \{([\s\S]*?)\n\}/ + )?.[1] || '' + + assert.match(compactBlock, /\.config-form\[data-form-section="mail"\] \.form-grid\s*\{[\s\S]*?gap: 5px 12px;/) + assert.match(compactBlock, /:deep\(\.field-label\)[\s\S]*?white-space: nowrap;/) + assert.match(compactBlock, /:deep\(\.field-port-guide\)[\s\S]*?min-height: 18px;/) + assert.doesNotMatch(compactBlock, /display:\s*none|visibility:\s*hidden/) + assert.match(formCss, /@media \(max-width: 768px\)[\s\S]*?grid-template-columns: minmax\(0, 1fr\);/) + assert.match(editorCss, /\.config-page\[data-config-page="mail"\] \.editor-footer\s*\{\s*margin-top: 4px;\s*padding-top: 4px;/) +}) + test('三个插件页面只展示和编辑自身字段，完整保留其他插件和未知字段', () => { const config = { meta: { generation: 9 }, plugins: { spam_block: { enabled: false, settings: { threshold: 20 }, secretStatus: { configured: true } },