scroll fixes

This commit is contained in:
2026-03-07 13:01:08 +11:00
parent 4064c9c557
commit 3b1eeaf12d
4 changed files with 49 additions and 121 deletions

View File

@@ -30,10 +30,10 @@ templ Footer() {
templ backToTopButton() {
<div class="absolute end-4 top-4 sm:end-6 lg:end-8">
<a
<button
class="inline-block rounded-full bg-teal p-2 text-crust
shadow-sm transition hover:bg-teal/75"
href="#main-content"
shadow-sm transition hover:bg-teal/75 hover:cursor-pointer"
onclick="document.getElementById('page-viewport').scrollTo({ top: 0, behavior: 'smooth' })"
>
<span class="sr-only">Back to top</span>
<svg
@@ -50,7 +50,7 @@ templ backToTopButton() {
clip-rule="evenodd"
></path>
</svg>
</a>
</button>
</div>
}

View File

@@ -29,7 +29,7 @@ templ Layout(title string) {
}
</head>
<body
class="bg-base dark text-text ubuntu-mono-regular overflow-x-hidden"
class="bg-base dark text-text ubuntu-mono-regular overflow-hidden h-screen"
hx-ext="ws"
ws-connect={ devInfo.WebsocketBase + "/ws/notifications" }
>
@@ -38,16 +38,20 @@ templ Layout(title string) {
@popup.ConfirmModal()
<div
id="main-content"
class="flex flex-col h-screen justify-between"
class="flex flex-col h-screen"
>
@Navbar()
if previewRole != nil {
@previewModeBanner(previewRole)
}
<div id="page-content" class="mb-auto md:px-5 md:pt-5">
{ children... }
<div id="page-viewport" class="flex-1 overflow-y-auto overflow-x-hidden">
<div id="page-content" class="min-h-full flex flex-col justify-between">
<div class="mb-auto md:px-5 md:pt-5">
{ children... }
</div>
@Footer()
</div>
</div>
@Footer()
</div>
</body>
</html>