added liked music page and a bunch of albums

src/routes/about/music/+page.svelte

@@ -0,0 +1,376 @@
+<script lang="ts">
+    import BannerTitleAlt from "$lib/banner-title-alt.svelte";
+    import Content from "$lib/content.svelte";
+    import TableOfContents from "$lib/table-of-contents.svelte";
+    import LinkList, { type LinkEntry } from "$lib/link-list.svelte";
+
+    interface AlbumEntry {
+        artist: string;
+        title: string;
+        year: number;
+        img: string;
+        description: string[];
+    };
+
+    const albums: AlbumEntry[] = [
+        {
+            artist: "acloudyskye",
+            title: "What Do You Want!",
+            year: 2022,
+            img: "acloudyskye_02_wdyw.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "acloudyskye",
+            title: "There Must Be Something Here",
+            year: 2024,
+            img: "acloudyskye_03_tmbsh.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "acloudyskye",
+            title: "This Won't Be The Last Time",
+            year: 2025,
+            img: "acloudyskye_04_twbtlt.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "Avicii",
+            title: "True",
+            year: 2013,
+            img: "avicii_01_true.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "Avicii",
+            title: "True (Avicii by Avicii)",
+            year: 2014,
+            img: "avicii_02_trueaba.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "Avicii",
+            title: "Avīci (01)",
+            year: 2017,
+            img: "avicii_04_avici01.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "Ben Böhmer",
+            title: "Breathing",
+            year: 2019,
+            img: "benboehmer_01_breathing.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "bitbird artists",
+            title: "create together vol. 3",
+            year: 2022,
+            img: "bitbird_ct3.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "bitbird artists",
+            title: "Gouldian Finch 4",
+            year: 2021,
+            img: "bitbird_gf4.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "brakence",
+            title: "hypochondriac",
+            year: 2022,
+            img: "brakence_04_hypochondriac.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "Duskus",
+            title: "Healers Vol. 1",
+            year: 2023,
+            img: "duskus_02_healersvol1.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "FROMTHEHEART",
+            title: '"things happen, it\'s ok!"',
+            year: 2020,
+            img: "fromtheheart_thiok.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "gabby start",
+            title: "alex",
+            year: 2022,
+            img: "gabbystart_02_alex.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "ILLENIUM",
+            title: "Ashes",
+            year: 2016,
+            img: "illenium_01_ashes.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "ILLENIUM",
+            title: "Awake",
+            year: 2017,
+            img: "illenium_02_awake.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "ILLENIUM",
+            title: "ASCEND",
+            year: 2019,
+            img: "illenium_03_ascend.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "Jane Remover",
+            title: "Teen Week",
+            year: 2021,
+            img: "janeremover_01_teenweek.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "Jane Remover",
+            title: "Frailty",
+            year: 2021,
+            img: "janeremover_02_frailty.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "Jane Remover",
+            title: "Census Designated",
+            year: 2023,
+            img: "janeremover_03_censusdesignated.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "Jane Remover",
+            title: "Revengeseekerz",
+            year: 2025,
+            img: "janeremover_04_revengeseekerz.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "Jaron",
+            title: "it's hard to see color [When You're So Impossibly Far Away*]",
+            year: 2022,
+            img: "jaron_02_ihtsc.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "Jaron",
+            title: "LIGHTYEARS",
+            year: 2024,
+            img: "jaron_03_lightyears.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "Kasbo",
+            title: "Places We Don't Know",
+            year: 2018,
+            img: "kasbo_01_pwdk.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "Kasbo",
+            title: "The Making of a Paracosm",
+            year: 2020,
+            img: "kasbo_02_tmoap.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "Kaskade",
+            title: "Kaskade Christmas Deluxe",
+            year: 2018,
+            img: "kaskade_christmas.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "kmoe",
+            title: "K1",
+            year: 2025,
+            img: "kmoe_01_k1.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "Knapsack",
+            title: "futura",
+            year: 2018,
+            img: "knapsack_02_futura.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+        {
+            artist: "Knapsack",
+            title: "Stem",
+            year: 2025,
+            img: "knapsack_04_stem.webp",
+            description: [
+                "test 1",
+                "test 2",
+                "test 3",
+            ],
+        },
+    ];
+</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 as 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%/8);
+        line-height: 0;
+    }
+
+    .album-button-img {
+        width: 100%;
+        padding: 2px;
+        box-sizing: border-box;
+    }
+</style>