# IconPark 勋章视觉替换设计 ## 目标 替换记录页训练勋章的现有通用图标,使其形成更清晰的成长叙事,同时保留主题换色、解锁状态、勋章点击说明和现有进度计算。 ## 已确认的视觉方向 采用 IconPark 的彩色填充风格(预览方案 A)。图标序列为:火焰、闪电、徽章、奖杯、钻石、星耀、皇冠。 - 前三枚已解锁图标使用暖橙、金黄、主题绿的温和递进,强调早期坚持。 - 第四至第七枚解锁图标使用当前主题色,保持换肤一致性。 - 未解锁图标沿用浅灰描边圆形节点。 - 图标在本地以 SVG path 形式嵌入既有 `utils/icons.js`,不添加 npm 包、远程请求或新的运行时模块。 ## 数据和交互 `config.trainingDayBadges` 继续定义天数、名称和图标键;记录页进度、逐段填充、解锁庆祝和点击详情均不改变。 图标构建器新增每枚勋章的彩色/白色变体:节点解锁时使用彩色图标,主题节点上的图标保持白色以保证对比度;未解锁时使用灰色图标。 ## 验证 - 为图标构建结果补充单元测试,验证七枚勋章的键均存在。 - 运行完整 Node 测试与 JavaScript 语法检查。 - 在微信开发者工具检查默认主题及蓝、绿主题下的记录页:节点、文字、进度段和点击说明均可见。 ## 授权 图标来源为 ByteDance IconPark,Apache-2.0;项目保留来源和许可证说明。