fix(ui): library layout

This commit is contained in:
2025-10-01 11:44:36 -04:00
parent 515a744734
commit 356a8aacbb

View File

@@ -65,15 +65,15 @@
} }
</script> </script>
<div> <div class="library-wrapper">
<h2 style="padding: 8px 8px 0 8px;">Library</h2> <h2 style="padding: 8px 8px 0 8px;">Library</h2>
{#if loading} {#if loading}
<p>Loading library...</p> <p style="padding: 8px;">Loading library...</p>
{:else if error} {:else if error}
<p class="error">{error}</p> <p class="error" style="padding: 8px;">{error}</p>
{:else if artists.length === 0 && albums.length === 0} {:else if artists.length === 0 && albums.length === 0}
<p>No music found in your music folder.</p> <p style="padding: 8px;">No music found in your music folder.</p>
{:else} {:else}
<section class="library-content"> <section class="library-content">
<!-- Tabs --> <!-- Tabs -->
@@ -173,12 +173,23 @@
</div> </div>
<style> <style>
.library-wrapper {
height: 100%;
display: flex;
flex-direction: column;
}
h2 { h2 {
margin: 0 0 8px 0; margin: 0 0 8px 0;
flex-shrink: 0;
} }
.library-content { .library-content {
margin: 0; margin: 0;
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
} }
.error { .error {
@@ -187,13 +198,21 @@
.tab-content { .tab-content {
margin-top: -2px; margin-top: -2px;
flex: 1;
display: flex;
flex-direction: column;
} }
.window-body { .window-body {
padding: 0; padding: 0;
flex: 1;
display: flex;
flex-direction: column;
overflow: hidden;
} }
.table-container { .table-container {
flex: 1;
overflow-y: auto; overflow-y: auto;
} }