57 lines
3.7 KiB
Markdown
57 lines
3.7 KiB
Markdown
# Plan List 进度图标主题兼容审计
|
||
|
||
审计时间：2026-07-20
|
||
|
||
## 范围
|
||
|
||
- 扩展既有 `wasteland`（暗金荒野）主题，不新增或替换主题 ID。
|
||
- 只修改 Plan List 标题中的 `.plan-progress-dot` 视觉层。
|
||
- `washi`、`coolvibe`、`editorial`、`sage`、`ink`、`dawn`、`carbon`、`nocturne`、`cinder`、`gilded` 保持 14px 语义色圆点。
|
||
- `wasteland` 使用独立的本地原色图标；不修改 Plan 数据、DOM 结构和其他工具块。
|
||
|
||
## 素材台账
|
||
|
||
| 角色 | 归档路径 | 尺寸/格式 | SHA-256 | Alpha | 用途 |
|
||
| --- | --- | --- | --- | --- | --- |
|
||
| 图标板 | `references/source-assets/wasteland-icon-sheet.webp` | 1672×941 RGB WebP | `482edda2dbc8932b3c209686fab89f50fa8600242b16379b39fa6657e722410e` | 无 | 仅作为可复现切片源 |
|
||
|
||
运行时不依赖会话附件或远程 URL，切片脚本只读取上述归档文件。
|
||
|
||
## 参考区域到实现映射
|
||
|
||
| 进度语义 | 图标板区域 | 目标资产 | 实际 DOM | CSS 责任 |
|
||
| --- | --- | --- | --- | --- |
|
||
| 已完成 | R2C3 `STATUS (ONLINE)` 的 16px 规格 | `icons/plan-progress/complete.png` | `.plan-progress-dot.is-complete` | 暗金主题显示绿色宝石原色图标 |
|
||
| 未完成 | R2C4 `LOADING` 的 16px 规格 | `icons/plan-progress/remaining.png` | `.plan-progress-dot.is-remaining` | 暗金主题显示暗金分段环原色图标 |
|
||
|
||
两枚图标输出到 20×20 透明画布，按 alpha 加权重心居中；桌面和窄屏均保持主体清晰，不再从 64px PNG 二次缩小。
|
||
|
||
## 验收清单
|
||
|
||
- 两枚 PNG 来自归档图标板的 16px 原生规格，manifest 记录源 hash、卡片、检测框、画布与用途。
|
||
- PNG 为 RGBA，透明背景无黑边、棋盘格或文字残留。
|
||
- 主题专属选择器全部限定 `html[data-theme='wasteland']`。
|
||
- 其他 10 个主题仍使用 14×14、左边距 8px 的圆点。
|
||
- Wasteland 完成/未完成图标可区分，标题与长计划不溢出。
|
||
- `style.css` / `app.js` 缓存版本同步推进，资产与静态资源 HTTP 200。
|
||
- `plan-list-progress`、`wasteland-theme`、`gilded-theme` 和全量回归通过。
|
||
- Firefox 检查 11 个主题及 1440×900、500×844、390×844 视口。
|
||
|
||
## 实际验收记录
|
||
|
||
验收日期：2026-07-20
|
||
|
||
- Firefox 152 实际加载 `style.css?v=20260720-plan-progress-icons`。
|
||
- `washi`、`coolvibe`、`editorial`、`sage`、`ink`、`dawn`、`carbon`、`nocturne`、`cinder`、`gilded`：完成/未完成均为 14×14，左边距 8px；未完成圆点命中 1px inset 描边与 `plan-progress-breathe 1.8s`，没有加载主题图片。
|
||
- `wasteland`：桌面图标 20×20、移动端 16×16；完成与未完成分别加载 `complete.png`、`remaining.png`；`box-shadow: none`，没有方形描边。
|
||
- 呼吸动画在 700ms 采样间隔内从 `scale(0.944)` / `opacity 0.820` 变化到 `scale(0.984)` / `opacity 0.948`。
|
||
- Firefox `ui.prefersReducedMotion=1` 时：`animation-name: none`、`opacity: 1`、`transform: none`，图标仍正常显示且无描边。
|
||
- 1672×941、1440×900、500×844、390×844 均检查短计划与 12 图标长计划；标题、长计划和页面横向溢出量均为 0。
|
||
- 两枚 PNG、manifest、CSS、JS 均返回 HTTP 200；专项、暗金主题、旧 Warframe 主题与全量回归均通过。
|
||
|
||
## 最终完成态同步修复
|
||
|
||
- 问题：展开列表使用最新 `result`，标题原先优先读取旧 `meta.progress`，会出现列表全部勾选但最后一个图标仍未点亮。
|
||
- 修复：标题进度来源调整为 `result → input → meta`；无法解析最新结果时仍保留兼容回退。
|
||
- Firefox 复现数据：`meta/input=7/8`、`result=8/8`；最终解析为 `8/8`，DOM 生成 8 个 `.is-complete`、0 个 `.is-remaining`，横向溢出为 0。
|