feat: ui improvements & style unification (#124)

ibetitsmike · deansheather · web-flow · commit cf25db591f42 · 2025-06-24T11:20:45.000+02:00
Fixes: #120 <table><thead> <tr> <th colspan="2">Dark mode</th> </tr></thead> <tbody> <tr> <td><img src="https://github.com/user-attachments/assets/31a9fb6c-0f2f-4ad6-b8ae-8f63e736128c" alt="traywindow_dark" width="250"></td> <td><img src="https://github.com/user-attachments/assets/cacb0d7e-f366-4126-a4eb-e4e1936c6a93" alt="traywindow_dark" width="250"></td> </tr> <tr> <td colspan="2"><img src="https://github.com/user-attachments/assets/f34bb089-f80e-4ba0-b89e-91da4e56d493" alt="traywindow_dark" width="500"></td> </tr> </tbody> </table> <table><thead> <tr> <th colspan="2">Light mode</th> </tr></thead> <tbody> <tr> <td><img src="https://github.com/user-attachments/assets/8d26512c-af92-4e02-b06d-51579a27b60c" alt="traywindow_dark" width="250"></td> <td><img src="https://github.com/user-attachments/assets/33de692f-3dcc-4dff-b3e7-3c96cb139336" alt="traywindow_dark" width="250"></td> </tr> <tr> <td colspan="2"><img src="https://github.com/user-attachments/assets/ebe25c8f-78c9-4309-8726-a86abf6e3197" alt="traywindow_dark" width="500"></td> </tr> </tbody> </table> --------- Co-authored-by: Dean Sheather <dean@deansheather.com>
diff --git a/App/Views/DirectoryPickerWindow.xaml b/App/Views/DirectoryPickerWindow.xaml
@@ -13,7 +13,7 @@
     MinWidth="400" MinHeight="600">
 
     <Window.SystemBackdrop>
-        <DesktopAcrylicBackdrop />
+        <MicaBackdrop/>
     </Window.SystemBackdrop>
 
     <Frame x:Name="RootFrame" />
diff --git a/App/Views/DirectoryPickerWindow.xaml.cs b/App/Views/DirectoryPickerWindow.xaml.cs
@@ -19,8 +19,6 @@ public DirectoryPickerWindow(DirectoryPickerViewModel viewModel)
         InitializeComponent();
         TitleBarIcon.SetTitlebarIcon(this);
 
-        SystemBackdrop = new DesktopAcrylicBackdrop();
-
         viewModel.Initialize(this, DispatcherQueue);
         RootFrame.Content = new DirectoryPickerMainPage(viewModel);
 
diff --git a/App/Views/FileSyncListWindow.xaml b/App/Views/FileSyncListWindow.xaml
@@ -13,7 +13,7 @@
     MinWidth="1000" MinHeight="300">
 
     <Window.SystemBackdrop>
-        <DesktopAcrylicBackdrop />
+        <MicaBackdrop/>
     </Window.SystemBackdrop>
 
     <Frame x:Name="RootFrame" />
diff --git a/App/Views/FileSyncListWindow.xaml.cs b/App/Views/FileSyncListWindow.xaml.cs
@@ -16,8 +16,6 @@ public FileSyncListWindow(FileSyncListViewModel viewModel)
         InitializeComponent();
         TitleBarIcon.SetTitlebarIcon(this);
 
-        SystemBackdrop = new DesktopAcrylicBackdrop();
-
         ViewModel.Initialize(this, DispatcherQueue);
         RootFrame.Content = new FileSyncListMainPage(ViewModel);
 
diff --git a/App/Views/Pages/DirectoryPickerMainPage.xaml b/App/Views/Pages/DirectoryPickerMainPage.xaml
@@ -9,8 +9,7 @@
     xmlns:converters="using:Coder.Desktop.App.Converters"
     xmlns:toolkit="using:CommunityToolkit.WinUI.Controls"
     xmlns:viewmodels="using:Coder.Desktop.App.ViewModels"
-    mc:Ignorable="d"
-    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
+    mc:Ignorable="d">
 
     <Grid>
         <Grid
diff --git a/App/Views/Pages/FileSyncListMainPage.xaml b/App/Views/Pages/FileSyncListMainPage.xaml
@@ -8,8 +8,7 @@
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:viewmodels="using:Coder.Desktop.App.ViewModels"
     xmlns:converters="using:Coder.Desktop.App.Converters"
-    mc:Ignorable="d"
-    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
+    mc:Ignorable="d">
 
     <Grid>
         <Grid
diff --git a/App/Views/Pages/SettingsMainPage.xaml b/App/Views/Pages/SettingsMainPage.xaml
@@ -11,8 +11,8 @@
     xmlns:ui="using:CommunityToolkit.WinUI"
     xmlns:win="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:controls="using:CommunityToolkit.WinUI.Controls"
-    mc:Ignorable="d"
-    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
+    mc:Ignorable="d">
+
     <Page.Resources>
         <!--  Spacing between cards  -->
         <x:Double x:Key="SettingsCardSpacing">4</x:Double>
diff --git a/App/Views/Pages/SignInTokenPage.xaml b/App/Views/Pages/SignInTokenPage.xaml
@@ -6,8 +6,7 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-    mc:Ignorable="d"
-    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
+    mc:Ignorable="d">
 
     <StackPanel
         Orientation="Vertical"
diff --git a/App/Views/Pages/SignInUrlPage.xaml b/App/Views/Pages/SignInUrlPage.xaml
@@ -6,8 +6,7 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-    mc:Ignorable="d"
-    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
+    mc:Ignorable="d">
 
     <StackPanel
         Orientation="Vertical"
diff --git a/App/Views/Pages/TrayWindowMainPage.xaml b/App/Views/Pages/TrayWindowMainPage.xaml
@@ -267,13 +267,17 @@
                                     <DataTemplate x:DataType="viewModels:AgentAppViewModel">
                                         <HyperlinkButton
                                             x:Name="AppButton"
-                                            Padding="6"
-                                            Margin="0"
+                                            Padding="4"
+                                            Margin="2"
                                             Command="{x:Bind OpenAppCommand}"
                                             CommandParameter="{Binding ElementName=AppButton}"
                                             Width="34"
                                             Height="34"
                                             ToolTipService.ToolTip="{x:Bind Details}">
+                                            <HyperlinkButton.Resources>
+                                                <SolidColorBrush x:Key="HyperlinkButtonBackground" Color="#1F000000"/>
+                                                <SolidColorBrush x:Key="HyperlinkButtonBackgroundPointerOver" Color="{ThemeResource SystemAccentColorDark1}" />
+                                            </HyperlinkButton.Resources>
 
                                             <Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                                                 <Image
diff --git a/App/Views/SettingsWindow.xaml b/App/Views/SettingsWindow.xaml
@@ -13,7 +13,7 @@
     MinWidth="600" MinHeight="350">
 
     <Window.SystemBackdrop>
-        <DesktopAcrylicBackdrop />
+        <MicaBackdrop/>
     </Window.SystemBackdrop>
 
     <Frame x:Name="RootFrame" />
diff --git a/App/Views/SettingsWindow.xaml.cs b/App/Views/SettingsWindow.xaml.cs
@@ -16,8 +16,6 @@ public SettingsWindow(SettingsViewModel viewModel)
         InitializeComponent();
         TitleBarIcon.SetTitlebarIcon(this);
 
-        SystemBackdrop = new DesktopAcrylicBackdrop();
-
         RootFrame.Content = new SettingsMainPage(ViewModel);
 
         this.CenterOnScreen();
diff --git a/App/Views/SignInWindow.xaml b/App/Views/SignInWindow.xaml
@@ -11,7 +11,7 @@
     Title="Sign in to Coder">
 
     <Window.SystemBackdrop>
-        <DesktopAcrylicBackdrop />
+        <MicaBackdrop/>
     </Window.SystemBackdrop>
 
     <controls:SizedFrame x:Name="RootFrame" />
diff --git a/App/Views/SignInWindow.xaml.cs b/App/Views/SignInWindow.xaml.cs
@@ -24,7 +24,6 @@ public SignInWindow(SignInViewModel viewModel)
     {
         InitializeComponent();
         TitleBarIcon.SetTitlebarIcon(this);
-        SystemBackdrop = new DesktopAcrylicBackdrop();
         RootFrame.SizeChanged += RootFrame_SizeChanged;
 
         _signInUrlPage = new SignInUrlPage(this, viewModel);
diff --git a/App/Views/TrayWindow.xaml.cs b/App/Views/TrayWindow.xaml.cs
@@ -9,7 +9,6 @@
 using Microsoft.UI.Windowing;
 using Microsoft.UI.Xaml;
 using Microsoft.UI.Xaml.Controls;
-using Microsoft.UI.Xaml.Media;
 using Microsoft.UI.Xaml.Media.Animation;
 using System;
 using System.Runtime.InteropServices;
@@ -62,7 +61,6 @@ public TrayWindow(IRpcController rpcController, ICredentialManager credentialMan
 
         InitializeComponent();
         AppWindow.Hide();
-        SystemBackdrop = new DesktopAcrylicBackdrop();
         Activated += Window_Activated;
         RootFrame.SizeChanged += RootFrame_SizeChanged;
 
