diff --git a/public/css/admin-components.css b/public/css/admin-components.css index c078c20..09e113d 100644 --- a/public/css/admin-components.css +++ b/public/css/admin-components.css @@ -18,22 +18,22 @@ } .toast{ - background:#111827; - border:1px solid #334155; + background:var(--adm-bg-container, #ffffff); + border:1px solid var(--adm-border-color, #e5e7eb); border-left-width:4px; - border-radius:12px; + border-radius:var(--adm-radius, 12px); padding:12px 12px; - color:#e5e7eb; - box-shadow:0 14px 30px rgba(0,0,0,.35); + color:var(--adm-text, #0f172a); + box-shadow:0 12px 30px rgba(15, 23, 42, .12); display:flex; align-items:flex-start; justify-content:space-between; gap:12px; } -.toast-success{border-left-color:#16a34a;} -.toast-warning{border-left-color:#f59e0b;} -.toast-error{border-left-color:#ef4444;} +.toast-success{border-left-color:var(--adm-success, #16a34a);} +.toast-warning{border-left-color:var(--adm-warning, #f59e0b);} +.toast-error{border-left-color:var(--adm-error, #ef4444);} .toast-content{ font-size:13px; @@ -45,7 +45,7 @@ appearance:none; border:none; background:transparent; - color:#94a3b8; + color:var(--adm-text-muted, #94a3b8); font-size:18px; line-height:1; cursor:pointer; @@ -54,8 +54,8 @@ } .toast-close:hover{ - background:#1f2937; - color:#e5e7eb; + background:rgba(22, 119, 255, .08); + color:var(--adm-text, #0f172a); } .form-inline-row{ @@ -114,9 +114,9 @@ .page-header{ width:100%; padding:16px; - border:1px solid #e5e7eb; - border-radius:12px; - background:#ffffff; + border:1px solid var(--adm-border-color, #e5e7eb); + border-radius:var(--adm-radius, 12px); + background:var(--adm-bg-container, #ffffff); } .page-header-main{ @@ -129,14 +129,14 @@ .page-header-title{ font-size:18px; font-weight:700; - color:#0f172a; + color:var(--adm-text, #0f172a); line-height:1.2; } .page-header-subtitle{ margin-top:6px; font-size:13px; - color:#64748b; + color:var(--adm-text-secondary, #64748b); line-height:1.45; } @@ -152,7 +152,7 @@ display:flex; flex-wrap:wrap; gap:12px; - color:#64748b; + color:var(--adm-text-secondary, #64748b); font-size:12px; } @@ -177,21 +177,21 @@ .stat-card-title{ font-size:12px; - color:#64748b; + color:var(--adm-text-secondary, #64748b); } .stat-card-value{ margin-top:10px; font-size:22px; font-weight:800; - color:#0f172a; + color:var(--adm-text, #0f172a); letter-spacing:.2px; } .stat-card-footnote{ margin-top:8px; font-size:12px; - color:#94a3b8; + color:var(--adm-text-muted, #94a3b8); } .collapsible > summary{ diff --git a/tests/Feature/AdminComponentsCssPageHeaderShouldUseThemeTokensTest.php b/tests/Feature/AdminComponentsCssPageHeaderShouldUseThemeTokensTest.php new file mode 100644 index 0000000..052a8b4 --- /dev/null +++ b/tests/Feature/AdminComponentsCssPageHeaderShouldUseThemeTokensTest.php @@ -0,0 +1,39 @@ +seed(); + + $this->post('/admin/login', [ + 'email' => 'platform.admin@demo.local', + 'password' => 'Platform@123456', + ])->assertRedirect('/admin'); + } + + public function test_admin_components_css_page_header_should_use_theme_tokens(): void + { + $this->loginAsPlatformAdmin(); + + $css = file_get_contents(public_path('css/admin-components.css')); + $this->assertIsString($css); + + // PageHeader 组件必须走主题令牌,避免后续统一换肤/统一基线时需要全局搜替换。 + $this->assertStringContainsString('.page-header{', $css); + $this->assertStringContainsString('border:1px solid var(--adm-border-color, #e5e7eb)', $css); + $this->assertStringContainsString('background:var(--adm-bg-container, #ffffff)', $css); + $this->assertStringContainsString('border-radius:var(--adm-radius, 12px)', $css); + + // 标题/副标题要使用文本 token。 + $this->assertStringContainsString('color:var(--adm-text, #0f172a)', $css); + $this->assertStringContainsString('color:var(--adm-text-secondary, #64748b)', $css); + } +}