71 lines
12 KiB
Markdown
71 lines
12 KiB
Markdown
# 调研发现
|
||
|
||
## 2026-07-17 初始事实
|
||
|
||
- 用户要求直接新建主题用于和现有 Warframe 对比，并授权自行切分图标。
|
||
- 参考图的核心是右侧暗黑骑士主视觉、黑铁底色、低饱和旧金描边、余烬点缀和尖角/切角装饰。
|
||
- 附件实际像素高度为 941px（参考、背景、图标板均为 1672×941）；人物位于背景右半区，左半区天然适合作为侧栏与聊天内容的低干扰背景。
|
||
- 图标板为 1672×941，按 6 列网格提供 16/24/32px 三档图标；应优先切出 32px 版本并在 CSS 中缩放，以保留清晰纹理。
|
||
- codebase-memory 项目 `home-cc-web` 索引状态为 ready（3429 节点、7841 边）。
|
||
- 工作区已有 17 项未提交改动，包含 `public/app.js`、`public/style.css`、`public/index.html` 和回归脚本；本任务必须保留这些改动。
|
||
- 当前 Trellis 指针属于无关任务 `07-11-subagent-card-metadata`；本次已创建独立任务 `07-17-gilded-wasteland-theme`。
|
||
- 主题入口集中在 `public/app.js`：`normalizeTheme`、`applyTheme`、`buildThemePickerHtml` 和 `mountThemePicker`；选择值写入 `document.documentElement.dataset.theme` 与 `localStorage['cc-web-theme']`。
|
||
- 当前 Warframe 主题 ID 为 `gilded`，注册项带 `hidden: true`；选择器过滤隐藏主题，`public/index.html` 还会在首屏前把已存 `gilded` 迁移到 `washi`。
|
||
- 现有回归函数 `assertFrontendGildedThemeContract` 明确断言 Warframe 隐藏和启动迁移，新增主题时需要改成“保留并展示 gilded + 独立 wasteland”的新契约。
|
||
- 计划审查第一次未通过，原因是主题 ID/迁移边界、附件精确路径和相关脏改动审计没有写清；计划已补齐并将重新审查。
|
||
- 第二次计划审查已通过；审查建议为资产 manifest 记录裁剪框，并在收口执行 `git diff --check`、主题专项回归和全量回归。
|
||
- 现有 Warframe 实现全部位于未提交改动中：`app.js` 新增 `gilded` 注册和四图欢迎区；`index.html` 新增启动迁移；`style.css` 新增约 1400 行 Warframe 样式；`regression.js` 新增资产哈希与主题契约断言。
|
||
- `public/app.js` 同时存在与本主题无关的子代理卡片改动；本任务只能修改 `THEME_OPTIONS`/主题逻辑附近，避免触碰后半文件。
|
||
- 相关文件审计基线 SHA-256：`app.js`=`8b320e88…`、`index.html`=`126c353c…`、`style.css`=`89e5f4a0…`、`regression.js`=`3d2c2db…`。本任务结束时以精确 diff 区块复核，而不是按整文件还原。
|
||
- 已有 Warframe 资产位于 `public/assets/themes/` 根目录，包含 `gilded-wasteland.png` 和三张 `warframe-*.jpg`；新主题资产将隔离到 `public/assets/themes/wasteland/` 子目录，避免同名覆盖。
|
||
- 主题系统是纯前端单源：`THEME_OPTIONS` 驱动设置候选，`applyTheme()` 同步 `html[data-theme]` 与 `localStorage['cc-web-theme']`，因此不需要新增后端接口。
|
||
- 新主题使用 body 全画布背景而不复用 `gilded` 的四图 welcome 舞台；桌面背景居中，移动端定位到 `70% 50%` 并加深遮罩。
|
||
- 图标板已得到 6 列×6 行卡片边界和 17 个常用 32px 图标 bbox；输出 64×64 透明 PNG，并使用 manifest 记录坐标与用途。
|
||
- 具体技术设计已写入 Trellis `info.md`，实现/检查上下文已用两份研究文档和前端规范完成配置。
|
||
- 背景已原样落到 `public/assets/themes/wasteland/background.webp`，SHA-256 为 `ee52b136294a7a31181b67e209253fefe7ace8c2b76885e45621484fecb802cb`。
|
||
- 17 枚图标均为 64×64 RGBA，具有透明区和非空金色像素；`status.png` 额外保留 714 个绿色有效像素。人工抽检 new-chat/status/send/settings 边缘干净、尖角完整。
|
||
- 环境没有 ImageMagick；资产代理使用已存在的 Pillow 10.2.0 完成裁剪、连通域去噪与 0.6px 羽化，未新增依赖。
|
||
- UI 已实现：`gilded` 恢复可见、`wasteland` 独立注册，首屏迁移移除，cache bust 更新为 `20260717-wasteland-theme`。
|
||
- `style.css` 新增 Wasteland 变量层、230 处共享暗色 selector 纳入和独立组件层；背景直接挂在 body，`.app/.chat-main/.messages` 透明，侧栏与消息使用分层半透明黑铁面板，因此主视觉不会被页面底色完全遮住。
|
||
- 六个高频控件已引用真实切图：new chat/search/attachment/send/stop/settings；设置 select 额外使用 dropdown 图标。
|
||
- 主线程 diff 审核发现 new chat 会同时显示切图与原生 `+`，已退回 UI 代理做最小 span 隔离修复。
|
||
- 实施期间现有未提交 Warframe welcome 从“四图舞台”变化为单图 `.warframe-hero`，说明相关并行任务仍在写共享文件；本任务不回退该变化，回归代理必须以当前 DOM 为准并避免恢复旧四图断言。
|
||
- new chat 原生 `+` 已包装成仅在 wasteland 隐藏的装饰 span，其他主题仍显示原符号，新主题只显示切图图标。
|
||
- 用户反馈文字偏暗后，Wasteland 主/次/弱文字分别提亮为 `#fff7e6`、`#eadfc9`、`#c9bda6`，链接为 `#e2c58d`，行内代码为 `#f6ead2`；在助手/用户/通用面板上的最低对比度仍为 9.49:1。
|
||
- 一次 `rg` 因模式以 `--target` 开头被当作选项而失败；后续同类命令必须用 `rg --` 结束参数解析。
|
||
- 外部并行会话一度回写 `gilded.hidden`、启动迁移和旧 cache bust；主线程通过运行会话列表定位到另一个 `定制暗金荒野主题` 会话，并在其写入后精确恢复三处契约，没有覆盖其 Warframe 配色/文案/hero。
|
||
- `assertFrontendGildedThemeContract` 已按当前单图 `.warframe-hero` 实现收敛；新 `assertFrontendWastelandThemeContract` 覆盖 17 项 manifest/PNG、背景 hash、双主题可见、无迁移、共享暗色 selector、六个真实控件图标、响应式、reduced-motion、cache bust 和纯白主文字对比度。
|
||
- `gilded-theme` 与 `wasteland-theme` 两个专项回归均已通过；下一阶段由主线程执行全量回归和静态复核。
|
||
- 外部会话在 17:35:19 第三次回写 `app.js`/`index.html`：恢复 `gilded hidden`、`gilded -> washi` 和旧 cache bust；`style.css` 的 `--text-primary: #fff` 与完整 Wasteland 样式仍完好。
|
||
- 为避免继续互相覆盖，回归代理按约定停止；当前需要用户先停止另一个运行中的 `定制暗金荒野主题` 会话，之后再补回三处小改动并重新执行专项/全量回归。
|
||
- 用户明确否定当前视觉：边框、图标和整体质感均不像参考图；此前“阶段 4 完成”的结论失效，必须以截图对照为准返工。
|
||
- 失败根因不是缺少更多装饰，而是层级方向错了：当前给过多普通控件统一金边/切角/渐变，背景遮罩过重，64×64 彩色图标直接缩小后显得糊且杂。
|
||
- 当前环境无 Playwright/Chromium，但有 `/usr/bin/firefox`；可创建仅用于规划验收的本地 mock HTML，用 headless Firefox 生成 1672×941 截图，不需要安装依赖或重启 ccweb。
|
||
- 新准则：面板卡片化减少、边框 1px 暗铜、切角只用于三类核心框架、图标使用用户切图 alpha mask 统一旧金材质，人物右侧清晰完整。
|
||
- 已建立 `.planning/gilded-wasteland-theme/visual-preview.html` 作为可复用的桌面结构 mock；但 Firefox headless 两种 profile 均无法生成截图，第二次明确报 `RenderCompositorSWGL failed mapping default framebuffer`，且系统无 Xvfb。
|
||
- 不为截图安装浏览器/驱动；后续视觉判断使用用户参考图的几何比例、现有 CSS 静态审计、图标原图抽检和用户在实时页面的反馈闭环。
|
||
- 用户补充了当前页与设计稿的五张一对一局部对比图，确认具体错误：新会话误用十字星、附件误加方框、输入区外框断裂且缺少中心徽记、侧栏框线不连续、所有图标误用统一 32px 来源。
|
||
- 已改为直接从完整设计稿提取透明蚀刻框：`frames/new-chat.png`、`search.png`、`project.png`、`active-session.png`、`composer.png`、`tool-call.png`；其中 composer 保留设计稿底部中心徽记。
|
||
- 已从图标板重新按 16/24px 逻辑档提取 `icons/ui/`：search/dropdown/theme/ai/status/attachment/send/stop/settings/user/terminal，不再复用统一 64px 大图缩小。
|
||
- Wasteland 尾部新增高保真覆盖层：新会话恢复简单 `+`，附件无按钮框，右侧操作按钮保留独立切角框；侧栏宽 316px、顶栏 57px、输入框 806×74px；消息回到 8px 轻圆角薄线框，背景遮罩显著减轻。
|
||
- CSS cache bust 已更新为 `20260717-wasteland-hifi`；本地服务已验证 stylesheet、composer frame、attachment icon 均返回 HTTP 200。
|
||
- 用户刷新后指出输入框存在明显错位与虚边；实际根因是旧 `.input-wrapper:focus-within` 高优先级 3px 光圈仍生效，同时 composer 素材保留了设计稿外/内两层顶线。
|
||
- 已对 focus/drag/note 三种输入状态强制清除 border/outline/box-shadow，并把 composer 素材左右对称收紧 5px、上移保留主蚀刻线；中心徽记量测仍为资产几何中心 `x=403/807`，未做错误偏移。
|
||
- CSS cache bust 已推进为 `20260717-wasteland-hifi-2`，新 CSS 与 composer 资产均通过本地 HTTP 200 校验。
|
||
- 新会话 `+` 消失是选择器错配：DOM 使用 `.new-chat-glyph`，高保真覆盖却写成不存在的 `.new-chat-native-icon`，同时旧高优先级规则仍将真实 span 隐藏。
|
||
- 顶部下拉图标切图在小尺寸下近乎透明，改用框内 CSS 三角形更稳定；会话 `…` 偏移与菜单不显示分别来自普通 flex 挤压和 `.session-item { overflow: hidden; }` 裁切，现已固定右侧定位并仅在菜单打开时解除裁切。
|
||
- 消息头像重叠不是重复消息节点：`createMsgElement()` 内联渲染了 `/codex.png`，高保真 Wasteland 又给同一 `.msg-avatar` 设置了 `ui/ai.png` 背景；主题层必须显式隐藏内部 `img/svg`。
|
||
- 输入框错层来自非等比缩放：真实内容框高度 74px，但 `::after` 固定显示 807×101 整框；主内容宽缩到约 650px 时只有横向被压缩，底部徽记仍按 101px 高度绘制。现已拆为固定框壳和独立徽记两层，分别响应宽高。
|
||
- 最新截图底部贯穿整宽的“虚线”不属于 composer 框，而是透明 `.input-area` 继续透出了背景素材底部的暖色横线；输入区需要独立黑铁遮罩，不能完全透明。
|
||
- 输入区原生铅笔/队列 SVG 与主题切图混用，材质必然不统一；现统一使用图标板的 chat/loading/send/stop，并复用从设计稿实际按钮裁出的 46px 蚀刻框。
|
||
- 框壳、人工底线、独立徽记的三层方案虽然规避非等比拉伸，但引入新的边线叠加和视觉中心误差；最终改为完整 807×101 资产单层等比缩放。源裁区中心徽记原本向右约 8px，已只平移下半部装饰层，中心主体 alpha 重心为 403.7、画布中心为 403.0。
|
||
- 右侧停止按钮的“色块”来自 Wasteland 专用棕色渐变叠加 24px stop 图标；现取消实心渐变并回退到透明黑铁底和 20px 细节图标。
|
||
- 用户最后圈出的独立边框来自 `.note-mode-btn/.send-btn/.abort-btn::after` 继续加载 `composer-action.png`，不是输入框主框；已彻底禁用该伪元素。图标几何居中仍不等于视觉居中，发送图标原 alpha 重心向右约 1.6px，因此资产生成器新增 composer 图标 alpha 重心校正。
|
||
- 24/30px 输出画布不等于有效图形尺寸：30px note 的实际可见区只有 22×20px。最终 note 使用 36px 画布得到 28×24 可见区，send 为 26×24，AI/用户分别达到 31×32 和 32×32，避免小图标在透明画布中显得缩了一圈。
|
||
|
||
## 待确认
|
||
|
||
- `THEME_OPTIONS` 完整注册内容及当前未提交差异归属。
|
||
- Warframe 主题样式的隔离方式与可共享的暗色完成选择器。
|
||
- 当前测试命令与可用的浏览器视觉验收入口。
|