80 lines
2 KiB
Text
80 lines
2 KiB
Text
---
|
|
import BaseHead from "../components/BaseHead.astro";
|
|
import Footer from "../components/nav/Footer.astro";
|
|
import { SITE_TITLE, SITE_DESCRIPTION } from "../consts";
|
|
import "@fontsource/ubuntu";
|
|
import "@fontsource/ubuntu/700.css";
|
|
import TopHeader from "../components/nav/TopHeader.astro";
|
|
import PageHeadline from "../components/PageHeadline.astro";
|
|
import MobileNavDrawer from "../components/nav/MobileNavDrawer.astro";
|
|
|
|
interface Props {
|
|
title?: string;
|
|
description?: string;
|
|
subtitle?: string;
|
|
className?: string;
|
|
}
|
|
|
|
const {
|
|
title = SITE_TITLE,
|
|
description = SITE_DESCRIPTION,
|
|
subtitle,
|
|
className = "max-w-2xl px-4 py-8",
|
|
} = Astro.props;
|
|
---
|
|
|
|
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<BaseHead title={title} description={description} />
|
|
<script is:inline>
|
|
// Prevent FOUC for dark mode
|
|
if (
|
|
localStorage.getItem("color-theme") === "dark" ||
|
|
(!("color-theme" in localStorage) &&
|
|
window.matchMedia("(prefers-color-scheme: dark)").matches)
|
|
) {
|
|
document.documentElement.classList.add("dark");
|
|
} else {
|
|
document.documentElement.classList.remove("dark");
|
|
}
|
|
</script>
|
|
</head>
|
|
|
|
<body
|
|
class="bg-white dark:bg-gray-900 text-black dark:text-white min-h-screen flex flex-col"
|
|
>
|
|
<div id="theme-overlay" class="theme-overlay"></div>
|
|
|
|
<!-- Mobile Navigation Drawer (at body level for proper positioning) -->
|
|
<MobileNavDrawer />
|
|
|
|
<!-- Header -->
|
|
<TopHeader />
|
|
|
|
<!-- Main Content -->
|
|
<main class="flex-1">
|
|
<div class={`${className} mx-auto`}>
|
|
<PageHeadline title={title} subtitle={subtitle} />
|
|
<slot />
|
|
</div>
|
|
</main>
|
|
|
|
<!-- Footer -->
|
|
<Footer />
|
|
|
|
<style>
|
|
.theme-overlay {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100vw;
|
|
height: 100vh;
|
|
pointer-events: none;
|
|
z-index: 9999;
|
|
display: none;
|
|
transition: clip-path 0.6s cubic-bezier(0.4, 0, 0.2, 1);
|
|
}
|
|
</style>
|
|
</body>
|
|
</html>
|