diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index f87cb18..c741316 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -4,7 +4,6 @@ import Gallery from "$lib/lists/gallery-entry.svelte"; import LinkList from "$lib/link-list.svelte"; - import type { DevlogPost } from "$lib/devlog-posts"; import { posts } from "$lib/devlog-posts"; var lastIndex = -1; diff --git a/src/routes/garden/music/+page.svelte b/src/routes/garden/music/+page.svelte index 88623e3..c3c68f4 100644 --- a/src/routes/garden/music/+page.svelte +++ b/src/routes/garden/music/+page.svelte @@ -3,8 +3,16 @@ import Content from "$lib/content.svelte"; import { albums, type AlbumEntry } from "$lib/likedalbums"; - let prnt = function(key: string) { - console.log(key) + let highlightedAlbum: AlbumEntry = $state({ + "artist": "", + "description": [], + "img": "", + "title": "", + "year": 0, + }); + + let albumClicked = function(key: string) { + highlightedAlbum = albums.get(key)!; } @@ -19,15 +27,15 @@ /> -
- -
-
{#each albums.entries() as [key, album]} {@render albumButton({ key, album })} {/each}
+ +
+ {@render albumShowcase({ album: highlightedAlbum })} +
{#snippet albumShowcase({ @@ -55,7 +63,7 @@ type="image" src="{album.img}" alt="Album art for {album.artist} – {album.title}" - on:click={() => prnt(key)} + onclick={() => albumClicked(key)} /> {/snippet}