From 59478b95d9bd5012fc21074ae68f466a2bb5c241 Mon Sep 17 00:00:00 2001
From: beo3000 <pakabu@web.de>
Date: Fri, 9 Jan 2026 21:37:03 +0100
Subject: [PATCH] mod home

---
 src/Koogle.Web/Components/Pages/Home.razor | 47 +++++++++++++---------
 1 file changed, 29 insertions(+), 18 deletions(-)

diff --git a/src/Koogle.Web/Components/Pages/Home.razor b/src/Koogle.Web/Components/Pages/Home.razor
index 64bc312..ecca82a 100644
--- a/src/Koogle.Web/Components/Pages/Home.razor
+++ b/src/Koogle.Web/Components/Pages/Home.razor
@@ -6,7 +6,7 @@
 
 @inject NavigationManager NavigationManager
 
-<MudContainer MaxWidth="MaxWidth.Large" Class="py-8">
+<MudContainer MaxWidth="MaxWidth.Large" Class="py-0">
 
 <MudImage src="logo6_bg.png" alt="KOOGLE Logo" Height="80" />
     @* Hero Section *@
@@ -45,7 +45,7 @@
                             </MudStack>
                             <AuthorizeView>
                                 <NotAuthorized>
-                                    <MudText Typo="Typo.caption" Style="color: white; opacity: 0.8;" Class="mt-2">
+                                    <MudText Style="color: white; opacity: 0.8; font-weight: 600;" Class="mt-2">
                                         Registriere deinen eigenen Club kostenlos oder nutze den <MudLink Href="/account/login" Class="demo-link">Demo-Zugang</MudLink> zum Testen.
                                     </MudText>
                                 </NotAuthorized>
@@ -62,12 +62,14 @@
         <MudText Typo="Typo.h5" Class="mb-4 font-weight-bold" Color="Color.Primary">
             Deine Vorteile mit KOOGLE
         </MudText>
-
+        
+        
         <MudGrid Spacing="4" Class="mb-8">
+            @* Zeile 1 *@
             <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.Groups" Color="Color.Primary" Size="Size.Large" />
+                        <MudIcon Icon="@Icons.Material.Filled.Groups" Color="Color.Primary" Size="Size.Large"/>
                         <MudText Typo="Typo.subtitle1" Class="font-weight-bold" Align="Align.Center">Mitgliederverwaltung</MudText>
                         <MudText Typo="Typo.body2" Align="Align.Center" Color="Color.Secondary">Mitglieder einfach verwaltet</MudText>
                     </MudStack>
@@ -76,7 +78,7 @@
             <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.Create" Color="Color.Success" Size="Size.Large" />
+                        <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>
@@ -85,7 +87,7 @@
             <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.AttachMoney" Color="Color.Warning" Size="Size.Large" />
+                        <MudIcon Icon="@Icons.Material.Filled.AttachMoney" Color="Color.Warning" Size="Size.Large"/>
                         <MudText Typo="Typo.subtitle1" Class="font-weight-bold" Align="Align.Center">Automatische Kostenabrechnung</MudText>
                         <MudText Typo="Typo.body2" Align="Align.Center" Color="Color.Secondary">Kosten und Umlagen im Blick</MudText>
                     </MudStack>
@@ -94,19 +96,18 @@
             <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.CheckCircle" Color="Color.Info" Size="Size.Large" />
+                        <MudIcon Icon="@Icons.Material.Filled.CheckCircle" Color="Color.Info" Size="Size.Large"/>
                         <MudText Typo="Typo.subtitle1" Class="font-weight-bold" Align="Align.Center">Auswertungen</MudText>
                         <MudText Typo="Typo.body2" Align="Align.Center" Color="Color.Secondary">Pro Person, Tag oder Spiel</MudText>
                     </MudStack>
                 </MudCard>
             </MudItem>
-        </MudGrid>
 
-        <MudGrid Spacing="4" Class="mb-8">
+            @* Zeile 2 *@
             <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.EventNote" Color="Color.Info" Size="Size.Large" />
+                        <MudIcon Icon="@Icons.Material.Filled.EventNote" Color="Color.Info" Size="Size.Large"/>
                         <MudText Typo="Typo.subtitle1" Class="font-weight-bold" Align="Align.Center">Spieltage einfach verwaltet</MudText>
                         <MudText Typo="Typo.body2" Align="Align.Center" Color="Color.Secondary">Übersichtlich und schnell</MudText>
                     </MudStack>
@@ -115,7 +116,7 @@
             <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.Calculate" Color="Color.Success" Size="Size.Large" />
+                        <MudIcon Icon="@Icons.Material.Filled.Calculate" Color="Color.Success" Size="Size.Large"/>
                         <MudText Typo="Typo.subtitle1" Class="font-weight-bold" Align="Align.Center">Regelbasierte Umlage</MudText>
                         <MudText Typo="Typo.body2" Align="Align.Center" Color="Color.Secondary">Ohne Kopfzerbrechen</MudText>
                     </MudStack>
@@ -124,7 +125,7 @@
             <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.TrendingUp" Color="Color.Error" Size="Size.Large" />
+                        <MudIcon Icon="@Icons.Material.Filled.TrendingUp" Color="Color.Error" Size="Size.Large"/>
                         <MudText Typo="Typo.subtitle1" Class="font-weight-bold" Align="Align.Center">Statistiken pro Tag oder Spiel</MudText>
                         <MudText Typo="Typo.body2" Align="Align.Center" Color="Color.Secondary">Detaillierte Auswertungen</MudText>
                     </MudStack>
@@ -133,16 +134,18 @@
             <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.SportsBaseball" Color="Color.Primary" Size="Size.Large" />
+                        <MudIcon Icon="@Icons.Material.Filled.SportsBaseball" Color="Color.Primary" Size="Size.Large"/>
                         <MudText Typo="Typo.subtitle1" Class="font-weight-bold" Align="Align.Center">Statistiken pro Person</MudText>
                         <MudText Typo="Typo.body2" Align="Align.Center" Color="Color.Secondary">Oder Spiel</MudText>
                     </MudStack>
                 </MudCard>
             </MudItem>
+            
+            @* Zeile 3 *@
             <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.Gif" Color="Color.Primary" Size="Size.Large" />
+                        <MudIcon Icon="@Icons.Material.Filled.Gif" Color="Color.Primary" Size="Size.Large"/>
                         <MudText Typo="Typo.subtitle1" Class="font-weight-bold" Align="Align.Center">Individuelle Gifs sorgen für Lacher am Kegelabend</MudText>
                         <MudText Typo="Typo.body2" Align="Align.Center" Color="Color.Secondary">weise Gifs Ereignissen zu</MudText>
                     </MudStack>
@@ -151,7 +154,7 @@
             <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.Games" Color="Color.Primary" Size="Size.Large" />
+                        <MudIcon Icon="@Icons.Material.Filled.Games" Color="Color.Primary" Size="Size.Large"/>
                         <MudText Typo="Typo.subtitle1" Class="font-weight-bold" Align="Align.Center">Auswahl an Kegelspielen</MudText>
                         <MudText Typo="Typo.body2" Align="Align.Center" Color="Color.Secondary">Tafel ohne Wasser und Kreide, synchron auf beliebigen Geräten</MudText>
                     </MudStack>
@@ -160,7 +163,7 @@
             <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.Mail" Color="Color.Info" Size="Size.Large" />
+                        <MudIcon Icon="@Icons.Material.Filled.Mail" Color="Color.Info" Size="Size.Large"/>
                         <MudText Typo="Typo.subtitle1" Class="font-weight-bold" Align="Align.Center">Strafen-Berichte per E-Mail</MudText>
                         <MudText Typo="Typo.body2" Align="Align.Center" Color="Color.Secondary">Verknüpfe Benutzerkonten und Mitglieder und erhalte Berichte per E-Mail</MudText>
                     </MudStack>
@@ -169,7 +172,7 @@
             <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.AccountBalance" Color="Color.Warning" Size="Size.Large" />
+                        <MudIcon Icon="@Icons.Material.Filled.AccountBalance" Color="Color.Warning" Size="Size.Large"/>
                         <MudText Typo="Typo.subtitle1" Class="font-weight-bold" Align="Align.Center">Kassenbuch</MudText>
                         <MudText Typo="Typo.body2" Align="Align.Center" Color="Color.Secondary">autom. Buchungen, Kontoabgleich u.v.m wird euer Kassenwart lieben</MudText>
                     </MudStack>
@@ -225,6 +228,14 @@
                 Unser <strong>Kegelverein KFB</strong> existiert seit 2000 - Wir wissen also, was Kegelvereine brauchen ;-)
             </MudText>
         </MudStack>
+        
+        <MudStack Row AlignItems="AlignItems.Center" Spacing="2">
+            <MudIcon Icon="@Icons.Material.Filled.Circle" Color="Color.Success" Size="Size.Small" />
+            <MudText>
+                Schon über <strong>1</strong> Kegelclubs vertrauen auf KOOGLE. ;-)
+            </MudText>
+        </MudStack>
+
     </MudPaper>
 
     @* Footer Slogan *@
@@ -236,7 +247,7 @@
 
     @* Copyright Footer *@
     <MudStack Row Justify="Justify.Center" AlignItems="AlignItems.Center" Spacing="4" Class="mt-6">
-        <MudText Typo="Typo.caption" Color="Color.Secondary">© 2025 KOOGLE. Alle Rechte vorbehalten.</MudText>
+        <MudText Typo="Typo.caption" Color="Color.Secondary">© 2026 KOOGLE. Alle Rechte vorbehalten.</MudText>
         <MudLink Href="/impressum" Typo="Typo.caption" Color="Color.Secondary">Impressum</MudLink>
         <MudLink Href="/datenschutz" Typo="Typo.caption" Color="Color.Secondary">Datenschutz</MudLink>
     </MudStack>