Seite umbauen mit Komponenten und admin-auth

src/lib/components/AdminHeader.svelte

@@ -0,0 +1,57 @@
+<!-- src/lib/components/AdminHeader.svelte -->
+<script lang="ts">
+  import { goto } from '$app/navigation';
+  
+  export let title: string;
+  export let showBackButton: boolean = false;
+  
+  function goBack() {
+    goto('/admin');
+  }
+  
+  async function logout() {
+    try {
+      const res = await fetch('/api/admin/logout', {
+        method: 'POST'
+      });
+      
+      if (res.ok) {
+        goto('/admin');
+      }
+    } catch (err) {
+      console.error('Logout fehler:', err);
+    }
+  }
+</script>
+
+<header class="bg-white shadow-sm border-b border-gray-200">
+  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+    <div class="flex justify-between items-center h-16">
+      <div class="flex items-center">
+        {#if showBackButton}
+          <button
+            on:click={goBack}
+            class="mr-4 p-2 rounded-md text-gray-400 hover:text-gray-600 hover:bg-gray-100 transition-colors"
+            aria-label="Zurück"
+          >
+            <svg class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
+            </svg>
+          </button>
+        {/if}
+        
+        <h1 class="text-xl font-semibold text-gray-900">{title}</h1>
+      </div>
+      
+      <div class="flex items-center space-x-4">
+        <span class="text-sm text-gray-500">Admin-Bereich</span>
+        <button
+          on:click={logout}
+          class="inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4 font-medium rounded-md text-white bg-red-600 hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 transition-colors"
+        >
+          Abmelden
+        </button>
+      </div>
+    </div>
+  </div>
+</header>