A personal website powered by Astro and ATProto
1---
2import '../styles/global.css';
3
4interface Props {
5 title: string;
6 description?: string;
7}
8
9const { title, description } = Astro.props;
10---
11
12<!DOCTYPE html>
13<html lang="en">
14 <head>
15 <meta charset="UTF-8" />
16 <meta name="description" content={description || "A personal website powered by ATproto"} />
17 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
18 <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
19 <title>{title || 'Home'} | Tynanverse</title>
20 </head>
21 <body class="bg-gray-50 dark:bg-gray-900 text-gray-900 dark:text-white font-sans">
22 <div class="min-h-screen">
23 <!-- Navigation -->
24 <nav class="bg-white dark:bg-gray-800 shadow-sm border-b border-gray-200 dark:border-gray-700">
25 <div class="container mx-auto px-4">
26 <div class="flex justify-between items-center h-16">
27 <div class="flex items-center space-x-8">
28 <a href="/" class="text-xl font-bold text-gray-900 dark:text-white hover:text-blue-600 dark:hover:text-blue-400 transition-colors">
29 Tynanverse
30 </a>
31 <div class="hidden md:flex space-x-6">
32 <a href="/" class="text-gray-600 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition-colors">
33 Home
34 </a>
35 <a href="/galleries" class="text-gray-600 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition-colors">
36 Galleries
37 </a>
38 <a href="/blog" class="text-gray-600 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition-colors">
39 Blog
40 </a>
41 <a href="/now" class="text-gray-600 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition-colors">
42 Now
43 </a>
44 </div>
45 </div>
46 </div>
47 </div>
48 </nav>
49
50 <slot />
51 </div>
52 </body>
53</html>