[ImageResizer] Moving from ModernWPF to WpfUI (#26858)

* Moving from ModernWPF to WpfUI * signing fix * Spellcheck * Sign fix 2 * Loc tweaks * sign fix 3 * Move titlebar * Tweaks * Debug * Fix again * Updating preview package * Fixes * Update notice.md --------- Co-authored-by: Stefan Markovic <stefan@janeasystems.com>
2024-11-27 14:59:16 +08:00 · 2023-08-08 15:19:38 +02:00 · 2023-08-08 15:19:38 +02:00 · a49f806ac7
commit a49f806ac7
parent f6e9b08855
21 changed files with 417 additions and 405 deletions
--- a/.github/actions/spell-check/expect.txt
+++ b/.github/actions/spell-check/expect.txt
@ -929,6 +929,7 @@ LEFTSCROLLBAR
 LEFTUP
 lego
 len
+lepo
 LError
 Lessthan
 LEVELID
@ -2189,6 +2190,7 @@ wox
 wparam
 wpf
 wpftmp
+wpfui
 wpr
 wprp
 wql
--- a/.pipelines/ESRPSigning_core.json
+++ b/.pipelines/ESRPSigning_core.json
@ -281,7 +281,8 @@
                "WinUI3Apps\\SharpCompress.dll",
                "ColorCode.Core.dll", 
                "ColorCode.UWP.dll",
-                "UnitsNet.dll"
+                "UnitsNet.dll",
+                "Wpf.Ui.dll"
            ],
            "SigningInfo": {
                "Operations": [
--- a/Directory.Packages.props
+++ b/Directory.Packages.props
@ -66,6 +66,7 @@
    <PackageVersion Include="Vanara.PInvoke.User32" Version="3.4.11" />
    <PackageVersion Include="Vanara.PInvoke.Shell32" Version="3.4.11" />
    <PackageVersion Include="WinUIEx" Version="2.2.0" />
+    <PackageVersion Include="WPF-UI" Version="3.0.0-preview.4" />
  </ItemGroup>
  <ItemGroup Condition="'$(IsExperimentationLive)'!=''">
    <!-- Additional dependencies used by experimentation -->
--- a/NOTICE.md
+++ b/NOTICE.md
@ -337,4 +337,5 @@ SOFTWARE.
 - Vanara.PInvoke.Shell32 3.4.11
 - Vanara.PInvoke.User32 3.4.11
 - WinUIEx 2.2.0
+- WPF-UI 3.0.0-preview.4

--- a/src/modules/imageresizer/ui/App.xaml
+++ b/src/modules/imageresizer/ui/App.xaml
@ -4,13 +4,12 @@
             xmlns:m="clr-namespace:ImageResizer.Models"
             xmlns:sys="clr-namespace:System;assembly=System.Runtime"
             xmlns:v="clr-namespace:ImageResizer.Views"
-             xmlns:ui="http://schemas.modernwpf.com/2019">
-
+             xmlns:ui="http://schemas.lepo.co/wpfui/2022/xaml">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
-                <ui:ThemeResources />
-                <ui:XamlControlsResources />
+                <ui:ThemesDictionary Theme="Dark" />
+                <ui:ControlsDictionary />
            </ResourceDictionary.MergedDictionaries>

            <ObjectDataProvider x:Key="ResizeFitValues"
--- a/src/modules/imageresizer/ui/App.xaml.cs
+++ b/src/modules/imageresizer/ui/App.xaml.cs
@ -5,7 +5,6 @@
 using System;
 using System.Text;
 using System.Windows;
-using Common.UI;
 using ImageResizer.Models;
 using ImageResizer.Properties;
 using ImageResizer.Utilities;
@ -16,9 +15,6 @@ namespace ImageResizer
 {
    public partial class App : Application, IDisposable
    {
-        private ThemeManager _themeManager;
-        private bool _isDisposed;
-
        static App()
        {
            Console.InputEncoding = Encoding.Unicode;
@ -44,8 +40,6 @@ namespace ImageResizer
            var mainWindow = new MainWindow(new MainViewModel(batch, Settings.Default));
            mainWindow.Show();

-            _themeManager = new ThemeManager(this);
-
            // Temporary workaround for issue #1273
            BecomeForegroundWindow(new System.Windows.Interop.WindowInteropHelper(mainWindow).Handle);
        }
@ -58,23 +52,9 @@ namespace ImageResizer
            NativeMethods.SetForegroundWindow(hWnd);
        }

-        protected virtual void Dispose(bool disposing)
-        {
-            if (!_isDisposed)
-            {
-                if (disposing)
-                {
-                    _themeManager?.Dispose();
-                }
-
-                _isDisposed = true;
-            }
-        }
-
        public void Dispose()
        {
            // Do not change this code. Put cleanup code in 'Dispose(bool disposing)' method
-            Dispose(disposing: true);
            GC.SuppressFinalize(this);
        }
    }
--- a/src/modules/imageresizer/ui/ImageResizerUI.csproj
+++ b/src/modules/imageresizer/ui/ImageResizerUI.csproj
@ -56,8 +56,8 @@
  <ItemGroup>
    <PackageReference Include="Microsoft.Windows.CsWinRT" />
    <PackageReference Include="Microsoft.Xaml.Behaviors.Wpf" />
-    <PackageReference Include="ModernWpfUI" />
    <PackageReference Include="System.IO.Abstractions" />
+    <PackageReference Include="WPF-UI" />
  </ItemGroup>
  <ItemGroup>
    <ProjectReference Include="..\..\..\common\GPOWrapperProjection\GPOWrapperProjection.csproj" />
--- a/src/modules/imageresizer/ui/Properties/Resources.Designer.cs
+++ b/src/modules/imageresizer/ui/Properties/Resources.Designer.cs
@ -19,7 +19,7 @@ namespace ImageResizer.Properties {
    // class via a tool like ResGen or Visual Studio.
    // To add or remove a member, edit your .ResX file then rerun ResGen
    // with the /str option, or rebuild your VS project.
-    [global::System.CodeDom.Compiler.GeneratedCodeAttribute("System.Resources.Tools.StronglyTypedResourceBuilder", "16.0.0.0")]
+    [global::System.CodeDom.Compiler.GeneratedCodeAttribute("System.Resources.Tools.StronglyTypedResourceBuilder", "17.0.0.0")]
    [global::System.Diagnostics.DebuggerNonUserCodeAttribute()]
    [global::System.Runtime.CompilerServices.CompilerGeneratedAttribute()]
    public class Resources {
@ -87,6 +87,15 @@ namespace ImageResizer.Properties {
            }
        }
        
+        /// <summary>
+        ///   Looks up a localized string similar to H.
+        /// </summary>
+        public static string HeightChar {
+            get {
+                return ResourceManager.GetString("HeightChar", resourceCulture);
+            }
+        }
+        
        /// <summary>
        ///   Looks up a localized string similar to Image Resizer.
        /// </summary>
@ -214,7 +223,7 @@ namespace ImageResizer.Properties {
        }
        
        /// <summary>
-        ///   Looks up a localized string similar to Open settings.
+        ///   Looks up a localized string similar to Settings.
        /// </summary>
        public static string Open_settings {
            get {
@ -277,7 +286,7 @@ namespace ImageResizer.Properties {
        }
        
        /// <summary>
-        ///   Looks up a localized string similar to _Stop.
+        ///   Looks up a localized string similar to Stop.
        /// </summary>
        public static string Progress_Stop {
            get {
@ -554,5 +563,14 @@ namespace ImageResizer.Properties {
                return ResourceManager.GetString("Width", resourceCulture);
            }
        }
+        
+        /// <summary>
+        ///   Looks up a localized string similar to W.
+        /// </summary>
+        public static string WidthChar {
+            get {
+                return ResourceManager.GetString("WidthChar", resourceCulture);
+            }
+        }
    }
 }
--- a/src/modules/imageresizer/ui/Properties/Resources.resx
+++ b/src/modules/imageresizer/ui/Properties/Resources.resx
@ -185,7 +185,7 @@
    <value>Resizing your pictures...</value>
  </data>
  <data name="Progress_Stop" xml:space="preserve">
-    <value>_Stop</value>
+    <value>Stop</value>
  </data>
  <data name="Progress_TimeRemaining_HourMinute" xml:space="preserve">
    <value>About {0} hour, {1} minute remaining.</value>
@ -278,9 +278,17 @@
    <value>Width</value>
  </data>
  <data name="Open_settings" xml:space="preserve">
-    <value>Open settings</value>
+    <value>Settings</value>
  </data>
  <data name="Input_RemoveMetadata" xml:space="preserve">
    <value>Remove metadata that doesn't affect rendering</value>
  </data>
+  <data name="HeightChar" xml:space="preserve">
+    <value>H</value>
+    <comment>First character of 'Height'</comment>
+  </data>
+  <data name="WidthChar" xml:space="preserve">
+    <value>W</value>
+    <comment>First character of 'Width'</comment>
+  </data>
 </root>
--- a/src/modules/imageresizer/ui/Themes/Dark.xaml
+++ b/src/modules/imageresizer/ui/Themes/Dark.xaml
@ -1,18 +0,0 @@
-<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-                    xmlns:system="clr-namespace:System;assembly=System.Runtime">
-
-    <!--  Metadata  -->
-    <system:String x:Key="Theme.Name">Dark.Accent1</system:String>
-    <system:String x:Key="Theme.Origin">PowerToysImageResizer</system:String>
-    <system:String x:Key="Theme.DisplayName">Accent1 (Dark)</system:String>
-    <system:String x:Key="Theme.BaseColorScheme">Dark</system:String>
-    <system:String x:Key="Theme.ColorScheme">Accent1</system:String>
-    <Color x:Key="Theme.PrimaryAccentColor">Black</Color>
-
-    <SolidColorBrush x:Key="SecondaryBackgroundBrush" Color="#FF3a3a3a" />
-    <SolidColorBrush x:Key="PrimaryBackgroundBrush" Color="#FF333333" />
-    <SolidColorBrush x:Key="PrimaryForegroundBrush" Color="#FFFFFFFF" />
-    <SolidColorBrush x:Key="SecondaryForegroundBrush" Color="#FF999999" />
-    <SolidColorBrush x:Key="PrimaryBorderBrush" Color="Transparent"/>
-</ResourceDictionary>
--- a/src/modules/imageresizer/ui/Themes/HighContrast1.xaml
+++ b/src/modules/imageresizer/ui/Themes/HighContrast1.xaml
@ -1,18 +0,0 @@
-<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-                    xmlns:system="clr-namespace:System;assembly=System.Runtime">
-
-    <!--  Metadata  -->
-    <system:String x:Key="Theme.Name">HighContrast.Accent2</system:String>
-    <system:String x:Key="Theme.Origin">PowerToysImageResizer</system:String>
-    <system:String x:Key="Theme.DisplayName">Accent2 (HighContrast)</system:String>
-    <system:String x:Key="Theme.BaseColorScheme">HighContrast</system:String>
-    <system:String x:Key="Theme.ColorScheme">Accent2</system:String>
-    <Color x:Key="Theme.PrimaryAccentColor">White</Color>
-
-    <SolidColorBrush x:Key="SecondaryBackgroundBrush" Color="#FF3a3a3a" />
-    <SolidColorBrush x:Key="PrimaryBackgroundBrush" Color="#FF333333" />
-    <SolidColorBrush x:Key="PrimaryForegroundBrush" Color="#FFffff00" />
-    <SolidColorBrush x:Key="SecondaryForegroundBrush" Color="#FF00ff00" />
-    <SolidColorBrush x:Key="PrimaryBorderBrush" Color="#FFffff00"/>
-</ResourceDictionary>
--- a/src/modules/imageresizer/ui/Themes/HighContrast2.xaml
+++ b/src/modules/imageresizer/ui/Themes/HighContrast2.xaml
@ -1,19 +0,0 @@
-<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-                    xmlns:system="clr-namespace:System;assembly=System.Runtime">
-
-    <!--  Metadata  -->
-    <system:String x:Key="Theme.Name">HighContrast.Accent3</system:String>
-    <system:String x:Key="Theme.Origin">PowerToysImageResizer</system:String>
-    <system:String x:Key="Theme.DisplayName">Accent3 (HighContrast)</system:String>
-    <system:String x:Key="Theme.BaseColorScheme">HighContrast</system:String>
-    <system:String x:Key="Theme.ColorScheme">Accent3</system:String>
-    <Color x:Key="Theme.PrimaryAccentColor">White</Color>
-
-
-    <SolidColorBrush x:Key="SecondaryBackgroundBrush" Color="#FF3a3a3a" />
-    <SolidColorBrush x:Key="PrimaryBackgroundBrush" Color="#FF333333" />
-    <SolidColorBrush x:Key="PrimaryForegroundBrush" Color="#FF00ff00" />
-    <SolidColorBrush x:Key="SecondaryForegroundBrush" Color="#FFc0c0c0" />
-    <SolidColorBrush x:Key="PrimaryBorderBrush" Color="#FF00ff00"/>
-</ResourceDictionary>
--- a/src/modules/imageresizer/ui/Themes/HighContrastBlack.xaml
+++ b/src/modules/imageresizer/ui/Themes/HighContrastBlack.xaml
@ -1,18 +0,0 @@
-<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-                    xmlns:system="clr-namespace:System;assembly=System.Runtime">
-    
-    <!--  Metadata  -->
-    <system:String x:Key="Theme.Name">HighContrast.Accent4</system:String>
-    <system:String x:Key="Theme.Origin">PowerToysImageResizer</system:String>
-    <system:String x:Key="Theme.DisplayName">Accent4 (HighContrast)</system:String>
-    <system:String x:Key="Theme.BaseColorScheme">HighContrast</system:String>
-    <system:String x:Key="Theme.ColorScheme">Accent4</system:String>
-    <Color x:Key="Theme.PrimaryAccentColor">White</Color>
-
-    <SolidColorBrush x:Key="SecondaryBackgroundBrush" Color="#FF3a3a3a" />
-    <SolidColorBrush x:Key="PrimaryBackgroundBrush" Color="#FF333333" />
-    <SolidColorBrush x:Key="PrimaryForegroundBrush" Color="#FFffffff" />
-    <SolidColorBrush x:Key="SecondaryForegroundBrush" Color="#FF1aebff" />
-    <SolidColorBrush x:Key="PrimaryBorderBrush" Color="White"/>
-</ResourceDictionary>
--- a/src/modules/imageresizer/ui/Themes/HighContrastWhite.xaml
+++ b/src/modules/imageresizer/ui/Themes/HighContrastWhite.xaml
@ -1,18 +0,0 @@
-<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-                    xmlns:system="clr-namespace:System;assembly=System.Runtime">
-
-    <!--  Metadata  -->
-    <system:String x:Key="Theme.Name">HighContrast.Accent5</system:String>
-    <system:String x:Key="Theme.Origin">PowerToysImageResizer</system:String>
-    <system:String x:Key="Theme.DisplayName">Accent5 (HighContrast)</system:String>
-    <system:String x:Key="Theme.BaseColorScheme">HighContrast</system:String>
-    <system:String x:Key="Theme.ColorScheme">Accent5</system:String>
-    <Color x:Key="Theme.PrimaryAccentColor">White</Color>
-
-    <SolidColorBrush x:Key="SecondaryBackgroundBrush" Color="#FFf3f3f3" />
-    <SolidColorBrush x:Key="PrimaryBackgroundBrush" Color="#FFffffff" />
-    <SolidColorBrush x:Key="PrimaryForegroundBrush" Color="#FF000000" />
-    <SolidColorBrush x:Key="SecondaryForegroundBrush" Color="#FF676666" />
-    <SolidColorBrush x:Key="PrimaryBorderBrush" Color="Black"/>
-</ResourceDictionary>
--- a/src/modules/imageresizer/ui/Themes/Light.xaml
+++ b/src/modules/imageresizer/ui/Themes/Light.xaml
@ -1,18 +0,0 @@
-<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-                    xmlns:system="clr-namespace:System;assembly=System.Runtime">
-
-    <!--  Metadata  -->
-    <system:String x:Key="Theme.Name">Light.Accent1</system:String>
-    <system:String x:Key="Theme.Origin">PowerToysImageResizer</system:String>
-    <system:String x:Key="Theme.DisplayName">Accent1 (Light)</system:String>
-    <system:String x:Key="Theme.BaseColorScheme">Light</system:String>
-    <system:String x:Key="Theme.ColorScheme">Accent1</system:String>
-    <Color x:Key="Theme.PrimaryAccentColor">White</Color>
-
-    <SolidColorBrush x:Key="SecondaryBackgroundBrush" Color="#FFf3f3f3" />
-    <SolidColorBrush x:Key="PrimaryBackgroundBrush" Color="#FFffffff" />
-    <SolidColorBrush x:Key="PrimaryForegroundBrush" Color="#FF000000" />
-    <SolidColorBrush x:Key="SecondaryForegroundBrush" Color="#FF676666" />
-    <SolidColorBrush x:Key="PrimaryBorderBrush" Color="Transparent"/>
-</ResourceDictionary>
--- a/src/modules/imageresizer/ui/Views/InputPage.xaml
+++ b/src/modules/imageresizer/ui/Views/InputPage.xaml
@ -1,209 +1,295 @@
-<UserControl x:Class="ImageResizer.Views.InputPage"
-             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-             xmlns:local="clr-namespace:ImageResizer.Views"
-             xmlns:m="clr-namespace:ImageResizer.Models"
-             xmlns:p="clr-namespace:ImageResizer.Properties"
-             xmlns:ui="http://schemas.modernwpf.com/2019"
-             MinWidth="350">
-
-    <Grid Background="{DynamicResource PrimaryBackgroundBrush}">
+<UserControl
+    x:Class="ImageResizer.Views.InputPage"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:m="clr-namespace:ImageResizer.Models"
+    xmlns:p="clr-namespace:ImageResizer.Properties"
+    xmlns:ui="http://schemas.lepo.co/wpfui/2022/xaml">

+    <Grid>
        <Grid.RowDefinitions>
-            <RowDefinition Height="Auto"/>
-            <RowDefinition Height="Auto" MinHeight="84"/>
-            <RowDefinition Height="Auto"/>
-            <RowDefinition Height="Auto"/>
+            <RowDefinition Height="Auto" />
+            <RowDefinition Height="Auto" />
+            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

-        <ComboBox x:Name="SizeComboBox"
-                  ItemsSource="{Binding Settings.AllSizes}"
-                  HorizontalAlignment="Stretch"
-                  Margin="12"
-                  SelectedIndex="{Binding Settings.SelectedSizeIndex}"
-                  ui:ControlHelper.Header="{x:Static p:Resources.Input_Content}">
+        <ComboBox
+            x:Name="SizeComboBox"
+            Grid.Row="1"
+            Height="64"
+            Margin="16,16,16,24"
+            HorizontalAlignment="Stretch"
+            VerticalAlignment="Stretch"
+            VerticalContentAlignment="Stretch"
+            ItemsSource="{Binding Settings.AllSizes}"
+            SelectedIndex="{Binding Settings.SelectedSizeIndex}">
            <ComboBox.Resources>
                <DataTemplate DataType="{x:Type m:ResizeSize}">
-                    <Grid Margin="0,6,0,0" AutomationProperties.Name="{Binding Name}">
+                    <Grid Margin="2,0,0,0" VerticalAlignment="Center" AutomationProperties.Name="{Binding Name}">
                        <Grid.RowDefinitions>
-                            <RowDefinition Height="20" />
-                            <RowDefinition Height="24" />
+                            <RowDefinition Height="Auto" />
+                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>
-                        <TextBlock Text="{Binding Name}"
-                                   FontSize="14"
-                                   FontWeight="SemiBold"/>
-                        <StackPanel Orientation="Horizontal"
-                                    Grid.Row="1"
-                                    VerticalAlignment="Top">
-                            <TextBlock Text="{Binding Fit, Converter={StaticResource EnumValueConverter}, ConverterParameter=ThirdPersonSingular}"
-                                       Style="{StaticResource CaptionTextBlockStyle}"
-                                       Foreground="{DynamicResource TextFillColorSecondaryBrush}"/>
-                            <TextBlock Text="{Binding Width, Converter={StaticResource AutoDoubleConverter}, ConverterParameter=Auto}"
-                                       Margin="4,0,0,0"
-                                       Style="{StaticResource CaptionTextBlockStyle}"
-                                       Foreground="{DynamicResource TextFillColorSecondaryBrush}"/>
-                            <TextBlock Text="×"
-                                       Margin="4,0,0,0"
-                                       Style="{StaticResource CaptionTextBlockStyle}"
-                                       Foreground="{DynamicResource TextFillColorSecondaryBrush}"
-                                       Visibility="{Binding ShowHeight, Converter={StaticResource BoolValueConverter}}"/>
-                            <TextBlock Text="{Binding Height, Converter={StaticResource AutoDoubleConverter}, ConverterParameter=Auto}"
-                                       Margin="4,0,0,0"
-                                       Style="{StaticResource CaptionTextBlockStyle}"
-                                       Foreground="{DynamicResource TextFillColorSecondaryBrush}"
-                                       Visibility="{Binding ShowHeight, Converter={StaticResource BoolValueConverter}}"/>
-                            <TextBlock Text="{Binding Unit, Converter={StaticResource EnumValueConverter}, ConverterParameter=ToLower}"
-                                       Margin="4,0,0,0"
-                                       Style="{StaticResource CaptionTextBlockStyle}"
-                                       Foreground="{DynamicResource TextFillColorSecondaryBrush}"/>
+                        <TextBlock FontWeight="SemiBold" Text="{Binding Name}" />
+                        <StackPanel
+                            Grid.Row="1"
+                            VerticalAlignment="Top"
+                            Orientation="Horizontal">
+                            <TextBlock
+                                FontSize="12"
+                                Foreground="{DynamicResource TextFillColorSecondaryBrush}"
+                                Text="{Binding Fit, Converter={StaticResource EnumValueConverter}, ConverterParameter=ThirdPersonSingular}" />
+                            <TextBlock
+                                Margin="4,0,0,0"
+                                FontSize="12"
+                                FontWeight="SemiBold"
+                                Text="{Binding Width, Converter={StaticResource AutoDoubleConverter}, ConverterParameter=Auto}" />
+                            <TextBlock
+                                Margin="4,0,0,0"
+                                FontSize="12"
+                                Foreground="{DynamicResource TextFillColorSecondaryBrush}"
+                                Text="×"
+                                Visibility="{Binding ShowHeight, Converter={StaticResource BoolValueConverter}}" />
+                            <TextBlock
+                                Margin="4,0,0,0"
+                                FontSize="12"
+                                FontWeight="SemiBold"
+                                Text="{Binding Height, Converter={StaticResource AutoDoubleConverter}, ConverterParameter=Auto}"
+                                Visibility="{Binding ShowHeight, Converter={StaticResource BoolValueConverter}}" />
+                            <TextBlock
+                                Margin="4,0,0,0"
+                                FontSize="12"
+                                Foreground="{DynamicResource TextFillColorSecondaryBrush}"
+                                Text="{Binding Unit, Converter={StaticResource EnumValueConverter}, ConverterParameter=ToLower}" />
                        </StackPanel>
                    </Grid>
                </DataTemplate>

                <DataTemplate DataType="{x:Type m:CustomSize}">
-                    <Grid Height="50"
-                          AutomationProperties.Name="{Binding Name}">
-
-                        <TextBlock Text="{Binding Name}"
-                                   Margin="0,0,0,0"
-                                   VerticalAlignment="Center"
-                                   FontSize="14"
-                                   FontWeight="SemiBold"
-                                   Foreground="{DynamicResource PrimaryForegroundBrush}" />
+                    <Grid VerticalAlignment="Center" AutomationProperties.Name="{Binding Name}">
+                        <TextBlock
+                            FontWeight="SemiBold"
+                            Text="{Binding Name}" />
                    </Grid>
                </DataTemplate>
            </ComboBox.Resources>
        </ComboBox>

-        <StackPanel Grid.Row="1" Orientation="Horizontal" Margin="12,0,12,12" Visibility="{Binding ElementName=SizeComboBox, Path=SelectedValue, Converter={StaticResource SizeTypeToVisibilityConverter}}">
-            <ComboBox ItemsSource="{Binding Source={StaticResource ResizeFitValues}}"
-                      AutomationProperties.Name="{x:Static p:Resources.Resize_Type}"
-                      Height="56"
-                      MinWidth="120"
-                      ui:ControlHelper.Header="{x:Static p:Resources.Resize_Type}"
-                      Text="{Binding ElementName=SizeComboBox, Path= SelectedValue.Fit, Mode=TwoWay}"/>
+        <Grid Grid.Row="2">
+            <Grid.RowDefinitions>
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="*" />
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="Auto" />
+            </Grid.RowDefinitions>
+            <Border
+                Grid.RowSpan="5"
+                Background="{DynamicResource LayerFillColorDefaultBrush}"
+                BorderBrush="{DynamicResource CardStrokeColorDefaultBrush}"
+                BorderThickness="0,1,0,0" />

-            <ui:NumberBox SpinButtonPlacementMode="Compact"
-                          Minimum="0"
-                          Width="102"
-                          Name="WidthNumberBox"
-                          KeyDown="Button_KeyDown"
-                          AutomationProperties.Name="{x:Static p:Resources.Width}"                          
-                          Margin="8,0,0,0">
-                <ui:ControlHelper.Header>
-                    <TextBlock Text="{x:Static p:Resources.Width}" Margin="0,0,0,-1" />
-                </ui:ControlHelper.Header>
-                <ui:NumberBox.Value>
-                    <Binding ElementName="SizeComboBox" Path="SelectedValue.Width" Mode="TwoWay" UpdateSourceTrigger="PropertyChanged"/>
-                </ui:NumberBox.Value>
-            </ui:NumberBox>
-            <TextBlock VerticalAlignment="Center"
-                       Text="&#xE947;"
-                       FontFamily="{StaticResource SymbolThemeFontFamily}"
-                       Width="24"
-                       Foreground="{DynamicResource SecondaryForegroundBrush}"
-                       Name="Times_Symbol"
-                       AutomationProperties.Name="{x:Static p:Resources.Times_Symbol}"
-                       TextAlignment="Center"
-                       Margin="0,8,0,0"
-                       Visibility="{Binding ElementName=SizeComboBox, Path= SelectedValue.ShowHeight, Converter={StaticResource BoolValueConverter}}"/>
-
-            <ui:NumberBox DataContext="{Binding ElementName=SizeComboBox, Path=SelectedItem}" 
-                          SpinButtonPlacementMode="Compact"
-                          Minimum="0"
-                          Width="102"
-                          Name="HeightNumberBox"
-                          KeyDown="Button_KeyDown"
-                          AutomationProperties.Name="{x:Static p:Resources.Height}"
-                          Visibility="{Binding ElementName=SizeComboBox, Path= SelectedValue.ShowHeight, Converter={StaticResource BoolValueConverter}}">
-                <ui:ControlHelper.Header>
-                    <TextBlock Text="{x:Static p:Resources.Height}" Margin="0,0,0,-1" />
-                </ui:ControlHelper.Header>
-                <ui:NumberBox.Value>
-                    <Binding ElementName="SizeComboBox" Path="SelectedValue.Height" Mode="TwoWay" UpdateSourceTrigger="PropertyChanged"/>
-                </ui:NumberBox.Value>
-            </ui:NumberBox>
-            <ComboBox Margin="8,0,0,0"
-                      Height="56"
-                      ItemsSource="{Binding Source={StaticResource ResizeUnitValues}}"
-                      AutomationProperties.Name="{x:Static p:Resources.Unit}"
-                      ui:ControlHelper.Header="{x:Static p:Resources.Unit}"
-                      Text="{Binding ElementName=SizeComboBox, Path= SelectedValue.Unit, Mode=TwoWay}"/>
-        </StackPanel>
+            <Grid
+                Height="86"
+                Margin="18,16,16,16"
+                Visibility="{Binding ElementName=SizeComboBox, Path=SelectedValue, Converter={StaticResource SizeTypeToVisibilityConverter}}">
+                <Grid.ColumnDefinitions>
+                    <ColumnDefinition Width="20" />
+                    <ColumnDefinition Width="*" />
+                    <ColumnDefinition Width="24" />
+                    <ColumnDefinition Width="20" />
+                    <ColumnDefinition Width="*" />
+                </Grid.ColumnDefinitions>
+                <Grid.RowDefinitions>
+                    <RowDefinition Height="Auto" />
+                    <RowDefinition Height="8" />
+                    <RowDefinition Height="Auto" />
+                </Grid.RowDefinitions>


-        <StackPanel Grid.Row="2" Orientation="Vertical">
+                <TextBlock
+                    HorizontalAlignment="Left"
+                    VerticalAlignment="Center"
+                    AutomationProperties.Name="{x:Static p:Resources.Width}"
+                    FontSize="12"
+                    FontWeight="SemiBold"
+                    Foreground="{DynamicResource TextFillColorSecondaryBrush}"
+                    Text="{x:Static p:Resources.WidthChar}"
+                    ToolTipService.ToolTip="{x:Static p:Resources.Width}" />
+                <ui:NumberBox
+                    Name="WidthNumberBox"
+                    Grid.Column="1"
+                    HorizontalAlignment="Stretch"
+                    AutomationProperties.Name="{x:Static p:Resources.Width}"
+                    KeyDown="Button_KeyDown"
+                    Minimum="0"
+                    SpinButtonPlacementMode="Inline">
+                    <ui:NumberBox.Value>
+                        <Binding
+                            ElementName="SizeComboBox"
+                            Mode="TwoWay"
+                            Path="SelectedValue.Width"
+                            UpdateSourceTrigger="PropertyChanged" />
+                    </ui:NumberBox.Value>
+                </ui:NumberBox>
+                <TextBlock
+                    Grid.Column="3"
+                    HorizontalAlignment="Left"
+                    VerticalAlignment="Center"
+                    AutomationProperties.Name="{x:Static p:Resources.Height}"
+                    FontSize="12"
+                    FontWeight="SemiBold"
+                    Foreground="{DynamicResource TextFillColorSecondaryBrush}"
+                    Text="{x:Static p:Resources.HeightChar}"
+                    ToolTipService.ToolTip="{x:Static p:Resources.Height}"
+                    Visibility="{Binding ElementName=SizeComboBox, Path=SelectedValue.ShowHeight, Converter={StaticResource BoolValueConverter}}" />
+                <ui:NumberBox
+                    Name="HeightNumberBox"
+                    Grid.Column="4"
+                    HorizontalAlignment="Stretch"
+                    AutomationProperties.Name="{x:Static p:Resources.Height}"
+                    DataContext="{Binding ElementName=SizeComboBox, Path=SelectedItem}"
+                    KeyDown="Button_KeyDown"
+                    Minimum="0"
+                    SpinButtonPlacementMode="Inline"
+                    Visibility="{Binding ElementName=SizeComboBox, Path=SelectedValue.ShowHeight, Converter={StaticResource BoolValueConverter}}">

-        <CheckBox Margin="12,4,12,0"
-                  Content="{x:Static p:Resources.Input_ShrinkOnly}"
-                  IsChecked="{Binding Settings.ShrinkOnly}"/>
-            
-        <CheckBox Margin="12,4,12,0"
-                  Content="{x:Static p:Resources.Input_IgnoreOrientation}"
-                  IsChecked="{Binding Settings.IgnoreOrientation}"/>
-        <!-- TODO: This option doesn't make much sense when resizing into a directory. We should swap it for an option
-                   to overwrite any files in the directory instead (issue #88) -->
-        <CheckBox Margin="12,4,12,0"
-                  Content="{x:Static p:Resources.Input_Replace}"
-                  IsChecked="{Binding Settings.Replace}"/>
+                    <ui:NumberBox.Value>
+                        <Binding
+                            ElementName="SizeComboBox"
+                            Mode="TwoWay"
+                            Path="SelectedValue.Height"
+                            UpdateSourceTrigger="PropertyChanged" />
+                    </ui:NumberBox.Value>
+                </ui:NumberBox>

-        <CheckBox Margin="12,4,12,0"
-                  Content="{x:Static p:Resources.Input_RemoveMetadata}"
-                  IsChecked="{Binding Settings.RemoveMetadata}"/>
+                <ui:SymbolIcon
+                    Grid.Row="2"
+                    Margin="-2,0,0,0"
+                    HorizontalAlignment="Left"
+                    VerticalAlignment="Center"
+                    Foreground="{DynamicResource TextFillColorSecondaryBrush}"
+                    Symbol="ArrowMaximize16"
+                    ToolTipService.ToolTip="{x:Static p:Resources.Resize_Type}" />

-            <TextBlock Grid.Column="0"
-                           FontWeight="Bold"
-                           Text="{x:Static p:Resources.Input_GifWarning}"
-                           TextWrapping="Wrap"
-                       Margin="12,12,12,0"
-                           HorizontalAlignment="Right"
-                           TextAlignment="Left"
-                           Foreground="{ui:ThemeResource SystemControlErrorTextForegroundBrush}"
-                           Visibility="{Binding TryingToResizeGifFiles, Converter={StaticResource BoolValueConverter}}"
-                           />
-        </StackPanel>
-    
-        <Border Margin="0,12,0,0"
-                Background="{DynamicResource SecondaryBackgroundBrush}"
-                BorderBrush="{DynamicResource PrimaryBorderBrush}"
-                BorderThickness="0,1,0,0"
-                Padding="12"
-                Grid.Row="3">
-            <Grid>
+                <ComboBox
+                    Grid.Row="2"
+                    Grid.Column="1"
+                    HorizontalAlignment="Stretch"
+                    AutomationProperties.Name="{x:Static p:Resources.Resize_Type}"
+                    ItemsSource="{Binding Source={StaticResource ResizeFitValues}}"
+                    Text="{Binding ElementName=SizeComboBox, Path=SelectedValue.Fit, Mode=TwoWay}" />
+
+                <ui:SymbolIcon
+                    Grid.Row="2"
+                    Grid.Column="3"
+                    Margin="-2,0,0,0"
+                    HorizontalAlignment="Left"
+                    VerticalAlignment="Center"
+                    FontSize="18"
+                    Foreground="{DynamicResource TextFillColorSecondaryBrush}"
+                    Symbol="Ruler16"
+                    ToolTipService.ToolTip="{x:Static p:Resources.Unit}" />
+
+                <ComboBox
+                    Grid.Row="2"
+                    Grid.Column="4"
+                    AutomationProperties.Name="{x:Static p:Resources.Unit}"
+                    ItemsSource="{Binding Source={StaticResource ResizeUnitValues}}"
+                    Text="{Binding ElementName=SizeComboBox, Path=SelectedValue.Unit, Mode=TwoWay}" />
+
+            </Grid>
+
+            <StackPanel
+                Grid.Row="1"
+                VerticalAlignment="Top"
+                Orientation="Vertical">
+
+                <CheckBox
+                    Margin="16,12,16,0"
+                    Content="{x:Static p:Resources.Input_ShrinkOnly}"
+                    IsChecked="{Binding Settings.ShrinkOnly}" />
+
+                <CheckBox
+                    Margin="16,2,16,0"
+                    Content="{x:Static p:Resources.Input_IgnoreOrientation}"
+                    IsChecked="{Binding Settings.IgnoreOrientation}" />
+                <!--
+                    TODO: This option doesn't make much sense when resizing into a directory. We should swap it for an option
+                    to overwrite any files in the directory instead (issue #88)
+                -->
+                <CheckBox
+                    Margin="16,2,16,0"
+                    Content="{x:Static p:Resources.Input_Replace}"
+                    IsChecked="{Binding Settings.Replace}" />
+
+                <CheckBox
+                    Margin="16,2,16,0"
+                    Content="{x:Static p:Resources.Input_RemoveMetadata}"
+                    IsChecked="{Binding Settings.RemoveMetadata}" />
+            </StackPanel>
+
+            <Border
+                Grid.Row="2"
+                Height="1"
+                Margin="0,12,0,8"
+                HorizontalAlignment="Stretch"
+                VerticalAlignment="Top"
+                Background="{DynamicResource DividerStrokeColorDefaultBrush}" />
+            <ui:InfoBar
+                Grid.Row="3"
+                Margin="16,0,16,0"
+                Padding="12,8,8,8"
+                IsClosable="False"
+                IsOpen="{Binding TryingToResizeGifFiles}"
+                Message="{x:Static p:Resources.Input_GifWarning}"
+                Severity="Warning" />
+            <Grid Grid.Row="4" Margin="16,8,16,16">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition />
-                    <ColumnDefinition Width="Auto"/>
-                    <ColumnDefinition Width="Auto"/>
+                    <ColumnDefinition Width="Auto" />
+                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>
-                <Button Width="36"
-                    Command="{Binding OpenSettingsCommand}"
+
+                <ui:Button
+                    Width="36"
                    Height="36"
-                    Margin="-8,0,0,0"
-                    Content="&#xE713;"
-                    Background="Transparent"
-                    FontFamily="{StaticResource SymbolThemeFontFamily}"
-                        FontSize="16"
+                    Margin="-6,0,0,0"
+                    Padding="0"
                    HorizontalAlignment="Left"
-                    ToolTipService.ToolTip="{x:Static p:Resources.Open_settings}"
-                    AutomationProperties.Name="{x:Static p:Resources.Open_settings}" />
+                    AutomationProperties.Name="{x:Static p:Resources.Open_settings}"
+                    Background="Transparent"
+                    BorderBrush="Transparent"
+                    Command="{Binding OpenSettingsCommand}"
+                    ToolTipService.ToolTip="{x:Static p:Resources.Open_settings}">
+                    <ui:Button.Content>
+                        <ui:SymbolIcon FontSize="18" Symbol="Settings20" />
+                    </ui:Button.Content>
+                </ui:Button>
+                <ui:Button
+                    Grid.Column="1"
+                    MinWidth="76"
+                    Margin="8,0,0,0"
+                    Appearance="Primary"
+                    AutomationProperties.Name="{x:Static p:Resources.Resize_Tooltip}"
+                    Command="{Binding ResizeCommand}"
+                    IsDefault="True">
+                    <StackPanel Orientation="Horizontal">
+                        <ui:SymbolIcon FontSize="18" Symbol="ResizeImage20" />
+                        <TextBlock Margin="8,0,0,0" Text="{x:Static p:Resources.Input_Resize}" />
+                    </StackPanel>
+                </ui:Button>

-                <Button Grid.Column="1"
-                        Style="{StaticResource AccentButtonStyle}"
-                        MinWidth="76"
-                        Margin="12,0,0,0"
-                        Command="{Binding ResizeCommand}"
-                        AutomationProperties.Name="{x:Static p:Resources.Resize_Tooltip}"
-                        Content="{x:Static p:Resources.Input_Resize}"
-                        IsDefault="True"/>
-
-                <Button Grid.Column="2"
-                        Style="{StaticResource DefaultButtonStyle}"
-                        MinWidth="76"
-                        Margin="12,0,0,0"
-                        Command="{Binding CancelCommand}"
-                        Content="{x:Static p:Resources.Cancel}"
-                        IsCancel="True"/>
+                <ui:Button
+                    Grid.Column="2"
+                    MinWidth="76"
+                    Margin="8,0,0,0"
+                    Command="{Binding CancelCommand}"
+                    Content="{x:Static p:Resources.Cancel}"
+                    IsCancel="True" />
            </Grid>
-        </Border>
+
+
+        </Grid>
    </Grid>
 </UserControl>
--- a/src/modules/imageresizer/ui/Views/InputPage.xaml.cs
+++ b/src/modules/imageresizer/ui/Views/InputPage.xaml.cs
@ -5,8 +5,9 @@
 using System.Windows.Controls;
 using System.Windows.Input;
 using ImageResizer.ViewModels;
-using ModernWpf.Controls;
+using Wpf.Ui.Controls;
 using static ImageResizer.ViewModels.InputViewModel;
+using Numberbox = Wpf.Ui.Controls.NumberBox;

 namespace ImageResizer.Views
 {
@ -31,7 +32,7 @@ namespace ImageResizer.Views
                var viewModel = (InputViewModel)this.DataContext;
                double number;
                KeyPressParams keyParams;
-                if (double.TryParse(((TextBox)e.OriginalSource).Text, out number))
+                if (double.TryParse(((System.Windows.Controls.TextBox)e.OriginalSource).Text, out number))
                {
                    // Determine which NumberBox triggered the event based on its name
                    switch (numberBox.Name)
--- a/src/modules/imageresizer/ui/Views/MainWindow.xaml
+++ b/src/modules/imageresizer/ui/Views/MainWindow.xaml
@ -1,44 +1,64 @@
-<Window x:Class="ImageResizer.Views.MainWindow"
-        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        xmlns:ui="http://schemas.modernwpf.com/2019"
-        xmlns:behaviors="http://schemas.microsoft.com/xaml/behaviors"
-        xmlns:local="clr-namespace:ImageResizer.Views"
-        xmlns:p="clr-namespace:ImageResizer.Properties"
-        xmlns:vm="clr-namespace:ImageResizer.ViewModels"
-        Content="{Binding CurrentPage}"
-        Icon="/PowerToys.ImageResizer;component/Resources/ImageResizer.ico"
-        Name="_this"
-        ResizeMode="NoResize"
-        SizeToContent="WidthAndHeight"
-        MinWidth="485"
-        Title="{x:Static p:Resources.ImageResizer}"
-        WindowStartupLocation="CenterScreen"
-        ui:WindowHelper.UseModernWindowStyle="True"
-        ui:TitleBar.IsIconVisible="True"
-        ui:TitleBar.Background="{DynamicResource PrimaryBackgroundBrush}"
-        AutomationProperties.Name="{x:Static p:Resources.ImageResizer}">
+<ui:FluentWindow
+    x:Class="ImageResizer.Views.MainWindow"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:behaviors="http://schemas.microsoft.com/xaml/behaviors"
+    xmlns:local="clr-namespace:ImageResizer.Views"
+    xmlns:p="clr-namespace:ImageResizer.Properties"
+    xmlns:ui="http://schemas.lepo.co/wpfui/2022/xaml"
+    xmlns:vm="clr-namespace:ImageResizer.ViewModels"
+    Name="_this"
+    Width="360"
+    Height="506"
+    ui:Design.Background="{DynamicResource ApplicationBackgroundBrush}"
+    ui:Design.Foreground="{DynamicResource TextFillColorPrimaryBrush}"
+    AutomationProperties.Name="{x:Static p:Resources.ImageResizer}"
+    ExtendsContentIntoTitleBar="True"
+    Icon="/PowerToys.ImageResizer;component/Resources/ImageResizer.ico"
+    ResizeMode="NoResize"
+    WindowBackdropType="Mica"
+    WindowCornerPreference="Default"
+    WindowStartupLocation="CenterScreen">

    <Window.Resources>
        <DataTemplate DataType="{x:Type vm:InputViewModel}">
-            <local:InputPage/>
+            <local:InputPage />
        </DataTemplate>
        <DataTemplate DataType="{x:Type vm:ProgressViewModel}">
-            <local:ProgressPage/>
+            <local:ProgressPage />
        </DataTemplate>
        <DataTemplate DataType="{x:Type vm:ResultsViewModel}">
-            <local:ResultsPage/>
+            <local:ResultsPage />
        </DataTemplate>
    </Window.Resources>

    <Window.TaskbarItemInfo>
-        <TaskbarItemInfo ProgressState="Normal" ProgressValue="{Binding Progress}"/>
+        <TaskbarItemInfo ProgressState="Normal" ProgressValue="{Binding Progress}" />
    </Window.TaskbarItemInfo>

    <behaviors:Interaction.Triggers>
        <behaviors:EventTrigger EventName="Loaded">
-            <behaviors:InvokeCommandAction Command="{Binding LoadCommand}" CommandParameter="{Binding ElementName=_this}"/>
+            <behaviors:InvokeCommandAction Command="{Binding LoadCommand}" CommandParameter="{Binding ElementName=_this}" />
        </behaviors:EventTrigger>
    </behaviors:Interaction.Triggers>

-</Window>
+    <Grid>
+        <Grid.RowDefinitions>
+            <RowDefinition Height="Auto" />
+            <RowDefinition Height="*" />
+        </Grid.RowDefinitions>
+        <ui:TitleBar
+            x:Name="TitleBar"
+            Title="{x:Static p:Resources.ImageResizer}"
+            Grid.Row="0"
+            Height="32"
+            Padding="16,0,16,0"
+            ShowMaximize="False"
+            ShowMinimize="False">
+            <ui:TitleBar.Icon>
+                <ui:ImageIcon Source="/PowerToys.ImageResizer;component/Resources/ImageResizer.ico" />
+            </ui:TitleBar.Icon>
+        </ui:TitleBar>
+        <ContentPresenter Grid.Row="1" Content="{Binding CurrentPage}" />
+    </Grid>
+</ui:FluentWindow>
--- a/src/modules/imageresizer/ui/Views/MainWindow.xaml.cs
+++ b/src/modules/imageresizer/ui/Views/MainWindow.xaml.cs
@ -5,18 +5,19 @@
 using System;
 using System.Collections.Generic;
 using System.Linq;
-using System.Windows;
 using ImageResizer.ViewModels;
 using Microsoft.Win32;
+using Wpf.Ui.Controls;
 using AppResources = ImageResizer.Properties.Resources;

 namespace ImageResizer.Views
 {
-    public partial class MainWindow : Window, IMainView
+    public partial class MainWindow : FluentWindow, IMainView
    {
        public MainWindow(MainViewModel viewModel)
        {
            DataContext = viewModel;
+            Wpf.Ui.Appearance.Watcher.Watch(this);
            InitializeComponent();
        }

--- a/src/modules/imageresizer/ui/Views/ProgressPage.xaml
+++ b/src/modules/imageresizer/ui/Views/ProgressPage.xaml
@ -1,45 +1,45 @@
-<UserControl x:Class="ImageResizer.Views.ProgressPage"
-             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-             xmlns:behaviors="http://schemas.microsoft.com/xaml/behaviors"
-             xmlns:local="clr-namespace:ImageResizer.Views"
-             xmlns:p="clr-namespace:ImageResizer.Properties"
-             Background="{DynamicResource PrimaryBackgroundBrush}"
-             MinWidth="350">
+<UserControl
+    x:Class="ImageResizer.Views.ProgressPage"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:behaviors="http://schemas.microsoft.com/xaml/behaviors"
+    xmlns:local="clr-namespace:ImageResizer.Views"
+    xmlns:p="clr-namespace:ImageResizer.Properties">

    <UserControl.Resources>
-        <local:TimeRemainingConverter x:Key="TimeRemainingConverter"/>
+        <local:TimeRemainingConverter x:Key="TimeRemainingConverter" />
    </UserControl.Resources>

    <behaviors:Interaction.Triggers>
        <behaviors:EventTrigger EventName="Loaded">
-            <behaviors:InvokeCommandAction Command="{Binding StartCommand}"/>
+            <behaviors:InvokeCommandAction Command="{Binding StartCommand}" />
        </behaviors:EventTrigger>
    </behaviors:Interaction.Triggers>

    <StackPanel>
-        <TextBlock Margin="12,12,12,0"
-                   FontSize="16"
-                   Foreground="{DynamicResource PrimaryForegroundBrush}"
-                   Text="{x:Static p:Resources.Progress_MainInstruction}"/>
-        <TextBlock Margin="12,12,12,0"
-                   Foreground="{DynamicResource PrimaryForegroundBrush}"
-                   Text="{Binding TimeRemaining,Converter={StaticResource TimeRemainingConverter}}"/>
-        <ProgressBar Height="16"
-                     Margin="12,12,12,0"
-                     Value="{Binding Progress}"
-                     Maximum="1"/>
-        <Border Margin="0,12,0,0"
-                Background="{DynamicResource SecondaryBackgroundBrush}"
-                BorderBrush="{DynamicResource PrimaryBorderBrush}"
-                BorderThickness="0,1,0,0"
-                Padding="12,12">
+        <TextBlock
+            Margin="12,12,12,0"
+            FontSize="16"
+            Text="{x:Static p:Resources.Progress_MainInstruction}" />
+        <TextBlock
+            Margin="12,12,12,0"
+            Foreground="{DynamicResource TextFillColorSecondaryBrush}"
+            Text="{Binding TimeRemaining, Converter={StaticResource TimeRemainingConverter}}" />
+        <ProgressBar
+            Height="16"
+            Margin="12,12,12,0"
+            Maximum="1"
+            Value="{Binding Progress}" />
+        <Border
+            Margin="0,12,0,0"
+            Padding="12,12"
+            BorderThickness="0,1,0,0">
            <StackPanel HorizontalAlignment="Right" Orientation="Horizontal">
-                <Button MinWidth="76"
-                        Style="{StaticResource AccentButtonStyle}"
-                        Command="{Binding StopCommand}"
-                        Content="{x:Static p:Resources.Progress_Stop}"
-                        IsCancel="True"/>
+                <Button
+                    MinWidth="76"
+                    Command="{Binding StopCommand}"
+                    Content="{x:Static p:Resources.Progress_Stop}"
+                    IsCancel="True" />
            </StackPanel>
        </Border>
    </StackPanel>
--- a/src/modules/imageresizer/ui/Views/ResultsPage.xaml
+++ b/src/modules/imageresizer/ui/Views/ResultsPage.xaml
@ -1,43 +1,46 @@
-<UserControl x:Class="ImageResizer.Views.ResultsPage"
-             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-             xmlns:p="clr-namespace:ImageResizer.Properties"
-             MinWidth="350"
-             Background="{DynamicResource PrimaryBackgroundBrush}">
+<UserControl
+    x:Class="ImageResizer.Views.ResultsPage"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:p="clr-namespace:ImageResizer.Properties">

    <StackPanel>
-        <TextBlock Margin="12,12,12,0"
-                   FontSize="16"
-                   Foreground="{DynamicResource PrimaryForegroundBrush}"
-                   Text="{x:Static p:Resources.Results_MainInstruction}"/>
-        <ScrollViewer MaxWidth="363"
-                      MaxHeight="350"
-                      HorizontalAlignment="Stretch"
-                      VerticalScrollBarVisibility="Auto">
+        <TextBlock
+            Margin="12,12,12,0"
+            FontSize="16"
+            Text="{x:Static p:Resources.Results_MainInstruction}" />
+        <ScrollViewer
+            MaxWidth="363"
+            MaxHeight="350"
+            HorizontalAlignment="Stretch"
+            VerticalScrollBarVisibility="Auto">
            <ItemsControl Margin="12,4,12,0" ItemsSource="{Binding Errors}">
                <ItemsControl.ItemTemplate>
                    <DataTemplate DataType="ResizeError">
                        <StackPanel>
-                            <TextBlock Margin="0,8,0,0"
-                                       FontWeight="Bold"
-                                       Text="{Binding File}"/>
-                            <TextBlock Text="{Binding Error}" TextWrapping="Wrap"/>
+                            <TextBlock
+                                Margin="0,8,0,0"
+                                FontWeight="Bold"
+                                Text="{Binding File}" />
+                            <TextBlock Text="{Binding Error}" TextWrapping="Wrap" />
                        </StackPanel>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </ScrollViewer>
-        <Border Margin="0,12,0,0"
-                Background="{DynamicResource SecondaryBackgroundBrush}"
-                BorderBrush="{DynamicResource PrimaryBorderBrush}"
-                BorderThickness="0,1,0,0"
-                Padding="12,12">
+        <Border
+            Margin="0,12,0,0"
+            Padding="12,12"
+            Background="{DynamicResource LayerFillColorDefaultBrush}"
+            BorderBrush="{DynamicResource CardStrokeColorDefaultBrush}"
+            BorderThickness="0,1,0,0">
            <StackPanel HorizontalAlignment="Right" Orientation="Horizontal">
-                <Button MinWidth="76"
-                        Command="{Binding CloseCommand}"
-                        Content="{x:Static p:Resources.Results_Close}"
-                        IsCancel="True"
-                        IsDefault="True"/>
+                <Button
+                    MinWidth="76"
+                    Command="{Binding CloseCommand}"
+                    Content="{x:Static p:Resources.Results_Close}"
+                    IsCancel="True"
+                    IsDefault="True" />
            </StackPanel>
        </Border>
    </StackPanel>