fix: 修复暗黑模式样式兼容性

- 在 tailwind.config.js 中启用 darkMode: 'class' 并扩展语义化颜色变量
- 将全项目硬编码颜色(bg-white、text-gray-*、border-gray-* 等)替换为语义化类名
- 修复 popup/index.html 硬编码浅色背景色
- 同步更新相关单元测试中的类名断言
This commit is contained in:
雨霖铃
2026-05-22 16:04:50 +08:00
parent 5b9a0f59d3
commit de7da9f1db
42 changed files with 274 additions and 261 deletions
+4 -4
View File
@@ -32,7 +32,7 @@ const Section = ({ title, content, color }: SectionProps) => {
<CopyButton text={JSON.stringify(content)} size="small" />
</div>
</div>
<pre className="m-0 p-3 bg-white/60 rounded-lg text-xs font-mono overflow-x-auto whitespace-pre-wrap break-all border border-black/5">
<pre className="m-0 p-3 bg-background/60 rounded-lg text-xs font-mono overflow-x-auto whitespace-pre-wrap break-all border border-black/5">
{content ? stringifyJson(content) : t('jwt:invalidFormat')}
</pre>
</div>
@@ -91,14 +91,14 @@ export default function Index() {
content={result.payload}
color="#d63aff" // JWT.io Payload Color
/>
<div className="p-4 rounded-xl border border-blue-200 bg-blue-50">
<div className="p-4 rounded-xl border border-primary/30 bg-primary/10">
<div className="flex justify-between items-center mb-2">
<span className="text-sm font-bold tracking-wide text-blue-600">
<span className="text-sm font-bold tracking-wide text-primary">
{t('jwt:signatureTitle')}
</span>
<CopyButton text={JSON.stringify(result.raw.signature)} size="small" />
</div>
<span className="block text-sm font-mono break-all text-gray-500 bg-white/60 p-3 rounded-lg border border-black/5">
<span className="block text-sm font-mono break-all text-muted-foreground bg-background/60 p-3 rounded-lg border border-black/5">
{result.signature || t('jwt:noSignature')}
</span>
</div>