chk
/
KoogleApp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

mod home style

This commit is contained in:
beo3000 2026-01-02 19:49:44 +01:00
parent f0b0d617a5
commit c2f85cca57
1 changed files with 28 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/Koogle.Web/Components/Pages/Home.razor
View File

@ -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>