Files
FictionArchive/fictionarchive-web-astro/src/layouts/GatedLayout.astro

39 lines
1.2 KiB
Plaintext

---
import AuthInit from '../lib/components/AuthInit.svelte';
import GatedAuthDisplay from '../lib/components/GatedAuthDisplay.svelte';
import '../styles/global.css';
interface Props {
title?: string;
}
const { title = 'FictionArchive' } = Astro.props;
---
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="generator" content={Astro.generator} />
<title>{title}</title>
</head>
<body class="min-h-screen bg-background">
<AuthInit client:load />
<header class="border-b bg-white/80 backdrop-blur dark:bg-gray-900/80">
<nav class="mx-auto flex max-w-6xl items-center gap-4 px-4 py-3 sm:px-6 lg:px-8">
<a href="/" class="flex items-center gap-2">
<span class="rounded bg-primary px-2 py-1 font-bold text-primary-foreground">FA</span>
<span class="font-semibold">FictionArchive</span>
</a>
<div class="flex-1"></div>
<GatedAuthDisplay client:load />
</nav>
</header>
<main class="mx-auto flex max-w-6xl flex-col gap-6 px-4 py-8 sm:px-6 lg:px-8">
<slot />
</main>
</body>
</html>