feat: add theme mode support with AppThemeMode enum and AppThemeState service

- Introduced AppThemeMode enum to define theme options: System, Light, Dark.
- Updated AppSettingsDocument to include ThemeMode property.
- Created AppThemeState service to manage current theme mode and handle changes.
- Integrated theme mode handling in CouchbaseLiteAppSettingsService for persistence.
- Added JavaScript for theme management in the frontend, supporting system preference detection.
- Enhanced CSS with theme variables for consistent styling across light and dark modes.
- Updated Playwright tests to ensure sidebar functionality and responsiveness.
This commit is contained in:
MaddoScientisto 2026-04-20 22:58:25 +02:00
commit 158906fa28
19 changed files with 889 additions and 82 deletions

View file

@ -10,6 +10,7 @@
<PageTitle>Calendar</PageTitle>
<div class="calendar-page">
<h1>Calendar</h1>
<div class="d-flex align-items-center gap-2 mb-3">
@ -51,11 +52,11 @@ else
{
@if (cell is null)
{
<td class="calendar-cell bg-light"></td>
<td class="calendar-cell calendar-cell-empty"></td>
}
else
{
<td class="calendar-cell @GetCellClass(cell) @(IsActiveCell(cell.Date) ? "calendar-cell-active" : string.Empty)" @onclick="() => TogglePopup(cell.Date)" role="button">
<td class="calendar-cell @GetCellClass(cell) @(IsToday(cell.Date) ? "calendar-cell-today" : string.Empty) @(IsActiveCell(cell.Date) ? "calendar-cell-active" : string.Empty)" @onclick="() => TogglePopup(cell.Date)" role="button">
<div class="calendar-day-number">@cell.Date.Day</div>
@foreach (var workUnit in cell.Entry?.WorkUnits ?? [])
@ -193,6 +194,7 @@ else
</div>
}
}
</div>
@code {
[Parameter] public string? YearMonth { get; set; }
@ -306,6 +308,8 @@ else
private bool IsActiveCell(DateOnly date) => activeDate == date;
private static bool IsToday(DateOnly date) => date == DateOnly.FromDateTime(DateTime.Today);
private void CreateWorkUnit(DateOnly date)
{
Navigation.NavigateTo($"/work-unit/{date:yyyy-MM-dd}");