glax/tranga-website
1
0
Fork 0
mirror of https://github.com/C9Glax/tranga-website.git synced 2025-10-15 09:50:48 +02:00
Code Issues Packages Projects Releases Wiki Activity

MangaCardList grid gapping

Browse Source 
withtag show loading under navigation
This commit is contained in:
glax
2025-10-14 23:52:18 +02:00
parent 3f5c009d2e
commit 3f6a58c0ed
2 changed files with 12 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
website/app/components/MangaCardList.vue
View File

@@ -1,11 +1,11 @@
<template> <template>
<div class="flex flex-row flex-wrap gap-2 justify-evenly"> <div class="grid grid-cols-[repeat(auto-fill,_minmax(240px,_1fr))] gap-4">
<MangaCard <MangaCard
v-for="(m, i) in manga" v-for="(m, i) in manga"
:key="m.key" :key="m.key"
:manga="m" :manga="m"
:expanded="i === expanded" :expanded="i === expanded"
class="cursor-pointer" class="cursor-pointer basis-(--mangacover-width)"
@click="$emit('click', m)" /> @click="$emit('click', m)" />
</div> </div>
</template> </template>

20
website/app/pages/manga/tag/[tag].vue
View File

@@ -1,20 +1,20 @@
<template> <template>
<LoadingPage :loading="status === 'pending'"> <TrangaPage>
<TrangaPage> <template #title>
<template #title> <h1 class="text-2xl">
<h1 class="text-2xl"> Manga with Tag <UBadge variant="outline" class="text-primary font-semibold text-xl">{{ tag }}</UBadge>
Manga with Tag <UBadge variant="outline" class="text-primary font-semibold text-xl">{{ tag }}</UBadge> </h1>
</h1> </template>
</template> <LoadingPage :loading="status === 'pending'">
<MangaCardList :manga="manga" /> <MangaCardList :manga="manga" />
</TrangaPage> </LoadingPage>
</LoadingPage> </TrangaPage>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
const route = useRoute(); const route = useRoute();
const tag = route.params.tag as string; const tag = route.params.tag as string;
const { data: manga, status } = await useApi('/v2/Manga/WithTag/{Tag}', { path: { Tag: tag } }); const { data: manga, status } = await useApi('/v2/Manga/WithTag/{Tag}', { path: { Tag: tag }, lazy: true });
useHead({ title: 'Tranga' }); useHead({ title: 'Tranga' });
</script> </script>