🐛 fix(driver-manager): 统一驱动管理页明暗主题底色

Refs #440

frontend/src/utils/driverManagerWorkbenchTheme.test.ts

@@ -0,0 +1,31 @@
+import { describe, expect, it } from 'vitest';
+
+import { buildDriverManagerWorkbenchTheme } from './driverManagerWorkbenchTheme';
+
+describe('driverManagerWorkbenchTheme', () => {
+  it('builds a dark driver manager theme with dark surfaces', () => {
+    const theme = buildDriverManagerWorkbenchTheme(true, 0.72);
+
+    expect(theme.isDark).toBe(true);
+    expect(theme.pageBg).toBe('rgb(31, 31, 31)');
+    expect(theme.sectionBg).toBe('rgb(31, 31, 31)');
+    expect(theme.cardBg).toBe('rgb(31, 31, 31)');
+    expect(theme.statBg).toBe('rgb(31, 31, 31)');
+    expect(theme.updateNoteBg).toBe('rgb(31, 31, 31)');
+    expect(theme.titleText).toBe('#f5f7ff');
+    expect(theme.warningText).toBe('#f6c453');
+  });
+
+  it('builds a light driver manager theme with light surfaces', () => {
+    const theme = buildDriverManagerWorkbenchTheme(false, 0.92);
+
+    expect(theme.isDark).toBe(false);
+    expect(theme.pageBg).toBe('rgb(255, 255, 255)');
+    expect(theme.sectionBg).toBe('rgb(255, 255, 255)');
+    expect(theme.cardBg).toBe('rgb(255, 255, 255)');
+    expect(theme.statBg).toBe('rgb(255, 255, 255)');
+    expect(theme.updateNoteBg).toBe('rgb(255, 255, 255)');
+    expect(theme.titleText).toBe('rgba(5, 5, 5, 0.92)');
+    expect(theme.warningText).toBe('#d48806');
+  });
+});

frontend/src/utils/driverManagerWorkbenchTheme.ts

@@ -0,0 +1,61 @@
+export type DriverManagerWorkbenchTheme = {
+  isDark: boolean;
+  pageBg: string;
+  sectionBg: string;
+  sectionBorder: string;
+  cardBg: string;
+  cardBorder: string;
+  cardWarningBorder: string;
+  cardReadyBorder: string;
+  statBg: string;
+  statBorder: string;
+  updateNoteBg: string;
+  updateNoteBorder: string;
+  mutedText: string;
+  titleText: string;
+  warningText: string;
+};
+
+export const buildDriverManagerWorkbenchTheme = (darkMode: boolean, _opacity: number): DriverManagerWorkbenchTheme => {
+  if (darkMode) {
+    const darkSurface = 'rgb(31, 31, 31)';
+
+    return {
+      isDark: true,
+      pageBg: darkSurface,
+      sectionBg: darkSurface,
+      sectionBorder: '1px solid rgba(255, 255, 255, 0.08)',
+      cardBg: darkSurface,
+      cardBorder: '1px solid rgba(255, 255, 255, 0.08)',
+      cardWarningBorder: '1px solid rgba(250, 173, 20, 0.35)',
+      cardReadyBorder: '1px solid rgba(82, 196, 26, 0.22)',
+      statBg: darkSurface,
+      statBorder: '1px solid rgba(255, 255, 255, 0.08)',
+      updateNoteBg: darkSurface,
+      updateNoteBorder: '1px solid rgba(250, 173, 20, 0.24)',
+      mutedText: 'rgba(255, 255, 255, 0.62)',
+      titleText: '#f5f7ff',
+      warningText: '#f6c453',
+    };
+  }
+
+  const lightSurface = 'rgb(255, 255, 255)';
+
+  return {
+    isDark: false,
+    pageBg: lightSurface,
+    sectionBg: lightSurface,
+    sectionBorder: '1px solid rgba(5, 5, 5, 0.08)',
+    cardBg: lightSurface,
+    cardBorder: '1px solid rgba(5, 5, 5, 0.08)',
+    cardWarningBorder: '1px solid rgba(250, 173, 20, 0.35)',
+    cardReadyBorder: '1px solid rgba(82, 196, 26, 0.22)',
+    statBg: lightSurface,
+    statBorder: '1px solid rgba(5, 5, 5, 0.08)',
+    updateNoteBg: lightSurface,
+    updateNoteBorder: '1px solid rgba(250, 173, 20, 0.24)',
+    mutedText: 'rgba(5, 5, 5, 0.62)',
+    titleText: 'rgba(5, 5, 5, 0.92)',
+    warningText: '#d48806',
+  };
+};