
extract: component SongCard used in database pages adjust (UI): now lyrics container won't show scrollbar
35 lines
1009 B
Svelte
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>
|