diff --git a/src/lib/components/CollectionView.svelte b/src/lib/components/CollectionView.svelte
index 59e57f3..1dc08b3 100644
--- a/src/lib/components/CollectionView.svelte
+++ b/src/lib/components/CollectionView.svelte
@@ -11,6 +11,7 @@
selectedTrackIndex?: number | null;
onTrackClick?: (index: number) => void;
showAlbumColumn?: boolean;
+ useSequentialNumbers?: boolean;
}
let {
@@ -21,7 +22,8 @@
tracks,
selectedTrackIndex = null,
onTrackClick,
- showAlbumColumn = false
+ showAlbumColumn = false,
+ useSequentialNumbers = false
}: Props = $props();
function getThumbnailUrl(coverPath?: string): string {
@@ -100,7 +102,7 @@
onclick={() => handleTrackClick(i)}
>
- {track.metadata.trackNumber ?? i + 1}
+ {useSequentialNumbers ? i + 1 : (track.metadata.trackNumber ?? i + 1)}
|
{track.metadata.title ?? '—'} |
{#if showAlbumColumn}
@@ -206,6 +208,13 @@
width: 100%;
}
+ thead {
+ position: sticky;
+ top: 0;
+ z-index: 1;
+ background: #121212;
+ }
+
th {
text-align: left;
}
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 162ff6f..a11d6cf 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -12,6 +12,7 @@
let playlists = $state([]);
let playlistsLoadTimestamp = $state(0);
+ let showBanner = $state(false);
// Count active downloads (queued or downloading)
let activeDownloads = $derived(
@@ -149,9 +150,17 @@
-
- {@render children?.()}
-
+
+
+ {@render children?.()}
+
+
+ {#if showBanner}
+
+ Banner content here
+
+ {/if}
+
Ready
@@ -230,15 +239,32 @@
padding-left: 8px;
}
- .content-area {
+ .right-column {
flex: 1;
min-width: 0;
+ display: flex;
+ flex-direction: column;
+ gap: 8px;
+ }
+
+ .content-area {
+ flex: 1;
+ min-height: 0;
overflow-y: auto;
padding: 0;
font-family: "Pixelated MS Sans Serif", Arial;
background: #121212;
}
+ .banner-panel {
+ flex-shrink: 0;
+ height: 120px;
+ padding: 8px;
+ font-family: "Pixelated MS Sans Serif", Arial;
+ background: #121212;
+ overflow: hidden;
+ }
+
.status-text {
padding: 6px 8px 10px 10px;
font-family: "Pixelated MS Sans Serif", Arial;
diff --git a/src/routes/playlists/[name]/+page.svelte b/src/routes/playlists/[name]/+page.svelte
index 781c977..2882ace 100644
--- a/src/routes/playlists/[name]/+page.svelte
+++ b/src/routes/playlists/[name]/+page.svelte
@@ -94,6 +94,7 @@
{selectedTrackIndex}
onTrackClick={handleTrackClick}
showAlbumColumn={true}
+ useSequentialNumbers={true}
/>
{/if}