aquavox/src/routes/database/+page.svelte
alikia2x aef964aa35 improve: SSR in database page, fix some UI bugs
extract: component SongCard used in database pages
adjust (UI): now lyrics container won't show scrollbar
2024-07-20 19:18:35 +08:00

35 lines
1009 B
Svelte

<script lang="ts">
import SongCard from '$lib/components/database/songCard.svelte';
import type { PageServerData } from './$types';
export let data: PageServerData;
let songList: MusicMetadata[] = data.songDataList;
</script>
<svelte:head>
<title>AquaVox 音乐数据库</title>
</svelte:head>
<h1 class="text-3xl text-red-500"><a href="/">AquaVox</a></h1>
<div>
<div class="flex justify-between items-center h-20 mb-8">
<h1>AquaVox 音乐数据库</h1>
<a
href="/database/submit"
class="h-12 w-24 border-black dark:border-white border-2 flex items-center justify-center rounded-lg"
>提交新曲</a
>
</div>
<div
class="relative grid mb-32"
style="grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
justify-content: space-between;
gap: 2rem 1rem;"
>
{#each songList as song}
<SongCard songData={song}/>
{/each}
</div>
</div>