Goodbye View Transitions

This commit is contained in:
Bad Manners 2024-10-28 21:26:40 -03:00
parent 6c834dd58a
commit 651054e65f
11 changed files with 654 additions and 704 deletions

View file

@ -1,6 +1,4 @@
---
import { ViewTransitions } from "astro:transitions";
import LoadingIndicator from "astro-loading-indicator/component";
import DarkModeScriptInline from "@components/DarkModeScriptInline.astro";
import NavHeader from "@components/NavHeader.astro";
import { IconSun, IconMoon } from "@components/icons";
@ -34,19 +32,6 @@ const title = pageTitle ? `${pageTitle} | Bad Manners` : "Bad Manners";
<meta property="og:url" content={Astro.url} />
<meta content="/logo.webp" property="og:image" />
<slot name="head" />
<ViewTransitions />
<LoadingIndicator color="#3b82f6" height="0.25rem" threshold={false} />
<script>
import Alpine from "alpinejs";
document.addEventListener("astro:after-preparation", () => {
Alpine.stopObservingMutations();
});
document.addEventListener("astro:page-load", () => {
document.dispatchEvent(new Event("alpine:init"));
Alpine.initTree(document.documentElement);
Alpine.startObservingMutations();
});
</script>
</head>
<body
:class="ageVerified ? 'overflow-auto' : 'overflow-hidden'"
@ -66,12 +51,11 @@ const title = pageTitle ? `${pageTitle} | Bad Manners` : "Bad Manners";
<main
class="w-full max-w-5xl flex-shrink-0 flex-grow-0 justify-center rounded-xl bg-stone-50 px-4 pb-6 pt-4 text-center text-base font-normal tracking-tight text-stone-700 sm:px-8 sm:pb-8 sm:pt-6 sm:text-lg dark:bg-zinc-800 dark:text-zinc-50 print:bg-transparent print:p-0"
>
<NavHeader transition:animate="none" />
<NavHeader />
<slot />
</main>
<footer
class="sm:text-md flex flex-col items-center pt-9 text-sm font-medium tracking-wide text-black dark:text-white"
transition:persist
>
<div class="flex items-center">
<span id="copyright" class="mr-2"
@ -102,7 +86,7 @@ const title = pageTitle ? `${pageTitle} | Bad Manners` : "Bad Manners";
</footer>
</div>
</div>
<DarkModeScriptInline transition:persist />
<AgeRestrictedModal transition:persist />
<DarkModeScriptInline />
<AgeRestrictedModal />
</body>
</html>