refactor: enhance layout and structure of Caddyfile and Reverse Proxies pages for improved UI consistency
All checks were successful
Caddy Manager CI build / docker (push) Successful in 1m1s

This commit is contained in:
2025-07-17 21:43:58 +07:00
parent 2da42bc8bd
commit 18c710d341
3 changed files with 26 additions and 24 deletions

View File

@@ -30,10 +30,8 @@
<MudIconButton Icon="@Icons.Custom.Brands.GitHub" Color="Color.Inherit" Href="https://github.com/daothanhduy305/CaddyManager" Target="_blank" /> <MudIconButton Icon="@Icons.Custom.Brands.GitHub" Color="Color.Inherit" Href="https://github.com/daothanhduy305/CaddyManager" Target="_blank" />
</MudAppBar> </MudAppBar>
<NavigationDrawer @ref="_drawer"/> <NavigationDrawer @ref="_drawer"/>
<MudMainContent Class="pt-16 px-16 pb-10"> <MudMainContent Class="pt-0" Style="height: calc(100vh - var(--mud-appbar-height) + var(--mud-appbar-height)/4); margin-top: calc(var(--mud-appbar-height) - var(--mud-appbar-height)/4);">
<MudContainer Class="mt-6">
@Body @Body
</MudContainer>
</MudMainContent> </MudMainContent>
</MudLayout> </MudLayout>
} }

View File

@@ -4,7 +4,7 @@
<PageTitle>Reverse proxy configurations</PageTitle> <PageTitle>Reverse proxy configurations</PageTitle>
<MudContainer Class="d-flex flex-row flex-grow-1 gap-4 align-center"> <MudStack Row Class="px-20 mud-background-body pt-8">
<MudButton Variant="Variant.Filled" Color="Color.Primary" StartIcon="@Icons.Material.Filled.Add" <MudButton Variant="Variant.Filled" Color="Color.Primary" StartIcon="@Icons.Material.Filled.Add"
OnClick="NewReverseProxy">New... OnClick="NewReverseProxy">New...
</MudButton> </MudButton>
@@ -24,8 +24,9 @@
OnDebounceIntervalElapsed="HandleIntervalElapsed" @bind-Value="_debouncedText" OnDebounceIntervalElapsed="HandleIntervalElapsed" @bind-Value="_debouncedText"
AdornmentIcon="@(string.IsNullOrWhiteSpace(_debouncedText) ? Icons.Material.Filled.Search : Icons.Material.Filled.Close)" AdornmentIcon="@(string.IsNullOrWhiteSpace(_debouncedText) ? Icons.Material.Filled.Search : Icons.Material.Filled.Close)"
OnAdornmentClick="HandleSearchBarAdornmentClick" /> OnAdornmentClick="HandleSearchBarAdornmentClick" />
</MudContainer> </MudStack>
<MudList T="CaddyConfigurationInfo" Class="pt-10" SelectionMode="SelectionMode.MultiSelection" <MudContainer Class="mt-8 overflow-y-auto" Style="height: calc(100vh - 3 * var(--mud-appbar-height) + 3 * var(--mud-appbar-height)/4 - 8px);">
<MudList T="CaddyConfigurationInfo" Class="py-4" SelectionMode="SelectionMode.MultiSelection"
@bind-SelectedValues="_selectedCaddyConfigurations"> @bind-SelectedValues="_selectedCaddyConfigurations">
@foreach (var (index, caddyConfig) in _availableCaddyConfigurations.Index()) @foreach (var (index, caddyConfig) in _availableCaddyConfigurations.Index())
{ {
@@ -38,3 +39,4 @@
} }
} }
</MudList> </MudList>
</MudContainer>

View File

@@ -3,7 +3,8 @@
<PageTitle>Global Caddyfile</PageTitle> <PageTitle>Global Caddyfile</PageTitle>
<MudCard> <MudContainer Class="pt-8">
<MudCard>
<MudCardHeader> <MudCardHeader>
<MudText Typo="Typo.h6"> <MudText Typo="Typo.h6">
Global Caddyfile Global Caddyfile
@@ -18,4 +19,5 @@
<MudButton Color="Color.Primary" OnClick="Submit">Save</MudButton> <MudButton Color="Color.Primary" OnClick="Submit">Save</MudButton>
<MudButton OnClick="Cancel">Cancel</MudButton> <MudButton OnClick="Cancel">Cancel</MudButton>
</MudCardActions> </MudCardActions>
</MudCard> </MudCard>
</MudContainer>