From bc521d5b2918269f1a9d49aa7a60a51476d49bef Mon Sep 17 00:00:00 2001 From: daniel-c-harvey Date: Tue, 9 Dec 2025 16:46:07 -0500 Subject: [PATCH] Styles & Home Page Content Cleanup Mobile Menu System & Dark Mode Cookie Theme Draft --- DeepDrftCli/DeepDrftCli.csproj | 20 +-- .../DeepDrftContent.Services.csproj | 2 +- DeepDrftContent/DeepDrftContent.csproj | 4 +- DeepDrftModels/DeepDrftModels.csproj | 2 +- DeepDrftTests/DeepDrftTests.csproj | 18 ++- DeepDrftWeb.Client/Common/DDIcons.cs | 28 +++++ DeepDrftWeb.Client/Common/DarkModeSettings.cs | 20 +++ .../AudioPlayerBar/AudioPlayerBar.razor.cs | 2 +- DeepDrftWeb.Client/DeepDrftWeb.Client.csproj | 9 +- DeepDrftWeb.Client/Layout/DeepDrftMenu.razor | 118 ++++++++++++++++++ DeepDrftWeb.Client/Layout/MainLayout.razor | 99 ++++++++------- DeepDrftWeb.Client/Layout/NavMenu.razor | 2 - DeepDrftWeb.Client/Layout/Pages.cs | 24 ++++ DeepDrftWeb.Client/Pages/Home.razor | 56 ++++----- .../Services/DarkModeCookieService.cs | 25 ++++ .../Services/DarkModeServiceBase.cs | 6 + DeepDrftWeb.Client/Startup.cs | 7 +- DeepDrftWeb.Client/_Imports.razor | 1 + .../DeepDrftWeb.Services.csproj | 8 +- DeepDrftWeb/Components/App.razor | 26 ++-- DeepDrftWeb/DeepDrftWeb.csproj | 16 +-- DeepDrftWeb/Program.cs | 7 +- DeepDrftWeb/Services/DarkModeService.cs | 22 ++++ DeepDrftWeb/Startup.cs | 13 +- .../wwwroot/styles/deepdrft-styles.css | 90 +++++++------ global.json | 4 +- 26 files changed, 461 insertions(+), 168 deletions(-) create mode 100644 DeepDrftWeb.Client/Common/DDIcons.cs create mode 100644 DeepDrftWeb.Client/Common/DarkModeSettings.cs create mode 100644 DeepDrftWeb.Client/Layout/DeepDrftMenu.razor create mode 100644 DeepDrftWeb.Client/Layout/Pages.cs create mode 100644 DeepDrftWeb.Client/Services/DarkModeCookieService.cs create mode 100644 DeepDrftWeb.Client/Services/DarkModeServiceBase.cs create mode 100644 DeepDrftWeb/Services/DarkModeService.cs diff --git a/DeepDrftCli/DeepDrftCli.csproj b/DeepDrftCli/DeepDrftCli.csproj index d429aee..1ca1e16 100644 --- a/DeepDrftCli/DeepDrftCli.csproj +++ b/DeepDrftCli/DeepDrftCli.csproj @@ -2,21 +2,21 @@ Exe - net9.0 + net10.0 enable enable - - - - - - - - - + + + + + + + + + diff --git a/DeepDrftContent.Services/DeepDrftContent.Services.csproj b/DeepDrftContent.Services/DeepDrftContent.Services.csproj index 187de63..e132d96 100644 --- a/DeepDrftContent.Services/DeepDrftContent.Services.csproj +++ b/DeepDrftContent.Services/DeepDrftContent.Services.csproj @@ -1,7 +1,7 @@  - net9.0 + net10.0 enable enable diff --git a/DeepDrftContent/DeepDrftContent.csproj b/DeepDrftContent/DeepDrftContent.csproj index e24ad01..732f465 100644 --- a/DeepDrftContent/DeepDrftContent.csproj +++ b/DeepDrftContent/DeepDrftContent.csproj @@ -1,13 +1,13 @@ - net9.0 + net10.0 enable enable - + diff --git a/DeepDrftModels/DeepDrftModels.csproj b/DeepDrftModels/DeepDrftModels.csproj index a8fcc32..cb70a35 100644 --- a/DeepDrftModels/DeepDrftModels.csproj +++ b/DeepDrftModels/DeepDrftModels.csproj @@ -1,7 +1,7 @@  - net9.0 + net10.0 enable enable diff --git a/DeepDrftTests/DeepDrftTests.csproj b/DeepDrftTests/DeepDrftTests.csproj index 66756b5..91d257c 100644 --- a/DeepDrftTests/DeepDrftTests.csproj +++ b/DeepDrftTests/DeepDrftTests.csproj @@ -1,7 +1,7 @@  - net9.0 + net10.0 latest enable enable @@ -9,11 +9,17 @@ - - - - - + + all + runtime; build; native; contentfiles; analyzers; buildtransitive + + + + + all + runtime; build; native; contentfiles; analyzers; buildtransitive + + diff --git a/DeepDrftWeb.Client/Common/DDIcons.cs b/DeepDrftWeb.Client/Common/DDIcons.cs new file mode 100644 index 0000000..b5ffbda --- /dev/null +++ b/DeepDrftWeb.Client/Common/DDIcons.cs @@ -0,0 +1,28 @@ +namespace DeepDrftWeb.Client.Common; + +public static class DDIcons +{ + /// + /// Charleston gas lamp lantern - uses currentColor for theming + /// + /// + /// Charleston gas lamp lantern - uses currentColor for theming + /// + public const string GasLamp = """ + + + + """; + + /// + /// Charleston gas lamp with lit flame - for dark mode + /// + public const string GasLampLit = """ + + + + + + + """; +} \ No newline at end of file diff --git a/DeepDrftWeb.Client/Common/DarkModeSettings.cs b/DeepDrftWeb.Client/Common/DarkModeSettings.cs new file mode 100644 index 0000000..4c0c0d1 --- /dev/null +++ b/DeepDrftWeb.Client/Common/DarkModeSettings.cs @@ -0,0 +1,20 @@ +using Microsoft.AspNetCore.Components; + +namespace DeepDrftWeb.Client.Common; + +public class DarkModeSettings() +{ + // public EventCallback IsDarkModeChanged { get; set; } + + [PersistentState] + public bool IsDarkMode + { + get; + set + { + if (value == field) return; + field = value; + // IsDarkModeChanged.InvokeAsync(value); + } + } = false; +} \ No newline at end of file diff --git a/DeepDrftWeb.Client/Controls/AudioPlayerBar/AudioPlayerBar.razor.cs b/DeepDrftWeb.Client/Controls/AudioPlayerBar/AudioPlayerBar.razor.cs index b59e73f..cb025ec 100644 --- a/DeepDrftWeb.Client/Controls/AudioPlayerBar/AudioPlayerBar.razor.cs +++ b/DeepDrftWeb.Client/Controls/AudioPlayerBar/AudioPlayerBar.razor.cs @@ -8,7 +8,7 @@ namespace DeepDrftWeb.Client.Controls.AudioPlayerBar; public partial class AudioPlayerBar : ComponentBase, IAsyncDisposable { [CascadingParameter] public required IStreamingPlayerService PlayerService { get; set; } - [Inject] private IBrowserViewportService BrowserViewportService { get; set; } = default!; + [Inject] public required IBrowserViewportService BrowserViewportService { get; set; } private bool _isMinimized = true; private bool _isSeeking = false; diff --git a/DeepDrftWeb.Client/DeepDrftWeb.Client.csproj b/DeepDrftWeb.Client/DeepDrftWeb.Client.csproj index 06b458c..2dde35f 100644 --- a/DeepDrftWeb.Client/DeepDrftWeb.Client.csproj +++ b/DeepDrftWeb.Client/DeepDrftWeb.Client.csproj @@ -1,7 +1,7 @@ - net9.0 + net10.0 enable enable true @@ -9,10 +9,11 @@ - + - - + + + diff --git a/DeepDrftWeb.Client/Layout/DeepDrftMenu.razor b/DeepDrftWeb.Client/Layout/DeepDrftMenu.razor new file mode 100644 index 0000000..93381fb --- /dev/null +++ b/DeepDrftWeb.Client/Layout/DeepDrftMenu.razor @@ -0,0 +1,118 @@ +@using DeepDrftWeb.Client.Controls +@using DeepDrftWeb.Client.Services + + +
+ @if (_isDesktop) + { +
+ + + + + + +
Deep DRFT
+ + + +
+ +
+ + @foreach (PageRoute thePage in Pages.AllPages) + { + @thePage.Name + } + +
+ } + else + { +
+ + + + + + + + +
Deep DRFT
+ + + + @foreach (PageRoute route in Pages.AllPages) + { + + + + + @route.Name + + + + } + + + +
+ } + +
+ +
+
+ + +@code { + [Inject] public required IBrowserViewportService BrowserViewportService { get; set; } + [Inject] public required DarkModeCookieService DarkModeCookieService { get; set; } + [Parameter] public int Elevation { get; set; } + [Parameter] public required bool IsDarkMode { get; set; } + [Parameter] public required EventCallback IsDarkModeChanged { get; set; } + + private bool _isDesktop = true; + private Guid _viewportSubscriptionId; + + protected override async Task OnInitializedAsync() + { + IsDarkMode = DarkModeCookieService.GetDarkModeAsync(); + await IsDarkModeChanged.InvokeAsync(IsDarkMode); + } + + protected override async Task OnAfterRenderAsync(bool firstRender) + { + if (firstRender) + { + var breakpoint = await BrowserViewportService.GetCurrentBreakpointAsync(); + _isDesktop = breakpoint >= Breakpoint.Sm; + + _viewportSubscriptionId = Guid.NewGuid(); + await BrowserViewportService.SubscribeAsync( + _viewportSubscriptionId, + args => + { + _isDesktop = args.Breakpoint >= Breakpoint.Sm; + InvokeAsync(StateHasChanged); + }, + new ResizeOptions { NotifyOnBreakpointOnly = true }, + fireImmediately: true); + + StateHasChanged(); + } + } + + private string DarkLightModeButtonIcon => IsDarkMode switch + { + true => DDIcons.GasLampLit, + false => DDIcons.GasLamp, + }; + + private async Task DarkModeToggle() + { + IsDarkMode = !IsDarkMode; + await DarkModeCookieService.SetDarkModeAsync(IsDarkMode); + await IsDarkModeChanged.InvokeAsync(IsDarkMode); + } +} diff --git a/DeepDrftWeb.Client/Layout/MainLayout.razor b/DeepDrftWeb.Client/Layout/MainLayout.razor index 79ec3fc..d9fd6b7 100644 --- a/DeepDrftWeb.Client/Layout/MainLayout.razor +++ b/DeepDrftWeb.Client/Layout/MainLayout.razor @@ -1,6 +1,10 @@ @using DeepDrftWeb.Client.Controls @using DeepDrftWeb.Client.Controls.AudioPlayerBar +@using DeepDrftWeb.Client.Services +@using DeepDrftWeb.Client.Common +@using Microsoft.AspNetCore.Components @inherits LayoutComponentBase +@implements IDisposable @@ -9,14 +13,7 @@
- - - - - - - - + @Body @@ -35,12 +32,31 @@
@code { - private bool _drawerOpen = true; + private const string DarkModeKey = "darkMode"; private bool _isDarkMode = true; + private PersistingComponentStateSubscription _persistingSubscription; + + [Inject] public required PersistentComponentState PersistentState { get; set; } + [Inject] public required DarkModeSettings DarkModeSettings { get; set; } protected override void OnInitialized() { base.OnInitialized(); + + // Restore persisted dark mode state (from server prerender) + if (PersistentState.TryTakeFromJson(DarkModeKey, out var restored)) + { + _isDarkMode = restored; + DarkModeSettings.IsDarkMode = restored; + } + else + { + _isDarkMode = DarkModeSettings.IsDarkMode; + } + + // Register to persist state when prerendering completes + _persistingSubscription = PersistentState.RegisterOnPersisting(PersistDarkMode); + _themeManager = new ThemeManagerTheme { Theme = @@ -59,23 +75,23 @@ }, H2 = new H2Typography() { - FontFamily = new[] {"EB Garamond", "serif"} + FontFamily = new[] {"Cormorant", "serif"} }, H3 = new H3Typography() { - FontFamily = new[] {"EB Garamond", "serif"} + FontFamily = new[] {"Cormorant", "serif"} }, H4 = new H4Typography() { - FontFamily = new[] {"EB Garamond", "serif"} + FontFamily = new[] {"Cormorant", "serif"} }, H5 = new H5Typography() { - FontFamily = new[] {"EB Garamond", "serif"} + FontFamily = new[] {"Cormorant", "serif"} }, H6 = new H6Typography() { - FontFamily = new[] {"EB Garamond", "serif"} + FontFamily = new[] {"Cormorant", "serif"} }, Button = new ButtonTypography() { @@ -87,16 +103,6 @@ StateHasChanged(); } - - private void DrawerToggle() - { - _drawerOpen = !_drawerOpen; - } - - private void DarkModeToggle() - { - _isDarkMode = !_isDarkMode; - } private ThemeManagerTheme _themeManager; public bool _themeManagerOpen = false; @@ -113,31 +119,31 @@ } // Charleston in the Day - Light Theme - // Inspired by Charleston's historic architecture: white stucco, black wrought iron gates, elegant accents + // Inspired by Charleston's historic architecture: wrought iron, bronze, Atlantic coast private readonly PaletteLight _lightPalette = new() { - Primary = "#1C1C1C", // Wrought iron black - strong, elegant - Secondary = "#B8848C", // Dusty rose - elegant accent - Tertiary = "#C9A962", // Antique gold - replaces brown + Primary = "#1A1A1A", // Wrought iron black + Secondary = "#B8623D", // Burnished copper - warm orange bronze + Tertiary = "#2A7B8C", // Atlantic turquoise Info = "#2196F3", // MudBlazor default blue (semantic) Success = "#4CAF50", // MudBlazor default green (semantic) Warning = "#FF9800", // MudBlazor default amber (semantic) Error = "#F44336", // MudBlazor default red (semantic) - Black = "#1C1C1C", // Wrought iron black + Black = "#1A1A1A", // Wrought iron black White = "#FDFBF7", // Cream white (stucco) Surface = "#FDFBF7", // Cream stucco surface Background = "#F5F2EC", // Warm linen background - AppbarText = "#FDFBF7", // Cream text on dark appbar (FIX) - AppbarBackground = "#1C1C1C", // Solid wrought iron appbar + AppbarText = "#FDFBF7", // Cream text on dark appbar + AppbarBackground = "#1A1A1A", // Solid wrought iron appbar DrawerBackground = "#F5F2EC", // Linen drawer - TextPrimary = "#1C1C1C", // Wrought iron text + TextPrimary = "#1A1A1A", // Wrought iron text TextSecondary = "#4A4A4A", // Softer iron text - GrayLight = "rgba(28,28,28,0.08)", // Light iron tint - GrayLighter = "rgba(28,28,28,0.04)", // Very light iron tint - GrayDefault = "rgba(28,28,28,0.15)", // Medium iron tint - GrayDark = "rgba(28,28,28,0.25)", // Darker iron tint - Divider = "rgba(28,28,28,0.12)", // Subtle divider lines - TableLines = "rgba(28,28,28,0.12)", // Table borders + GrayLight = "rgba(26,26,26,0.08)", // Light iron tint + GrayLighter = "rgba(26,26,26,0.04)", // Very light iron tint + GrayDefault = "rgba(26,26,26,0.15)", // Medium iron tint + GrayDark = "rgba(26,26,26,0.25)", // Darker iron tint + Divider = "rgba(26,26,26,0.12)", // Subtle divider lines + TableLines = "rgba(26,26,26,0.12)", // Table borders }; // Lowcountry Summer Nights - Dark Theme @@ -178,14 +184,19 @@ OverlayDark = "rgba(255,255,255,0.08)", // Light overlay }; - public string DarkLightModeButtonIcon => _isDarkMode switch - { - true => Icons.Material.Rounded.AutoMode, - false => Icons.Material.Outlined.DarkMode, - }; - // Theme wrapper class for CSS targeting private string ThemeWrapperClass => _isDarkMode ? "deepdrft-theme-dark" : "deepdrft-theme-light"; + + private Task PersistDarkMode() + { + PersistentState.PersistAsJson(DarkModeKey, _isDarkMode); + return Task.CompletedTask; + } + + public void Dispose() + { + _persistingSubscription.Dispose(); + } } diff --git a/DeepDrftWeb.Client/Layout/NavMenu.razor b/DeepDrftWeb.Client/Layout/NavMenu.razor index 830a1ea..46c1e58 100644 --- a/DeepDrftWeb.Client/Layout/NavMenu.razor +++ b/DeepDrftWeb.Client/Layout/NavMenu.razor @@ -1,7 +1,5 @@ @using DeepDrftWeb.Client.Controls -Home -Track Gallery diff --git a/DeepDrftWeb.Client/Layout/Pages.cs b/DeepDrftWeb.Client/Layout/Pages.cs new file mode 100644 index 0000000..81f2a5d --- /dev/null +++ b/DeepDrftWeb.Client/Layout/Pages.cs @@ -0,0 +1,24 @@ +using MudBlazor; + +namespace DeepDrftWeb.Client.Layout; + +public class PageRoute +{ + public string Name { get; set; } = string.Empty; + public string Route { get; set; } = string.Empty; + public string? Icon { get; set; } = null; +} + +public static class Pages +{ + public static readonly List MenuPages = + [ + new() { Name = "Track Gallery", Route = "/tracks", Icon = Icons.Material.Filled.LibraryMusic } + ]; + + public static readonly List AllPages = + new List + { + new() { Name = "Home", Route = "/", Icon = Icons.Material.Filled.Home } + }.Concat(MenuPages).ToList(); +} \ No newline at end of file diff --git a/DeepDrftWeb.Client/Pages/Home.razor b/DeepDrftWeb.Client/Pages/Home.razor index aa3fb4f..ebbbe92 100644 --- a/DeepDrftWeb.Client/Pages/Home.razor +++ b/DeepDrftWeb.Client/Pages/Home.razor @@ -1,6 +1,6 @@ @page "/" -DeepDrft - Electronic Music Collective +Deep DRFT- Electronic Music Collective @@ -11,17 +11,17 @@ - DEEPDRFT + DEEP DRFT - ELECTRONIC MUSIC COLLECTIVE - - Live electronic music from Charleston, SC featuring house, techno, trance, and IDM crafted with synthesizers and grooveboxes + Live electronic music from Charleston, South Carolina - @@ -46,8 +47,8 @@ @* About Section *@ - - + + The Collective @@ -65,8 +66,8 @@ - - + + Our Sound @@ -96,11 +97,11 @@ - - + High-Quality Streaming @@ -111,9 +112,9 @@ - Live Sessions @@ -126,11 +127,10 @@ - - + + Video Content @@ -143,8 +143,8 @@ - + Class="mb-3 deepdrft-icon-large deepdrft-text-quinary" /> + Growing Archive @@ -158,8 +158,8 @@ @* Location & Connect Section *@ - - + + Charleston, SC @@ -175,8 +175,8 @@ - - + + Connect With Us diff --git a/DeepDrftWeb.Client/Services/DarkModeCookieService.cs b/DeepDrftWeb.Client/Services/DarkModeCookieService.cs new file mode 100644 index 0000000..191dd15 --- /dev/null +++ b/DeepDrftWeb.Client/Services/DarkModeCookieService.cs @@ -0,0 +1,25 @@ +using DeepDrftWeb.Client.Common; +using Microsoft.JSInterop; + +namespace DeepDrftWeb.Client.Services; + +public class DarkModeCookieService(DarkModeSettings darkModeSetting, IJSRuntime js) : DarkModeServiceBase +{ + private const int EXPIRY_DAYS = 365; + + public bool GetDarkModeAsync() + { + return darkModeSetting.IsDarkMode; + // var value = await js.InvokeAsync("eval", + // $"document.cookie.split('; ').find(c => c.startsWith('{COOKIE_NAME}='))?.split('=')[1]"); + // return value == "true"; + } + + public async ValueTask SetDarkModeAsync(bool isDarkMode) + { + var expires = DateTime.UtcNow.AddDays(EXPIRY_DAYS).ToString("R"); + await js.InvokeVoidAsync("eval", + $"document.cookie = '{COOKIE_NAME}={isDarkMode.ToString().ToLower()}; expires={expires}; path=/; SameSite=Lax'"); + darkModeSetting.IsDarkMode = isDarkMode; + } +} \ No newline at end of file diff --git a/DeepDrftWeb.Client/Services/DarkModeServiceBase.cs b/DeepDrftWeb.Client/Services/DarkModeServiceBase.cs new file mode 100644 index 0000000..848f34e --- /dev/null +++ b/DeepDrftWeb.Client/Services/DarkModeServiceBase.cs @@ -0,0 +1,6 @@ +namespace DeepDrftWeb.Client.Services; + +public abstract class DarkModeServiceBase +{ + protected const string COOKIE_NAME = "darkMode"; +} \ No newline at end of file diff --git a/DeepDrftWeb.Client/Startup.cs b/DeepDrftWeb.Client/Startup.cs index 919c212..9b91bac 100644 --- a/DeepDrftWeb.Client/Startup.cs +++ b/DeepDrftWeb.Client/Startup.cs @@ -1,6 +1,8 @@ using DeepDrftWeb.Client.Clients; +using DeepDrftWeb.Client.Common; using DeepDrftWeb.Client.Services; using DeepDrftWeb.Client.ViewModels; +using Microsoft.AspNetCore.Http; namespace DeepDrftWeb.Client; @@ -8,6 +10,10 @@ public static class Startup { public static void ConfigureDomainServices(IServiceCollection services) { + // Theme Support + services.AddScoped(); + services.AddScoped(); + // Track Client services.AddScoped(); services.AddScoped(); @@ -29,6 +35,5 @@ public static class Startup }); services.AddScoped(); services.AddScoped(); - // AudioPlaybackEngine removed - functionality merged into AudioPlayerService } } \ No newline at end of file diff --git a/DeepDrftWeb.Client/_Imports.razor b/DeepDrftWeb.Client/_Imports.razor index de75392..3371bf6 100644 --- a/DeepDrftWeb.Client/_Imports.razor +++ b/DeepDrftWeb.Client/_Imports.razor @@ -9,3 +9,4 @@ @using MudBlazor @using MudBlazor.Services @using MudBlazor.ThemeManager +@using DeepDrftWeb.Client.Common \ No newline at end of file diff --git a/DeepDrftWeb.Services/DeepDrftWeb.Services.csproj b/DeepDrftWeb.Services/DeepDrftWeb.Services.csproj index e42b03c..c923130 100644 --- a/DeepDrftWeb.Services/DeepDrftWeb.Services.csproj +++ b/DeepDrftWeb.Services/DeepDrftWeb.Services.csproj @@ -1,15 +1,15 @@  - net9.0 + net10.0 enable enable - - - + + + all runtime; build; native; contentfiles; analyzers; buildtransitive diff --git a/DeepDrftWeb/Components/App.razor b/DeepDrftWeb/Components/App.razor index 5c3e058..7ed2d2a 100644 --- a/DeepDrftWeb/Components/App.razor +++ b/DeepDrftWeb/Components/App.razor @@ -1,4 +1,5 @@ - +@using DeepDrftWeb.Services + @@ -8,7 +9,7 @@ - + @@ -20,12 +21,23 @@ - - - - + + - + +@code { + + [Inject] public required DarkModeService DarkModeService { get; set; } + + protected override void OnInitialized() + { + base.OnInitialized(); + DarkModeService.CheckDarkMode(); + } + +} diff --git a/DeepDrftWeb/DeepDrftWeb.csproj b/DeepDrftWeb/DeepDrftWeb.csproj index 5db3bc0..8db9af4 100644 --- a/DeepDrftWeb/DeepDrftWeb.csproj +++ b/DeepDrftWeb/DeepDrftWeb.csproj @@ -1,32 +1,32 @@ - net9.0 + net10.0 enable enable - - + + all runtime; build; native; contentfiles; analyzers; buildtransitive - - - + + + all runtime; build; native; contentfiles; analyzers; buildtransitive - + - + all runtime; build; native; contentfiles; analyzers; buildtransitive diff --git a/DeepDrftWeb/Program.cs b/DeepDrftWeb/Program.cs index 43a1bfa..0379e0c 100644 --- a/DeepDrftWeb/Program.cs +++ b/DeepDrftWeb/Program.cs @@ -1,5 +1,4 @@ using DeepDrftWeb; -using DeepDrftWeb.Client.Services; using MudBlazor.Services; using DeepDrftWeb.Components; using Microsoft.AspNetCore.HttpOverrides; @@ -10,17 +9,17 @@ var builder = WebApplication.CreateBuilder(args); builder.Services.AddMudServices(); // Add AudioInteropService for both server and client rendering -builder.Services.AddScoped(); +// builder.Services.AddScoped(); var baseUrl = builder.GetKestrelUrl(); var contentApiUrl = builder.Configuration["ApiUrls:ContentApi"] ?? throw new Exception("Content API URL is not configured"); -Startup.ConfigureDomainServices(builder); - DeepDrftWeb.Client.Startup.ConfigureApiHttpClient(builder.Services, baseUrl); DeepDrftWeb.Client.Startup.ConfigureDomainServices(builder.Services); DeepDrftWeb.Client.Startup.ConfigureContentServices(builder.Services, contentApiUrl); +Startup.ConfigureDomainServices(builder); + builder.Services.AddControllers(); // Add services to the container. diff --git a/DeepDrftWeb/Services/DarkModeService.cs b/DeepDrftWeb/Services/DarkModeService.cs new file mode 100644 index 0000000..e90b38f --- /dev/null +++ b/DeepDrftWeb/Services/DarkModeService.cs @@ -0,0 +1,22 @@ +using DeepDrftWeb.Client.Common; +using DeepDrftWeb.Client.Services; + +namespace DeepDrftWeb.Services; + +public class DarkModeService(DarkModeSettings darkModeSettings, IHttpContextAccessor httpAccessor) : DarkModeServiceBase +{ + public void CheckDarkMode() + { + // get + // { + bool isDarkMode = false; // Default to light mode + var context = httpAccessor.HttpContext; + if (context?.Request.Cookies.TryGetValue(COOKIE_NAME, out var dark) == true) + { + isDarkMode = dark == "true"; + } + darkModeSettings.IsDarkMode = isDarkMode; + // return isDarkMode; + // } + } +} \ No newline at end of file diff --git a/DeepDrftWeb/Startup.cs b/DeepDrftWeb/Startup.cs index 1466d7e..20b8649 100644 --- a/DeepDrftWeb/Startup.cs +++ b/DeepDrftWeb/Startup.cs @@ -1,4 +1,4 @@ -using DeepDrftWeb.Services.Data; +using DeepDrftWeb.Services.Data; using DeepDrftWeb.Services.Repositories; using DeepDrftWeb.Services; using Microsoft.EntityFrameworkCore; @@ -13,9 +13,16 @@ public static class Startup builder.Services.AddDbContext(options => options.UseSqlite(builder.Configuration.GetConnectionString("DefaultConnection"))); + // Add Server Prerendering Theming Support + // DarkModeSettings is registered in DeepDrftWeb.Client.Startup.ConfigureDomainServices + builder.Services + .AddHttpContextAccessor() + .AddScoped(); + // Add Track services - builder.Services.AddScoped(); - builder.Services.AddScoped(); + builder.Services + .AddScoped() + .AddScoped(); } public static string GetKestrelUrl(this WebApplicationBuilder builder) diff --git a/DeepDrftWeb/wwwroot/styles/deepdrft-styles.css b/DeepDrftWeb/wwwroot/styles/deepdrft-styles.css index fd6ed87..4257d95 100644 --- a/DeepDrftWeb/wwwroot/styles/deepdrft-styles.css +++ b/DeepDrftWeb/wwwroot/styles/deepdrft-styles.css @@ -4,16 +4,16 @@ /* Color Variables - Charleston in the Day (Light Mode Default) */ :root { - /* Charleston Theme Colors */ - --deepdrft-primary: #1C1C1C; /* Wrought iron black */ - --deepdrft-secondary: #B8848C; /* Dusty rose - elegant accent */ - --deepdrft-tertiary: #C9A962; /* Antique gold - replaces brown */ - --deepdrft-accent: #7D9B8C; /* Sage green */ + /* Charleston Theme Colors - Elegant Ironwork & Lowcountry */ + --deepdrft-primary: #1A1A1A; /* Wrought iron black */ + --deepdrft-secondary: #B8623D; /* Burnished copper - warm orange bronze */ + --deepdrft-tertiary: #2A7B8C; /* Atlantic turquoise */ + --deepdrft-accent: #2A7B8C; /* Atlantic turquoise */ /* Extended Palette - Light Theme (Charleston) */ - --deepdrft-quaternary: #7D9B8C; /* Sage green */ - --deepdrft-quinary: #6B7D8A; /* Slate blue */ - --deepdrft-senary: #C4967A; /* Warm terracotta */ + --deepdrft-quaternary: #D4A556; /* Lamplight orange/yellow */ + --deepdrft-quinary: #3D5A47; /* Swampy elegant green */ + --deepdrft-senary: #6B4C6A; /* Sunset purple */ --deepdrft-septenary: #8A7A96; /* Soft plum */ /* Surface Colors */ @@ -32,17 +32,19 @@ --deepdrft-theme-septenary: var(--deepdrft-septenary); /* Charleston-specific accent colors */ - --charleston-iron: #1C1C1C; + --charleston-iron: #1A1A1A; --charleston-iron-soft: #4A4A4A; --charleston-cream: #FDFBF7; - --charleston-rose: #B8848C; - --charleston-gold: #C9A962; - --charleston-sage: #7D9B8C; + --charleston-bronze: #B8623D; + --charleston-turquoise: #2A7B8C; + --charleston-lamplight: #D4A556; + --charleston-swamp: #3D5A47; + --charleston-sunset: #6B4C6A; /* Font Hierarchy - DRY font definitions */ - /* Upscale steakhouse aesthetic - refined, modern luxury */ + /* Upscale Charleston aesthetic - tall decorative ironwork elegance */ --deepdrft-font-largest-headers: "Bodoni Moda", serif; /* h1, hero text - high-fashion editorial */ - --deepdrft-font-headers: "EB Garamond", serif; /* h2-h6 - elegant serif headers */ + --deepdrft-font-headers: "Cormorant", serif; /* h2-h6 - elegant readable serif */ --deepdrft-font-body: "DM Sans", sans-serif; /* body, buttons, UI - clean modern */ } @@ -111,13 +113,13 @@ .deepdrft-theme-light .deepdrft-gradient-soft-primary { background: linear-gradient(45deg, color-mix(in srgb, var(--charleston-iron) 4%, transparent) 0%, - color-mix(in srgb, var(--charleston-rose) 6%, transparent) 100%); + color-mix(in srgb, var(--charleston-bronze) 6%, transparent) 100%); } .deepdrft-theme-light .mud-paper.deepdrft-gradient-soft-secondary, .deepdrft-theme-light .deepdrft-gradient-soft-secondary { background: linear-gradient(45deg, - color-mix(in srgb, var(--charleston-gold) 6%, transparent) 0%, + color-mix(in srgb, var(--charleston-lamplight) 6%, transparent) 0%, color-mix(in srgb, var(--charleston-iron) 4%, transparent) 100%); } @@ -125,13 +127,13 @@ .deepdrft-theme-light .deepdrft-gradient-soft-accent { background: linear-gradient(135deg, color-mix(in srgb, var(--charleston-iron) 3%, transparent) 0%, - color-mix(in srgb, var(--charleston-gold) 5%, transparent) 100%); + color-mix(in srgb, var(--charleston-lamplight) 5%, transparent) 100%); } .deepdrft-theme-light .mud-paper.deepdrft-gradient-soft-tertiary, .deepdrft-theme-light .deepdrft-gradient-soft-tertiary { background: linear-gradient(135deg, - color-mix(in srgb, var(--charleston-rose) 5%, transparent) 0%, + color-mix(in srgb, var(--charleston-bronze) 5%, transparent) 0%, color-mix(in srgb, var(--charleston-iron) 3%, transparent) 100%); } @@ -139,7 +141,7 @@ .deepdrft-theme-light .deepdrft-gradient-features { background: linear-gradient(to right, color-mix(in srgb, var(--charleston-iron) 2%, transparent) 0%, - color-mix(in srgb, var(--charleston-rose) 3%, transparent) 100%); + color-mix(in srgb, var(--charleston-bronze) 3%, transparent) 100%); } /* Lowcountry Gradient Overrides (Dark Mode) */ @@ -204,17 +206,13 @@ h1, .deepdrft-text-hero, .deepdrft-heading-primary { text-shadow: 2px 2px 4px rgba(0,0,0,0.5); } -.deepdrft-text-hero { - font-size: clamp(2rem, 8vw, 4rem); -} - /* Hero Section Theme-Aware Text Colors */ /* Light mode (cream background): dark text */ .deepdrft-theme-light .deepdrft-hero-container .deepdrft-hero-title { color: var(--charleston-iron); } .deepdrft-theme-light .deepdrft-hero-container .deepdrft-hero-subtitle { - color: var(--charleston-rose); + color: var(--charleston-bronze); } .deepdrft-theme-light .deepdrft-hero-container .deepdrft-hero-description { color: var(--charleston-iron-soft); @@ -351,6 +349,18 @@ body, p, span, div, border-top: 4px solid var(--deepdrft-theme-tertiary); } +.deepdrft-border-top-quaternary { + border-top: 4px solid var(--deepdrft-theme-quaternary); +} + +.deepdrft-border-top-quinary { + border-top: 4px solid var(--deepdrft-theme-quinary); +} + +.deepdrft-border-top-senary { + border-top: 4px solid var(--deepdrft-theme-senary); +} + /* Buttons */ .deepdrft-button-primary { color: var(--deepdrft-theme-primary); @@ -382,7 +392,7 @@ body, p, span, div, .deepdrft-theme-light .mud-card.deepdrft-card-pink-tint, .deepdrft-theme-light .mud-paper.deepdrft-card-pink-tint { - background: color-mix(in srgb, var(--charleston-rose) 10%, transparent); + background: color-mix(in srgb, var(--charleston-bronze) 10%, transparent); } .deepdrft-theme-dark .mud-card.deepdrft-card-pink-tint, .deepdrft-theme-dark .mud-paper.deepdrft-card-pink-tint { @@ -400,7 +410,7 @@ body, p, span, div, .deepdrft-theme-light .mud-card.deepdrft-card-lavender-tint, .deepdrft-theme-light .mud-paper.deepdrft-card-lavender-tint { - background: color-mix(in srgb, var(--charleston-sage) 10%, transparent); + background: color-mix(in srgb, var(--charleston-swamp) 10%, transparent); } .deepdrft-theme-dark .mud-card.deepdrft-card-lavender-tint, .deepdrft-theme-dark .mud-paper.deepdrft-card-lavender-tint { @@ -419,7 +429,7 @@ body, p, span, div, .deepdrft-theme-light .mud-card.deepdrft-card-secondary-tint, .deepdrft-theme-light .mud-paper.deepdrft-card-secondary-tint { - background: color-mix(in srgb, var(--charleston-rose) 8%, transparent); + background: color-mix(in srgb, var(--charleston-bronze) 8%, transparent); } .deepdrft-theme-dark .mud-card.deepdrft-card-secondary-tint, .deepdrft-theme-dark .mud-paper.deepdrft-card-secondary-tint { @@ -428,7 +438,7 @@ body, p, span, div, .deepdrft-theme-light .mud-card.deepdrft-card-tertiary-tint, .deepdrft-theme-light .mud-paper.deepdrft-card-tertiary-tint { - background: color-mix(in srgb, var(--charleston-gold) 8%, transparent); + background: color-mix(in srgb, var(--charleston-lamplight) 8%, transparent); } .deepdrft-theme-dark .mud-card.deepdrft-card-tertiary-tint, .deepdrft-theme-dark .mud-paper.deepdrft-card-tertiary-tint { @@ -483,7 +493,7 @@ body, p, span, div, .deepdrft-hero-text-container { max-width: 600px; - margin: 0 auto; + /*margin: 0 auto;*/ } /* Feature Cards Layout */ @@ -606,27 +616,27 @@ body, p, span, div, box-shadow: inset 0 0 20px rgba(28,28,28,0.03); } -/* Gold Accent */ -.charleston-gold-accent { - border-bottom: 2px solid var(--charleston-gold, #C9A962); +/* Lamplight Accent */ +.charleston-lamplight-accent { + border-bottom: 2px solid var(--charleston-lamplight, #D4A556); } -.charleston-gold-border { - border: 1px solid var(--charleston-gold, #C9A962); +.charleston-lamplight-border { + border: 1px solid var(--charleston-lamplight, #D4A556); } -/* Rose Accent */ -.charleston-rose-accent { - border-bottom: 2px solid var(--charleston-rose, #B8848C); +/* Bronze Accent */ +.charleston-bronze-accent { + border-bottom: 2px solid var(--charleston-bronze, #B8623D); } -.charleston-rose-border { - border: 1px solid var(--charleston-rose, #B8848C); +.charleston-bronze-border { + border: 1px solid var(--charleston-bronze, #B8623D); } /* Garden Card (subtle green tint) */ .charleston-garden-tint { - background: color-mix(in srgb, var(--charleston-sage) 8%, transparent); + background: color-mix(in srgb, var(--charleston-swamp) 8%, transparent); } /* Iron Gate Pattern Overlay */ diff --git a/global.json b/global.json index e69d70f..9a523dc 100644 --- a/global.json +++ b/global.json @@ -1,7 +1,7 @@ { "sdk": { - "version": "10.0.100", + "version": "10.0.0", "rollForward": "latestMajor", - "allowPrerelease": true + "allowPrerelease": false } } \ No newline at end of file