docs(ds-flow): Phase 1.6-1.7 — ui_kits 标 DEPRECATED + 真源指针收敛
用户定:ui_kits 暂留(整屏布局尚无 HTML 替代,重建属 L3 不在本轮),标废弃 不删。 - design/CLAUDE.md:顶部加「真源对照」横幅(令牌→prototype/tokens.css、原子 →atoms.css+index.html、图标→icons.js、Flutter→client/lib/widgets、Web→ web/*;colors_and_type.css 降级别名、design/flutter 已删、ui_kits DEPRECATED、 _ds_manifest/_ds_bundle 历史派生物);§6「修改设计系统时」重写为 ds-flow 流程。 - design/ui_kits/DEPRECATED.md:醒目废弃标记 + 真源指引 + 暂留理由。 - 1.7:确认无构建/CI 消费 _ds_manifest/_ds_bundle/_adherence,登记职责交 index.html,旧工具产物标历史派生物(不删,无消费者)。 Phase 1(原型单源三件套)完成。 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
wangjia
+21
-6
@@ -2,6 +2,17 @@
|
||||
|
||||
> 本文件是项目持久指令,任何会话自动注入。目标:让任何 agent(含 Claude Code)都能**完全还原**这套设计,不走样。生产前端是 **Flutter**;React/HTML 是视觉规范参考。
|
||||
|
||||
> ⚠️ **真源对照(2026-07 ds-flow 治理后,以此为准;下文历史章节的旧路径逐步迁移中)**
|
||||
> | 关注点 | 现在的真源 | 已废弃/降级 |
|
||||
> |---|---|---|
|
||||
> | 设计令牌 | `design/prototype/tokens.css`(ds-flow 原型单源) | `colors_and_type.css` 现为薄 `@import` 别名,勿在此加变量 |
|
||||
> | 组件原子 | `design/prototype/atoms.css` + 登记页 `design/prototype/index.html` | — |
|
||||
> | 图标 | `design/prototype/icons.js`(Lucide sprite 单源) | — |
|
||||
> | Flutter 组件实现 | `client/lib/widgets/`(canonical)+ `client/lib/pangolin_theme.dart`(实现层) | `design/flutter/` **已删除**;本文下文 `flutter/…` 路径作废 |
|
||||
> | 官网/用户中心实现 | `web/website/` · `web/usercenter/`(各自 canonical) | — |
|
||||
> | 整屏视觉参考 | `design/ui_kits/`(**DEPRECATED · 仅历史整屏布局参考**,勿当真源;整屏 HTML 化后退役) | 旧 DS 工具 `_ds_manifest.json`/`_ds_bundle.js` 为历史派生物 |
|
||||
> 详见根 `CLAUDE.md`「## 前端设计系统治理(ds-flow)」+ `docs/frontend-ds-refactor-plan.html`。
|
||||
|
||||
---
|
||||
|
||||
## 0. 一句话定位
|
||||
@@ -105,12 +116,16 @@ SKILL.md ← Agent Skill 入口
|
||||
|
||||
---
|
||||
|
||||
## 6. 修改设计系统时(本项目是 DS 工程)
|
||||
- 改令牌 → 编辑 `colors_and_type.css` **同时**同步 `flutter/pangolin_theme.dart`(两者必须一致)。
|
||||
- 改 specimen 卡 → `preview/*.html`,首行带 `<!-- @dsCard group="…" -->`。
|
||||
- 改组件视觉 → 同步改 React(`ui_kits/`)与 Flutter(`flutter/widgets/`)两处。
|
||||
- 改完跑 `check_design_system` 确认无报错(动效 token 标 `@kind other`)。
|
||||
- logo 改动 → 同步 5 个 SVG(`assets/`)+ `flutter/assets/` 副本 + React 内联 `Mark`/`DMark` + Flutter `pangolin_logo.dart`。
|
||||
## 6. 修改设计系统时(ds-flow;以此为准,旧写法已废)
|
||||
- **改令牌** → 只改 `design/prototype/tokens.css`(原型单源),然后跑 codegen:
|
||||
`node design/codegen/gen_flutter_tokens.mjs`(生成 `client/lib/pangolin_tokens.gen.dart`,勿手改)+
|
||||
`cd web/{website,usercenter} && npm run gen:tokens`。**勿改 `colors_and_type.css`**(它已是 `@import` 别名)。
|
||||
- **加/改组件原子** → 先在 `design/prototype/atoms.css` 定义 + `design/prototype/index.html` 登记页加展示卡(L1 无例外先原型),再落 canonical 实现:Flutter `client/lib/widgets/`、官网 `web/website/`、用户中心 `web/usercenter/`。
|
||||
- **加/改图标** → 先进 `design/prototype/icons.js` sprite,三端(Flutter/website/usercenter)只从此集取。
|
||||
- 评审原型:`node design/prototype/serve.mjs` → `http://localhost:5180/`(给 URL,不截图)。
|
||||
- **禁止**再向 `design/` 提交 Dart/TS 组件代码副本(会漂移;`ui_kits/` 为历史 DEPRECATED 参考,勿新增)。
|
||||
- logo 改动 → 同步 SVG(`design/assets/` + `client/…` 副本)+ Flutter `pangolin_logo.dart` + Web 内联 `Mark`。
|
||||
- 闸:改完跑 `bash ci/check-codegen-drift.sh`(codegen 零 diff)+ `flutter analyze`/`flutter test`(含 golden)。
|
||||
|
||||
---
|
||||
|
||||
|
||||
@@ -0,0 +1,20 @@
|
||||
# ⚠️ DEPRECATED — 历史整屏视觉参考,勿当真源
|
||||
|
||||
本目录(`design/ui_kits/`)是早期的 React/HTML 端原型(mobile/tablet/desktop/website/usercenter
|
||||
六端整屏)。**已废弃为「仅历史整屏布局参考」,不再是设计真源**(2026-07 ds-flow 治理后)。
|
||||
|
||||
## 现在的真源在哪
|
||||
- 设计令牌 → `design/prototype/tokens.css`
|
||||
- 组件原子 → `design/prototype/atoms.css` + 登记页 `design/prototype/index.html`
|
||||
- 图标 → `design/prototype/icons.js`
|
||||
- 生产实现(canonical)→ Flutter `client/lib/widgets/`、官网 `web/website/`、用户中心 `web/usercenter/`
|
||||
|
||||
## 为什么暂留而不删
|
||||
原子层已被 prototype/ 捕获,但**整屏布局尚无 HTML 替代**(重建整屏属 L3 新屏工作,不在本轮治理范围)。
|
||||
待整屏 HTML 化迁进 `design/prototype/screens/` 后,本目录退役删除。
|
||||
|
||||
## 铁律
|
||||
- **勿在此新增/修改** jsx/css 组件副本(会与 canonical 漂移;根 CLAUDE.md「禁向 design/ 提组件代码副本」)。
|
||||
- 需要改组件视觉,去改真源(prototype/ + canonical 实现),不要动这里。
|
||||
|
||||
详见根 `CLAUDE.md`「## 前端设计系统治理(ds-flow)」+ `docs/frontend-ds-refactor-plan.html`。
|
||||
@@ -47,9 +47,9 @@
|
||||
收敛现有分散图标（website Icon.astro / usercenter icons.tsx / Flutter pangolin_icons.dart 三处的图标集）
|
||||
- [x] 1.5 `design/prototype/index.html`：活登记页——三…两主题（light/dark）切换 + `data-swatches` 声明式色板 +
|
||||
字号梯度 + 圆角/间距/阴影 + 全部公用组件原子展示卡 + 图标库全展示。**每个 atom 必须在此登记**
|
||||
- [ ] 1.6 `design/ui_kits/` 的 jsx/css 端原型：提炼进 prototype 后**删除 jsx 组件副本**（消除与
|
||||
- [x] 1.6 `design/ui_kits/` 的 jsx/css 端原型：提炼进 prototype 后**删除 jsx 组件副本**（消除与
|
||||
「禁向 design/ 提组件代码副本」的冲突 + 漂移源）；保留必要的屏级 HTML 布局参考迁进 `prototype/screens/`
|
||||
- [ ] 1.7 更新/退役 `_ds_manifest.json` + `_ds_bundle.js`：登记簿职责交给 `index.html`，
|
||||
- [x] 1.7 更新/退役 `_ds_manifest.json` + `_ds_bundle.js`：登记簿职责交给 `index.html`，
|
||||
manifest 若仍被消费则保留为派生产物（记清谁是真源）
|
||||
|
||||
---
|
||||
|
||||
Reference in New Issue
Block a user