mirror of
https://github.com/farion1231/cc-switch.git
synced 2026-10-25 17:22:27 +08:00
fix(ui): soften dark-mode text colors to reduce glare
The three dark-mode text tiers all sat close to white (15.5 / 11.1 / 8.4 contrast on the app background), so screens full of table data and labels looked harsh and the hierarchy flattened. - --text-1 #f4f4f5 -> #e4e4e7, and the shadcn --foreground family follows so inherited body text matches - --text-2 #d0d0d8 -> #ababb3, --text-3 #b5b5bd -> #9a9aa2 - --muted-foreground aligned with --text-2 Contrast is now about 13.4 / 7.5 / 6.1; the secondary and tertiary tiers stay at or above 4.5:1 on card and selected backgrounds. Light mode is unchanged.
This commit is contained in:
1 parent
4215f7ee29
commit
3784fd9e4d
2 files changed
+14
-11
No files matched your search
@@ -67,7 +67,7 @@
|
||||
--action-bg: #ea580c; --action-hover: #f06d1f; --action-fg: #ffffff; --action-text: #fb923c; --action-soft: rgba(249, 115, 21, 0.12); --ring: #d77a3c;
|
||||
--bg-app: #1c1c1e; --bg-sidebar: #161618; --bg-subtle: #26262a; --bg-selected: #313136; --bg-card: #2e2e33;
|
||||
--border: #3e3e45; --border-strong: #4a4a52;
|
||||
--text-1: #f4f4f5; --text-2: #d0d0d8; --text-3: #b5b5bd;
|
||||
--text-1: #e4e4e7; --text-2: #ababb3; --text-3: #9a9aa2;
|
||||
--inverse-bg: #f4f4f5; --inverse-fg: #18181b; --overlay: rgba(0, 0, 0, .55); --control-off: #6f6f77;
|
||||
--direct-fill: #4a8fd9; --direct-text: #8fb8e6; --direct-soft: rgba(74, 143, 217, 0.12); --direct-solid: #2f6db3; --direct-on: #ffffff;
|
||||
--route-fill: #2a9d8f; --route-text: #7cc4ba; --route-soft: rgba(42, 157, 143, 0.12); --route-solid: #1f7d72; --route-on: #ffffff;
|
||||
@@ -86,7 +86,7 @@
|
||||
--action-bg: #ea580c; --action-hover: #f06d1f; --action-fg: #ffffff; --action-text: #fb923c; --action-soft: rgba(249, 115, 21, 0.12); --ring: #d77a3c;
|
||||
--bg-app: #1c1c1e; --bg-sidebar: #161618; --bg-subtle: #26262a; --bg-selected: #313136; --bg-card: #2e2e33;
|
||||
--border: #3e3e45; --border-strong: #4a4a52;
|
||||
--text-1: #f4f4f5; --text-2: #d0d0d8; --text-3: #b5b5bd;
|
||||
--text-1: #e4e4e7; --text-2: #ababb3; --text-3: #9a9aa2;
|
||||
--inverse-bg: #f4f4f5; --inverse-fg: #18181b; --overlay: rgba(0, 0, 0, .55); --control-off: #6f6f77;
|
||||
--direct-fill: #4a8fd9; --direct-text: #8fb8e6; --direct-soft: rgba(74, 143, 217, 0.12); --direct-solid: #2f6db3; --direct-on: #ffffff;
|
||||
--route-fill: #2a9d8f; --route-text: #7cc4ba; --route-soft: rgba(42, 157, 143, 0.12); --route-solid: #1f7d72; --route-on: #ffffff;
|
||||
|
||||
+12
-9
@@ -37,22 +37,23 @@
|
||||
|
||||
.dark {
|
||||
--background: 240 3.4% 11.4%;
|
||||
--foreground: 240 4.8% 95.9%;
|
||||
/* 文字色与下方 --text-1 一致(#e4e4e7):纯白主文字铺满整屏时刺眼 */
|
||||
--foreground: 240 5.9% 90%;
|
||||
--card: 240 5.2% 19%;
|
||||
--card-foreground: 240 4.8% 95.9%;
|
||||
--card-foreground: 240 5.9% 90%;
|
||||
--popover: 240 5.2% 19%;
|
||||
--popover-foreground: 240 4.8% 95.9%;
|
||||
--popover-foreground: 240 5.9% 90%;
|
||||
|
||||
--primary: 240 4.8% 95.9%;
|
||||
--primary-foreground: 240 5.9% 10%;
|
||||
|
||||
--secondary: 240 5% 15.7%;
|
||||
--secondary-foreground: 240 4.8% 95.9%;
|
||||
--secondary-foreground: 240 5.9% 90%;
|
||||
|
||||
--muted: 240 5% 15.7%;
|
||||
--muted-foreground: 240 5.7% 72.5%;
|
||||
--muted-foreground: 240 5.4% 68.6%;
|
||||
--accent: 240 5% 15.7%;
|
||||
--accent-foreground: 240 4.8% 95.9%;
|
||||
--accent-foreground: 240 5.9% 90%;
|
||||
|
||||
--destructive: 0 62.8% 30.6%;
|
||||
--destructive-foreground: 0 0% 98%;
|
||||
@@ -154,9 +155,11 @@
|
||||
--bg-selected: #313136;
|
||||
--bg-card: #2e2e33;
|
||||
--border-strong: #4a4a52;
|
||||
--text-1: #f4f4f5;
|
||||
--text-2: #d0d0d8;
|
||||
--text-3: #b5b5bd;
|
||||
/* 三档文字都比纯白压低一截并拉开明度差:太亮时三档都贴近白色,整屏显得刺眼、层次压平。
|
||||
次级、三级对卡片底、选中底(--bg-card / --bg-selected)都 ≥ 4.5:1 */
|
||||
--text-1: #e4e4e7;
|
||||
--text-2: #ababb3;
|
||||
--text-3: #9a9aa2;
|
||||
/* 深色模式:实心块压暗一档(大面积不刺眼)+ 白字;文字、焦点描边用亮一档的 #fb923c */
|
||||
--action-bg: #ea580c;
|
||||
--action-fg: #ffffff;
|
||||
|
||||
Reference in new issue
Block a user