feat(ui): implement compact grid layout for items and artifacts

Add compact tooltip mode to EntityCard component
Display 12-column icon grid on desktop for collections
Retain standard card layout with details on mobile devices
This commit is contained in:
2026-05-04 22:19:36 +08:00
parent 28f4e6032c
commit cd0f8868c3
5 changed files with 168 additions and 15 deletions

View File

@@ -638,8 +638,9 @@ Items 与 Event Items 使用相同数据模型:
- 按用途筛选
- 按标签筛选
- 按自定义排序展示
- 物品列表卡片使用与 Pokemon 列表一致的居中图鉴式布局,只展示物品图标、名称和分类;不展示标签、入手方式或编辑元信息
- 有用途的物品在卡片左上角以斜 Ribbon 展示用途名称
- 物品列表桌面端使用 12 列紧凑 Grid每个格子只展示物品图标有用途的物品在卡片左上角以斜 Ribbon 展示用途名称;物品名称通过 hover / focus Tooltip 展示
- 物品列表移动端保持常规卡片布局,展示物品图标、名称和分类
- 物品列表不展示标签、入手方式或编辑元信息。
- 已配置图标时,物品卡片展示图标缩略图;未配置图标时保留默认物品标记。
物品详情页展示:
@@ -682,7 +683,9 @@ Ancient Artifacts 列表功能:
- 按分类展示为标签页
- 按标签筛选
- 按自定义排序展示
- 列表卡片使用与 Pokemon 列表一致的居中图鉴式布局,展示图片 / 默认 Ancient Artifact 标记名称和分类;不展示编辑元信息
- 列表桌面端使用 12 列紧凑 Grid每个格子只展示图片 / 默认 Ancient Artifact 标记名称通过 hover / focus Tooltip 展示
- 列表移动端保持常规卡片布局,展示图片 / 默认 Ancient Artifact 标记、名称和分类。
- 列表不展示编辑元信息。
Ancient Artifacts 详情页展示: