From dc393502c2fa1555a20eac657e81f3ee489c951a Mon Sep 17 00:00:00 2001
From: Daniel Michelberger <dml@kq-pwr.de>
Date: Fri, 14 Aug 2026 15:45:36 +0200
Subject: [PATCH] feat: Login mit Logo statt Produktname
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Auf der Login-Karte steht jetzt das Logo an Stelle des Titels "Zeitnahme",
ebenso entfaellt der Name im Seitentitel. Im Header stand ohnehin nur das
Logo, dort war nichts zu entfernen.

Logo.svelte nimmt dafuer eine class-Prop entgegen, damit dieselbe
Komponente im Header und auf der Login-Karte in unterschiedlicher Groesse
verwendet werden kann; der bisherige Default w-24 h-24 bleibt, der Header
aendert sich also nicht. Die Bilder skalieren nun ueber h-full w-full mit
dem Container statt ueber die nie gueltige Klasse "-24".

"Zeitnahme" als Bezeichnung der Funktion (Navigation, Ueberschrift der
Timing-Seite, Buttons) bleibt bestehen — entfernt wurde nur der
Produktname.

Verifiziert: svelte-check ohne Fehler, Login-Seite im Browser geprueft,
Logo in beiden Groessen isoliert gerendert.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
---
 frontend/src/lib/components/Logo.svelte | 13 ++++++++-----
 frontend/src/routes/login/+page.svelte  |  9 +++++----
 2 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/frontend/src/lib/components/Logo.svelte b/frontend/src/lib/components/Logo.svelte
index b133633..bf740d7 100644
--- a/frontend/src/lib/components/Logo.svelte
+++ b/frontend/src/lib/components/Logo.svelte
@@ -1,7 +1,10 @@
-<script>
+<script lang="ts">
+    // Groesse ueber eine Klasse steuerbar, damit dasselbe Logo im Header
+    // (klein) und auf der Login-Karte (gross) verwendet werden kann.
+    let { class: className = 'w-24 h-24' }: { class?: string } = $props()
 </script>
 
-<div class="w-24  h-24 relative" id="logo">
-	<img alt="" class="absolute top-0 w-24 -24  object-contain" src="/schildl.svg">
-	<img alt="" class="absolute top-0 scale-110 w-24 -24  object-contain" src="/radl.svg">
-</div>
\ No newline at end of file
+<div class="relative {className}" id="logo">
+    <img alt="" class="absolute inset-0 h-full w-full object-contain" src="/schildl.svg">
+    <img alt="" class="absolute inset-0 h-full w-full scale-110 object-contain" src="/radl.svg">
+</div>
diff --git a/frontend/src/routes/login/+page.svelte b/frontend/src/routes/login/+page.svelte
index 96ba878..518cf53 100644
--- a/frontend/src/routes/login/+page.svelte
+++ b/frontend/src/routes/login/+page.svelte
@@ -2,10 +2,11 @@
     import { auth } from '$lib/stores/pocketbase.svelte'
     import { goto } from '$app/navigation'
     import { Button } from '@/components/ui/button'
-    import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
+    import { Card, CardContent, CardDescription, CardHeader } from '@/components/ui/card'
     import { Input } from '@/components/ui/input'
     import { Label } from '@/components/ui/label'
     import { LoaderCircle } from 'lucide-svelte'
+    import Logo from '$lib/components/Logo.svelte'
 
     let email = $state('')
     let password = $state('')
@@ -34,12 +35,12 @@
     }
 </script>
 
-<svelte:head><title>Login – Zeitnahme</title></svelte:head>
+<svelte:head><title>Login</title></svelte:head>
 
 <div class="min-h-screen flex items-center justify-center bg-background p-4">
     <Card class="w-full max-w-md">
-        <CardHeader class="text-center">
-            <CardTitle class="text-2xl">Zeitnahme</CardTitle>
+        <CardHeader class="justify-items-center gap-3 pt-2 text-center">
+            <Logo class="h-20 w-20" />
             <CardDescription>Melde dich an, um fortzufahren</CardDescription>
         </CardHeader>
         <CardContent>