xiaohei/taiji-pda-v0
1
0
Fork 1
mirror of https://github.com/Fasthei/taiji-pda-v0.git synced 2026-09-26 21:21:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

style: 整理三种主题配色

Browse Source 
1. 灰白色（light）- 纯灰白背景，不带色调
2. 青色（dark）- 深色青色调背景
3. 纯黑色（black）- OLED 纯黑背景
This commit is contained in:
zhanggangyong
2026-01-15 15:41:17 +00:00
parent 82fa0d64db
commit 9d84ab5d3a
1 changed files with 31 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/globals.css
+31 -52
View File
@@ -3,25 +3,32 @@
@custom-variant dark (&:is(.dark *));
:root {
--background: oklch(0.97 0.005 200);
/* ============================================
主题 1: 灰白色（默认亮色主题）
- 背景：纯灰白，不带色调
- 主色调：青绿色
============================================ */
:root,
.light,
html.light {
--background: oklch(0.96 0 0);
--foreground: oklch(0.15 0 0);
--card: oklch(0.98 0.003 200);
--card: oklch(0.98 0 0);
--card-foreground: oklch(0.15 0 0);
--popover: oklch(0.98 0.003 200);
--popover: oklch(0.99 0 0);
--popover-foreground: oklch(0.15 0 0);
--primary: oklch(0.38 0.13 200);
--primary-foreground: oklch(1 0 0);
--secondary: oklch(0.96 0.01 200);
--secondary: oklch(0.92 0 0);
--secondary-foreground: oklch(0.15 0 0);
--muted: oklch(0.97 0.005 200);
--muted-foreground: oklch(0.48 0 0);
--muted: oklch(0.94 0 0);
--muted-foreground: oklch(0.45 0 0);
--accent: oklch(0.42 0.11 200);
--accent-foreground: oklch(1 0 0);
--destructive: oklch(0.55 0.22 25);
--destructive-foreground: oklch(1 0 0);
--border: oklch(0.93 0.01 200);
--input: oklch(0.93 0.01 200);
--border: oklch(0.90 0 0);
--input: oklch(0.90 0 0);
--ring: oklch(0.38 0.13 200);
--chart-1: oklch(0.48 0.13 200);
--chart-2: oklch(0.52 0.11 180);
@@ -29,18 +36,23 @@
--chart-4: oklch(0.62 0.11 160);
--chart-5: oklch(0.55 0.11 40);
--radius: 0.5rem;
--sidebar: oklch(0.99 0.005 200);
--sidebar: oklch(0.97 0 0);
--sidebar-foreground: oklch(0.15 0 0);
--sidebar-primary: oklch(0.38 0.13 200);
--sidebar-primary-foreground: oklch(1 0 0);
--sidebar-accent: oklch(0.97 0.005 200);
--sidebar-accent: oklch(0.94 0 0);
--sidebar-accent-foreground: oklch(0.15 0 0);
--sidebar-border: oklch(0.93 0.01 200);
--sidebar-border: oklch(0.90 0 0);
--sidebar-ring: oklch(0.38 0.13 200);
}
/* 默认主题：中等灰色（当前颜色） */
.dark {
/* ============================================
主题 2: 青色（深色青色主题）
- 背景：深青色调
- 主色调：亮青绿色
============================================ */
.dark,
html.dark {
--background: oklch(0.22 0.01 200);
--foreground: oklch(0.95 0 0);
--card: oklch(0.26 0.01 200);
@@ -75,7 +87,11 @@
--sidebar-ring: oklch(0.65 0.15 200);
}
/* 纯黑色主题 */
/* ============================================
主题 3: 纯黑色（OLED 黑色主题）
- 背景：纯黑色
- 主色调：亮青绿色
============================================ */
.black,
html.black {
--background: oklch(0.08 0 0);
@@ -112,43 +128,6 @@ html.black {
--sidebar-ring: oklch(0.7 0.16 200);
}
/* 浅灰白色主题 */
.light,
html.light {
--background: oklch(0.97 0.005 200);
--foreground: oklch(0.15 0 0);
--card: oklch(0.98 0.003 200);
--card-foreground: oklch(0.15 0 0);
--popover: oklch(0.98 0.003 200);
--popover-foreground: oklch(0.15 0 0);
--primary: oklch(0.38 0.13 200);
--primary-foreground: oklch(1 0 0);
--secondary: oklch(0.96 0.01 200);
--secondary-foreground: oklch(0.15 0 0);
--muted: oklch(0.97 0.005 200);
--muted-foreground: oklch(0.48 0 0);
--accent: oklch(0.42 0.11 200);
--accent-foreground: oklch(1 0 0);
--destructive: oklch(0.55 0.22 25);
--destructive-foreground: oklch(1 0 0);
--border: oklch(0.93 0.01 200);
--input: oklch(0.93 0.01 200);
--ring: oklch(0.38 0.13 200);
--chart-1: oklch(0.48 0.13 200);
--chart-2: oklch(0.52 0.11 180);
--chart-3: oklch(0.58 0.13 220);
--chart-4: oklch(0.62 0.11 160);
--chart-5: oklch(0.55 0.11 40);
--sidebar: oklch(0.99 0.005 200);
--sidebar-foreground: oklch(0.15 0 0);
--sidebar-primary: oklch(0.38 0.13 200);
--sidebar-primary-foreground: oklch(1 0 0);
--sidebar-accent: oklch(0.97 0.005 200);
--sidebar-accent-foreground: oklch(0.15 0 0);
--sidebar-border: oklch(0.93 0.01 200);
--sidebar-ring: oklch(0.38 0.13 200);
}
@theme inline {
--font-sans: "Geist", "Geist Fallback";
--font-mono: "Geist Mono", "Geist Mono Fallback";