Kick off (#1)

* Kick off * Update LICENSE copyright
2026-05-18 06:24:12 +00:00 · 2026-04-11 13:22:36 +02:00
parent 1f1e74c9f8
commit 3882a1941a
76 changed files with 17154 additions and 1 deletions
@@ -0,0 +1,85 @@
+---
+interface Props {
+  title: string;
+  description?: string;
+}
+
+const { title, description = 'Real-time uptime monitoring dashboard' } = Astro.props;
+---
+
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="description" content={description} />
+    <meta name="color-scheme" content="light dark" />
+    <meta property="og:title" content={title} />
+    <meta property="og:description" content={description} />
+    <meta property="og:type" content="website" />
+    <meta name="twitter:card" content="summary" />
+    <meta name="twitter:title" content={title} />
+    <meta name="twitter:description" content={description} />
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Geist+Mono:wght@400;500;600;700&display=swap" rel="stylesheet" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <link rel="mask-icon" href="/favicon.svg" color="#60a5fa" />
+    <title>{title}</title>
+  </head>
+  <body>
+    <slot />
+    <script src="../scripts/charts.ts"></script>
+    <script>
+      // Theme detection and persistence
+      (function() {
+        const STORAGE_KEY = 'atalaya-theme';
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)');
+
+        function getPreferredTheme() {
+          const stored = localStorage.getItem(STORAGE_KEY);
+          if (stored === 'light' || stored === 'dark') return stored;
+          return prefersDark.matches ? 'dark' : 'light';
+        }
+
+        function setTheme(theme: 'light' | 'dark') {
+          document.documentElement.setAttribute('data-theme', theme);
+          localStorage.setItem(STORAGE_KEY, theme);
+        }
+
+        // Set initial theme
+        setTheme(getPreferredTheme());
+
+        // Watch for system preference changes (only when no explicit choice)
+        prefersDark.addEventListener('change', (e) => {
+          if (!localStorage.getItem(STORAGE_KEY)) {
+            setTheme(e.matches ? 'dark' : 'light');
+          }
+        });
+      })();
+    </script>
+  </body>
+</html>
+
+<style is:global>
+  @import '../styles/global.css';
+
+  .skip-link {
+    position: absolute;
+    top: -2.5rem;
+    left: 0;
+    background: var(--accent);
+    color: white;
+    padding: var(--space-2) var(--space-4);
+    border-radius: var(--radius-sm);
+    text-decoration: none;
+    font-weight: var(--font-semibold);
+    z-index: 1000;
+    transition: top var(--transition-fast);
+  }
+
+  .skip-link:focus {
+    top: var(--space-4);
+    left: var(--space-4);
+  }
+</style>