granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

show awakening icon on collection weapon cards

Browse source
This commit is contained in:
Justin Edmund 2025-12-16 21:18:21 -08:00
parent 90ea38e15f
commit 590c3496fd
1 changed files with 18 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
src/lib/components/collection/CollectionWeaponCard.svelte
View file

@ -1,6 +1,7 @@
<script lang="ts"> <script lang="ts">
import type { CollectionWeapon } from '$lib/types/api/collection' import type { CollectionWeapon } from '$lib/types/api/collection'
import { getWeaponImage } from '$lib/utils/images' import { getWeaponImage } from '$lib/utils/images'
import { getAwakeningImage } from '$lib/utils/modifiers'
import UncapIndicator from '$lib/components/uncap/UncapIndicator.svelte' import UncapIndicator from '$lib/components/uncap/UncapIndicator.svelte'
interface Props { interface Props {
@ -33,6 +34,13 @@
<button type="button" class="weapon-card" onclick={onClick}> <button type="button" class="weapon-card" onclick={onClick}>
<div class="card-image"> <div class="card-image">
{#if awakeningImage}
<img
class="awakening"
src={awakeningImage}
alt={`${weapon.awakening?.type?.name?.en || 'Awakening'} Lv${weapon.awakening?.level || 0}`}
/>
{/if}
<img class="weapon-image" src={imageUrl} alt={displayName} loading="lazy" /> <img class="weapon-image" src={imageUrl} alt={displayName} loading="lazy" />
</div> </div>
<UncapIndicator <UncapIndicator
@ -78,6 +86,16 @@
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: hidden;
background: var(--card-bg, #f5f5f5); background: var(--card-bg, #f5f5f5);
.awakening {
position: absolute;
top: 10%;
left: -3%;
width: 30%;
height: auto;
z-index: 2;
pointer-events: none;
}
} }
.weapon-image { .weapon-image {