ebolo/CaddyManager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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
Details

Browse Source
This commit is contained in:
Duy Dao
2025-07-17 21:43:58 +07:00
parent 2da42bc8bd
commit 18c710d341
3 changed files with 26 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
CaddyManager/Components/Layout/MainLayout.razor
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>
} }

8
CaddyManager/Components/Pages/Caddy/CaddyReverseProxies/CaddyReverseProxiesPage.razor
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>

34
CaddyManager/Components/Pages/Caddy/CaddyfilePage.razor
View File

@@ -3,19 +3,21 @@
<PageTitle>Global Caddyfile</PageTitle> <PageTitle>Global Caddyfile</PageTitle>
<MudCard> <MudContainer Class="pt-8">
<MudCardHeader> <MudCard>
<MudText Typo="Typo.h6"> <MudCardHeader>
Global Caddyfile <MudText Typo="Typo.h6">
</MudText> Global Caddyfile
</MudCardHeader> </MudText>
<MudCardContent> </MudCardHeader>
<MudText Typo="Typo.caption" Class="pl-4">File content</MudText> <MudCardContent>
<StandaloneCodeEditor @ref="_codeEditor" ConstructionOptions="@EditorConstructionOptions" <MudText Typo="Typo.caption" Class="pl-4">File content</MudText>
CssClass="caddy-file-editor global-caddy mt-1"></StandaloneCodeEditor> <StandaloneCodeEditor @ref="_codeEditor" ConstructionOptions="@EditorConstructionOptions"
</MudCardContent> CssClass="caddy-file-editor global-caddy mt-1"></StandaloneCodeEditor>
<MudCardActions Class="pb-4 pr-4 d-flex flex-row-reverse gap-4"> </MudCardContent>
<MudButton Color="Color.Primary" OnClick="Submit">Save</MudButton> <MudCardActions Class="pb-4 pr-4 d-flex flex-row-reverse gap-4">
<MudButton OnClick="Cancel">Cancel</MudButton> <MudButton Color="Color.Primary" OnClick="Submit">Save</MudButton>
</MudCardActions> <MudButton OnClick="Cancel">Cancel</MudButton>
</MudCard> </MudCardActions>
</MudCard>
</MudContainer>