35e39ff979
Introduce a DxComboBox in MainLayout for selecting between multiple themes. Update ThemeState to manage the current theme, provide a list of available themes, and apply the selected theme via a new SetTheme method. Refactor dark mode handling to work with the new theme system, and ensure UI updates on theme or mode changes.
49 lines
1.3 KiB
Plaintext
49 lines
1.3 KiB
Plaintext
@inherits LayoutComponentBase
|
|
@implements IDisposable
|
|
@inject ThemeState ThemeState
|
|
|
|
<div class="page @(ThemeState.IsDarkMode ? "app-dark" : "app-light")">
|
|
<div class="sidebar">
|
|
<NavMenu />
|
|
</div>
|
|
|
|
<main>
|
|
<div class="top-row px-4">
|
|
<DxComboBox Data="@ThemeState.AvailableThemes"
|
|
Value="@ThemeState.CurrentThemeName"
|
|
ValueChanged="@((string t) => ThemeState.SetTheme(t))"
|
|
style="width: 130px;" />
|
|
<DxButton Text="@(ThemeState.IsDarkMode ? "Dark Mode aus" : "Dark Mode an")"
|
|
Click="ToggleTheme" />
|
|
<a href="https://learn.microsoft.com/aspnet/core/" target="_blank">About</a>
|
|
</div>
|
|
|
|
<article class="content px-4">
|
|
@Body
|
|
</article>
|
|
</main>
|
|
</div>
|
|
|
|
<div id="blazor-error-ui">
|
|
An unhandled error has occurred.
|
|
<a href="" class="reload">Reload</a>
|
|
<a class="dismiss">🗙</a>
|
|
</div>
|
|
|
|
@code {
|
|
protected override void OnInitialized()
|
|
{
|
|
ThemeState.OnChange += StateHasChanged;
|
|
}
|
|
|
|
private void ToggleTheme()
|
|
{
|
|
ThemeState.SetDarkMode(!ThemeState.IsDarkMode);
|
|
}
|
|
|
|
public void Dispose()
|
|
{
|
|
ThemeState.OnChange -= StateHasChanged;
|
|
}
|
|
}
|