mirror of
https://github.com/markuryy/shark.git
synced 2025-12-12 19:51:01 +00:00
fix(ui): library layout
This commit is contained in:
@@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user