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="--quattro" preload />
21 <Font cssVariable="--dyslexic" preload />
22 <Font cssVariable="--intel-mono" preload />
23 <Font cssVariable="--plex-serif" preload />
24 <Font cssVariable="--jacquard-12" preload />
25 <slot name="head" />
26 </head>
27 <body class="flex flex-col min-h-svh">
28 <header>
29 {skipLink && (
30 <a class="skip-link" href={`#${skipLink}`}>Skip to content</a>
31 )}
32
33 <Navbar />
34 </header>
35
36 <div class:list={["sm:w-10/12 sm:mx-auto max-w-full mx-6 text-base", className]} {...rest}>
37 <slot />
38 </div>
39
40 <footer class="footer sm:footer-horizontal footer-center bg-base-300 text-base-content mt-auto p-5">
41 copyright or something ig
42 </footer>
43 </body>
44</html>
45
46<style>
47 @reference "../assets/styles/global.css";
48
49 .skip-link {
50 @apply absolute top-3 -left-full transition-all ease-in-out btn btn-ghost;
51
52 &:focus {
53 @apply left-3;
54 }
55 }
56</style>