moved music to garden section; added highlight effect to albums

This commit is contained in:
2025-08-18 14:22:13 +02:00
parent 608d17a752
commit a5d077c6c7
29 changed files with 20 additions and 3 deletions

View File

@@ -1,56 +0,0 @@
<script lang="ts">
import BannerTitleAlt from "$lib/banner-title-alt.svelte";
import Content from "$lib/content.svelte";
import { albums, type AlbumEntry } from "$lib/likedalbums";
</script>
<svelte:head>
<title>My Liked Music | denizk0461</title>
</svelte:head>
<BannerTitleAlt
title="My Liked Music"
banner="/common/me/.webp"
subtitle="A look into my music taste"
/>
<Content>
<div class="album-button-container">
{#each albums.entries() as [key, album]}
{@render albumButton({ album })}
{/each}
</div>
</Content>
{#snippet albumButton({
album
}: {
album: AlbumEntry;
})}
<div class="album-button">
<input
class="album-button-img"
type="image"
src="{album.img}"
alt="Album art for {album.artist} {album.title}" />
</div>
{/snippet}
<style>
.album-button-container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.album-button {
width: calc(100%/12);
line-height: 0;
}
.album-button-img {
width: 100%;
padding: 2px;
box-sizing: border-box;
}
</style>