chore: rebuild release package
This commit is contained in:
70
.planning/gilded-wasteland-theme/findings.md
Normal file
70
.planning/gilded-wasteland-theme/findings.md
Normal file
@@ -0,0 +1,70 @@
|
||||
# 调研发现
|
||||
|
||||
## 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 主题样式的隔离方式与可共享的暗色完成选择器。
|
||||
- 当前测试命令与可用的浏览器视觉验收入口。
|
||||
43
.planning/gilded-wasteland-theme/progress.md
Normal file
43
.planning/gilded-wasteland-theme/progress.md
Normal file
@@ -0,0 +1,43 @@
|
||||
# 进度日志
|
||||
|
||||
## 2026-07-17
|
||||
|
||||
- 已读取 `frontend-skill`、`planning-with-files`、`todo-list-csv` 与 Trellis 工作流。
|
||||
- 已初始化 Trellis 上下文,确认工作区存在其他未提交改动。
|
||||
- 已确认 codebase-memory 索引可用。
|
||||
- 已建立 7 步执行计划、TODO CSV 和本地持久化规划文件。
|
||||
- 计划审查首次发现 `gilded` ID、启动迁移、附件路径与脏改动边界不明确;已补充主题 ID 契约、资产清单与强制差异审计步骤。
|
||||
- 第二轮计划审查已通过;已完成相关脏文件、Warframe 新增区块和资产目录的初步审计,并记录开始实施前的文件哈希。
|
||||
- 阶段 1 完成:确定 `gilded`/`wasteland` 双 ID 契约与最小合并边界;进入任务规格、资产裁剪和实施上下文整理。
|
||||
- 已完成主题架构与资产裁剪研究,形成 `info.md` 技术设计,并配置 Trellis implement/check 上下文。
|
||||
- 阶段 2 完成:任务上下文校验通过(implement 5 条、check 4 条);进入本地背景和透明图标资产生成。
|
||||
- 阶段 3 完成:背景和 17 枚图标/manifest 已生成,格式、尺寸、alpha、像素内容与背景哈希验证通过;进入主题样式与注册实施。
|
||||
- UI 主实现完成并通过语法/静态检查;主线程正在收口 new chat 图标重复的细节问题,随后进入主题回归契约补充。
|
||||
- 阶段 4 完成:重复加号已修复,用户要求的文字提亮已完成并通过 WCAG 对比度计算;进入 Wasteland/Warframe 当前态回归契约更新。
|
||||
- 阶段 5 完成:当前 Warframe 单图契约与新 Wasteland 完整契约均已落盘,两个主题专项 target 通过;进入全量自动化与 diff 审查。
|
||||
- 全量回归首次运行失败:外部并行会话在专项通过后回写了旧的 `gilded hidden` 回归断言;跨会话消息因目标仍在处理中未送达,当前等待共享写入稳定后做最终合并。
|
||||
- 阻塞确认:外部会话第三次覆盖共享主题契约,已停止反复写入。Wasteland 背景、图标、样式和主文字 `#fff` 均保留;待另一个会话停止后继续最终合并、全量回归与浏览器验收。
|
||||
- 用户视觉验收失败,任务回滚到视觉实现阶段:当前版本未完成。已重定视觉准则,并追加“逐项对照参考图”作为最终独立验收步骤。
|
||||
- 已尝试建立本地 mock 并用 Firefox 截图;因容器图形 framebuffer 不可用且无 Xvfb,停止浏览器截图路线,转为并行视觉/图标审计后直接重构 Wasteland 隔离样式。
|
||||
- 根据用户局部对比图完成第一轮高保真返工:直接接入设计稿真实边框与分规格图标,重做侧栏顶部、选中会话、消息、工具块和输入区;静态检查通过,18 项新资源引用无缺失,服务端实际请求返回 200。当前不标记完成,等待用户刷新后的视觉确认。
|
||||
- 根据最新截图完成输入框第二轮校正:移除遗留焦点虚框,压缩双层外线为单一主蚀刻线,保持中心徽记精确居中;`git diff --check` 与线上静态资源请求验证通过。继续等待实际页面视觉确认。
|
||||
- 根据用户标注修复侧栏控件:`+` 改为实际 DOM 文字符号并恢复显示,下拉改为框内 CSS 三角形;会话操作区改为绝对定位并在展开时解除裁切。cache bust 推进到 `wasteland-hifi-3`,新增四项专项回归断言,Wasteland target 与 diff 检查通过。
|
||||
- 根据新截图修复两处结构错误:荒野头像隐藏内联 `codex.png`,只保留主题 AI 图标;composer 不再把 807×101 整图压到窄容器,新增 807×74 框壳和 547×51 独立徽记,并修正误写的 `.input-mode-row` 为真实 `.chat-controls`。cache bust 推进到 `wasteland-hifi-4`,新增资产尺寸与叠图回归断言,专项 target、语法、diff 和在线 200 校验通过。
|
||||
- 按用户最新圈注继续重做 composer:输入区增加不透明黑铁渐变以遮住背景素材透出的底部假线;底边降亮;从设计稿提取 46×46 操作框;新增 note/chat、queue/loading 两枚 24px 图标,并把 stop 升到 24px,统一替换输入区原生 SVG。cache bust 推进到 `wasteland-hifi-5`,专项回归和 7 项线上资产请求通过。
|
||||
- 第三次 composer 收口:撤销框壳/底线/徽记三层拼接,改为设计稿完整 `composer.png` 单层按 807×101 等比绘制;中心主体实测误差 0.7px;停止按钮取消棕色实心背景并换回更轻的 20px stop 图标。cache bust 推进到 `wasteland-hifi-6`,专项回归、语法、diff 与在线资源校验通过。
|
||||
- 按用户反馈调整消息层:助手/系统气泡底色从 0.66 降到 0.34,用户气泡从 0.62 降到 0.40;磨砂提升为 16px blur + 1.12 saturate,并补 WebKit 前缀。cache bust 推进到 `wasteland-hifi-7`。
|
||||
- 输入区按钮最终清理:移除 `composer-action` 伪元素框,普通态/悬停态强制透明且无 border/box-shadow;点击区收为 40px。note/queue/send/stop 在生成阶段按 alpha 重心自动居中,四枚图标中心误差均小于 0.5px。cache bust 推进到 `wasteland-hifi-8`,专项回归、语法、diff 与在线 CSS 校验通过。
|
||||
- 图标尺寸校正:composer 的 note/queue/send 改用图标板 32px 源,note 单独输出 36px(可见 28×24),send 输出 30px(可见 26×24);AI/用户头像改用 32px 源并输出/显示 36px,容器增至 42px。cache bust 推进到 `wasteland-hifi-10`,中心误差保持在 0.53px 内,专项回归和 4 项在线资产校验通过。
|
||||
- 消息磨砂第二轮:助手/系统底色降到 0.22,用户气泡降到 0.28,边线同步降亮;backdrop blur 提升到 22px、saturate 1.18。cache bust 推进到 `wasteland-hifi-11`。
|
||||
- 根据实际截图纠正“数值透明但视觉实心”的问题:移除用户气泡棕色染层,用户/助手底色改为中性黑 0.08/0.10;强模糊从 22px 回调到 14px,避免背景被抹成色块。cache bust 推进到 `wasteland-hifi-12`。
|
||||
- 新截图确认实心黑块来自嵌套工具层而非外层气泡:`.tool-call-content.reasoning/command/file-change` 仍被早期高优先级规则设为 0.90。现以同级选择器和 `!important` 将 tool-call/tool-group 降到 0.04,内容层降到 0.035,标题层降到 0.02,并保留 10px 轻磨砂。cache bust 推进到 `wasteland-hifi-13`。
|
||||
- 用户再次明确范围仅为消息气泡背景。已撤销本轮协作卡片层改动,只针对助手/跨会话/系统 `.msg-bubble`:去掉黑色染层,改为 2.2% 中性暖色薄膜,并以 12px blur + 1.28 brightness 让暗背景上的磨砂和透景可辨;cache bust 推进到 `wasteland-hifi-14`,专项回归、语法与 diff 检查通过。
|
||||
- 用户截图确认 hifi-14 视觉仍无变化。通过 Firefox WebDriver 读取计算样式,发现旧规则 `html[data-theme='wasteland'] :is(... .msg.system .msg-bubble[data-tone='info'])` 因 `:is()` 采用最高参数 specificity,仍将助手气泡背景锁在 `rgba(12,15,13,0.88)`;hifi-14 实际只覆盖了 backdrop filter。现仅给消息气泡背景/边线/内高光声明增加 `!important`,浏览器计算值已变为 `rgba(226,214,190,0.022)` 且背景图纹理可穿透;cache bust 推进到 `wasteland-hifi-15`,专项回归、语法、diff 与在线资源检查通过。
|
||||
- 修复侧栏页脚品牌错位:图标资产 alpha 重心正常,根因是设置按钮按 `vertical-align: middle`、品牌 `inline-flex` 按 baseline 排版。浏览器实测原设置按钮中心 `22.93px`、品牌中心 `14px`;页脚改为 flex 双轴居中并将品牌行高收为 1 后,页脚中心 `35.5px`、设置按钮与品牌均为 `36px`。cache bust 推进到 `wasteland-hifi-16`,专项回归、语法、diff 与在线资源检查通过。
|
||||
- 修复多行输入时 composer 框错位:移除固定 `807/101` 高宽比的 `.input-wrapper::before`,把原始 `composer.png` 直接绑定为输入框本体的九宫格 `border-image`(slice `10 10 43 10`,底部 outset `27px`)。顶部/四角保持原图,侧边随真实高度拉伸,底部徽记跟随实际底边;焦点/拖拽/笔记态不再用 `border:0` 破坏 frame。Firefox 实测单行 `74px`、多行 `204px` 均正确,伪元素计算值为 `display:none`。cache bust 推进到 `wasteland-hifi-17`,专项回归、语法、diff 与在线资源检查通过。
|
||||
- 按用户指定将助手/跨会话/系统消息气泡的 `backdrop-filter` 从 `blur(12px)` 降为 `blur(3px)`,保留 `saturate(1.16) brightness(1.28)` 与 WebKit 前缀,使背景细节更清楚。cache bust 推进到 `wasteland-hifi-18`,专项回归、语法、diff 与在线 CSS 检查通过。
|
||||
- 按用户反馈精简侧栏页脚:保留可点击的设置齿轮,隐藏 `CC-Web` 前纯装饰性的主题星标,避免两个金色图标并排产生视觉冲突;原有 flex 垂直居中保持不变。cache bust 推进到 `wasteland-hifi-19`,专项回归、语法、diff 与在线资源检查通过。
|
||||
- 修复协作代理卡顶部轻微错位:Wasteland 外框左上有切角,但 `.collab-agent-header` 原先无内边距且标题 token 按 baseline 排列。现标题行设为 `min-height:24px; padding:4px 8px 0`,`collab-agent-title-wrap` 改为几何居中;Firefox 复刻确认标题避开切角且子卡布局未变化。cache bust 推进到 `wasteland-hifi-20`,专项回归、语法、diff 与在线资源检查通过。
|
||||
- 按用户要求移除 `.input-area` 的独立黑色渐变面板,强制设为 `background: transparent !important`,并保持无阴影、无 backdrop filter;输入框本体及动态 `border-image` 不变。cache bust 推进到 `wasteland-hifi-21`,专项回归、语法、diff 与在线 CSS 检查通过。
|
||||
- 实现新建对话欢迎卡:从用户提供的 RGB 素材板中按金色像素分离 `1095×875` RGBA 主框,排除烘焙棋盘格和下方其他组件;另裁出干净 `600×350` 暗纹理 WebP。静态/动态欢迎 DOM 均新增独立 surface/frame 图层,文字置于安全区并使用 `#fff` 主标题与旧金副标题。Firefox 实测桌面卡片 `614.6×491.1`,底部距输入区约 19px;500px 窄屏卡片 `464×370.8` 且横向溢出为 0。cache bust 推进到 `wasteland-hifi-22` / `theme-bundle-2`,Wasteland 与 Gilded 双主题回归、语法、diff、线上资源 200 检查均通过。
|
||||
- 用户指出欢迎卡位置“不正”:根因是按参考图左侧构图保留了块级起始对齐,浏览器实测卡片中心比聊天画布中心偏左约 147px。现给欢迎 hero 增加 `margin:0 auto`,复测卡片中心 `838.49px`、画布中心 `840.5px`,仅余约 2px 滚动条/像素取整差。cache bust 推进到 `wasteland-hifi-23`,Wasteland/Gilded 双主题回归、语法、diff 与在线版本检查通过。
|
||||
69
.planning/gilded-wasteland-theme/task_plan.md
Normal file
69
.planning/gilded-wasteland-theme/task_plan.md
Normal file
@@ -0,0 +1,69 @@
|
||||
# 新增暗金荒野主题计划
|
||||
|
||||
## 目标
|
||||
|
||||
在不替换现有 Warframe 主题的前提下,新增一个可独立选择、可直接对比的“暗金荒野”主题;使用用户提供的背景图和图标板,保持现有功能与响应式布局完整。
|
||||
|
||||
## 阶段
|
||||
|
||||
1. [COMPLETE] 审计现有 `gilded`/Warframe 未提交实现并建立合并边界
|
||||
2. [COMPLETE] 建立主题任务规格与资产方案
|
||||
3. [COMPLETE] 切分并优化暗金主题图像资产
|
||||
4. [COMPLETE] 新增暗金荒野主题样式与主题注册
|
||||
5. [COMPLETE] 补充主题切换和资源回归测试
|
||||
6. [IN_PROGRESS] 执行静态检查与自动化回归
|
||||
7. [TODO] 启动页面并进行多视口视觉验收
|
||||
8. [TODO] 逐项对照参考图复核构图边框与图标
|
||||
|
||||
## 视觉方向
|
||||
|
||||
- 视觉主张:熄灭后的王庭——背景人物必须清晰完整地固定在右侧;界面是悬浮其上的薄黑铁框架,不是把背景压黑后铺满金边卡片。
|
||||
- 内容计划:以现有应用工作台为主体,依次统一侧栏导航、聊天消息、工具执行块、输入区和设置/弹层,不新增无业务意义的装饰区块。
|
||||
- 交互主张:只保留主题短淡入、旧金线条扫光和按钮 1px 位移;取消余烬粒子与消息逐条入场等抢眼装饰。
|
||||
|
||||
## 视觉返工准则(用户验收失败后追加)
|
||||
|
||||
- 当前版本被用户明确判定为“不像参考图”,不得以自动化通过代替视觉完成。
|
||||
- 边框使用 1px、低饱和暗铜和 6–8px 小切角;只在主按钮、输入框、工具执行块保留框架感,普通消息与列表不再全部 `clip-path`。
|
||||
- 面板以近黑半透明层级为主,取消大面积金色渐变、粗边、重投影和卡片化堆叠。
|
||||
- 图标继续来自用户图标板,但小控件改用 PNG alpha 作为 CSS mask,统一旧金材质和 18/22/28px 三档尺寸,避免当前 64px 彩色切图直接缩到 22px 的糊、脏、比例失衡。
|
||||
- 背景人物必须保持原图清晰度,不加 blur;左侧遮罩和消息面板只保证文字可读,不得覆盖右侧人物主体。
|
||||
- 主文字保持用户指定的 `#fff`。
|
||||
|
||||
## 决策与约束
|
||||
|
||||
- 原 Warframe 保留内部 ID `gilded`,移除其 `hidden` 限制和 `gilded -> washi` 启动迁移,使它重新成为可选主题。
|
||||
- 新主题使用独立内部 ID `wasteland`,显示名“暗金荒野”;不得复用或覆盖 `gilded`。
|
||||
- 主题选择器必须同时展示 `gilded`(Warframe Wasteland)和 `wasteland`(暗金荒野),默认主题仍保持 `washi`。
|
||||
- 图标从用户提供的图标板切分为本地主题资产,不依赖运行时 CSS 裁剪。
|
||||
- 优先新增隔离文件;修改已有脏文件前先核对差异,避免覆盖用户改动。
|
||||
- 不新增前端框架或重量级依赖。
|
||||
|
||||
## 资产清单
|
||||
|
||||
- 完整界面参考:`sessions/_attachments/f01c1388-b603-434a-b226-2ff5771d4925.webp`
|
||||
- 新主题背景源图:`sessions/_attachments/094d7907-875d-41f4-9985-992c87c9b9cc.webp`
|
||||
- 图标板源图:`sessions/_attachments/43bd9ed6-2ba6-4c9d-bd9d-25b068cb4711.webp`
|
||||
- 新建对话欢迎页参考:`sessions/_attachments/33cd7ba3-208a-4d7f-9c53-672fcc22f127.webp`
|
||||
- 新建对话欢迎卡素材板:`sessions/_attachments/2b88b81d-c5a8-4d92-a518-afeea691eade.webp`
|
||||
- 目标背景:`public/assets/themes/wasteland/background.webp`
|
||||
- 目标图标目录:`public/assets/themes/wasteland/icons/`,输出透明 PNG,优先切分 32px 档的 16 个常用图标。
|
||||
- 欢迎卡资产:`public/assets/themes/wasteland/frames/welcome-card.png` 与 `public/assets/themes/wasteland/textures/welcome-card-surface.webp`。
|
||||
- 常用图标范围:新会话、搜索、下拉、主题、AI、在线状态、附件、发送、停止、设置、用户、终端、复制、刷新、聊天、关闭/确认。
|
||||
|
||||
## 脏改动合并边界
|
||||
|
||||
- 实施前分别审计 `public/app.js`、`public/index.html`、`public/style.css`、`scripts/regression.js` 和 `public/assets/themes/` 的未提交差异。
|
||||
- 记录本任务开始前相关文件的差异与资产清单;只追加 `wasteland` 注册、样式和断言,并对恢复 `gilded` 可见性做最小精确修改。
|
||||
- 不重排或格式化现有大文件,不修改与主题无关的区块。
|
||||
|
||||
## 错误记录
|
||||
|
||||
| 错误 | 尝试 | 处理 |
|
||||
|---|---:|---|
|
||||
| `rg` 把以 `--target` 开头的模式误解析为命令参数 | 1 | 后续检索使用 `rg -- '<pattern>'`,不重复原命令 |
|
||||
| 全量回归在专项通过后命中旧 `gilded hidden` 断言 | 1 | 判定为外部运行会话回写 `scripts/regression.js`;等待共享写入稳定后重新合并当前契约 |
|
||||
| 跨会话协调消息返回 `target_running` | 1 | 不重复即时发送;先等待目标会话完成当前处理,再查询状态或采用本地最终合并 |
|
||||
| 外部会话第三次回写 `gilded hidden`、启动迁移和旧 cache bust | 3 | 已满足重复冲突阈值;停止反复覆盖,等待用户停止 `定制暗金荒野主题` 会话后再做最终合并与全量回归 |
|
||||
| 用户视觉验收明确失败:边框、图标、整体质感不像参考图 | 1 | 回滚“实现完成”判断;建立本地可截图 mock,逐项按参考图重做并新增最终对照步骤 |
|
||||
| Headless Firefox 无法输出本地视觉 mock 截图 | 2 | 默认 profile 超时;独立 profile 又因 SWGL framebuffer 映射失败,环境无 Xvfb;停止重复尝试,不安装依赖,改用参考图几何审计 + 用户实时页面反馈 |
|
||||
81
.planning/gilded-wasteland-theme/visual-preview.html
Normal file
81
.planning/gilded-wasteland-theme/visual-preview.html
Normal file
@@ -0,0 +1,81 @@
|
||||
<!doctype html>
|
||||
<html lang="zh-CN" data-theme="wasteland">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>暗金荒野视觉验收</title>
|
||||
<link rel="stylesheet" href="../../public/style.css">
|
||||
<style>
|
||||
html, body { width: 100%; height: 100%; overflow: hidden; }
|
||||
#app { display: flex !important; width: 100%; height: 100%; }
|
||||
.messages { overflow: hidden; }
|
||||
.visual-preview-note { color: var(--text-muted); font-size: 12px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app" class="app">
|
||||
<aside class="sidebar">
|
||||
<div class="sidebar-header">
|
||||
<div class="new-chat-split">
|
||||
<button class="new-chat-btn"><span class="new-chat-native-icon" aria-hidden="true">+</span> 新会话</button>
|
||||
<button class="new-chat-arrow" aria-label="更多">▾</button>
|
||||
</div>
|
||||
<div class="session-search">
|
||||
<input class="session-search-input" value="" placeholder="搜索会话 / 项目">
|
||||
</div>
|
||||
</div>
|
||||
<div class="session-list">
|
||||
<div class="session-project-header"><span class="project-toggle">▾</span><span class="session-project-name">cc-web</span><span class="session-project-count">63</span></div>
|
||||
<div class="session-item active"><span class="session-item-title">重新实现暗金荒野主题</span><span class="session-item-time">运行中</span></div>
|
||||
<div class="session-item"><span class="session-item-title">统一主题卡片规范</span><span class="session-item-time">2小时前</span></div>
|
||||
<div class="session-item"><span class="session-item-title">修复对话结束焦点问题</span><span class="session-item-time">5小时前</span></div>
|
||||
<div class="session-item"><span class="session-item-title">优化快捷指令交互体验</span><span class="session-item-time">1天前</span></div>
|
||||
<div class="session-project-header"><span class="project-toggle">›</span><span class="session-project-name">english</span><span class="session-project-count">8</span></div>
|
||||
<div class="session-project-header"><span class="project-toggle">›</span><span class="session-project-name">ERPTTableHelp</span><span class="session-project-count">20</span></div>
|
||||
</div>
|
||||
<div class="sidebar-footer"><button class="settings-btn" title="设置">⚙</button><span class="brand">暗金荒野</span></div>
|
||||
</aside>
|
||||
|
||||
<main class="chat-main">
|
||||
<header class="chat-header">
|
||||
<div class="chat-title">定制暗金荒野主题</div>
|
||||
<div class="chat-header-actions"><button class="chat-session-id-btn">ID d7692e74</button><span class="chat-cwd">~/home/cc-web</span></div>
|
||||
</header>
|
||||
<div class="messages-wrap">
|
||||
<div class="messages">
|
||||
<div class="msg assistant">
|
||||
<div class="msg-avatar">✦</div>
|
||||
<div class="msg-bubble">
|
||||
<p>明白了,这次走暗金荒野风格,整体要有荒芜、神秘、暗金、科幻骑士的感觉。</p>
|
||||
<p>界面会统一成黑铁面板、细旧金描边和克制的状态绿,背景人物保持在右侧。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="msg user"><div class="msg-bubble"><p>边框和图标要严格贴近参考图,不要只改配色。</p></div></div>
|
||||
<div class="msg assistant">
|
||||
<div class="msg-avatar">✦</div>
|
||||
<div class="msg-bubble">
|
||||
<p>正在生成关键页面与组件,并保留现有功能和响应式布局。</p>
|
||||
<details class="tool-call" open>
|
||||
<summary><span>生成主题页面</span><span class="tool-call-state done">运行成功</span></summary>
|
||||
<div class="tool-call-content command">npm run regression -- --target wasteland-theme</div>
|
||||
</details>
|
||||
<details class="tool-call">
|
||||
<summary><span>检查图标与边框</span><span class="tool-call-state running">运行中</span></summary>
|
||||
</details>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="input-area">
|
||||
<div class="input-mode-row"><span class="chat-runtime-state">● 运行中</span><button class="mode-select">YOLO</button><span class="visual-preview-note">自定义 · 重载 MCP</span></div>
|
||||
<div class="input-wrapper">
|
||||
<button class="attach-btn" title="上传"><svg width="18" height="18"><path d="M3 9h12" stroke="currentColor"/></svg></button>
|
||||
<textarea id="msg-input" placeholder="输入消息... 输入 / 查看指令"></textarea>
|
||||
<button class="send-btn" title="发送"><svg width="18" height="18"><path d="M2 2l14 7-14 7 3-7z" fill="currentColor"/></svg></button>
|
||||
<button class="abort-btn" title="停止"><svg width="18" height="18"><rect x="3" y="3" width="12" height="12" fill="currentColor"/></svg></button>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user