feat: Dashboard 主题模式切换 — 系统跟随/明亮/黑暗，localStorage 持久化，TDesign theme-mode 驱动

新增 useThemePreference hook 和纯工具函数，支持系统/明亮/黑暗三态主题选择、 matchMedia 系统主题跟随、localStorage 持久化和启动期主题预应用，通过 <html theme-mode> 驱动 TDesign 主题变量切换。 Header 右侧控件重新组织为 .dashboard-header-controls 单行桌面布局，主题 RadioGroup 位于刷新频率 RadioGroup 前。附带：build.ts import specifier 改为跨平台 sep 转换；config-loader 测试适配 Windows PATH 和 YAML 路径转义；test-utils 类型窄化修复。
2026-05-15 22:18:29 +08:00
parent 8793fbd786
commit c46ab14cce
14 changed files with 419 additions and 66 deletions
--- a/openspec/specs/css-utility-classes/spec.md
+++ b/openspec/specs/css-utility-classes/spec.md
@@ -73,9 +73,13 @@ styles.css SHALL 定义前端组件复用的工具类，包含页面布局相关
 - **WHEN** HeadMenu logo 区域渲染品牌名和副标题
 - **THEN** 品牌 SHALL 使用 `.dashboard-brand` 类（display: inline-flex; align-items: baseline; gap: var(--td-comp-margin-s)），品牌名 SHALL 使用 `.dashboard-logo` 类（font-size: calc(var(--td-font-size-title-large) + 6px); font-weight: 700），副标题 SHALL 使用 `.dashboard-subtitle` 类（font-size: var(--td-font-size-body-medium); color: var(--td-text-color-secondary)）

-#### Scenario: 刷新控制区域类
- **WHEN** HeadMenu operations 区域渲染刷新频率选择器和倒计时/按钮
- **THEN** 容器 SHALL 使用 `.dashboard-refresh-control` 类（display: inline-flex; align-items: center; gap: var(--td-comp-margin-s); margin-right: var(--td-comp-margin-xxl)）
+#### Scenario: Header 右侧操作区类
+- **WHEN** HeadMenu operations 区域渲染主题模式选择器、刷新频率选择器和倒计时/按钮
+- **THEN** 容器 SHALL 使用 `.dashboard-header-controls` 类（display: inline-flex; align-items: center; gap: var(--td-comp-margin-s); margin-right: var(--td-comp-margin-xxl)）
+
+#### Scenario: Header 右侧操作区单行布局
+- **WHEN** Header 右侧操作区渲染
+- **THEN** `.dashboard-header-controls` SHALL 保持桌面单行水平布局，不为该区域新增窄屏换行或收纳规则

 #### Scenario: 倒计时文本类
 - **WHEN** 倒计时文本或刷新按钮渲染