From c2f85cca575813c3dd2ccb01cfcd201d9cd00a6a Mon Sep 17 00:00:00 2001
From: beo3000 <pakabu@web.de>
Date: Fri, 2 Jan 2026 19:49:44 +0100
Subject: [PATCH] mod home style

---
 src/Koogle.Web/Components/Pages/Home.razor | 33 ++++++++++++++++++----
 1 file changed, 28 insertions(+), 5 deletions(-)

diff --git a/src/Koogle.Web/Components/Pages/Home.razor b/src/Koogle.Web/Components/Pages/Home.razor
index 30c0fab..683a799 100644
--- a/src/Koogle.Web/Components/Pages/Home.razor
+++ b/src/Koogle.Web/Components/Pages/Home.razor
@@ -14,9 +14,9 @@
                 <MudStack Spacing="4">
                     <MudStack Row AlignItems="AlignItems.Center" Spacing="2">
                         <MudIcon Icon="@Icons.Material.Filled.Sports" Size="Size.Large" />
-                        <MudText Typo="Typo.caption" Style="opacity: 0.8;">Vereinsverwaltung leicht gemacht</MudText>
+                        <MudText Typo="Typo.caption" Style="opacity: 0.8;" Class="hero-subtitle">Vereinsverwaltung leicht gemacht</MudText>
                     </MudStack>
-                    <MudText Typo="Typo.h3" Class="font-weight-bold">
+                    <MudText Typo="Typo.h3" Class="hero-title">
                         KOOGLE - Vereinsverwaltung leicht gemacht
                     </MudText>
                     <MudText Typo="Typo.h6" Style="opacity: 0.9;">
@@ -54,9 +54,9 @@
             <MudItem xs="12" sm="6" md="3">
                 <MudCard Elevation="2" Class="pa-4 rounded-lg" Style="height: 100%;">
                     <MudStack AlignItems="AlignItems.Center" Spacing="2">
-                        <MudIcon Icon="@Icons.Material.Filled.CalendarMonth" Color="Color.Success" Size="Size.Large" />
-                        <MudText Typo="Typo.subtitle1" Class="font-weight-bold" Align="Align.Center">Spieltage organisieren</MudText>
-                        <MudText Typo="Typo.body2" Align="Align.Center" Color="Color.Secondary">Termine, Spiele und Teilnehmer im Blick</MudText>
+                        <MudIcon Icon="@Icons.Material.Filled.Create" Color="Color.Success" Size="Size.Large" />
+                        <MudText Typo="Typo.subtitle1" Class="font-weight-bold" Align="Align.Center">Club-Administration</MudText>
+                        <MudText Typo="Typo.body2" Align="Align.Center" Color="Color.Secondary">Gründe einen Verein und lade weitere Personen ein</MudText>
                     </MudStack>
                 </MudCard>
             </MudItem>
@@ -212,5 +212,28 @@
 
 </MudContainer>
 
+
 @code {
 }
+
+<style>
+    .hero-subtitle {
+        font-size: 0.65rem !important;
+    }
+
+    @@media (min-width: 600px) {
+        .hero-subtitle {
+            font-size: 0.75rem !important;
+        }
+    }
+
+    .hero-title {
+        font-size: 1.9rem !important;
+    }
+
+    @@media (min-width: 600px) {
+        .hero-title {
+            font-size: 2.2rem !important;
+        }
+    }
+</style>