猫猫 v0.17.0:详情悬浮窗重构
猫猫手册将猫咪详情悬浮窗重构为宽屏双栏档案视图,整合照片墙、基础信息、故事、关系与动态,并统一暖色视觉和交互行为。
猫猫手册 v0.17.0 完成猫咪详情悬浮窗重构:从连续纵向信息改为宽屏双栏档案视图,让照片、基础信息、故事、关系和动态可以在同一面板中分区呈现。
详情面板布局
- 顶部身份栏统一展示正式名称、性别图标、状态胶囊、别名和关闭按钮,并加入轻量的校园祝福文案。
- 左栏承载首图、缩略图照片墙和 2×2 基础信息卡;区域使用猫爪图标,绝育和疫苗信息采用对应本地插画,具体日期通过悬停气泡查看。
- 右栏承载故事档案、正式关系和猫咪动态;各组件统一使用图标、大号标题、暖米色背景和加粗边框。
关系与动态交互
- 正式关系使用结构化
relationships数据,故事提及信息不进入关系视觉;没有关系时保留“待补充”容器。 - 关系卡支持点击切换到对应猫咪详情,并根据对称关系和亲子关系语义生成双向展示。
- 动态按日期从新到旧排序,默认显示最近 3 条,可展开查看全部;第一版展示日期、标题和文字,不渲染动态图片。
实现留档
- 增加详情悬浮框的视觉布局、组件组成和分步实现规范。
- 新增性别、关系、绝育和疫苗图标等本地 UI 资产,避免依赖外部 CDN。
UI 设计图留档