50 lines
3.3 KiB
Markdown
50 lines
3.3 KiB
Markdown
# 3-12 [done] Rust Web 3000 Stitch UI Parity Checklist v1
|
||
|
||
> 更新时间：2026-04-29
|
||
>
|
||
> 迁入 done：本清单所有输入、约束、实施项与验收项均已完成，并已通过 Rust 单测与 task119/task120/task121/task122 smoke 复核。
|
||
>
|
||
> 目标：以 `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。
|