docs: 更新 CLAUDE.md 设计规范至 Fluent 2 + 忽略日志文件
Deploy Wiki to Production / deploy (push) Has been cancelled

- 品牌色 #1677FF → #0078D4,标题渐变修正
- 功能色、圆角、行高、字体族同步 Fluent 2 值
- 移除已不存在的 badgeStyle 引用
- 补充 ui-ux-pro-max 技能
- .gitignore 添加 **/logs/ 排除日志文件
This commit is contained in:
zdh
2026-06-06 19:31:38 +08:00
parent 9d2851dc56
commit 1b1b503eee
2 changed files with 18 additions and 13 deletions
+1
View File
@@ -2,3 +2,4 @@
qModel/.git/
招标投标AI推广应用政策解读/.git/
.claude/skills/ui-ux-pro-max/
**/logs/
+17 -13
View File
@@ -53,13 +53,13 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
**新增文档**:在对应分类的 `items` 数组中添加条目。如果分类不存在,新建一个分类对象。
**颜色映射**`wikiData``color` 字段`badgeStyle` 对象的语义约定):
- `pink` — 深度分析、政策解读
- `blue` — 工程指南、数据平台
- `mint` — 调研研究、商业分析
- `lavender` — 参考资源、AI 工具
**颜色映射**`wikiData``color` 字段的语义约定,颜色值直接写在各分类条目中):
- `pink` — 深度分析、政策解读、政务行业
- `blue` — 工程指南、数据平台、医疗健康
- `mint` — 调研研究、商业分析、配送到家
- `lavender` — 参考资源、AI 工具、关于作者
`badgeStyle` 对象已定义对应 CSS 样式(约 `index.html:391`),当前渲染函数未直接渲染 badge,但保留供未来扩展。新增分类时仍需选择语义匹配的颜色并确保 `badgeStyle` 中有对应键
新增分类时选择语义匹配的颜色,颜色样式通过 `card-badge` 类渲染
### 页面特性
@@ -91,7 +91,7 @@ wikiData (声明式) → allItems (展开数组, 附加 section/icon) → 视图
所有报告页(`{主题}/报告/*.html`)遵循统一的 HTML 模板结构:
1. `:root` 块复制 CSS 设计 Token(含品牌色、功能色、中性色、圆角、阴影等变量)
2. 固定 header-barsticky top,品牌标题渐变 `linear-gradient(135deg, #1677FF, #722ED1)`
2. 固定 header-barsticky top,品牌标题渐变 `linear-gradient(135deg, #0078D4 0%, #2B88D8 100%)`
3. 单列容器布局,`max-width: 1200px` 居中
4. Markdown 内容通过内联 HTML 渲染(表格、代码块、列表)
5. 语言属性 `lang="zh-CN"`
@@ -108,13 +108,16 @@ wikiData (声明式) → allItems (展开数组, 附加 section/icon) → 视图
## UI 设计规范
所有页面遵循 `.claude/design-tokens.md` 中的 Ant Design 阿里云风格设计规范。关键约束:
所有页面遵循 `.claude/design-tokens.md` 中的 **Microsoft Fluent 2 / Windows 11** 设计规范(2026-06 从 Ant Design v5 迁移)。关键约束:
- **配色方案**:品牌色 `#1677FF`,功能色(成功 `#52C41A`、警告 `#FAAD14`、错误 `#FF4D4F`
- **字体规范**:基准字号 14px,行高 22px,字体族使用系统默认 + 中文字体回退
- **圆角体系**`2px / 6px / 8px / 12px` 四级
- **间距基准**8px 单位
- **主题**:仅 `index.html` 支持亮色/暗色切换(通过 `data-theme` 属性 + localStorage 持久化);报告页统一使用亮色主题,不定义暗色变量。注意 `design-tokens.md` §8 声称"全部页面统一使用亮色主题"与实际不符——索引页的暗色模式是刻意设计,`design-tokens.md` 此处有误
- **配色方案**:品牌色 `#0078D4`Fluent 2 Communication Blue,功能色(成功 `#107C10`、警告 `#FF8C00`、错误 `#FF4D4F`
- **字体规范**:基准字号 14px,行高 20px,字体族 `Segoe UI Variable Text``Segoe UI``PingFang SC` / `Microsoft YaHei` 回退;等宽字体 `Cascadia Code``Fira Code``SF Mono`
- **圆角体系**`2px / 4px / 6px / 8px` 四级Fluent 2 更方正)
- **间距体系**旧版 8px 基准保留向后兼容,新版推荐 4px 基准的 `--fluent-spacing-*` 系列
- **阴影与层级**Fluent 2 Elevation 体系(2/4/8/16/28/64 六级),对应 z-index 100600
- **材质**:Acrylic(亚克力半透明模糊,导航栏用)、Mica(云母,标题栏用)、Smoke(烟雾遮罩,Modal 用)
- **动效**:标准缓动 `cubic-bezier(0.8, 0.0, 0.2, 1.0)`,时长 83ms333ms 四级
- **主题**`index.html` 支持亮色/暗色切换(`data-theme` 属性 + localStorage 键 `wiki-theme` + `prefers-color-scheme: dark` 系统偏好);报告页统一亮色主题
创建新 HTML 页面时应直接复用 `:root` CSS 变量块,不要重新定义颜色值。完整规范详见 `.claude/design-tokens.md`
@@ -135,5 +138,6 @@ wikiData (声明式) → allItems (展开数组, 附加 section/icon) → 视图
|------|------|---------|
| `remote-sync` | rsync 增量同步到远端服务器,自动排除 `node_modules`/`.git` 等 | `/remote-sync` 手动调用 |
| `deep-research` | 生成格式控制的研究报告,含证据追踪、引用治理和多轮综合 | `/deep-research` 手动调用 |
| `ui-ux-pro-max` | UI/UX 设计与前端实现辅助 | 按需调用 |
`deep-research` 技能包含参考资料(`.claude/skills/deep-research/references/`)和调研笔记(`research-notes/`),执行深度研究时会用到。