fix alligment, remove scrollbars, clean up layout to support desktop properly

This commit is contained in:
2025-05-25 03:14:30 +02:00
parent 8e5adaec96
commit 6058a96258
12 changed files with 80 additions and 51 deletions

View File

@@ -3,6 +3,7 @@ import { RouterLink, RouterView } from 'vue-router'
import NowPlaying from '@/components/NowPlaying.vue'
import NowPlayingView from '@/views/NowPlayingView.vue'
import MenuView from '@/views/MenuView.vue'
import HistoryView from '@/views/HistoryView.vue'
import Footer from '@/components/Footer.vue'
import { ref, onMounted, watch, onUnmounted } from 'vue'
import { useRoute } from 'vue-router'
@@ -37,8 +38,6 @@ function loadColors() {
document.documentElement.style.setProperty('--information-color', localStorage.getItem('infoColor') || '#ec4899');
document.documentElement.style.setProperty('--border-color', localStorage.getItem('borderColor') || '#ec4899');
console.log(localStorage.getItem('bgColor'));
}
loadColors();
@@ -71,17 +70,17 @@ onUnmounted(() => {
</div>
<div v-else class="flex flex-col h-screen max-h-screen wrapper info text-xl">
<main class="flex flex-1 w-full h-full overflow-y-scroll">
<main class="flex flex-1 w-full h-full overflow-y-hidden">
<aside class="w-1/12 bg-primary p-4">
<p>Sidebar content</p>
<aside class="w-1/12 bg-primary p-4 overflow-y-scroll">
<HistoryView />
</aside>
<section class="flex-1 overflow-y-scroll p-4">
<section class="flex-1 overflow-y-hidden">
<RouterView />
</section>
<section class="w-1/5 p-4">
<section class="w-1/5 overflow-y-scroll flex flex-col">
<NowPlayingView />
</section>
</main>