diff --git a/DESIGN.md b/DESIGN.md index 226361b..5968f42 100644 --- a/DESIGN.md +++ b/DESIGN.md @@ -272,6 +272,7 @@ Pokemon 列表功能: - 满足任意条件 - 满足全部条件 - 按自定义排序展示 +- Pokemon 列表卡片只展示 Pokemon 图片和下方的 `#ID 名称`;不展示喜欢的环境、属性、特长、喜欢的东西或编辑元信息。 - Pokemon 卡片在已配置图片时展示所选图片缩略图;未配置图片时保留默认 Poké Ball 标记。 Pokemon 详情页展示: diff --git a/frontend/src/styles/main.css b/frontend/src/styles/main.css index c25f9b6..402fdbe 100644 --- a/frontend/src/styles/main.css +++ b/frontend/src/styles/main.css @@ -1461,6 +1461,33 @@ button:disabled, color: var(--muted); } +.pokemon-list-grid .entity-card { + min-height: 168px; + grid-template-columns: 1fr; + justify-items: center; + align-content: center; + gap: 14px; + text-align: center; +} + +.pokemon-list-grid .entity-card__mark { + width: 92px; + height: 92px; +} + +.pokemon-list-grid .pokeball-mark { + --ball-size: 64px !important; +} + +.pokemon-list-grid .entity-card__content { + justify-items: center; + gap: 0; +} + +.pokemon-list-grid .entity-card__title { + font-size: 20px; +} + .edit-meta { margin: 0; color: var(--muted); diff --git a/frontend/src/views/PokemonList.vue b/frontend/src/views/PokemonList.vue index 87940ab..45361a9 100644 --- a/frontend/src/views/PokemonList.vue +++ b/frontend/src/views/PokemonList.vue @@ -3,8 +3,6 @@ import { Icon } from '@iconify/vue'; import { computed, onMounted, ref, watch } from 'vue'; import { useI18n } from 'vue-i18n'; import { useRoute } from 'vue-router'; -import EditMeta from '../components/EditMeta.vue'; -import EntityChips from '../components/EntityChips.vue'; import EntityCard from '../components/EntityCard.vue'; import FilterPanel from '../components/FilterPanel.vue'; import PageHeader from '../components/PageHeader.vue'; @@ -44,10 +42,6 @@ async function loadPokemon() { loading.value = false; } -function pokemonTypeIconSrc(typeId: number): string | null { - return typeId >= 1 && typeId <= 19 ? `/types/small/${typeId}.png` : null; -} - function pokemonCardImage(item: Pokemon) { return item.image ? { src: item.image.url, alt: t('pages.pokemon.imageAlt', { name: item.name, variant: item.image.variant }) } : undefined; } @@ -128,41 +122,22 @@ watch(query, loadPokemon); -