veryroundbird.house
forked from
haetae.tngl.sh/fanfic-atproto
personal fork for experimenting
1---
2import "$/styles/global.css";
3import { Font } from "astro:assets";
4import Navbar from "~/Navbar.astro";
5
6interface Props {
7 title?: string;
8 skipLink?: string;
9 class?: string;
10}
11
12const { title = "fanfics", skipLink, class: className, ...rest } = Astro.props;
13---
14<html lang="en">
15 <head>
16 <meta charset="utf-8" />
17 <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
18 <meta name="viewport" content="width=device-width" />
19 <title>{title}</title>
20 <Font cssVariable="--atkinson" preload />
21 <Font cssVariable="--dyslexic" preload />
22 <Font cssVariable="--plex-mono" preload />
23 <Font cssVariable="--plex-serif" preload />
24 <slot name="head" />
25 </head>
26 <body class="flex flex-col min-h-svh">
27 <header>
28 {skipLink && (
29 <a class="skip-link" href={`#${skipLink}`}>Skip to content</a>
30 )}
31
32 <Navbar />
33 </header>
34
35 <div class:list={["min-w-[65ch] max-w-10/12 mx-auto text-base", className]} {...rest}>
36 <slot />
37 </div>
38
39 <footer class="footer sm:footer-horizontal footer-center bg-base-300 text-base-content mt-auto p-5">
40 copyright or something ig
41 </footer>
42 </body>
43</html>
44
45<style>
46 @reference "../assets/styles/global.css";
47
48 .skip-link {
49 @apply absolute top-3 -left-full transition-all ease-in-out btn btn-ghost;
50
51 &:focus {
52 @apply left-3;
53 }
54 }
55</style>