Files
mnote/design/03-rust-web/done/3-12-rust-web-3000-stitch-ui-parity-checklist-v1.md
T

50 lines
3.3 KiB
Markdown
Raw Normal View History

2026-04-29 16:33:15 +08:00
# 3-12 [done] Rust Web 3000 Stitch UI Parity Checklist v1
2026-04-29 16:23:49 +08:00
2026-04-29 16:33:15 +08:00
> 更新时间:2026-04-29
>
> 迁入 done:本清单所有输入、约束、实施项与验收项均已完成,并已通过 Rust 单测与 task119/task120/task121/task122 smoke 复核。
>
2026-04-29 16:23:49 +08:00
> 目标:以 `design/design/stitch/260429` 的 Stitch 产物为视觉基准,把 3000 的 Rust Web 页面推进到更接近目标 UI,同时保留真实页面树、文件树、页面新建和 `leptos-tiptap` runtime。
## 输入基准
- [x] 读取 Stitch 设计系统:`DESIGN.md`
- [x] 读取 Stitch 静态结构:`code.html`
- [x] 查看目标截图:`screen.png`
- [x] 对比当前 3000 截图:`/mnt/Data1T/mnote/tmp/image copy 33.png`
## 约束
- [x] 不直接整包复制 Stitch HTML,避免绕开 Rust projection / tree shell / editor island。
- [x] 不恢复 Next.js 为主入口,3000 继续由 `mnote-web` 承载。
- [x] 页面树、文件树、新建页面、正文编辑继续使用当前已接入的运行链路。
- [x] 不引入 Tailwind CDN、Google Fonts、远程图片作为运行依赖。
## 实施项
- [x] 侧栏外壳对齐 Stitch:240px 左栏、浅灰无硬边框、工作区头像/标题、快捷操作区、底部入口。
- [x] 侧栏内容对齐 Stitch:星标置顶、我的页面、Explorer tab 同屏呈现,并保留真实页面树和文件树 DOM/testid。
- [x] 页面树/文件树行样式对齐 Stitch:12px 层级缩进、14px 文本、soft-bleed hover、当前页选中态。
- [x] 顶栏对齐 Stitch:44px 高度、左侧面包屑、右侧 Public/收藏/历史/AI/搜索/更多工具。
- [x] 文档画布对齐 Stitch:居中 880px 内容列、80px 顶部留白、页面图标、标题、元信息、分割线。
- [x] `leptos-tiptap` 外壳对齐 Stitch:编辑器跟随文档列宽、正文 16px/1.6、空态提示不遮挡真实编辑器。
- [x] 浮动按钮对齐 Stitch:右下帮助按钮 + 绿色 AI 圆形按钮。
- [x] 首页 active page 链路不退化:根页仍能看到真实 sidebar,并可打开当前页。
- [x] 验证 Rust 单测和关键 smoke,确保树与编辑器 runtime 未断开。
## 验收
- [x] `cargo test -p mnote-web` 通过。
- [x] 至少一个文档 shell smoke 通过,确认 `wolai-sidebar`、页面树、文件树、`leptos_tiptap_island` 仍存在。
- [x] 如 3000 服务可用,使用浏览器截图或 DOM 检查确认首屏侧栏、顶栏、文档画布接近 Stitch 目标。
## 验证记录
- [x] `cargo test -p mnote-web`126 个单测通过,doc tests 4 个 ignored。
- [x] `node scripts/task119-rust-web-wolai-visual-regression-smoke.js`:通过,截图 `test-results/task119-rust-web-wolai-visual-regression-root.png`
- [x] `node scripts/task120-rust-web-tree-integration-smoke.js`:通过。
- [x] `node scripts/task121-rust-web-editor-island-hydration-smoke.js`:通过,确认 hydrate、输入、保存、reload 读回。
- [x] `node scripts/task122-rust-web-create-page-ui-smoke.js`:通过,确认侧栏 `+` 新建页面并进入文档页。
- [x] 手动 Playwright 截图:`test-results/task123-stitch-document-parity.png`,确认文档页头、真实页面树/文件树、编辑器正文列对齐。
- [x] 修复 `我的页面 / Explorer` 切换:文件树不再作为第二个独立 Explorer section 渲染,点击 Explorer tab 后切换到文件树 panel。