From 4be02cbf0fd9e73bcbe9e59a691d00fd39735b1f Mon Sep 17 00:00:00 2001 From: wangjia <809946525@qq.com> Date: Sat, 13 Jun 2026 14:32:29 +0800 Subject: [PATCH] =?UTF-8?q?feat(tokens):=20=E8=AE=BE=E8=AE=A1=E4=BB=A4?= =?UTF-8?q?=E7=89=8C=E8=90=BD=E5=9C=B0=20+=20=E6=B5=85=E8=89=B2=E4=B8=BB?= =?UTF-8?q?=E9=A2=98=E9=AA=A8=E6=9E=B6=20[tsk=5FpusPU3oCPVfc]?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 在 web/style.css :root 补全缺失令牌: - --violet / --violet-dim(磷光紫,审批闸色) - --glow-green/violet/cyan/red(辉光 shadow 值) - --radius-xs/sm/md/lg/dot(圆角阶梯) - --space-1..9(间距阶) - --pad-btn/btn-xs/input/chip/card(控件内边距) - --shadow-pop/modal/toast(浮层阴影) - --surface-*/--text-*/--border-*/--accent*/--status-go|gate|bad|run(语义别名) 新增 [data-theme="light"] 完整块,覆盖全部底色、文字、 信号色与辉光变量,确保浅色切换不崩版。 现有 --green/amber/red/cyan 及 @keyframes blink/pulse/rise 均未改动,暗色主题视觉零影响。 Co-Authored-By: Claude Sonnet 4.6 --- web/style.css | 85 +++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 85 insertions(+) diff --git a/web/style.css b/web/style.css index ed42f0a..72ea520 100644 --- a/web/style.css +++ b/web/style.css @@ -16,6 +16,8 @@ --green: #5fdd7d; --green-dim: #2e6b3d; + --violet: #b88ef5; + --violet-dim:#503070; --amber: #f0b429; --amber-dim: #6b5414; --red: #ff5d5d; @@ -23,9 +25,92 @@ --cyan: #59c8d8; --cyan-dim: #1e4e57; + /* ── 辉光(text-shadow / box-shadow 用) ── */ + --glow-green: 0 0 12px rgba(95, 221, 125, .45); + --glow-violet: 0 0 14px rgba(184, 142, 245, .4); + --glow-cyan: 0 0 18px rgba(89, 200, 216, .5); + --glow-red: 0 0 14px rgba(255, 93, 93, .3); + + /* ── 圆角 ── */ + --radius-xs: 3px; + --radius-sm: 4px; + --radius-md: 6px; + --radius-lg: 10px; + --radius-dot: 50%; + + /* ── 间距阶(px) ── */ + --space-1: 4px; + --space-2: 6px; + --space-3: 8px; + --space-4: 10px; + --space-5: 12px; + --space-6: 14px; + --space-7: 16px; + --space-8: 20px; + --space-9: 22px; + + /* ── 控件内边距 ── */ + --pad-btn: 6px 14px; + --pad-btn-xs: 2px 8px; + --pad-input: 7px 10px; + --pad-chip: 1px 8px; + --pad-card: 12px 14px; + + /* ── 浮层阴影 ── */ + --shadow-pop: 0 10px 30px rgba(0, 0, 0, .65); + --shadow-modal: 0 18px 60px rgba(0, 0, 0, .6); + --shadow-toast: 0 8px 30px rgba(0, 0, 0, .55); + + /* ── 语义别名 ── */ + --surface-page: var(--bg); + --surface-rail: var(--bg-deep); + --surface-card: var(--panel); + --surface-raised: var(--panel-2); + --text-body: var(--ink); + --text-secondary: var(--muted); + --text-disabled: var(--faint); + --border-default: var(--line); + --border-soft: var(--line-soft); + --accent: var(--green); + --accent-dim: var(--green-dim); + --status-go: var(--green); + --status-gate: var(--violet); + --status-bad: var(--red); + --status-run: var(--cyan); + --mono: 'IBM Plex Mono', 'Noto Sans SC', ui-monospace, monospace; } +/* ── Light 主题: 激活 — 纸白底,信号色加深保对比,-dim 变淡色底 ── */ +[data-theme="light"] { + --bg: #f3f6f1; + --bg-deep: #e9eee6; + --panel: #fcfdfb; + --panel-2: #e4ebe1; + --line: #c9d4c6; + --line-soft: #dbe3d8; + + --ink: #1d251b; + --muted: #5c6b57; + --faint: #92a08c; + + --green: #1b8f46; + --green-dim: #b5e2c3; + --violet: #7747d1; + --violet-dim:#dcccf6; + --amber: #946d06; + --amber-dim: #ecd9a0; + --red: #cd3434; + --red-dim: #f2baba; + --cyan: #0b7488; + --cyan-dim: #b2dfe7; + + --glow-green: 0 0 10px rgba(27, 143, 70, .25); + --glow-violet: 0 0 10px rgba(119, 71, 209, .22); + --glow-cyan: 0 0 12px rgba(11, 116, 136, .25); + --glow-red: 0 0 10px rgba(205, 52, 52, .2); +} + * { box-sizing: border-box; margin: 0; padding: 0; } html, body { height: 100%; }