refactor

frontend/src/layouts/AdminLayout.astro

@@ -0,0 +1,45 @@
+---
+import Layout from './Layout.astro';
+
+interface Props {
+    title: string;
+}
+
+const { title } = Astro.props;
+---
+
+<Layout title={title}>
+    <div class="glass p-6 md:p-12 mb-12" id="admin-content" style="display: none;">
+        <header class="mb-8 md:mb-12 border-b border-white/5 pb-8 md:pb-12 flex flex-col md:flex-row justify-between items-start md:items-center gap-4">
+            <div>
+                <a href="/admin" class="text-blue hover:text-sky transition-colors mb-4 md:mb-8 inline-flex items-center gap-2 group text-sm md:text-base">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="md:w-5 md:h-5 transition-transform group-hover:-translate-x-1"><path d="m15 18-6-6 6-6"/></svg>
+                    Dashboard
+                </a>
+                <h1 class="text-3xl md:text-4xl font-extrabold text-mauve">
+                    {title}
+                </h1>
+                <slot name="header-subtitle" />
+            </div>
+            
+            <div class="flex gap-4 w-full md:w-auto">
+                <slot name="header-actions" />
+            </div>
+        </header>
+
+        <slot />
+    </div>
+
+    <script>
+        const token = localStorage.getItem('admin_token');
+        if (!token) {
+            window.location.href = '/admin/login';
+        } else {
+            const content = document.getElementById('admin-content');
+            if (content) content.style.display = 'block';
+            
+            // Dispatch custom event for child components to know token is ready
+            document.dispatchEvent(new CustomEvent('admin-auth-ready', { detail: { token } }));
+        }
+    </script>
+</Layout>