feat(theme): 专业主题系统重构 — Warp/Linear 设计参考,深色/浅色完整适配

参考设计系统:
- Warp: 温暖暗色调、自然层次、克制配色
- Linear: 亮度阶梯层次、半透明边框、精确排版

核心改进:
- app-theme.ts: 完整重写深色/浅色调色板 (+surface-hover/active, border-subtle/focus, feedback-bg, placeholder)
- useTheme.ts: 修复硬编码 return 'dark',支持 dark/light/system 完整切换
- index.css: 消除硬编码颜色,全部使用 CSS 变量
- tailwind.config.js: 新增 txt/content/surface/border/ph/feedback 语义 token
- 44 文件批量迁移: 292 处 text-gray/bg-gray/text-white/placeholder-gray → 主题感知语义 token

| 44 files +611/-482 | tsc零错误 | 96/96 tests passing
This commit is contained in:
OpsXShell Dev committed 2026-04-25 19:31:51 +08:00
1 parent 07c4a5b14f
commit e9a0d21758
44 files changed
+593 -464

No files matched your search

+6 -6
View File
@@ -18,13 +18,13 @@ export default function DefaultFallback({ error, onReset }: DefaultFallbackProps
</svg>
</div>
<div>
<h2 className="text-lg font-semibold text-gray-200">出错了</h2>
<p className="text-sm text-gray-500">应用遇到意外问题</p>
<h2 className="text-lg font-semibold text-content-primary">出错了</h2>
<p className="text-sm text-txt-muted">应用遇到意外问题</p>
</div>
</div>
<div className="bg-dark-900 rounded-lg p-4 mb-4">
<p className="text-sm text-gray-300 mb-2">{appError.message}</p>
<p className="text-sm text-content-secondary mb-2">{appError.message}</p>
{appError.recoverable && (
<p className="text-xs text-green-400">此错误可以恢复,请尝试刷新页面</p>
)}
@@ -33,19 +33,19 @@ export default function DefaultFallback({ error, onReset }: DefaultFallbackProps
<div className="flex gap-3">
<button
onClick={onReset}
className="flex-1 px-4 py-2 bg-accent-blue hover:bg-blue-600 text-white rounded-lg transition-colors text-sm font-medium"
className="flex-1 px-4 py-2 bg-surface-baseccent-blue hover:bg-surface-baselue-600 text-content-primary rounded-lg transition-colors text-sm font-medium"
>
刷新页面
</button>
<button
onClick={() => window.location.reload()}
className="px-4 py-2 bg-dark-700 hover:bg-dark-600 text-gray-300 rounded-lg transition-colors text-sm"
className="px-4 py-2 bg-dark-700 hover:bg-dark-600 text-content-secondary rounded-lg transition-colors text-sm"
>
重启应用
</button>
</div>
<p className="mt-4 text-xs text-gray-600 text-center">
<p className="mt-4 text-xs text-txt-faint text-center">
如果问题持续存在,请检查日志或联系支持
</p>
</div>