more layout fixes

This commit is contained in:
2026-02-10 03:53:53 -08:00
parent 9e83b72139
commit fc0f04f29c
2 changed files with 11 additions and 15 deletions

View File

@@ -92,7 +92,7 @@
<div class="lg:hidden w-full sticky bottom-0"> <div class="lg:hidden w-full sticky bottom-0">
<PlayerMobile /> <PlayerMobile />
</div> </div>
<div class="hidden lg:block h-full"> <div class="hidden lg:block sticky top-12 h-[calc(100dvh-4rem)]">
<PlayerDesktop /> <PlayerDesktop />
</div> </div>
</div> </div>

View File

@@ -18,17 +18,13 @@
- Desktop: 2-column grid, right column reserved for the in-flow player sidebar - Desktop: 2-column grid, right column reserved for the in-flow player sidebar
--> -->
<div <div
class="min-h-dvh not-xl:min-w-[80dvw] lg:grid lg:grid-rows-[auto_1fr] gap-16 lg:grid-cols-[1fr_420px]" class="min-h-dvh max-w-full not-xl:min-w-[80dvw] lg:grid lg:grid-rows-[auto_1fr] gap-16 lg:grid-cols-[1fr_420px]"
> >
<header <header
class="sticky top-0 z-40 border-b bg-background/80 backdrop-blur lg:col-span-2" class="sticky top-0 z-40 border-b bg-background/80 backdrop-blur lg:col-span-2"
> >
<div <div class="mx-auto flex h-14 max-w-6xl items-center justify-between px-4">
class="mx-auto flex h-14 max-w-6xl items-center justify-between px-4" <a href={resolve("/")} class="font-semibold tracking-tight">AMQ Train</a>
>
<a href={resolve("/")} class="font-semibold tracking-tight"
>AMQ Train</a
>
<nav class="flex items-center gap-2 text-sm"> <nav class="flex items-center gap-2 text-sm">
<a href={resolve("/")}>Anime</a> <a href={resolve("/")}>Anime</a>
@@ -44,7 +40,6 @@
<!-- Desktop sidebar column (in normal flow) --> <!-- Desktop sidebar column (in normal flow) -->
<!-- PlayerRoot uses contents to inject its children into this grid --> <!-- PlayerRoot uses contents to inject its children into this grid -->
</div>
<ClientOnly showFallback={false}> <ClientOnly showFallback={false}>
{#snippet children()} {#snippet children()}
<div class="contents"> <div class="contents">
@@ -52,6 +47,7 @@
</div> </div>
{/snippet} {/snippet}
</ClientOnly> </ClientOnly>
</div>
<!-- Mobile player UI is rendered via a portal from the single GlobalPlayer instance <!-- Mobile player UI is rendered via a portal from the single GlobalPlayer instance
mounted in the desktop sidebar column above. --> mounted in the desktop sidebar column above. -->