chore: rebuild release package
This commit is contained in:
130
.planning/warframe-theme-rework/findings.md
Normal file
130
.planning/warframe-theme-rework/findings.md
Normal file
@@ -0,0 +1,130 @@
|
||||
# Warframe 主题返工发现
|
||||
|
||||
## 用户反馈根因
|
||||
|
||||
- 上一版将原画放入 `--page-background`,导致图片同时出现在欢迎态和阅读态;图片没有
|
||||
独立布局职责,只是壁纸。
|
||||
- 上一版对比度计算使用纯色变量,没有计算半透明聊天表面叠加图片后的实际背景,
|
||||
因此结果不能反映用户真实阅读体验。
|
||||
- 暖纸色被过度用于正文,长段内容缺少接近中性的高亮文字,视觉疲劳明显。
|
||||
|
||||
## 新构图方向
|
||||
|
||||
- 阅读态:实色主背景、实色消息表面、实色输入表面,图片完全退场。
|
||||
- 欢迎态:利用 `.welcome-msg` 建立左侧操作信息与右侧完整竖幅的单一构图,不给图片
|
||||
叠加正文。
|
||||
- 移动端:欢迎态单列,完整图片作为独立区块;聊天状态不加载可见图片层。
|
||||
|
||||
## 作品检索状态
|
||||
|
||||
- `https://displate.com/search?q=warframe` 直接访问被 Cloudflare challenge 拦截。
|
||||
- DuckDuckGo HTML 公开索引连接超时。
|
||||
- 用户已提供 3 个 Displate CDN 候选和 Pinterest Warframe poster 页面;后续以这些
|
||||
候选为主,不再把拿到产品落地页作为前置条件。
|
||||
- Pinterest ideas 页面直连在 30 秒后超时,无法可靠提取更多公开候选;停止自动搜图,
|
||||
避免绕过站点限制或产生噪声。
|
||||
|
||||
## 用户提供的 Displate CDN 候选
|
||||
|
||||
1. 候选 1(480×673):红橙落日群像,四个角色、多重能量效果,视觉冲击最强但焦点
|
||||
过多;只能作为完全独立海报,不适合与界面文字共享区域,且与现有暗金色板偏离。
|
||||
2. 候选 2(480×672):单角色近景、浅蓝建筑背景,轮廓清晰、构图安静,最适合
|
||||
左右分区;采用它意味着主题应整体转为冷蓝钢铁色,不能继续沿用暗金棕。
|
||||
3. 候选 3(480×672):`WARFRAME THE SACRIFICE` 深青暗金群像,自带完整标题和
|
||||
海报层级;与现有暗金主题最协调,适合欢迎态右侧完整立幅,禁止铺到阅读区背后。
|
||||
|
||||
上述 CDN 图仅下载到 `/tmp` 做只读分析,未写入项目。
|
||||
|
||||
## 多图参考板决策
|
||||
|
||||
- 用户明确说明三张 CDN 图用于“参考”,不是替换主题原图;此前把“继续”解释为授权
|
||||
替换是错误假设,已撤销。项目继续使用最初上传的 1000×1500 原图。
|
||||
- 参考 1:借鉴强对角线、能量方向和前中后景层次;不借用高饱和红色和群像拥挤布局。
|
||||
- 参考 2:借鉴单角色清晰轮廓、主体与浅色负空间分离;不把主题整体改成冷蓝。
|
||||
- 参考 3:借鉴深青暗金材质、完整框景和垂直层级;不复制海报文字或群像素材。
|
||||
- 综合结果:原图作为完整独立立幅;欢迎态用明确的框景、负空间和纵向层级组织;
|
||||
阅读态图片完全退场。三张参考图均不进入 `public/assets`。
|
||||
|
||||
## 代码定位
|
||||
|
||||
- codebase-memory MCP 仍返回 `Transport closed`,已降级为 `rg`/`sed` 精确定位,不重复
|
||||
调用失效通道。
|
||||
- 欢迎态由 `buildWelcomeMarkup()` 生成稳定的 `.welcome-msg`,静态首页也使用同一结构;
|
||||
可以用 `.messages:has(> .welcome-msg)` 限定欢迎构图,无需修改多处分支状态。
|
||||
- 上一版图片同时存在于 `--page-background`、`--login-background`、`.chat-main` 移动规则
|
||||
和主题预览;返工后原图只保留在欢迎态立幅与主题选择器预览两处。
|
||||
|
||||
## 真实表面对比度体系
|
||||
|
||||
- 主背景:`#0b0d0e`;面板/助手消息:`#171a1c`;用户消息:`#34271f`;代码背景:
|
||||
`#101214`,全部使用不透明实色。
|
||||
- 主文字 `#f2eee5`:对主背景 16.82:1,对面板 15.10:1。
|
||||
- 次文字 `#d5cbb8`:对主背景 12.12:1,对面板 10.88:1。
|
||||
- 弱文字 `#aea38f`:对主背景 7.82:1,对面板 7.02:1。
|
||||
- 暗色按钮字 `#111416` 对暗金按钮 `#d4bd83` 为 10.05:1。
|
||||
- 用户消息文字/背景 12.46:1;代码文字/背景 14.44:1;危险与成功状态对面板
|
||||
分别为 7.54:1、9.31:1。
|
||||
- 禁用态使用 0.68 透明度,次文字在面板上的实际合成对比度为 5.65:1;不再沿用
|
||||
0.56 导致的 4.26:1。
|
||||
|
||||
## 欢迎态实现
|
||||
|
||||
- `buildWelcomeMarkup` 与静态首页统一为 `.welcome-copy + .welcome-art` 结构。
|
||||
- gilded 主题用 `.messages:has(> .welcome-msg)` 建立欢迎态专属布局:桌面文字/立幅双区,
|
||||
移动端立幅在上、操作说明在下。
|
||||
- `--page-background` 与 `--login-background` 已改为实色,移动 `.chat-main` 图片背景已
|
||||
删除;原图只在 `.welcome-art` 与主题选择器小预览出现。
|
||||
- 欢迎文案用暗金竖线组织,原图 `contain` 完整展示;没有增加卡片或在图上叠文字。
|
||||
|
||||
## 阅读表面实现
|
||||
|
||||
- gilded 变量已切换为中性暖白文字、墨黑主背景和不透明面板;暗金只用于焦点、选中
|
||||
边缘、欢迎态竖线和主按钮。
|
||||
- 导航、会话 hover/active、聊天头部、输入区、搜索、消息气泡、命令菜单、选项菜单、
|
||||
行内代码与工具代码均使用实色,不再依赖图片或半透明模糊层。
|
||||
- 主按钮由渐变改为单一暗金实色;助手/用户消息使用明确不同但都高对比的实色表面。
|
||||
- placeholder 使用弱文字且 opacity=1;所有禁用表单控件统一 opacity=0.68。
|
||||
|
||||
## 响应式几何
|
||||
|
||||
- 1440×900:主区扣除侧栏和欢迎 padding 后宽 1056.3px,双列最小需求 652px;原图
|
||||
`contain` 约 360×540,无横向溢出。
|
||||
- 1024×768:可用宽 670.3px,双列最小需求 631.2px;原图约 307.2×460.8,仍保持
|
||||
独立完整立幅。
|
||||
- 390×844:切换单列,可用宽 362px,原图约 253.2×379.8;图片在上、操作说明在下,
|
||||
输入区位于 `.messages-wrap` 外部,不被图片挤压,无横向溢出。
|
||||
- 移动头部、输入区和输入框均为完全不透明实色;1024 视口降低欢迎最小高度,避免为
|
||||
海报制造无意义滚动。
|
||||
|
||||
## 回归契约
|
||||
|
||||
- 动态/静态欢迎 DOM 必须同时包含 `.welcome-copy` 与 `.welcome-art`,并移除旧花朵占位。
|
||||
- 原图 URL 必须在 CSS 中恰好出现两次:欢迎立幅和主题选择器预览;变量块和
|
||||
`.chat-main` 禁止出现图片 URL。
|
||||
- 项目 UI 文件禁止出现 `cdn.displate.com`,保证三张参考图不被复制进产品。
|
||||
- 自动计算主/次/弱文字和主按钮真实对比度,并断言欢迎态桌面/移动结构、不透明表面、
|
||||
禁用态透明度、减少动态偏好和缓存版本。
|
||||
- `gilded-theme` 专项回归通过。
|
||||
|
||||
## 独立审查第 1 轮
|
||||
|
||||
- 769–980px 视口扣除 280px 侧栏和消息 padding 后,双列最小宽度可能不足;欢迎态应
|
||||
在 980px 以下提前切单列,1024×768 仍保留双列。
|
||||
- `.msg.user .msg-attachment-card/thumb` 的特异性高于暗色共用层,仍使用旧半透明规则;
|
||||
需要 gilded 专属实色附件卡与缩略图覆盖。
|
||||
- 回归只禁止 `cdn.displate.com` 不够;应禁止主题 CSS 中任何远程 `url(http...)`,并
|
||||
覆盖 Displate/Pinterest/pinimg 参考域名。
|
||||
- 完整回归在恢复既有 Claude 欢迎短语后已通过。
|
||||
|
||||
## 审查修复结果
|
||||
|
||||
- 欢迎态在 `max-width: 980px` 提前切换单列,覆盖所有可能塞不下双列的窄桌面;
|
||||
1024×768 继续使用双区。
|
||||
- 用户消息附件卡、hover、缩略图、占位/说明文字、名称和过期态均增加 gilded 高特异性
|
||||
实色覆盖,消除旧透明规则。
|
||||
- 回归禁止 Displate/Pinterest/pinimg 域名进入 UI 文件,并禁止 Warframe 主题 CSS 使用
|
||||
任意远程 `url(http...)`。
|
||||
- 修复后专项与完整回归再次通过;独立复核确认原图未替换、参考图未进入项目、图片
|
||||
仅用于欢迎态立幅和主题选择器预览,普通聊天与所有阅读表面均保持实色高对比。
|
||||
- 当前服务已实际返回 `20260717-warframe-readable` 版本首页和原始主题图;环境仍无
|
||||
Playwright/Chromium,真实浏览器视觉效果保留为用户刷新后的人工复核项。
|
||||
36
.planning/warframe-theme-rework/progress.md
Normal file
36
.planning/warframe-theme-rework/progress.md
Normal file
@@ -0,0 +1,36 @@
|
||||
# Warframe 主题返工进展
|
||||
|
||||
## 2026-07-17
|
||||
|
||||
- 已确认用户反馈指向两个根因:真实对比度不足、图片缺乏构图职责。
|
||||
- 已读取 `frontend-skill`、`planning-with-files`、`todo-list-csv`。
|
||||
- 已尝试 Displate 直连与 DuckDuckGo 索引,均失败并记录降级路径。
|
||||
- 已建立返工视觉策略与验收标准,等待计划审查。
|
||||
- 用户提供 3 个 Displate CDN 候选;已完成临时下载和视觉分析,候选 3 最适合现有
|
||||
暗金方向,候选 2 适合彻底改成冷蓝方向。
|
||||
- 计划审查第 1 轮发现来源路径、真实状态对比、响应式验收和测试范围不够具体;已修订。
|
||||
- 计划审查第 2 轮已通过。Pinterest 页面访问超时,候选集合收敛为用户提供的 3 张
|
||||
CDN 图片;等待用户确认图片方向与使用权限。
|
||||
- 用户澄清 CDN 画作用于多图参考而非替换;已撤销替换假设,确认保留原图,并把三张
|
||||
参考分别映射为动势、留白、框景/材质方法,进入真实表面对比度设计。
|
||||
- codebase-memory MCP 不可用;已用本地检索确认欢迎态 DOM 和上一版所有图片引用位置。
|
||||
- 已建立基于真实不透明表面的高对比 token 与关键状态指标,完成对比度阶段,开始重构
|
||||
欢迎态独立立幅。
|
||||
- 首次组合补丁上下文校验失败,未产生代码变更;已记录并切换为小范围精确补丁。
|
||||
- 已完成欢迎态 DOM、桌面/移动构图、图片退场规则与两段入场动效;Node 语法和 CSS
|
||||
结构检查通过,进入阅读导航与输入区域高对比改造。
|
||||
- 已完成全部主要阅读与交互表面的实色、高对比改造,进入桌面/移动响应式细节核验。
|
||||
- 已完成 1440×900、1024×768、390×844 静态几何与结构核验,均无横向溢出,进入
|
||||
回归契约更新。
|
||||
- 已更新高对比与构图专项回归契约,语法及 `gilded-theme` 目标通过;进入完整回归与
|
||||
独立视觉审查。
|
||||
- 完整回归首次命中既有静态欢迎文案契约,已定位为新文案兼容问题,正在最小修正。
|
||||
- 恢复兼容短语后完整回归通过;独立审查发现窄桌面断点、用户附件半透明和远程图片
|
||||
契约 3 项问题,正在修复。
|
||||
- 已修复首轮审查全部问题,专项/完整回归通过,正在等待独立审查最终复核。
|
||||
- 独立复核最终通过:原图哈希和尺寸不变,三张参考图未写入项目,图片只在欢迎态立幅
|
||||
与主题预览出现,普通聊天、附件、导航、输入、菜单和代码区均为实色高对比表面。
|
||||
- 最终重新执行专项与完整回归,均通过;`git diff --check` 通过;本地 8002 服务返回
|
||||
新缓存版本首页与原始主题图。未执行服务重启。
|
||||
- 并行核验时全量回归超过 30 秒窗口,已续接进程并确认退出码 0;首次域名检索命令
|
||||
引号转义失败,已改用多个 `rg -e` 参数完成复核。
|
||||
65
.planning/warframe-theme-rework/task_plan.md
Normal file
65
.planning/warframe-theme-rework/task_plan.md
Normal file
@@ -0,0 +1,65 @@
|
||||
# Warframe 主题返工计划
|
||||
|
||||
## 目标
|
||||
|
||||
根据用户反馈重做 Warframe Wasteland 主题:优先解决文字费眼与图片构图随意的问题,
|
||||
同时把用户提供的 Displate CDN 与 Pinterest Warframe 画作整理成多图视觉参考板;
|
||||
保留用户最初上传的主题原图,不绕过站点验证,不把参考图复制进项目。
|
||||
|
||||
## 视觉策略
|
||||
|
||||
- **视觉论点:** 墨黑舰舱般的高对比工作台,Warframe 原画只在空会话状态成为完整
|
||||
立幅,进入阅读状态后退场,不再铺在正文背后。
|
||||
- **内容规划:** 导航负责定位;欢迎态左侧负责操作提示、右侧负责完整画作;聊天区
|
||||
只负责阅读;输入区使用稳定不透明表面。
|
||||
- **交互论点:** 欢迎画作短距离淡入;会话选中态只用暗金边缘;输入聚焦使用清晰
|
||||
暖色描边;遵守减少动态偏好。
|
||||
|
||||
## 执行步骤
|
||||
|
||||
1. [complete] 评估用户提供的 Warframe 候选并确定构图
|
||||
2. [complete] 建立真实表面的文字对比度指标
|
||||
3. [complete] 重构欢迎态图片艺术面板
|
||||
4. [complete] 提升阅读导航与输入区域对比度
|
||||
5. [complete] 优化桌面与移动端响应式构图
|
||||
6. [complete] 更新主题资源与样式回归契约
|
||||
7. [complete] 运行回归测试并完成独立视觉审查
|
||||
|
||||
## 完成标准
|
||||
|
||||
- 对用户提供的 CDN/Pinterest 参考记录来源 URL、可访问性、可借鉴的构图方法与
|
||||
禁用方式;至少综合 3 张参考图的方法,保留最初主题原图,参考图不复制进项目。
|
||||
- 普通聊天状态的正文、导航和输入区后方不出现图片;所有阅读表面保持不透明。
|
||||
- 主文字、次文字、弱文字分别相对其真实不透明表面达到至少 7:1、5.5:1、4.5:1;
|
||||
分别检查默认、hover、active、focus、disabled、会话选中、输入占位符、消息气泡、
|
||||
代码块、命令菜单和弹层,不再只计算主题变量。
|
||||
- 欢迎态在 1440×900 和 1024×768 使用明确的文字/立幅双区域;390×844 单列展示,
|
||||
图片完整、不挤压输入框、不产生横向滚动。
|
||||
- `public/style.css` 需移除阅读态图片并实现欢迎态布局、实色 token 和状态覆盖;
|
||||
`public/app.js` 只在确有必要时增加稳定欢迎态标记;`scripts/regression.js` 需断言
|
||||
阅读态无背景图、欢迎态独立图片、关键状态色与响应式规则。
|
||||
- 专项与完整回归通过,独立审查无阻塞或中高风险问题;若仍无浏览器运行时,必须将
|
||||
真实布局视觉验证标为待用户复核,不能用静态检查冒充浏览器验收。
|
||||
|
||||
## 风险与约束
|
||||
|
||||
- 保留用户已有未提交改动,不重写无关子代理卡片逻辑。
|
||||
- 保持内部主题值 `gilded`,避免破坏已保存偏好。
|
||||
- 不重启 cc-web;静态资源由现有服务实时提供。
|
||||
- 当前环境没有 Playwright/Chromium;先检查是否存在可执行截图/DOM 尺寸替代路径。
|
||||
若完全不可用,完成静态结构、对比度和构图规则审查后,保留“用户侧真实视觉复核”
|
||||
未完成项,不虚报浏览器验收通过。
|
||||
|
||||
## 错误记录
|
||||
|
||||
- Displate 搜索页和 robots.txt 均被 Cloudflare 安全检查替代,未获得作品列表。
|
||||
- DuckDuckGo HTML 与 Pinterest ideas 页面均在 30 秒后连接超时;不重复相同请求,
|
||||
后续以用户已提供的 3 个 CDN 候选为决策集合。
|
||||
- 首次欢迎态组合补丁因 CSS 变量块上下文与当前文件不完全一致而未应用;改为分别
|
||||
读取精确行并拆分 app/index、变量、欢迎布局三个小补丁,不重复原补丁。
|
||||
- 欢迎态结构验证命令中的 `rg` 模式以 `--page-background` 开头,被误判为参数;
|
||||
Node/CSS 结构检查已通过,后续使用 `rg -n -- '<pattern>'` 校验,不重复原命令。
|
||||
- 最终并行核验中的全量回归超过单次 30 秒返回窗口,改为续接原进程读取终态;域名
|
||||
检索命令因混合引号转义失败,改为多个 `rg -e` 参数完成同范围复核。
|
||||
- 首次完整回归因现有契约要求静态欢迎文案包含“开始与 Claude 对话”而失败;保留新
|
||||
布局并恢复该兼容短语,再运行完整回归。
|
||||
Reference in New Issue
Block a user