diff --git a/.gitignore b/.gitignore index 95fa510..7292033 100644 --- a/.gitignore +++ b/.gitignore @@ -1,10 +1,6 @@ # Build outputs bin/ obj/ -node_modules/ -test-results/ -playwright-report/ -blob-report/ # User-specific files *.user @@ -31,8 +27,6 @@ Data/*.db-* *.sqlite3 App_Data/ .docker-data/ -probe-desktop.png -probe-mobile.png # Secrets and environment files .env diff --git a/Components/App.razor b/Components/App.razor index 1cf0d7a..a2917af 100644 --- a/Components/App.razor +++ b/Components/App.razor @@ -5,28 +5,6 @@ - @@ -37,7 +15,6 @@ - diff --git a/Components/Layout/MainLayout.razor b/Components/Layout/MainLayout.razor index b49bc25..7e9232b 100644 --- a/Components/Layout/MainLayout.razor +++ b/Components/Layout/MainLayout.razor @@ -1,16 +1,24 @@ @inherits LayoutComponentBase -@implements IDisposable - -@inject AppThemeState ThemeState -@inject IJSRuntime JS
- +
+ About
@@ -29,39 +37,8 @@ @code { private bool sidebarCollapsed = true; - protected override void OnInitialized() - { - ThemeState.ThemeModeChanged += HandleThemeModeChanged; - } - - protected override async Task OnAfterRenderAsync(bool firstRender) - { - if (!firstRender) - { - return; - } - - var themeMode = await ThemeState.EnsureLoadedAsync(); - await ApplyThemeAsync(themeMode); - } - private void ToggleSidebar() { sidebarCollapsed = !sidebarCollapsed; } - - private void HandleThemeModeChanged(AppThemeMode themeMode) - { - _ = InvokeAsync(() => ApplyThemeAsync(themeMode).AsTask()); - } - - private ValueTask ApplyThemeAsync(AppThemeMode themeMode) - { - return JS.InvokeVoidAsync("workTrackerTheme.setTheme", themeMode.ToString().ToLowerInvariant()); - } - - public void Dispose() - { - ThemeState.ThemeModeChanged -= HandleThemeModeChanged; - } } diff --git a/Components/Layout/MainLayout.razor.css b/Components/Layout/MainLayout.razor.css index cfbb458..8204d7a 100644 --- a/Components/Layout/MainLayout.razor.css +++ b/Components/Layout/MainLayout.razor.css @@ -14,8 +14,8 @@ main { } .top-row { - background-color: var(--wt-header-bg); - border-bottom: 1px solid var(--wt-header-border); + background-color: #f7f7f7; + border-bottom: 1px solid #d6d5d5; justify-content: flex-end; height: 3.5rem; display: flex; @@ -23,7 +23,6 @@ main { } .top-row ::deep a, .top-row ::deep .btn-link { - color: var(--wt-header-link); white-space: nowrap; margin-left: 1.5rem; text-decoration: none; @@ -38,9 +37,30 @@ main { text-overflow: ellipsis; } +.sidebar-toggle { + display: none; + align-items: center; + justify-content: center; + flex-direction: column; + gap: 0.2rem; + width: 2.5rem; + height: 2.5rem; + margin-right: auto; + border: 1px solid #d6d5d5; + border-radius: 0.65rem; + background: #fff; +} + +.sidebar-toggle-bar { + width: 1rem; + height: 2px; + background: #334155; + border-radius: 999px; +} + @media (max-width: 640.98px) { .top-row { - justify-content: flex-end; + justify-content: space-between; } .top-row ::deep a, .top-row ::deep .btn-link { @@ -80,6 +100,10 @@ main { padding-right: 1.5rem !important; } + .sidebar-toggle { + display: inline-flex; + } + .sidebar.sidebar-collapsed { width: 5rem; } diff --git a/Components/Layout/NavMenu.razor b/Components/Layout/NavMenu.razor index 514e372..4a34d50 100644 --- a/Components/Layout/NavMenu.razor +++ b/Components/Layout/NavMenu.razor @@ -4,29 +4,15 @@ @code { [Parameter] public bool IsCollapsed { get; set; } - [Parameter] public EventCallback OnToggleSidebar { get; set; } - - private Task ToggleSidebarAsync() - { - return OnToggleSidebar.InvokeAsync(); - } }
-
-
- +
+
+ + WorkTracker + +
diff --git a/Components/Layout/NavMenu.razor.css b/Components/Layout/NavMenu.razor.css index 68a8b8e..b4e5429 100644 --- a/Components/Layout/NavMenu.razor.css +++ b/Components/Layout/NavMenu.razor.css @@ -1,19 +1,10 @@ .top-row { min-height: 3.5rem; background-color: rgba(0,0,0,0.4); - padding-left: 0.75rem !important; - padding-right: 0.75rem !important; -} - -.nav-menu-header { - display: flex; - align-items: center; - gap: 0.75rem; } .navbar-brand { font-size: 1.1rem; - margin-bottom: 0; } .sidebar-brand-compact { @@ -24,32 +15,6 @@ height: 100%; } -.sidebar-toggle { - display: inline-flex; - align-items: center; - justify-content: center; - flex-direction: column; - gap: 0.2rem; - width: 2.5rem; - height: 2.5rem; - border: 1px solid rgba(255, 255, 255, 0.18); - border-radius: 0.65rem; - background: rgba(255, 255, 255, 0.08); - color: #fff; - flex: 0 0 auto; -} - -.sidebar-toggle:hover { - background: rgba(255, 255, 255, 0.16); -} - -.sidebar-toggle-bar { - width: 1rem; - height: 2px; - background: currentColor; - border-radius: 999px; -} - .bi { display: inline-block; position: relative; @@ -157,22 +122,19 @@ display: none; } - .nav-menu-shell-collapsed .nav-scrollable { - display: none; - } - - .nav-menu-shell:not(.nav-menu-shell-collapsed) .nav-scrollable { - display: block; - } - .nav-scrollable { height: auto; } } @media (min-width: 641px) { + .nav-menu-shell-collapsed .top-row { + padding-left: 0.5rem !important; + padding-right: 0.5rem !important; + } + .nav-menu-shell-collapsed .container-fluid { - justify-content: flex-start; + justify-content: center; } .nav-menu-shell-collapsed .sidebar-brand-full, diff --git a/Components/Pages/CalendarView.razor b/Components/Pages/CalendarView.razor index 890463d..60f2df0 100644 --- a/Components/Pages/CalendarView.razor +++ b/Components/Pages/CalendarView.razor @@ -10,7 +10,6 @@ Calendar -

Calendar

@@ -52,11 +51,11 @@ else { @if (cell is null) { - + } else { - +
@cell.Date.Day
@foreach (var workUnit in cell.Entry?.WorkUnits ?? []) @@ -194,13 +193,10 @@ else
} } -
@code { [Parameter] public string? YearMonth { get; set; } - private const string IncludePreviewPreferenceKey = "worktracker.includePreviewWorkUnits"; - private DateOnly firstOfMonth; private bool loading = true; private List weeks = []; @@ -224,22 +220,6 @@ else await LoadMonth(); } - protected override async Task OnAfterRenderAsync(bool firstRender) - { - if (!firstRender) - { - return; - } - - var savedIncludePreview = await JS.InvokeAsync("workTrackerPreferences.getBool", IncludePreviewPreferenceKey); - if (savedIncludePreview.HasValue && savedIncludePreview.Value != includePreviewTotals) - { - includePreviewTotals = savedIncludePreview.Value; - await LoadMonth(); - await InvokeAsync(StateHasChanged); - } - } - private async Task LoadMonth() { loading = true; @@ -287,7 +267,6 @@ else private async Task OnIncludePreviewTotalsChanged(ChangeEventArgs e) { includePreviewTotals = e.Value is bool value && value; - await JS.InvokeVoidAsync("workTrackerPreferences.setBool", IncludePreviewPreferenceKey, includePreviewTotals); await LoadMonth(); } @@ -327,8 +306,6 @@ 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}"); diff --git a/Components/Pages/GridView.razor b/Components/Pages/GridView.razor index c21e3f8..2887739 100644 --- a/Components/Pages/GridView.razor +++ b/Components/Pages/GridView.razor @@ -24,7 +24,7 @@ else {
- +
@@ -150,31 +150,31 @@ else private string GetRowClass(CalendarDayRow row) { - if (row.IsWeekend || row.IsFestivity) return "grid-row-weekend"; - if (row.Entry is null) return string.Empty; + if (row.IsWeekend || row.IsFestivity) return "table-danger"; + if (row.Entry is null) return ""; if (row.Entry.CalendarEvents.Any(entry => entry.EventType == CalendarEventType.Holiday)) { - return "grid-row-holiday"; + return "table-success"; } if (row.Entry.CalendarEvents.Any(entry => entry.EventType == CalendarEventType.Closure)) { - return "grid-row-closure"; + return "table-warning"; } if (row.Entry.CalendarEvents.Any(entry => entry.EventType == CalendarEventType.Illness)) { - return "grid-row-illness"; + return "table-info"; } if (row.Entry.CalendarEvents.Any(entry => entry.EventType == CalendarEventType.DayOff)) { - return "grid-row-dayoff"; + return "table-secondary"; } if (row.Entry.WorkUnits.Any(entry => entry.Location == WorkUnitLocation.Home)) { - return "grid-row-home"; + return "table-light"; } return string.Empty; diff --git a/Components/Pages/MonthlySummary.razor b/Components/Pages/MonthlySummary.razor index 8f45fe5..ed4ba65 100644 --- a/Components/Pages/MonthlySummary.razor +++ b/Components/Pages/MonthlySummary.razor @@ -5,7 +5,6 @@ @using System.Globalization @inject global::WorkTracker.Services.WorkDays.IWorkDayService WorkDayService -@inject IJSRuntime JS Monthly Summary @@ -210,7 +209,6 @@ else if (viewMode == SummaryViewMode.Timesheet && timesheet is not null) [Parameter] public string? YearMonth { get; set; } private static readonly CultureInfo ItalianCulture = CultureInfo.GetCultureInfo("it-IT"); - private const string IncludePreviewPreferenceKey = "worktracker.includePreviewWorkUnits"; private DateOnly currentMonth; private bool loading = true; @@ -233,26 +231,9 @@ else if (viewMode == SummaryViewMode.Timesheet && timesheet is not null) await LoadSummary(); } - protected override async Task OnAfterRenderAsync(bool firstRender) - { - if (!firstRender) - { - return; - } - - var savedIncludePreview = await JS.InvokeAsync("workTrackerPreferences.getBool", IncludePreviewPreferenceKey); - if (savedIncludePreview.HasValue && savedIncludePreview.Value != includePreview) - { - includePreview = savedIncludePreview.Value; - await LoadSummary(); - await InvokeAsync(StateHasChanged); - } - } - private async Task OnIncludePreviewChanged(ChangeEventArgs e) { includePreview = e.Value is bool value && value; - await JS.InvokeVoidAsync("workTrackerPreferences.setBool", IncludePreviewPreferenceKey, includePreview); await LoadSummary(); } diff --git a/Components/Pages/Settings.razor b/Components/Pages/Settings.razor index 38d2689..0cb3a2d 100644 --- a/Components/Pages/Settings.razor +++ b/Components/Pages/Settings.razor @@ -2,7 +2,6 @@ @attribute [Authorize] @inject IAppSettingsService AppSettingsService -@inject AppThemeState ThemeState Settings @@ -19,14 +18,6 @@ else
-
- - - - - - -
@@ -84,7 +75,6 @@ else } settings = await AppSettingsService.SaveAsync(settings); - ThemeState.SetThemeMode(settings.ThemeMode); statusMessage = $"Saved at {DateTime.Now:t}"; } } diff --git a/Domain/AppSettingsDocument.cs b/Domain/AppSettingsDocument.cs index ead685a..a3a93d1 100644 --- a/Domain/AppSettingsDocument.cs +++ b/Domain/AppSettingsDocument.cs @@ -4,8 +4,6 @@ public sealed class AppSettingsDocument { public string Id { get; set; } = "global"; - public AppThemeMode ThemeMode { get; set; } = AppThemeMode.System; - public decimal StandardWorkHoursPerDay { get; set; } = 8m; public decimal HourlyGrossRate { get; set; } = 17.5m; diff --git a/Domain/AppThemeMode.cs b/Domain/AppThemeMode.cs deleted file mode 100644 index f5cd3b7..0000000 --- a/Domain/AppThemeMode.cs +++ /dev/null @@ -1,8 +0,0 @@ -namespace WorkTracker.Domain; - -public enum AppThemeMode -{ - System, - Light, - Dark -} \ No newline at end of file diff --git a/Program.cs b/Program.cs index d67f0ef..68c4cec 100644 --- a/Program.cs +++ b/Program.cs @@ -19,17 +19,6 @@ using WorkTracker.Services.WorkDays; var builder = WebApplication.CreateBuilder(args); -var runningInContainer = string.Equals( - Environment.GetEnvironmentVariable("DOTNET_RUNNING_IN_CONTAINER"), - "true", - StringComparison.OrdinalIgnoreCase) - || File.Exists("/.dockerenv"); - -if (!runningInContainer) -{ - builder.WebHost.UseStaticWebAssets(); -} - builder.Logging.ClearProviders(); builder.Host.UseNLog(); @@ -71,7 +60,6 @@ builder.Services.Configure(builder.Configuration.GetSection(S builder.Services.AddSingleton(); builder.Services.AddScoped(); -builder.Services.AddScoped(); builder.Services.AddSingleton(); builder.Services.AddSingleton(); builder.Services.AddScoped(); diff --git a/README.Docker.md b/README.Docker.md index 58592fe..7cfede9 100644 --- a/README.Docker.md +++ b/README.Docker.md @@ -2,7 +2,7 @@ Running and debugging with Docker or local Couchbase Lite storage Quick run (Docker Engine required): -1. Build and start services with the development override: +1. Build and start services: docker compose up --build @@ -11,15 +11,9 @@ Quick run (Docker Engine required): Production deployment: - Put deployment values in a `.env` file next to `docker-compose.yml` or export them in the shell before running Docker Compose. -- The base compose file is runtime-only and expects the image referenced by `IMAGE_REGISTRY` and `IMAGE_TAG` to already exist. - The base compose file is now parameterized for host port, persisted storage path, image tag, auth mode, seeded user credentials, allowed hosts, and healthcheck timings. - For a direct production deployment, define at least `WORKTRACKER_DATA_PATH`. If you enable the built-in login flow, also define `APPAUTH_ENABLED=true` and a strong `SINGLEUSER_PASSWORD` before first startup. -Production start: - -- Copy `docker-compose.yml` and the matching env file to the server. -- Pull the published image first, then start the stack with `docker compose --env-file production.env up -d`. - Deployment variables: | Variable | Required for production | Default | Purpose | @@ -110,6 +104,5 @@ Docker Playwright smoke tests: Notes: - The base compose file remains production-oriented; the override file is the optional containerized development layer. -- `docker compose up --build` still works locally because Docker Compose auto-loads `docker-compose.override.yml`, which carries the build settings. - The first container build takes longer because the dev image installs the .NET debugger. - The Dockerfile uses the .NET 10 `*-noble` images so local builds and container builds stay aligned with the SDK available in VS Code. diff --git a/Services/Settings/AppThemeState.cs b/Services/Settings/AppThemeState.cs deleted file mode 100644 index f8c27b8..0000000 --- a/Services/Settings/AppThemeState.cs +++ /dev/null @@ -1,41 +0,0 @@ -using WorkTracker.Domain; - -namespace WorkTracker.Services.Settings; - -public sealed class AppThemeState -{ - private readonly IAppSettingsService appSettingsService; - private AppThemeMode? currentThemeMode; - - public AppThemeState(IAppSettingsService appSettingsService) - { - this.appSettingsService = appSettingsService; - } - - public event Action? ThemeModeChanged; - - public AppThemeMode CurrentThemeMode => currentThemeMode ?? AppThemeMode.System; - - public async Task EnsureLoadedAsync(CancellationToken cancellationToken = default) - { - if (currentThemeMode.HasValue) - { - return currentThemeMode.Value; - } - - var settings = await appSettingsService.GetAsync(cancellationToken); - currentThemeMode = settings.ThemeMode; - return CurrentThemeMode; - } - - public void SetThemeMode(AppThemeMode themeMode) - { - if (currentThemeMode == themeMode) - { - return; - } - - currentThemeMode = themeMode; - ThemeModeChanged?.Invoke(themeMode); - } -} \ No newline at end of file diff --git a/Services/Settings/CouchbaseLiteAppSettingsService.cs b/Services/Settings/CouchbaseLiteAppSettingsService.cs index c2c1584..fc934bf 100644 --- a/Services/Settings/CouchbaseLiteAppSettingsService.cs +++ b/Services/Settings/CouchbaseLiteAppSettingsService.cs @@ -47,7 +47,6 @@ public sealed class CouchbaseLiteAppSettingsService : IAppSettingsService private void SaveDocument(AppSettingsDocument settings) { var document = new MutableDocument(DefaultSettingsId); - document.SetString("themeMode", settings.ThemeMode.ToString()); document.SetDouble("standardWorkHoursPerDay", Decimal.ToDouble(settings.StandardWorkHoursPerDay)); document.SetDouble("hourlyGrossRate", Decimal.ToDouble(settings.HourlyGrossRate)); document.SetDouble("profitabilityCoefficient", Decimal.ToDouble(settings.ProfitabilityCoefficient)); @@ -66,7 +65,6 @@ public sealed class CouchbaseLiteAppSettingsService : IAppSettingsService return new AppSettingsDocument { Id = document.Id, - ThemeMode = ReadThemeMode(document), StandardWorkHoursPerDay = ReadDecimal(document, "standardWorkHoursPerDay", 8m), HourlyGrossRate = ReadDecimal(document, "hourlyGrossRate", 17.5m), ProfitabilityCoefficient = ReadDecimal(document, "profitabilityCoefficient", 0.67m), @@ -86,14 +84,6 @@ public sealed class CouchbaseLiteAppSettingsService : IAppSettingsService : defaultValue; } - private static AppThemeMode ReadThemeMode(Document document) - { - var value = document.GetString("themeMode"); - return Enum.TryParse(value, ignoreCase: true, out var themeMode) - ? themeMode - : AppThemeMode.System; - } - private static DateTimeOffset ReadDateTimeOffset(Document document, string key) { var value = document.GetString(key); diff --git a/docker-compose.yml b/docker-compose.yml index 9763b6f..981a99f 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -1,5 +1,8 @@ services: worktracker: + build: + context: . + dockerfile: Dockerfile image: ${IMAGE_REGISTRY:-worktracker}:${IMAGE_TAG:-latest} environment: ASPNETCORE_ENVIRONMENT: ${ASPNETCORE_ENVIRONMENT:-Production} diff --git a/package-lock.json b/package-lock.json deleted file mode 100644 index 05e095f..0000000 --- a/package-lock.json +++ /dev/null @@ -1,76 +0,0 @@ -{ - "name": "worktracker-playwright", - "lockfileVersion": 3, - "requires": true, - "packages": { - "": { - "name": "worktracker-playwright", - "dependencies": { - "playwright": "^1.59.1" - }, - "devDependencies": { - "@playwright/test": "^1.59.1" - } - }, - "node_modules/@playwright/test": { - "version": "1.59.1", - "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.59.1.tgz", - "integrity": "sha512-PG6q63nQg5c9rIi4/Z5lR5IVF7yU5MqmKaPOe0HSc0O2cX1fPi96sUQu5j7eo4gKCkB2AnNGoWt7y4/Xx3Kcqg==", - "dev": true, - "license": "Apache-2.0", - "dependencies": { - "playwright": "1.59.1" - }, - "bin": { - "playwright": "cli.js" - }, - "engines": { - "node": ">=18" - } - }, - "node_modules/fsevents": { - "version": "2.3.2", - "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", - "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", - "hasInstallScript": true, - "license": "MIT", - "optional": true, - "os": [ - "darwin" - ], - "engines": { - "node": "^8.16.0 || ^10.6.0 || >=11.0.0" - } - }, - "node_modules/playwright": { - "version": "1.59.1", - "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.59.1.tgz", - "integrity": "sha512-C8oWjPR3F81yljW9o5OxcWzfh6avkVwDD2VYdwIGqTkl+OGFISgypqzfu7dOe4QNLL2aqcWBmI3PMtLIK233lw==", - "license": "Apache-2.0", - "dependencies": { - "playwright-core": "1.59.1" - }, - "bin": { - "playwright": "cli.js" - }, - "engines": { - "node": ">=18" - }, - "optionalDependencies": { - "fsevents": "2.3.2" - } - }, - "node_modules/playwright-core": { - "version": "1.59.1", - "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.59.1.tgz", - "integrity": "sha512-HBV/RJg81z5BiiZ9yPzIiClYV/QMsDCKUyogwH9p3MCP6IYjUFu/MActgYAvK0oWyV9NlwM3GLBjADyWgydVyg==", - "license": "Apache-2.0", - "bin": { - "playwright-core": "cli.js" - }, - "engines": { - "node": ">=18" - } - } - } -} diff --git a/package.json b/package.json index 031f157..64ec29f 100644 --- a/package.json +++ b/package.json @@ -5,9 +5,6 @@ "test:e2e": "playwright test" }, "devDependencies": { - "@playwright/test": "^1.59.1" - }, - "dependencies": { - "playwright": "^1.59.1" + "@playwright/test": "1.59.1" } -} +} \ No newline at end of file diff --git a/production.env b/production.env index 5bfd2a2..592616c 100644 --- a/production.env +++ b/production.env @@ -10,10 +10,10 @@ WORKTRACKER_DATA_PATH=/mnt/storage/data/worktracker/db COUCHBASELITE_DATABASE_NAME=worktracker # Published app port -WORKTRACKER_PORT=8003 +WORKTRACKER_PORT=8002 # Image reference used by Docker Compose -IMAGE_REGISTRY=forgejo.maddoscientisto.net/maddo/worktracker +IMAGE_REGISTRY=worktracker IMAGE_TAG=latest # Built-in authentication @@ -22,7 +22,7 @@ APPAUTH_DEFAULT_USERNAME=Admin APPAUTH_DEFAULT_USERID=ADMIN SINGLEUSER_SEED_ON_STARTUP=true SINGLEUSER_USERNAME=admin -SINGLEUSER_PASSWORD=disagio +SINGLEUSER_PASSWORD=disagio-spaghetti-science-adsfg # Container healthcheck tuning WORKTRACKER_HEALTHCHECK_INTERVAL=30s diff --git a/tests/playwright/auth-bypass.spec.ts b/tests/playwright/auth-bypass.spec.ts index 0cd22cf..670b5e8 100644 --- a/tests/playwright/auth-bypass.spec.ts +++ b/tests/playwright/auth-bypass.spec.ts @@ -1,14 +1,9 @@ import { expect, test } from '@playwright/test'; -async function waitForBlazorConnection(page: Parameters[0]['page']) { - await page.waitForTimeout(750); -} - test.describe('sidebar collapse', () => { test('starts collapsed and expands through the toggle button', async ({ page }) => { await page.setViewportSize({ width: 1440, height: 960 }); - await page.goto('/', { waitUntil: 'networkidle' }); - await waitForBlazorConnection(page); + await page.goto('/'); const sidebar = page.getByTestId('sidebar-shell'); const toggle = page.getByRole('button', { name: 'Toggle sidebar' }); @@ -18,43 +13,16 @@ test.describe('sidebar collapse', () => { await expect(page.getByRole('link', { name: 'Dashboard' })).toBeVisible(); await toggle.click(); - await page.waitForTimeout(500); await expect(sidebar).toHaveAttribute('data-collapsed', 'false'); await expect(toggle).toHaveAttribute('aria-expanded', 'true'); await expect(page.getByText('Dashboard')).toBeVisible(); await toggle.click(); - await page.waitForTimeout(500); await expect(sidebar).toHaveAttribute('data-collapsed', 'true'); await expect(toggle).toHaveAttribute('aria-expanded', 'false'); }); - - test('renders sidebar styles and toggles on narrow layouts', async ({ page }) => { - await page.setViewportSize({ width: 500, height: 900 }); - await page.goto('/', { waitUntil: 'networkidle' }); - await waitForBlazorConnection(page); - - const sidebar = page.getByTestId('sidebar-shell'); - const toggle = page.getByRole('button', { name: 'Toggle sidebar' }); - const navScrollable = page.locator('.nav-scrollable'); - const sidebarPanel = page.locator('.sidebar'); - const toggleBar = page.locator('.sidebar-toggle-bar').first(); - - await expect(sidebar).toHaveAttribute('data-collapsed', 'true'); - await expect(navScrollable).toBeHidden(); - - await expect(sidebarPanel).toHaveCSS('background-image', /linear-gradient/); - await expect(toggleBar).toHaveCSS('background-color', 'rgb(255, 255, 255)'); - - await toggle.click(); - await page.waitForTimeout(500); - - await expect(sidebar).toHaveAttribute('data-collapsed', 'false'); - await expect(toggle).toHaveAttribute('aria-expanded', 'true'); - await expect(navScrollable).toBeVisible(); - }); }); test('home loads without a login screen', async ({ page }) => { diff --git a/wwwroot/app.css b/wwwroot/app.css index a2f6721..071fd5d 100644 --- a/wwwroot/app.css +++ b/wwwroot/app.css @@ -2,405 +2,6 @@ html, body { font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; } -:root { - --wt-header-bg: #f7f7f7; - --wt-header-border: #d6d5d5; - --wt-header-link: #1f2937; - --wt-calendar-cell-hover: rgba(0, 0, 0, 0.05); - --wt-calendar-active: #1b6ec2; - --wt-calendar-total: #334155; - --wt-calendar-hours: #666; - --wt-popup-bg: #fff; - --wt-popup-border: rgba(0, 0, 0, 0.15); - --wt-popup-link-bg: #f1f3f5; - --wt-calendar-today-ring: #0d6efd; - --wt-calendar-today-badge-bg: #0d6efd; - --wt-calendar-today-badge-text: #fff; - --wt-summary-head-bg: #f8f9fa; - --wt-summary-sticky-bg: #fff; - --wt-summary-row-alt: #fcfcfd; - --wt-summary-popup-bg: #fff; - --wt-summary-popup-border: rgba(0, 0, 0, 0.12); - --wt-summary-popup-text: #1f2937; - --wt-summary-popup-event: #475569; -} - -[data-bs-theme=dark] { - --wt-header-bg: #1d2228; - --wt-header-border: rgba(255, 255, 255, 0.08); - --wt-header-link: #dee2e6; - --wt-calendar-cell-hover: rgba(255, 255, 255, 0.06); - --wt-calendar-active: #6ea8fe; - --wt-calendar-total: #d0d7de; - --wt-calendar-hours: #adb5bd; - --wt-popup-bg: #212529; - --wt-popup-border: rgba(255, 255, 255, 0.12); - --wt-popup-link-bg: #343a40; - --wt-calendar-today-ring: #8ec5ff; - --wt-calendar-today-badge-bg: #8ec5ff; - --wt-calendar-today-badge-text: #0f172a; - --wt-summary-head-bg: #2b3035; - --wt-summary-sticky-bg: #212529; - --wt-summary-row-alt: #1a1e22; - --wt-summary-popup-bg: #212529; - --wt-summary-popup-border: rgba(255, 255, 255, 0.12); - --wt-summary-popup-text: #e9ecef; - --wt-summary-popup-event: #adb5bd; -} - -.page { - position: relative; - display: flex; - flex-direction: column; -} - -main { - flex: 1; - min-width: 0; -} - -.sidebar { - background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%); -} - -.top-row { - background-color: var(--wt-header-bg); - border-bottom: 1px solid var(--wt-header-border); - justify-content: flex-end; - height: 3.5rem; - display: flex; - align-items: center; -} - -.top-row a, -.top-row .btn-link { - color: var(--wt-header-link); - white-space: nowrap; - margin-left: 1.5rem; - text-decoration: none; -} - -.top-row a:hover, -.top-row .btn-link:hover { - text-decoration: underline; -} - -.top-row a:first-child { - overflow: hidden; - text-overflow: ellipsis; -} - -.nav-menu-header { - display: flex; - align-items: center; - gap: 0.75rem; - justify-content: flex-start; -} - -.nav-menu-shell { - height: 100%; -} - -.nav-menu-shell .top-row { - min-height: 3.5rem; - background-color: rgba(0, 0, 0, 0.4); - border-bottom: 0; - padding-left: 0.75rem !important; - padding-right: 0.75rem !important; -} - -.sidebar-toggle { - display: inline-flex; - align-items: center; - justify-content: center; - flex-direction: column; - gap: 0.2rem; - width: 2.5rem; - height: 2.5rem; - border: 1px solid rgba(255, 255, 255, 0.18); - border-radius: 0.65rem; - background: rgba(255, 255, 255, 0.08); - color: #fff; - flex: 0 0 auto; -} - -.sidebar-toggle:hover { - background: rgba(255, 255, 255, 0.16); -} - -.sidebar-toggle-bar { - width: 1rem; - height: 2px; - background: currentColor; - border-radius: 999px; -} - -.bi { - display: inline-block; - position: relative; - width: 1.25rem; - height: 1.25rem; - margin-right: 0.75rem; - top: -1px; - background-size: cover; -} - -.bi-house-door-fill-nav-menu { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E"); -} - -.bi-plus-square-fill-nav-menu { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E"); -} - -.bi-list-nested-nav-menu { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E"); -} - -.bi-lock-nav-menu { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2zM5 8h6a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1z'/%3E%3C/svg%3E"); -} - -.bi-person-nav-menu { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person' viewBox='0 0 16 16'%3E%3Cpath d='M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4Zm-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10c-2.29 0-3.516.68-4.168 1.332-.678.678-.83 1.418-.832 1.664h10Z'/%3E%3C/svg%3E"); -} - -.bi-person-badge-nav-menu { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-badge' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1h-3zM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath d='M4.5 0A2.5 2.5 0 0 0 2 2.5V14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2.5A2.5 2.5 0 0 0 11.5 0h-7zM3 2.5A1.5 1.5 0 0 1 4.5 1h7A1.5 1.5 0 0 1 13 2.5v10.795a4.2 4.2 0 0 0-.776-.492C11.392 12.387 10.063 12 8 12s-3.392.387-4.224.803a4.2 4.2 0 0 0-.776.492V2.5z'/%3E%3C/svg%3E"); -} - -.bi-person-fill-nav-menu { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-fill' viewBox='0 0 16 16'%3E%3Cpath d='M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z'/%3E%3C/svg%3E"); -} - -.bi-arrow-bar-left-nav-menu { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-arrow-bar-left' viewBox='0 0 16 16'%3E%3Cpath d='M12.5 15a.5.5 0 0 1-.5-.5v-13a.5.5 0 0 1 1 0v13a.5.5 0 0 1-.5.5ZM10 8a.5.5 0 0 1-.5.5H3.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L3.707 7.5H9.5a.5.5 0 0 1 .5.5Z'/%3E%3C/svg%3E"); -} - -.bi-gear-fill-nav-menu { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M9.405 1.05c-.413-1.4-2.397-1.4-2.81 0l-.1.34a1.464 1.464 0 0 1-2.105.872l-.31-.17c-1.283-.698-2.686.705-1.987 1.987l.169.311c.446.82.023 1.841-.872 2.105l-.34.1c-1.4.413-1.4 2.397 0 2.81l.34.1a1.464 1.464 0 0 1 .872 2.105l-.17.31c-.698 1.283.705 2.686 1.987 1.987l.311-.169a1.464 1.464 0 0 1 2.105.872l.1.34c.413 1.4 2.397 1.4 2.81 0l.1-.34a1.464 1.464 0 0 1 2.105-.872l.31.17c1.283.698 2.686-.705 1.987-1.987l-.169-.311a1.464 1.464 0 0 1 .872-2.105l.34-.1c1.4-.413 1.4-2.397 0-2.81l-.34-.1a1.464 1.464 0 0 1-.872-2.105l.17-.31c.698-1.283-.705-2.686-1.987-1.987l-.311.169a1.464 1.464 0 0 1-2.105-.872l-.1-.34zM8 10.93a2.929 2.929 0 1 1 0-5.86 2.929 2.929 0 0 1 0 5.858z'/%3E%3C/svg%3E"); -} - -.bi-calendar3-nav-menu { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M14 0H2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zM1 3.857C1 3.384 1.448 3 2 3h12c.552 0 1 .384 1 .857v10.286c0 .473-.448.857-1 .857H2c-.552 0-1-.384-1-.857V3.857z'/%3E%3Cpath d='M6.5 7a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2z'/%3E%3C/svg%3E"); -} - -.bi-bar-chart-fill-nav-menu { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M1 11a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-3zm5-4a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1V7zm5-5a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1V2z'/%3E%3C/svg%3E"); -} - -.nav-item { - font-size: 0.9rem; - padding-bottom: 0.5rem; -} - -.nav-label { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.nav-item:first-of-type { - padding-top: 1rem; -} - -.nav-item:last-of-type { - padding-bottom: 1rem; -} - -.nav-item .nav-link { - color: #d7d7d7; - background: none; - border: none; - border-radius: 4px; - height: 3rem; - display: flex; - align-items: center; - line-height: 3rem; - width: 100%; -} - -.nav-item a.active { - background-color: rgba(255, 255, 255, 0.37); - color: white; -} - -.nav-item .nav-link:hover { - background-color: rgba(255, 255, 255, 0.1); - color: white; -} - -.nav-scrollable { - display: block; - height: calc(100vh - 3.5rem); - overflow-y: auto; -} - -@media (max-width: 640.98px) { - .top-row { - justify-content: flex-end; - } - - .top-row a, - .top-row .btn-link { - margin-left: 0; - } - - .nav-menu-shell-collapsed .sidebar-brand-full, - .nav-menu-shell:not(.nav-menu-shell-collapsed) .sidebar-brand-compact { - display: none; - } - - .nav-menu-shell-collapsed .nav-scrollable { - display: none; - } - - .nav-menu-shell:not(.nav-menu-shell-collapsed) .nav-scrollable { - display: block; - } - - .nav-scrollable { - height: auto; - } -} - -@media (min-width: 641px) { - .page { - flex-direction: row; - } - - .sidebar { - width: 250px; - height: 100vh; - position: sticky; - top: 0; - transition: width 0.2s ease; - overflow: hidden; - flex: 0 0 auto; - } - - .top-row { - position: sticky; - top: 0; - z-index: 1; - } - - .top-row.auth a:first-child { - flex: 1; - text-align: right; - width: 0; - } - - .top-row, - article { - padding-left: 2rem !important; - padding-right: 1.5rem !important; - } - - .sidebar.sidebar-collapsed { - width: 5rem; - } - - .nav-menu-shell-collapsed .container-fluid { - justify-content: flex-start; - } - - .nav-menu-shell-collapsed .nav-label { - display: none; - } - - .nav-menu-shell-collapsed .nav-item { - padding-bottom: 0.3rem; - } - - .nav-menu-shell-collapsed .nav-item.px-3 { - padding-left: 0.5rem !important; - padding-right: 0.5rem !important; - } - - .nav-menu-shell-collapsed .nav-item .nav-link { - justify-content: center; - padding-left: 0; - padding-right: 0; - } - - .nav-menu-shell-collapsed .nav-item .nav-link, - .nav-menu-shell-collapsed .nav-item button.nav-link { - min-width: 0; - } - - .nav-menu-shell-collapsed .bi { - margin-right: 0; - } -} - -#blazor-error-ui { - color-scheme: light only; - background: lightyellow; - bottom: 0; - box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2); - box-sizing: border-box; - display: none; - left: 0; - padding: 0.6rem 1.25rem 0.7rem 1.25rem; - position: fixed; - width: 100%; - z-index: 1000; -} - -#blazor-error-ui .dismiss { - cursor: pointer; - position: absolute; - right: 0.75rem; - top: 0.5rem; -} - -.grid-view-table { - --wt-grid-row-weekend: #f8d7da; - --wt-grid-row-holiday: #d4edda; - --wt-grid-row-closure: #fff3cd; - --wt-grid-row-illness: #d1ecf1; - --wt-grid-row-dayoff: #e2e3e5; - --wt-grid-row-home: #f8f9fa; -} - -[data-bs-theme=dark] .grid-view-table { - --wt-grid-row-weekend: #522c35; - --wt-grid-row-holiday: #1f4e3f; - --wt-grid-row-closure: #5c4a20; - --wt-grid-row-illness: #16404a; - --wt-grid-row-dayoff: #3b4046; - --wt-grid-row-home: #2b3035; -} - -.grid-view-table .grid-row-weekend > * { - background-color: var(--wt-grid-row-weekend); -} - -.grid-view-table .grid-row-holiday > * { - background-color: var(--wt-grid-row-holiday); -} - -.grid-view-table .grid-row-closure > * { - background-color: var(--wt-grid-row-closure); -} - -.grid-view-table .grid-row-illness > * { - background-color: var(--wt-grid-row-illness); -} - -.grid-view-table .grid-row-dayoff > * { - background-color: var(--wt-grid-row-dayoff); -} - -.grid-view-table .grid-row-home > * { - background-color: var(--wt-grid-row-home); -} - -.grid-view-table tbody tr > * { - color: inherit; -} - a, .btn-link { color: #006bb7; } @@ -469,41 +70,17 @@ h1:focus { } .calendar-table td.calendar-cell:hover { - background-color: var(--wt-calendar-cell-hover); -} - -.calendar-cell-empty { - background-color: var(--bs-tertiary-bg); + background-color: rgba(0, 0, 0, 0.05); } .calendar-cell-active { - box-shadow: inset 0 0 0 0.15rem var(--wt-calendar-active); -} - -.calendar-cell-today::after { - content: ""; - position: absolute; - inset: 0.2rem; - border: 0.15rem solid var(--wt-calendar-today-ring); - border-radius: 0.75rem; - pointer-events: none; + box-shadow: inset 0 0 0 0.15rem #1b6ec2; } .calendar-day-number { - display: inline-flex; - align-items: center; - justify-content: center; - min-width: 2rem; - height: 2rem; font-weight: bold; font-size: 0.9rem; margin-bottom: 0.3rem; - border-radius: 999px; -} - -.calendar-cell-today .calendar-day-number { - background-color: var(--wt-calendar-today-badge-bg); - color: var(--wt-calendar-today-badge-text); } .calendar-day-total { @@ -512,12 +89,12 @@ h1:focus { font-size: 0.72rem; font-weight: 700; text-align: right; - color: var(--wt-calendar-total); + color: #334155; } .calendar-hours { font-size: 0.75rem; - color: var(--wt-calendar-hours); + color: #666; } .calendar-item { @@ -586,8 +163,8 @@ h1:focus { z-index: 20; width: min(16rem, calc(100vw - 2rem)); max-width: calc(100vw - 2rem); - background: var(--wt-popup-bg); - border: 1px solid var(--wt-popup-border); + background: #fff; + border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 0.75rem; box-shadow: 0 0.75rem 2rem rgba(0, 0, 0, 0.18); padding: 0.75rem; @@ -612,8 +189,7 @@ h1:focus { .calendar-popup-link { border: 0; border-radius: 0.5rem; - background: var(--wt-popup-link-bg); - color: inherit; + background: #f1f3f5; padding: 0.45rem 0.6rem; text-align: left; } @@ -653,45 +229,6 @@ h1:focus { background-color: #d4edda !important; } -[data-bs-theme=dark] .calendar-legend-work { - background-color: #24476f; - color: #e8f3ff; -} - -[data-bs-theme=dark] .calendar-legend-home { - background-color: #245744; - color: #e7fff4; -} - -[data-bs-theme=dark] .calendar-legend-preview { - background-color: #6b5314; - color: #fff5d7; -} - -[data-bs-theme=dark] .calendar-weekend { - background-color: #4b2c33 !important; -} - -[data-bs-theme=dark] .calendar-closure { - background-color: #5c4a20 !important; -} - -[data-bs-theme=dark] .calendar-illness { - background-color: #16404a !important; -} - -[data-bs-theme=dark] .calendar-dayoff { - background-color: #3b4046 !important; -} - -[data-bs-theme=dark] .calendar-holiday { - background-color: #1f4e3f !important; -} - -.calendar-page { - padding-bottom: 3rem; -} - @media (max-width: 767.98px) { .calendar-table td.calendar-cell { height: 8rem; @@ -714,59 +251,38 @@ h1:focus { } .timesheet-summary-table thead th { - background-color: var(--wt-summary-head-bg); - white-space: normal; + background-color: #f8f9fa; + white-space: nowrap; } .timesheet-summary-table th, .timesheet-summary-table td { min-width: 2.2rem; - padding: 0.35rem 0.16rem; + padding: 0.25rem 0.12rem; vertical-align: middle; - line-height: 1.2; } .timesheet-summary-sticky-column { position: sticky; left: 0; z-index: 2; - min-width: 6.25rem !important; - max-width: 6.25rem; - background-color: var(--wt-summary-sticky-bg); - white-space: normal; - overflow-wrap: anywhere; - word-break: break-word; - text-align: left; + min-width: 15rem !important; + background-color: #fff; } .timesheet-summary-table thead .timesheet-summary-sticky-column { z-index: 3; - background-color: var(--wt-summary-head-bg); + background-color: #f8f9fa; } .timesheet-summary-total-column { - position: sticky; - right: 0; - z-index: 2; - background-color: var(--wt-summary-head-bg); - min-width: 3.5rem !important; + background-color: #f8f9fa; + min-width: 3.3rem !important; } .timesheet-summary-table tbody tr:nth-child(odd) td, .timesheet-summary-table tbody tr:nth-child(odd) .timesheet-summary-sticky-column { - background-color: var(--wt-summary-row-alt); -} - -.timesheet-summary-table tbody tr:nth-child(odd) .timesheet-summary-total-column { - background-color: var(--wt-summary-row-alt); -} - -.timesheet-summary-table tbody .timesheet-summary-total-column { - background-color: var(--wt-summary-sticky-bg); -} - -.timesheet-summary-table thead .timesheet-summary-total-column { - z-index: 3; + background-color: #fcfcfd; } .timesheet-summary-table .timesheet-summary-day-danger { @@ -777,14 +293,6 @@ h1:focus { background-color: #e2e3e5 !important; } -[data-bs-theme=dark] .timesheet-summary-table .timesheet-summary-day-danger { - background-color: #5b2833 !important; -} - -[data-bs-theme=dark] .timesheet-summary-table .timesheet-summary-day-closure { - background-color: #3b4046 !important; -} - .timesheet-summary-day-header { position: relative; cursor: default; @@ -798,9 +306,9 @@ h1:focus { width: min(18rem, calc(100vw - 2rem)); max-width: calc(100vw - 2rem); padding: 0.65rem 0.75rem; - border: 1px solid var(--wt-summary-popup-border); + border: 1px solid rgba(0, 0, 0, 0.12); border-radius: 0.7rem; - background: var(--wt-summary-popup-bg); + background: #fff; box-shadow: 0 0.75rem 2rem rgba(15, 23, 42, 0.18); text-align: left; transform: translateX(-50%); @@ -829,7 +337,7 @@ h1:focus { .timesheet-summary-day-popup-item { font-size: 0.75rem; line-height: 1.35; - color: var(--wt-summary-popup-text); + color: #1f2937; } .timesheet-summary-day-popup-item + .timesheet-summary-day-popup-item { @@ -837,21 +345,12 @@ h1:focus { } .timesheet-summary-day-popup-item-event { - color: var(--wt-summary-popup-event); + color: #475569; } @media (max-width: 767.98px) { .timesheet-summary-sticky-column { - min-width: 4.75rem !important; - max-width: 4.75rem; - padding-left: 0.3rem !important; - padding-right: 0.3rem !important; - font-size: 0.82rem; - } - - .timesheet-summary-total-column { - min-width: 3.1rem !important; - font-size: 0.82rem; + min-width: 12rem !important; } .timesheet-summary-day-popup { diff --git a/wwwroot/theme.js b/wwwroot/theme.js deleted file mode 100644 index cf7b2a2..0000000 --- a/wwwroot/theme.js +++ /dev/null @@ -1,89 +0,0 @@ -window.workTrackerTheme = (() => { - const storageKey = "worktracker.themeMode"; - const mediaQuery = window.matchMedia - ? window.matchMedia("(prefers-color-scheme: dark)") - : null; - - function normalize(mode) { - const normalized = (mode || "system").toString().toLowerCase(); - return normalized === "light" || normalized === "dark" || normalized === "system" - ? normalized - : "system"; - } - - function resolve(mode) { - if (mode === "system") { - return mediaQuery && mediaQuery.matches ? "dark" : "light"; - } - - return mode; - } - - function apply(mode) { - const normalized = normalize(mode); - const effectiveMode = resolve(normalized); - - document.documentElement.setAttribute("data-bs-theme", effectiveMode); - document.documentElement.setAttribute("data-theme-mode", normalized); - document.documentElement.style.colorScheme = effectiveMode; - localStorage.setItem(storageKey, normalized); - } - - function handleSystemThemeChange() { - const currentMode = normalize(localStorage.getItem(storageKey) || document.documentElement.getAttribute("data-theme-mode")); - if (currentMode === "system") { - apply(currentMode); - } - } - - if (mediaQuery) { - if (typeof mediaQuery.addEventListener === "function") { - mediaQuery.addEventListener("change", handleSystemThemeChange); - } - else if (typeof mediaQuery.addListener === "function") { - mediaQuery.addListener(handleSystemThemeChange); - } - } - - return { - init() { - apply(localStorage.getItem(storageKey) || document.documentElement.getAttribute("data-theme-mode")); - }, - setTheme(mode) { - apply(mode); - } - }; -})(); - -window.workTrackerPreferences = { - getBool(key) { - try { - const value = localStorage.getItem(key); - if (value === null) { - return null; - } - - if (value === "true") { - return true; - } - - if (value === "false") { - return false; - } - - return null; - } - catch { - return null; - } - }, - setBool(key, value) { - try { - localStorage.setItem(key, value ? "true" : "false"); - } - catch { - } - } -}; - -window.workTrackerTheme.init(); \ No newline at end of file
Date