From bf98eb1c47f847962fa40d7a51d6015fad47156a Mon Sep 17 00:00:00 2001
From: LilithSilver <84940819+LilithSilver@users.noreply.github.com>
Date: Tue, 14 May 2024 11:30:17 -0700
Subject: [PATCH] Dark mode (#299)

---
 LightBulb/App.axaml                           | 100 ++++++++++++++----
 LightBulb/App.axaml.cs                        |  64 +++++++++--
 LightBulb/LightBulb.csproj                    |   2 +-
 LightBulb/Models/ThemeMode.cs                 |  22 ++++
 LightBulb/Services/SettingsService.cs         |   3 +
 .../Settings/AdvancedSettingsTabViewModel.cs  |  13 ++-
 LightBulb/ViewModels/MainViewModel.cs         |   3 -
 .../Views/Components/DashboardView.axaml      |  53 ++++++++--
 .../Settings/AdvancedSettingsTabView.axaml    |  41 +++++--
 .../ApplicationWhitelistSettingsTabView.axaml |   6 +-
 .../Settings/GeneralSettingsTabView.axaml     |  36 ++++---
 .../Settings/LocationSettingsTabView.axaml    |  21 ++--
 LightBulb/Views/Controls/HotKeyTextBox.axaml  |   3 +-
 LightBulb/Views/MainView.axaml                |   5 +-
 14 files changed, 299 insertions(+), 73 deletions(-)
 create mode 100644 LightBulb/Models/ThemeMode.cs

diff --git a/LightBulb/App.axaml b/LightBulb/App.axaml
index 80eb4467..13df9456 100644
--- a/LightBulb/App.axaml
+++ b/LightBulb/App.axaml
@@ -4,13 +4,15 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:dialogHostAvalonia="clr-namespace:DialogHostAvalonia;assembly=DialogHost.Avalonia"
     xmlns:framework="clr-namespace:LightBulb.Framework"
+    xmlns:sys="using:System"
     xmlns:materialAssists="clr-namespace:Material.Styles.Assists;assembly=Material.Styles"
+    xmlns:materialControls="clr-namespace:Material.Styles.Controls;assembly=Material.Styles"
     xmlns:materialIcons="clr-namespace:Material.Icons.Avalonia;assembly=Material.Icons.Avalonia"
-    xmlns:materialStyles="clr-namespace:Material.Styles.Themes;assembly=Material.Styles"
-    RequestedThemeVariant="Light">
+    xmlns:materialStyles="clr-namespace:Material.Styles.Themes;assembly=Material.Styles">
     <Application.DataTemplates>
         <framework:ViewManager />
     </Application.DataTemplates>
+
     <Application.Styles>
         <Style>
             <Style.Resources>
@@ -79,19 +81,62 @@
             </Style>
         </Style>
 
+        <!-- Apply Slider Accent class, since Material doesn't do it itself -->
+        <Style Selector="Slider.accent">
+            <Style Selector="^ Border#PART_InactiveState">
+                <Setter Property="Background" Value="{DynamicResource MaterialSecondaryMidBrush}" />
+            </Style>
+            <Style Selector="^ Border#PART_Indicator">
+                <Setter Property="Background" Value="{DynamicResource MaterialSecondaryMidBrush}" />
+            </Style>
+            <Style Selector="^ Border#PART_HoverEffect">
+                <Setter Property="Background" Value="{DynamicResource MaterialSecondaryMidBrush}" />
+            </Style>
+
+            <Style Selector="^ Border#PART_ThumbGrip">
+                <Setter Property="Background" Value="{DynamicResource MaterialSecondaryMidBrush}" />
+            </Style>
+        </Style>
+
         <!--  Text box  -->
         <Style Selector="TextBox">
             <Setter Property="FontSize" Value="14" />
         </Style>
 
+        <!-- Apply TextBox Accent class, since material doesn't do it itself -->
+        <Style Selector="TextBox.accent">
+            <Setter Property="SelectionBrush" Value="{DynamicResource MaterialSecondaryMidBrush}" />
+            <Setter Property="SelectionForegroundBrush" Value="{DynamicResource MaterialSecondaryForegroundBrush}" />
+            <Setter Property="CaretBrush" Value="{DynamicResource MaterialSecondaryMidBrush}" />
+            <Style Selector="^ materialControls|MaterialUnderline">
+                <Setter Property="ActiveBrush" Value="{DynamicResource MaterialSecondaryMidBrush}" />
+            </Style>
+        </Style>
+
         <!--  Toggle button  -->
         <Style Selector="ToggleButton">
             <Setter Property="TextElement.FontWeight" Value="Medium" />
         </Style>
 
+        <!-- Combo box -->
+        <Style Selector="ComboBox">
+            <Style Selector="^ /template/ Panel#PART_RootPanel">
+                <Setter Property="Height" Value="22" />
+            </Style>
+        </Style>
+
+        <!-- Apply ComboBox Accent class, since material doesn't do it itself -->
+        <Style Selector="ComboBox.accent">
+            <Style Selector="^ materialControls|MaterialUnderline">
+                <Setter Property="ActiveBrush" Value="{DynamicResource MaterialSecondaryMidBrush}" />
+            </Style>
+        </Style>
+
         <!--  Toggle switch  -->
         <Style Selector="ToggleSwitch">
-            <Setter Property="materialAssists:ToggleSwitchAssist.SwitchThumbOffBackground" Value="{DynamicResource MaterialBackgroundBrush}" />
+            <!-- Apply custom style for disabled toggles, because Material's default is bad.-->
+            <!-- Tracked in https://github.com/AvaloniaCommunity/Material.Avalonia/issues/379 -->
+            <Setter Property="materialAssists:ToggleSwitchAssist.SwitchThumbOffBackground" Value="{DynamicResource ToggleBackgroundBrush}" />
         </Style>
 
         <!--  Tooltip  -->
@@ -104,25 +149,38 @@
     </Application.Styles>
 
     <Application.Resources>
-        <!--  Text box  -->
-        <ControlTheme
-            x:Key="CompactTextBox"
-            BasedOn="{StaticResource {x:Type TextBox}}"
-            TargetType="{x:Type TextBox}">
-            <Styles>
-                <Style Selector="TextBox">
-                    <Setter Property="Height" Value="22" />
-
-                    <Style Selector="^ /template/ Panel#PART_TextFieldPanel">
-                        <Setter Property="MinHeight" Value="0" />
-                    </Style>
-
-                    <Style Selector="^ /template/ Panel#PART_TextContainer">
-                        <Setter Property="Margin" Value="0" />
+        <ResourceDictionary>
+            <!--  Text box  -->
+            <ControlTheme
+                x:Key="CompactTextBox"
+                BasedOn="{StaticResource {x:Type TextBox}}"
+                TargetType="{x:Type TextBox}">
+                <Styles>
+                    <Style Selector="TextBox">
+                        <Setter Property="Height" Value="22" />
+
+                        <Style Selector="^ /template/ Panel#PART_TextFieldPanel">
+                            <Setter Property="MinHeight" Value="0" />
+                        </Style>
+                        <Style Selector="^ /template/ Panel#PART_TextContainer">
+                            <Setter Property="Margin" Value="0" />
+                        </Style>
                     </Style>
-                </Style>
-            </Styles>
-        </ControlTheme>
+                </Styles>
+            </ControlTheme>
+            <ResourceDictionary.ThemeDictionaries>
+                <ResourceDictionary x:Key="Light">
+                    <!-- Custom style for disabled toggles -->
+                    <SolidColorBrush x:Key="ToggleBackgroundBrush" Color="#FFFFFF"></SolidColorBrush>
+                    <sys:Boolean x:Key="UseAccentControls">false</sys:Boolean>
+                </ResourceDictionary>
+                <ResourceDictionary x:Key="Dark">
+                    <!-- Custom style for disabled toggles -->
+                    <SolidColorBrush x:Key="ToggleBackgroundBrush" Color="#8E8E8E"></SolidColorBrush>
+                    <sys:Boolean x:Key="UseAccentControls">true</sys:Boolean>
+                </ResourceDictionary>
+            </ResourceDictionary.ThemeDictionaries>
+        </ResourceDictionary>
     </Application.Resources>
 
     <!--  Tray icon  -->
diff --git a/LightBulb/App.axaml.cs b/LightBulb/App.axaml.cs
index a9dbce0a..10f1f123 100644
--- a/LightBulb/App.axaml.cs
+++ b/LightBulb/App.axaml.cs
@@ -5,8 +5,10 @@
 using Avalonia.Controls.ApplicationLifetimes;
 using Avalonia.Markup.Xaml;
 using Avalonia.Media;
+using Avalonia.Platform;
 using Avalonia.Threading;
 using LightBulb.Framework;
+using LightBulb.Models;
 using LightBulb.Services;
 using LightBulb.Utils;
 using LightBulb.Utils.Extensions;
@@ -26,6 +28,7 @@ public class App : Application, IDisposable
 
     private readonly ServiceProvider _services;
     private readonly MainViewModel _mainViewModel;
+    private readonly SettingsService _settingsService;
 
     public App()
     {
@@ -56,6 +59,22 @@ public App()
 
         _services = services.BuildServiceProvider(true);
         _mainViewModel = _services.GetRequiredService<ViewModelManager>().CreateMainViewModel();
+        _settingsService = _services.GetRequiredService<SettingsService>();
+
+        // Load settings
+        _settingsService.Load();
+
+        _settingsService.WatchProperty(
+            o => o.Theme,
+            () =>
+            {
+                if (PlatformSettings is IPlatformSettings settings)
+                {
+                    SetupTheme(settings.GetColorValues());
+                }
+            },
+            false
+        );
     }
 
     public override void Initialize()
@@ -95,12 +114,45 @@ public override void OnFrameworkInitializationCompleted()
 
         base.OnFrameworkInitializationCompleted();
 
-        // Set custom theme colors
-        this.LocateMaterialTheme<MaterialThemeBase>().CurrentTheme = Theme.Create(
-            Theme.Light,
-            Color.Parse("#343838"),
-            Color.Parse("#F9A825")
-        );
+        if (PlatformSettings is IPlatformSettings settings)
+        {
+            settings.ColorValuesChanged += PlatformSettings_ColorValuesChanged;
+            SetupTheme(settings.GetColorValues());
+        }
+    }
+
+    private void PlatformSettings_ColorValuesChanged(object? sender, PlatformColorValues colors)
+    {
+        SetupTheme(colors);
+    }
+
+    private void SetupTheme(PlatformColorValues colors)
+    {
+        var themeMode = _settingsService.Theme;
+        if (themeMode == ThemeMode.System)
+        {
+            themeMode =
+                colors.ThemeVariant == PlatformThemeVariant.Dark ? ThemeMode.Dark : ThemeMode.Light;
+        }
+
+        if (themeMode == ThemeMode.Dark)
+        {
+            RequestedThemeVariant = Avalonia.Styling.ThemeVariant.Dark;
+            this.LocateMaterialTheme<MaterialThemeBase>().CurrentTheme = Theme.Create(
+                Theme.Dark,
+                Color.Parse("#202222"),
+                Color.Parse("#F9A825")
+            );
+        }
+        else
+        {
+            RequestedThemeVariant = Avalonia.Styling.ThemeVariant.Light;
+            this.LocateMaterialTheme<MaterialThemeBase>().CurrentTheme = Theme.Create(
+                Theme.Light,
+                Color.Parse("#343838"),
+                Color.Parse("#F9A825")
+            );
+        }
     }
 
     private void TrayIcon_OnClicked(object? sender, EventArgs args) => this.TryFocusMainWindow();
diff --git a/LightBulb/LightBulb.csproj b/LightBulb/LightBulb.csproj
index 4c826f6c..c13291ae 100644
--- a/LightBulb/LightBulb.csproj
+++ b/LightBulb/LightBulb.csproj
@@ -26,7 +26,7 @@
     <PackageReference Include="Deorcify" Version="1.0.2" PrivateAssets="all" />
     <PackageReference Include="DialogHost.Avalonia" Version="0.7.7" />
     <PackageReference Include="DotnetRuntimeBootstrapper" Version="2.5.3" PrivateAssets="all" Condition="$([MSBuild]::IsOsPlatform('Windows'))" />
-    <PackageReference Include="Material.Avalonia" Version="3.5.0" />
+    <PackageReference Include="Material.Avalonia" Version="3.6.0" />
     <PackageReference Include="Material.Icons.Avalonia" Version="2.1.9" />
     <PackageReference Include="Microsoft.Extensions.DependencyInjection" Version="8.0.0" />
     <PackageReference Include="Onova" Version="2.6.11" />
diff --git a/LightBulb/Models/ThemeMode.cs b/LightBulb/Models/ThemeMode.cs
new file mode 100644
index 00000000..82d71c55
--- /dev/null
+++ b/LightBulb/Models/ThemeMode.cs
@@ -0,0 +1,22 @@
+namespace LightBulb.Models;
+
+/// <summary>
+/// Describes the application's theme mode.
+/// </summary>
+public enum ThemeMode
+{
+    /// <summary>
+    /// Use the light theme
+    /// </summary>
+    Light,
+
+    /// <summary>
+    /// Use the dark theme
+    /// </summary>
+    Dark,
+
+    /// <summary>
+    /// Use whichever theme is specified by system settings
+    /// </summary>
+    System
+}
diff --git a/LightBulb/Services/SettingsService.cs b/LightBulb/Services/SettingsService.cs
index f33cce70..c99f7957 100644
--- a/LightBulb/Services/SettingsService.cs
+++ b/LightBulb/Services/SettingsService.cs
@@ -88,6 +88,9 @@ public partial class SettingsService() : SettingsBase(GetFilePath())
     [property: JsonIgnore] // comes from registry
     private bool _isAutoStartEnabled;
 
+    [ObservableProperty]
+    private ThemeMode _theme = ThemeMode.System;
+
     [ObservableProperty]
     private bool _isAutoUpdateEnabled = true;
 
diff --git a/LightBulb/ViewModels/Components/Settings/AdvancedSettingsTabViewModel.cs b/LightBulb/ViewModels/Components/Settings/AdvancedSettingsTabViewModel.cs
index 4f8b2d04..059306f7 100644
--- a/LightBulb/ViewModels/Components/Settings/AdvancedSettingsTabViewModel.cs
+++ b/LightBulb/ViewModels/Components/Settings/AdvancedSettingsTabViewModel.cs
@@ -1,4 +1,7 @@
-using LightBulb.Services;
+using System;
+using System.Collections.Generic;
+using LightBulb.Models;
+using LightBulb.Services;
 
 namespace LightBulb.ViewModels.Components.Settings;
 
@@ -11,6 +14,14 @@ public bool IsAutoStartEnabled
         set => SettingsService.IsAutoStartEnabled = value;
     }
 
+    public IReadOnlyList<ThemeMode> ThemeArray { get; } = Enum.GetValues<ThemeMode>();
+
+    public ThemeMode Theme
+    {
+        get => SettingsService.Theme;
+        set => SettingsService.Theme = value;
+    }
+
     public bool IsAutoUpdateEnabled
     {
         get => SettingsService.IsAutoUpdateEnabled;
diff --git a/LightBulb/ViewModels/MainViewModel.cs b/LightBulb/ViewModels/MainViewModel.cs
index 39685004..531e8994 100644
--- a/LightBulb/ViewModels/MainViewModel.cs
+++ b/LightBulb/ViewModels/MainViewModel.cs
@@ -143,9 +143,6 @@ Click LEARN MORE to find ways that you can help.
     [RelayCommand]
     private async Task InitializeAsync()
     {
-        // Load settings
-        settingsService.Load();
-
         await FinalizePendingUpdateAsync();
         await ShowGammaRangePromptAsync();
         await ShowFirstTimeExperienceMessageAsync();
diff --git a/LightBulb/Views/Components/DashboardView.axaml b/LightBulb/Views/Components/DashboardView.axaml
index 989f41f6..ad06e365 100644
--- a/LightBulb/Views/Components/DashboardView.axaml
+++ b/LightBulb/Views/Components/DashboardView.axaml
@@ -12,6 +12,39 @@
         <components:DashboardViewModel />
     </Design.DataContext>
 
+    <UserControl.Resources>
+        <ResourceDictionary>
+            <ResourceDictionary.ThemeDictionaries>
+                <ResourceDictionary x:Key="Light">
+                    <!-- Sundial brushes -->
+                    <SolidColorBrush x:Key="SundialNightBorderBrush" Color="#FFAF1A"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialNightBrush" Color="#FFD280"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialDayBorderBrush" Color="#8AC0FF"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialDayBrush" Color="#F2F8FF"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialSunriseBorderBrush" Color="#FFC766"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialSunriseBrush" Color="#FFEDCD"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialSunsetBorderBrush" Color="#FFC766"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialSunsetBrush" Color="#FFEDCD"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialMarkerBorderBrush" Color="#FF7733"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialMarkerBrush" Color="#FFAB85"></SolidColorBrush>
+                </ResourceDictionary>
+                <ResourceDictionary x:Key="Dark">
+                    <!-- Sundial brushes -->
+                    <SolidColorBrush x:Key="SundialNightBorderBrush" Color="#B18B4E"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialNightBrush" Color="#ECC17E"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialDayBorderBrush" Color="#4E93B1"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialDayBrush" Color="#AAD7EA"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialSunriseBorderBrush" Color="#B18C4E"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialSunriseBrush" Color="#FAEDD6"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialSunsetBorderBrush" Color="#B18C4E"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialSunsetBrush" Color="#FAEDD6"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialMarkerBorderBrush" Color="#B1704E"></SolidColorBrush>
+                    <SolidColorBrush x:Key="SundialMarkerBrush" Color="#E38755"></SolidColorBrush>
+                </ResourceDictionary>
+            </ResourceDictionary.ThemeDictionaries>
+        </ResourceDictionary>
+    </UserControl.Resources>
+
     <Grid ColumnDefinitions="*,Auto,*">
         <!--  Sunset time  -->
         <TextBlock
@@ -41,14 +74,14 @@
                 Height="180"
                 EndAngle="{Binding SunriseStart, Converter={x:Static converters:TimeOnlyToDegreesDoubleConverter.Instance}}"
                 StartAngle="{Binding SunsetEnd, Converter={x:Static converters:TimeOnlyToDegreesDoubleConverter.Instance}}"
-                Stroke="#FFAF1A"
+                Stroke="{DynamicResource SundialNightBorderBrush}"
                 StrokeThickness="28" />
             <controls:Arc
                 Width="180"
                 Height="180"
                 EndAngle="{Binding SunriseStart, Converter={x:Static converters:TimeOnlyToDegreesDoubleConverter.Instance}}"
                 StartAngle="{Binding SunsetEnd, Converter={x:Static converters:TimeOnlyToDegreesDoubleConverter.Instance}}"
-                Stroke="#FFD280"
+                Stroke="{DynamicResource SundialNightBrush}"
                 StrokeThickness="26" />
 
             <!--  Day time arc  -->
@@ -57,14 +90,14 @@
                 Height="180"
                 EndAngle="{Binding SunsetStart, Converter={x:Static converters:TimeOnlyToDegreesDoubleConverter.Instance}}"
                 StartAngle="{Binding SunriseEnd, Converter={x:Static converters:TimeOnlyToDegreesDoubleConverter.Instance}}"
-                Stroke="#8AC0FF"
+                Stroke="{DynamicResource SundialDayBorderBrush}"
                 StrokeThickness="28" />
             <controls:Arc
                 Width="180"
                 Height="180"
                 EndAngle="{Binding SunsetStart, Converter={x:Static converters:TimeOnlyToDegreesDoubleConverter.Instance}}"
                 StartAngle="{Binding SunriseEnd, Converter={x:Static converters:TimeOnlyToDegreesDoubleConverter.Instance}}"
-                Stroke="#F2F8FF"
+                Stroke="{DynamicResource SundialDayBrush}"
                 StrokeThickness="26" />
 
             <!--  Sunrise transition  -->
@@ -73,14 +106,14 @@
                 Height="180"
                 EndAngle="{Binding SunriseEnd, Converter={x:Static converters:TimeOnlyToDegreesDoubleConverter.Instance}}"
                 StartAngle="{Binding SunriseStart, Converter={x:Static converters:TimeOnlyToDegreesDoubleConverter.Instance}}"
-                Stroke="#FFC766"
+                Stroke="{DynamicResource SundialSunriseBorderBrush}"
                 StrokeThickness="28" />
             <controls:Arc
                 Width="180"
                 Height="180"
                 EndAngle="{Binding SunriseEnd, Converter={x:Static converters:TimeOnlyToDegreesDoubleConverter.Instance}}"
                 StartAngle="{Binding SunriseStart, Converter={x:Static converters:TimeOnlyToDegreesDoubleConverter.Instance}}"
-                Stroke="#FFEDCD"
+                Stroke="{DynamicResource SundialSunriseBrush}"
                 StrokeThickness="26" />
 
             <!--  Sunset transition  -->
@@ -89,14 +122,14 @@
                 Height="180"
                 EndAngle="{Binding SunsetEnd, Converter={x:Static converters:TimeOnlyToDegreesDoubleConverter.Instance}}"
                 StartAngle="{Binding SunsetStart, Converter={x:Static converters:TimeOnlyToDegreesDoubleConverter.Instance}}"
-                Stroke="#FFC766"
+                Stroke="{DynamicResource SundialSunsetBorderBrush}"
                 StrokeThickness="28" />
             <controls:Arc
                 Width="180"
                 Height="180"
                 EndAngle="{Binding SunsetEnd, Converter={x:Static converters:TimeOnlyToDegreesDoubleConverter.Instance}}"
                 StartAngle="{Binding SunsetStart, Converter={x:Static converters:TimeOnlyToDegreesDoubleConverter.Instance}}"
-                Stroke="#FFEDCD"
+                Stroke="{DynamicResource SundialSunsetBrush}"
                 StrokeThickness="26" />
 
             <!--  Current time position  -->
@@ -104,13 +137,13 @@
                 Width="180"
                 Height="180"
                 Angle="{Binding Instant.TimeOfDay.TotalDays, Converter={x:Static converters:FractionToDegreesConverter.Instance}}"
-                Fill="#FF7733"
+                Fill="{DynamicResource SundialMarkerBorderBrush}"
                 Size="28" />
             <controls:ArcPoint
                 Width="180"
                 Height="180"
                 Angle="{Binding Instant.TimeOfDay.TotalDays, Converter={x:Static converters:FractionToDegreesConverter.Instance}}"
-                Fill="#FFAB85"
+                Fill="{DynamicResource SundialMarkerBrush}"
                 Size="26" />
 
             <!--  Configuration offset  -->
diff --git a/LightBulb/Views/Components/Settings/AdvancedSettingsTabView.axaml b/LightBulb/Views/Components/Settings/AdvancedSettingsTabView.axaml
index b897a8cb..87df660e 100644
--- a/LightBulb/Views/Components/Settings/AdvancedSettingsTabView.axaml
+++ b/LightBulb/Views/Components/Settings/AdvancedSettingsTabView.axaml
@@ -18,11 +18,33 @@
                 HorizontalAlignment="Right"
                 VerticalAlignment="Center"
                 DockPanel.Dock="Right"
-                IsChecked="{Binding IsAutoStartEnabled}" />
+                IsChecked="{Binding IsAutoStartEnabled}"
+                Classes.accent="{DynamicResource UseAccentControls}" />
+        </DockPanel>
+
+        <!-- Theme -->
+        <DockPanel Margin="0,16,0,0" ToolTip.Tip="LightBulb UI Theme">
+            <TextBlock
+                VerticalAlignment="Center"
+                DockPanel.Dock="Left"
+                Text="Theme" />
+            <ComboBox
+                HorizontalAlignment="Right"
+                DockPanel.Dock="Right"
+                ItemsSource="{Binding ThemeArray}"
+                SelectedItem="{Binding Theme}"
+                Classes.accent="{DynamicResource UseAccentControls}">
+                <ComboBox.ItemTemplate>
+                    <DataTemplate>
+                        <!-- Required for correct Material display, via https://github.com/AvaloniaCommunity/Material.Avalonia/issues/269#issuecomment-1738117187-->
+                        <TextBlock Text="{Binding StringFormat='\{0\}'}" VerticalAlignment="Center"></TextBlock>
+                    </DataTemplate>
+                </ComboBox.ItemTemplate>
+            </ComboBox>
         </DockPanel>
 
         <!--  Auto update  -->
-        <DockPanel Margin="0,16,0,0" ToolTip.Tip="Keep LightBulb updated by automatically installing new versions as they become available">
+        <DockPanel Margin="0,14,0,0" ToolTip.Tip="Keep LightBulb updated by automatically installing new versions as they become available">
             <TextBlock
                 VerticalAlignment="Center"
                 DockPanel.Dock="Left"
@@ -31,7 +53,8 @@
                 HorizontalAlignment="Right"
                 VerticalAlignment="Center"
                 DockPanel.Dock="Right"
-                IsChecked="{Binding IsAutoUpdateEnabled}" />
+                IsChecked="{Binding IsAutoUpdateEnabled}"
+                Classes.accent="{DynamicResource UseAccentControls}" />
         </DockPanel>
 
         <!--  Default to day time  -->
@@ -44,7 +67,8 @@
                 HorizontalAlignment="Right"
                 VerticalAlignment="Center"
                 DockPanel.Dock="Right"
-                IsChecked="{Binding IsDefaultToDayConfigurationEnabled}" />
+                IsChecked="{Binding IsDefaultToDayConfigurationEnabled}"
+                Classes.accent="{DynamicResource UseAccentControls}" />
         </DockPanel>
 
         <!--  Pause when full screen  -->
@@ -57,7 +81,8 @@
                 HorizontalAlignment="Right"
                 VerticalAlignment="Center"
                 DockPanel.Dock="Right"
-                IsChecked="{Binding IsPauseWhenFullScreenEnabled}" />
+                IsChecked="{Binding IsPauseWhenFullScreenEnabled}"
+                Classes.accent="{DynamicResource UseAccentControls}" />
         </DockPanel>
 
         <!--  Configuration smoothing  -->
@@ -70,7 +95,8 @@
                 HorizontalAlignment="Right"
                 VerticalAlignment="Center"
                 DockPanel.Dock="Right"
-                IsChecked="{Binding IsConfigurationSmoothingEnabled}" />
+                IsChecked="{Binding IsConfigurationSmoothingEnabled}"
+                Classes.accent="{DynamicResource UseAccentControls}" />
         </DockPanel>
 
         <!--  Gamma polling  -->
@@ -83,7 +109,8 @@
                 HorizontalAlignment="Right"
                 VerticalAlignment="Center"
                 DockPanel.Dock="Right"
-                IsChecked="{Binding IsGammaPollingEnabled}" />
+                IsChecked="{Binding IsGammaPollingEnabled}"
+                Classes.accent="{DynamicResource UseAccentControls}" />
         </DockPanel>
     </StackPanel>
 </UserControl>
\ No newline at end of file
diff --git a/LightBulb/Views/Components/Settings/ApplicationWhitelistSettingsTabView.axaml b/LightBulb/Views/Components/Settings/ApplicationWhitelistSettingsTabView.axaml
index a97a14bd..22a0d902 100644
--- a/LightBulb/Views/Components/Settings/ApplicationWhitelistSettingsTabView.axaml
+++ b/LightBulb/Views/Components/Settings/ApplicationWhitelistSettingsTabView.axaml
@@ -42,7 +42,8 @@
                 HorizontalAlignment="Right"
                 VerticalAlignment="Center"
                 IsChecked="{Binding IsApplicationWhitelistEnabled}"
-                ToolTip.Tip="Pause LightBulb when one of the selected applications is in the foreground" />
+                ToolTip.Tip="Pause LightBulb when one of the selected applications is in the foreground"
+                Classes.accent="{DynamicResource UseAccentControls}" />
         </Grid>
 
         <!--  Whitelisted applications  -->
@@ -69,7 +70,8 @@
                         <CheckBox
                             Content="{Binding Name}"
                             IsChecked="{Binding $parent[ListBoxItem].IsSelected, Mode=OneWay}"
-                            IsHitTestVisible="False" />
+                            IsHitTestVisible="False"
+                            Classes.accent="{DynamicResource UseAccentControls}"/>
                     </Panel>
                 </DataTemplate>
             </ListBox.ItemTemplate>
diff --git a/LightBulb/Views/Components/Settings/GeneralSettingsTabView.axaml b/LightBulb/Views/Components/Settings/GeneralSettingsTabView.axaml
index 621f4668..d1db4102 100644
--- a/LightBulb/Views/Components/Settings/GeneralSettingsTabView.axaml
+++ b/LightBulb/Views/Components/Settings/GeneralSettingsTabView.axaml
@@ -17,7 +17,8 @@
                 MinWidth="24"
                 HorizontalAlignment="Right"
                 DockPanel.Dock="Right"
-                Theme="{DynamicResource CompactTextBox}">
+                Theme="{DynamicResource CompactTextBox}"
+                Classes.accent="{DynamicResource UseAccentControls}">
                 <Interaction.Behaviors>
                     <behaviors:LostFocusUpdateBindingBehavior Text="{Binding DayTemperature, Converter={x:Static converters:DoubleToStringConverter.Instance}}" />
                 </Interaction.Behaviors>
@@ -31,7 +32,8 @@
             Minimum="2500"
             SmallChange="100"
             TickFrequency="20"
-            Value="{Binding DayTemperature}" />
+            Value="{Binding DayTemperature}"
+            Classes.accent="{DynamicResource UseAccentControls}" />
 
         <!--  Night temperature  -->
         <DockPanel Margin="0,24,0,0" ToolTip.Tip="Color temperature during the night">
@@ -40,7 +42,8 @@
                 MinWidth="24"
                 HorizontalAlignment="Right"
                 DockPanel.Dock="Right"
-                Theme="{DynamicResource CompactTextBox}">
+                Theme="{DynamicResource CompactTextBox}"
+                Classes.accent="{DynamicResource UseAccentControls}">
                 <Interaction.Behaviors>
                     <behaviors:LostFocusUpdateBindingBehavior Text="{Binding NightTemperature, Converter={x:Static converters:DoubleToStringConverter.Instance}}" />
                 </Interaction.Behaviors>
@@ -54,7 +57,8 @@
             Minimum="2500"
             SmallChange="100"
             TickFrequency="20"
-            Value="{Binding NightTemperature}" />
+            Value="{Binding NightTemperature}"
+            Classes.accent="{DynamicResource UseAccentControls}" />
 
         <!--  Day brightness  -->
         <DockPanel Margin="0,24,0,0">
@@ -76,7 +80,8 @@
                 MinWidth="24"
                 HorizontalAlignment="Right"
                 DockPanel.Dock="Right"
-                Theme="{DynamicResource CompactTextBox}">
+                Theme="{DynamicResource CompactTextBox}"
+                Classes.accent="{DynamicResource UseAccentControls}">
                 <Interaction.Behaviors>
                     <behaviors:LostFocusUpdateBindingBehavior Text="{Binding DayBrightness, Converter={x:Static converters:FractionToPercentageStringConverter.Instance}}" />
                 </Interaction.Behaviors>
@@ -90,7 +95,8 @@
             Minimum="0.1"
             SmallChange="0.01"
             TickFrequency="0.01"
-            Value="{Binding DayBrightness}" />
+            Value="{Binding DayBrightness}"
+            Classes.accent="{DynamicResource UseAccentControls}" />
 
         <!--  Night brightness  -->
         <DockPanel Margin="0,24,0,0">
@@ -112,7 +118,8 @@
                 MinWidth="24"
                 HorizontalAlignment="Right"
                 DockPanel.Dock="Right"
-                Theme="{DynamicResource CompactTextBox}">
+                Theme="{DynamicResource CompactTextBox}"
+                Classes.accent="{DynamicResource UseAccentControls}">
                 <Interaction.Behaviors>
                     <behaviors:LostFocusUpdateBindingBehavior Text="{Binding NightBrightness, Converter={x:Static converters:FractionToPercentageStringConverter.Instance}}" />
                 </Interaction.Behaviors>
@@ -126,7 +133,8 @@
             Minimum="0.1"
             SmallChange="0.01"
             TickFrequency="0.01"
-            Value="{Binding NightBrightness}" />
+            Value="{Binding NightBrightness}"
+            Classes.accent="{DynamicResource UseAccentControls}" />
 
         <!--  Configuration transition duration  -->
         <DockPanel Margin="0,24,0,0" ToolTip.Tip="Duration of time it takes to switch between day-time and night-time configurations">
@@ -135,7 +143,8 @@
                 MinWidth="48"
                 HorizontalAlignment="Right"
                 DockPanel.Dock="Right"
-                Theme="{DynamicResource CompactTextBox}">
+                Theme="{DynamicResource CompactTextBox}"
+                Classes.accent="{DynamicResource UseAccentControls}">
                 <Interaction.Behaviors>
                     <behaviors:LostFocusUpdateBindingBehavior Text="{Binding ConfigurationTransitionDuration, Converter={x:Static converters:TimeSpanToDurationStringConverter.Instance}}" />
                 </Interaction.Behaviors>
@@ -147,7 +156,8 @@
             Maximum="3"
             Minimum="0"
             SmallChange="0.08"
-            Value="{Binding ConfigurationTransitionDuration, Converter={x:Static converters:TimeSpanToHoursDoubleConverter.Instance}}" />
+            Value="{Binding ConfigurationTransitionDuration, Converter={x:Static converters:TimeSpanToHoursDoubleConverter.Instance}}"
+            Classes.accent="{DynamicResource UseAccentControls}" />
 
         <!--  Configuration transition offset  -->
         <DockPanel Margin="0,24,0,0" ToolTip.Tip="Offset that specifies how early or late the transition starts, relative to the sunrise and sunset">
@@ -156,7 +166,8 @@
                 MinWidth="24"
                 HorizontalAlignment="Right"
                 DockPanel.Dock="Right"
-                Theme="{DynamicResource CompactTextBox}">
+                Theme="{DynamicResource CompactTextBox}"
+                Classes.accent="{DynamicResource UseAccentControls}">
                 <Interaction.Behaviors>
                     <behaviors:LostFocusUpdateBindingBehavior Text="{Binding ConfigurationTransitionOffset, Converter={x:Static converters:FractionToPercentageStringConverter.Instance}}" />
                 </Interaction.Behaviors>
@@ -168,6 +179,7 @@
             Maximum="1"
             Minimum="0"
             SmallChange="0.01"
-            Value="{Binding ConfigurationTransitionOffset}" />
+            Value="{Binding ConfigurationTransitionOffset}"
+            Classes.accent="{DynamicResource UseAccentControls}" />
     </StackPanel>
 </UserControl>
\ No newline at end of file
diff --git a/LightBulb/Views/Components/Settings/LocationSettingsTabView.axaml b/LightBulb/Views/Components/Settings/LocationSettingsTabView.axaml
index 7a55f835..86edeb4c 100644
--- a/LightBulb/Views/Components/Settings/LocationSettingsTabView.axaml
+++ b/LightBulb/Views/Components/Settings/LocationSettingsTabView.axaml
@@ -18,13 +18,15 @@
                 Content="Manual"
                 DockPanel.Dock="Left"
                 IsChecked="{Binding IsManualSunriseSunsetEnabled}"
-                ToolTip.Tip="Configure sunrise and sunset manually" />
+                ToolTip.Tip="Configure sunrise and sunset manually"
+                Classes.accent="{DynamicResource UseAccentControls}" />
             <RadioButton
                 HorizontalAlignment="Right"
                 Content="Location-based"
                 DockPanel.Dock="Right"
                 IsChecked="{Binding !IsManualSunriseSunsetEnabled}"
-                ToolTip.Tip="Configure your location and use it to automatically calculate the sunrise and sunset times" />
+                ToolTip.Tip="Configure your location and use it to automatically calculate the sunrise and sunset times"
+                Classes.accent="{DynamicResource UseAccentControls}" />
         </DockPanel>
 
         <!--  Manual  -->
@@ -39,7 +41,8 @@
                     MinWidth="24"
                     HorizontalAlignment="Right"
                     DockPanel.Dock="Right"
-                    Theme="{DynamicResource CompactTextBox}">
+                    Theme="{DynamicResource CompactTextBox}"
+                    Classes.accent="{DynamicResource UseAccentControls}">
                     <Interaction.Behaviors>
                         <behaviors:LostFocusUpdateBindingBehavior Text="{Binding ManualSunrise, Converter={x:Static converters:TimeOnlyToStringConverter.Instance}}" />
                     </Interaction.Behaviors>
@@ -51,7 +54,8 @@
                 Maximum="23.99999"
                 Minimum="0"
                 SmallChange="0.25"
-                Value="{Binding ManualSunrise, Converter={x:Static converters:TimeOnlyToHoursDoubleConverter.Instance}}" />
+                Value="{Binding ManualSunrise, Converter={x:Static converters:TimeOnlyToHoursDoubleConverter.Instance}}"
+                Classes.accent="{DynamicResource UseAccentControls}" />
 
             <!--  Sunset time  -->
             <DockPanel Margin="0,16,0,0">
@@ -60,7 +64,8 @@
                     MinWidth="24"
                     HorizontalAlignment="Right"
                     DockPanel.Dock="Right"
-                    Theme="{DynamicResource CompactTextBox}">
+                    Theme="{DynamicResource CompactTextBox}"
+                    Classes.accent="{DynamicResource UseAccentControls}">
                     <Interaction.Behaviors>
                         <behaviors:LostFocusUpdateBindingBehavior Text="{Binding ManualSunset, Converter={x:Static converters:TimeOnlyToStringConverter.Instance}}" />
                     </Interaction.Behaviors>
@@ -72,7 +77,8 @@
                 Maximum="23.99999"
                 Minimum="0"
                 SmallChange="0.25"
-                Value="{Binding ManualSunset, Converter={x:Static converters:TimeOnlyToHoursDoubleConverter.Instance}}" />
+                Value="{Binding ManualSunset, Converter={x:Static converters:TimeOnlyToHoursDoubleConverter.Instance}}"
+                Classes.accent="{DynamicResource UseAccentControls}" />
         </StackPanel>
 
         <!--  Location-based  -->
@@ -104,7 +110,8 @@
                     VerticalAlignment="Center"
                     IsEnabled="{Binding !IsBusy}"
                     Text="{Binding LocationQuery}"
-                    Theme="{DynamicResource CompactTextBox}">
+                    Theme="{DynamicResource CompactTextBox}"
+                    Classes.accent="{DynamicResource UseAccentControls}">
                     <ToolTip.Tip>
                         <TextBlock>
                             <Run Text="Specify your location using geographic coordinates or a search query" />
diff --git a/LightBulb/Views/Controls/HotKeyTextBox.axaml b/LightBulb/Views/Controls/HotKeyTextBox.axaml
index 7777ecf9..2c81dd70 100644
--- a/LightBulb/Views/Controls/HotKeyTextBox.axaml
+++ b/LightBulb/Views/Controls/HotKeyTextBox.axaml
@@ -8,5 +8,6 @@
         IsUndoEnabled="False"
         Text="{Binding $parent[UserControl].HotKey, Mode=OneWay}"
         TextAlignment="Center"
-        Theme="{DynamicResource CompactTextBox}" />
+        Theme="{DynamicResource CompactTextBox}"
+        Classes.accent="{DynamicResource UseAccentControls}" />
 </UserControl>
diff --git a/LightBulb/Views/MainView.axaml b/LightBulb/Views/MainView.axaml
index d896487b..0d8b759e 100644
--- a/LightBulb/Views/MainView.axaml
+++ b/LightBulb/Views/MainView.axaml
@@ -35,6 +35,7 @@
                     Background="{DynamicResource MaterialPrimaryMidBrush}"
                     PointerPressed="HeaderBorder_OnPointerPressed">
                     <Grid ColumnDefinitions="Auto,Auto,*,Auto">
+                        <Border Background="{DynamicResource MaterialSecondaryMidBrush}" Width="32" Height="32" CornerRadius="32" />
                         <!--  On/Off button and logo  -->
                         <ToggleButton
                             Grid.Column="0"
@@ -42,10 +43,10 @@
                             Height="32"
                             Padding="0"
                             VerticalAlignment="Center"
-                            Background="{DynamicResource MaterialSecondaryMidBrush}"
                             IsChecked="{Binding Dashboard.IsEnabled}"
                             Theme="{DynamicResource MaterialIconToggleButton}"
-                            ToolTip.Tip="Toggle LightBulb on/off">
+                            ToolTip.Tip="Toggle LightBulb on/off"
+                            Classes="primary">
                             <ToggleButton.Content>
                                 <materialIcons:MaterialIcon Width="24" Height="24">
                                     <materialIcons:MaterialIcon.Styles>