initial commit

src/pages/admin/login.astro

@@ -0,0 +1,50 @@
+---
+import AdminLoginLayout from '@layouts/admin/AdminLoginLayout.astro';
+import Password from '@components/input/Password.svelte';
+import Input from '@components/input/Input.svelte';
+import Popup from '@components/popup/Popup.svelte';
+---
+
+<AdminLoginLayout title="Login">
+  <div class="flex justify-center items-center w-full h-screen">
+    <div class="card w-96 px-6 py-6 shadow-lg">
+      <h1 class="text-3xl text-center">Admin Login</h1>
+      <div class="divider"></div>
+      <form id="login" class="flex flex-col items-center">
+        <div>
+          <Input id="username" type="text" label="Nutzername" required />
+          <Password id="password" label="Passwort" required />
+        </div>
+        <div class="mt-4">
+          <button class="btn btn-neutral">Login</button>
+        </div>
+      </form>
+    </div>
+  </div>
+</AdminLoginLayout>
+
+<Popup client:idle />
+
+<script>
+  import { actions } from 'astro:actions';
+  import { BASE_PATH } from 'astro:env/client';
+  import { popupState } from '@components/popup/Popup';
+
+  const loginForm = document.getElementById('login') as HTMLFormElement;
+  loginForm.addEventListener('submit', async (e) => {
+    e.preventDefault();
+
+    const usernameInput = document.getElementById('username') as HTMLInputElement;
+    const passwordInput = document.getElementById('password') as HTMLInputElement;
+
+    const { error } = await actions.session.login({
+      username: usernameInput.value,
+      password: passwordInput.value
+    });
+    if (error) {
+      popupState.set({ type: 'error', title: 'Fehler', message: error.message });
+      return;
+    }
+    window.location.href = `${BASE_PATH}/admin`;
+  });
+</script>