agent-Specialization/scripts/strip_fallback.py
JOJO b4030c386e refactor(frontend): 颜色 token 系统两层重构 + 三主题填色 + 去半透明
将前端配色从散落的硬编码/双命名体系(--claude-* / --theme-*)重构为
两层 token 结构(原始层 + 中性语义层),并按"经典抄 Claude、浅色抄
ChatGPT、深色自研"的定位完成三主题填色,同时建立 stylelint 防回退栏杆。
代码大量由 AI 生成的历史遗留配色问题(同语义多值、跨主题塌缩、强调色
撞文字色、fallback 第二真相源等)在此一并收口。

== 一、Token 结构重构(_tokens.scss)==
- 重写为两层:原始层 + 语义层;组件只引用中性语义名
  (--surface-* / --text-* / --border-* / --accent* / --state-* 等)。
- --claude-* / --theme-* 降级为兼容别名(41 个转发),迁移完成后删除。
- 三主题(classic / light / dark)+ 首屏回退(:root:not([data-theme]),
  与经典同值)全部补齐,结构对齐、不再缺项。

== 二、三主题填色 ==
- 经典 = Claude 官网亮色盘:暖奶油表面阶梯
  canvas #faf9f5 < soft #f5f0e8 < card #efe9de < cream-strong #e8e0d2
  < 纯白浮起;文字 #141413;hairline #e6dfd8;暖橙 primary #cc785c。
- 浅色 = ChatGPT 亮色盘:冷白 #ffffff / 侧栏 #f9f9f9 / 嵌套 #f3f3f3,
  中性灰文字,近黑 primary #181818。
- 深色 = 自研中性灰阶,本轮完全不动(原样保留)。
- 修复塌缩 bug:强调色在 light/dark 原被误填成灰(CTA 失去品牌色),
  现统一回品牌 primary;light 表面原全塌成 #ffffff(过于平面),
  现按灰阶拉开层次。
- 强调色克制(CTA-only voltage):primary 仅用于发送按钮/logo 等极少
  数处;hover / 选中 / 运行态一律走中性灰(运行态指示器从 amber 改灰)。
- 对话区背景从纯白改为暖奶油 canvas;个人空间下拉菜单、git 状态条、
  二级菜单等收口到统一语义色。

== 三、全面去半透明 ==
- 所有实体面板/二级菜单背景改为不透明(surface token 由半透明白改实色,
  --mobile-menu 三亮色主题改实色)。
- 移除已不透明面板上失效的 backdrop-filter 磨砂(移动端菜单、右键菜单、
  模型模式下拉等)。
- 遮罩 scrim(--overlay-scrim)与刻意玻璃质感装饰保留半透明。

== 四、块展开底色统一 ==
- 思考/工具块展开区底色统一为对话背景色:.collapsible-block 及其 header
  背景由 --surface-soft 改 transparent,与堆叠块(stacked-block)一致,
  消除"单块奶油底 vs 多块透明"的不一致。

== 五、布局修复 ==
- 工作区隐藏后残留空白:.workspace-panel--collapsed 补 flex-basis:0 +
  width/min-width:0,修正 flex-basis:auto 被子元素内容宽度撑开导致内联
  width:0 失效、collapsed 后仍占 ~300px 的问题。

== 六、防回退栏杆(新增)==
- 新增 .stylelintrc.cjs:三条规则拦截裸 hex / rgb()|hsl() 字面色 /
  var(--x, fallback) 兜底 / prefers-color-scheme;存量未清理文件用
  BASELINE_EXEMPT 临时豁免(现仅剩 5 个 admin 页面,本轮按用户要求不处理),
  清理一个移除一个、不再回退。
- package.json:build 脚本接入 stylelint(tsc → stylelint → vite),
  新增 lint:css 脚本及 stylelint/postcss-scss/postcss-html 依赖。
- 修复 25 处 \!important 笔误(zsh 历史扩展污染导致的无效 CSS)。

== 七、辅助脚本(新增 scripts/)==
- lint_check.py:Node 环境不可用时的 stylelint 替身(复刻三规则 + 括号
  校验,支持多行声明检测)。
- color_map.py:硬编码色 → token 反查,判定可映射/野色。
- strip_fallback.py:安全剥离已定义 token 的冗余 fallback。

== 八、文档 ==
- CLAUDE.md / AGENTS.md 前端设计规范更新:颜色规则扩写为三主题定位 +
  两层 token + 表面层次 + 强调色克制 + color-mix 派生 + stylelint 栏杆;
  新增"实体面板禁止半透明"规则;"禁止边缘光晕"补充"仅在用户明确允许
  或要求时才可使用"。

注:前端构建验证(npm run build / lint:css)由用户本机完成;AI 工具
上下文 Node v24 段错误无法运行 node/npm/vite/stylelint。

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-06-06 16:20:58 +08:00

121 lines
4.1 KiB
Python
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

#!/usr/bin/env python3
"""
strip_fallback.py —— 安全剥离 var(--DEFINED_TOKEN, fallback) 的 fallback。
仅当 token 在 _tokens.scss 中已定义时才剥离(此时 fallback 永不生效,剥离=零视觉变化)。
未定义 tokenfallback 是真实值)一律跳过。
带 --write 才落盘,否则只 dry-run 报告。
安全校验:每个被改的位置,改动后只是去掉了 ", fallback"token 名和其余内容不变。
"""
import sys, re, glob, os
def load_defined():
txt = open('static/src/styles/base/_tokens.scss', encoding='utf-8').read()
return set(re.findall(r'(--[a-z0-9-]+)\s*:', txt))
def find_var_spans(s):
"""返回所有 var(...) 的 (start, end, inner) 支持嵌套end 是右括号下一位。"""
spans = []
i = 0
while True:
m = re.search(r'var\(', s[i:])
if not m:
break
start = i + m.start()
# 从 'var(' 的左括号开始做括号匹配
depth = 0
j = start + 3 # points at '('
assert s[j] == '('
k = j
while k < len(s):
if s[k] == '(':
depth += 1
elif s[k] == ')':
depth -= 1
if depth == 0:
break
k += 1
inner = s[j+1:k]
spans.append((start, k+1, inner))
i = k + 1
return spans
def strip_one(s, defined):
"""对字符串 s 处理最外层 var(),递归处理 inner。返回 (新串, 改动数)。"""
spans = find_var_spans(s)
if not spans:
return s, 0
out = []
last = 0
changes = 0
for start, end, inner in spans:
out.append(s[last:start])
# 先递归处理 inner处理嵌套 var
new_inner, c_inner = strip_one(inner, defined)
changes += c_inner
# 解析最外层 var(--tok, fallback?) —— 在顶层逗号处分割
mtok = re.match(r'\s*(--[a-z0-9-]+)\s*', new_inner)
if mtok:
tok = mtok.group(1)
rest = new_inner[mtok.end():]
if rest.startswith(','):
# 有 fallback。token 已定义 → 剥离
if tok in defined:
out.append(f'var({tok})')
changes += 1
else:
out.append(f'var({new_inner})')
else:
out.append(f'var({new_inner})')
else:
out.append(f'var({new_inner})')
last = end
out.append(s[last:])
return ''.join(out), changes
def process_file(path, defined, write):
src = open(path, encoding='utf-8').read()
new, ch = strip_one(src, defined)
if ch and write:
open(path, 'w', encoding='utf-8').write(new)
return ch, src, new
def verify(src, new):
"""校验去掉所有空白后new 必须是 src 删除若干 ', fallback' 的结果。
粗校验new 的非空白字符是 src 非空白字符的子序列,且行数不变。"""
if src.count('\n') != new.count('\n'):
return False, "行数变化"
# 每行new 行必须是 old 行的子序列(只删不增)
for o, n in zip(src.splitlines(), new.splitlines()):
oi = 0
for ch in n:
oi = o.find(ch, oi)
if oi == -1:
return False, f"非子序列: {o!r} -> {n!r}"
oi += 1
return True, "ok"
def main():
write = '--write' in sys.argv
args = [a for a in sys.argv[1:] if not a.startswith('--')]
defined = load_defined()
files = args or (glob.glob('static/src/**/*.scss', recursive=True) +
glob.glob('static/src/**/*.vue', recursive=True))
files = [f for f in files if '_tokens' not in f and '_virtual-monitor' not in f]
total = 0
for f in sorted(files):
ch, src, new = process_file(f, defined, write=False)
if not ch:
continue
ok, msg = verify(src, new)
flag = "OK" if ok else f"FAIL({msg})"
print(f"{ch:3d} strips [{flag}] {f}")
if ok and write:
open(f, 'w', encoding='utf-8').write(new)
total += ch
print(f"\n{'已写入' if write else 'DRY-RUN'} 总剥离: {total}")
if __name__ == '__main__':
main()