From 727324ca9a8ba503fbc6fd7b3262176b69e23210 Mon Sep 17 00:00:00 2001
From: Stone_Red <56473591+Stone-Red-Code@users.noreply.github.com>
Date: Sun, 28 Dec 2025 23:20:50 +0100
Subject: [PATCH] Overhaul theme creation and editing UI

---
 src/DesktopMagic/App.xaml.cs                  |   4 +
 .../DataContexts/MainWindowDataContext.cs     |   1 +
 src/DesktopMagic/Dialogs/ColorDialog.xaml     | 102 +++++++++++-------
 src/DesktopMagic/Dialogs/ColorDialog.xaml.cs  |   6 +-
 src/DesktopMagic/Dialogs/InputDialog.xaml     |  51 ++++++---
 src/DesktopMagic/Dialogs/InputDialog.xaml.cs  |   2 +-
 src/DesktopMagic/Dialogs/ThemeDialog.xaml     |  92 ++++++++++------
 src/DesktopMagic/Dialogs/ThemeDialog.xaml.cs  |  30 ++----
 src/DesktopMagic/GlobalSuppressions.cs        |   1 +
 src/DesktopMagic/MainWindow.xaml              |   1 +
 src/DesktopMagic/MainWindow.xaml.cs           |   1 +
 src/DesktopMagic/Pages/MainPage.xaml          |   1 -
 src/DesktopMagic/Pages/ThemePage.xaml         |  74 ++++++++-----
 src/DesktopMagic/Pages/ThemePage.xaml.cs      |   7 +-
 src/DesktopMagic/Plugins/PluginManager.xaml   |   6 +-
 .../Resources/Strings/StringResources.de.xaml |   2 +-
 .../Resources/Strings/StringResources.en.xaml |   2 +-
 17 files changed, 237 insertions(+), 146 deletions(-)

diff --git a/src/DesktopMagic/App.xaml.cs b/src/DesktopMagic/App.xaml.cs
index 55be20b..20acbf9 100644
--- a/src/DesktopMagic/App.xaml.cs
+++ b/src/DesktopMagic/App.xaml.cs
@@ -5,6 +5,8 @@ using System.IO;
 using System.Threading;
 using System.Windows;
 
+using Wpf.Ui;
+
 namespace DesktopMagic;
 
 /// <summary>
@@ -26,6 +28,8 @@ public partial class App : Application
 
     public static string PluginsPath => Path.Combine(ApplicationDataPath, "Plugins");
 
+    public static IContentDialogService DialogService { get; } = new ContentDialogService();
+
     public static Logger Logger { get; } = new Logger()
     {
         Config = new()
diff --git a/src/DesktopMagic/DataContexts/MainWindowDataContext.cs b/src/DesktopMagic/DataContexts/MainWindowDataContext.cs
index 88aa449..8c3c0fd 100644
--- a/src/DesktopMagic/DataContexts/MainWindowDataContext.cs
+++ b/src/DesktopMagic/DataContexts/MainWindowDataContext.cs
@@ -11,6 +11,7 @@ internal class MainWindowDataContext : INotifyPropertyChanged
     public event PropertyChangedEventHandler? PropertyChanged;
 
     private static DesktopMagicSettings settings = new();
+
     private bool isLoading = true;
 
     public string Title =>
diff --git a/src/DesktopMagic/Dialogs/ColorDialog.xaml b/src/DesktopMagic/Dialogs/ColorDialog.xaml
index 18c4330..96c3fd1 100644
--- a/src/DesktopMagic/Dialogs/ColorDialog.xaml
+++ b/src/DesktopMagic/Dialogs/ColorDialog.xaml
@@ -1,50 +1,76 @@
-<Window x:Class="DesktopMagic.Dialogs.ColorDialog"
+<ui:FluentWindow x:Class="DesktopMagic.Dialogs.ColorDialog"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+        xmlns:ui="http://schemas.lepo.co/wpfui/2022/xaml"
+        xmlns:tray="http://schemas.lepo.co/wpfui/2022/xaml/tray"
+        xmlns:pages="clr-namespace:DesktopMagic.Pages"
+        xmlns:plugins="clr-namespace:DesktopMagic.Plugins"
+        mc:Ignorable="d"
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-        xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
-        xmlns:local="clr-namespace:DesktopMagic.Dialogs"
-        mc:Ignorable="d"
-        ResizeMode="NoResize"
-        Title="ColorDialog"
+        xmlns:dataContext="clr-namespace:DesktopMagic.DataContexts"
+        d:DataContext="{d:DesignInstance Type=dataContext:MainWindowDataContext}"
+        ui:Design.Background="{DynamicResource ApplicationBackgroundBrush}"
+        ui:Design.Foreground="{DynamicResource TextFillColorPrimaryBrush}"
+        Foreground="{DynamicResource TextFillColorPrimaryBrush}"
+        WindowCornerPreference="Round"
+        WindowBackdropType="Tabbed"
+        Height="300"
+        Width="450"
+        MinHeight="300"
+        MinWidth="450"
         WindowStartupLocation="CenterOwner"
-        SizeToContent="WidthAndHeight">
+        ExtendsContentIntoTitleBar="True">
     <Grid>
-        <StackPanel Margin="15">
+        <Grid.RowDefinitions>
+            <RowDefinition Height="Auto" />
+            <RowDefinition Height="*" />
+            <RowDefinition Height="Auto" />
+        </Grid.RowDefinitions>
+
+        <ui:TitleBar ShowMinimize="False" ShowMaximize="False">
+            <ui:TitleBar.Icon>
+                <ui:ImageIcon Source="{StaticResource Icon}" />
+            </ui:TitleBar.Icon>
+        </ui:TitleBar>
+
+        <StackPanel Grid.Row="1" Margin="15">
             <Label x:Name="label" Content="Label" HorizontalAlignment="Left" VerticalAlignment="Top" />
+            <Grid Margin="{StaticResource DefaultMargin}">
+                <Grid.RowDefinitions>
+                    <RowDefinition Height="*"/>
+                    <RowDefinition Height="*"/>
+                    <RowDefinition Height="*"/>
+                    <RowDefinition Height="*"/>
+                </Grid.RowDefinitions>
 
-            <DockPanel>
-                <Label Content="A:" Width="20" />
-                <Slider x:Name="alphaSlider" VerticalAlignment="Center" Maximum="255" ValueChanged="ColorSliders_ValueChanged" TickFrequency="1" IsSnapToTickEnabled="True" Background="#00030000" />
-            </DockPanel>
-            <DockPanel>
-                <Label Content="R:" Width="20" />
-                <Slider x:Name="redSlider" VerticalAlignment="Center" Maximum="255" ValueChanged="ColorSliders_ValueChanged" TickFrequency="1" IsSnapToTickEnabled="True" Background="#00030000" />
-            </DockPanel>
-            <DockPanel>
-                <Label Content="G:" Width="20" />
-                <Slider x:Name="greenSlider" VerticalAlignment="Center" Maximum="255" ValueChanged="ColorSliders_ValueChanged" TickFrequency="1" IsSnapToTickEnabled="True" Background="#0000FF00" />
-            </DockPanel>
-            <DockPanel>
-                <Label Content="B:" Width="20" />
-                <Slider x:Name="blueSlider" VerticalAlignment="Center" Maximum="255" ValueChanged="ColorSliders_ValueChanged" TickFrequency="1" IsSnapToTickEnabled="True" Background="#000000FF" />
-            </DockPanel>
-
-            <StackPanel Orientation="Horizontal">
-                <Border CornerRadius="1" BorderThickness="1.5" BorderBrush="Gray" Height="23" Width="23"  Margin="0,0,5,0">
+                <DockPanel Grid.Row="0">
+                    <Label Content="A:" Width="20" />
+                    <Slider x:Name="alphaSlider" VerticalAlignment="Center" Maximum="255" ValueChanged="ColorSliders_ValueChanged" TickFrequency="1" IsSnapToTickEnabled="True" />
+                </DockPanel>
+                <DockPanel Grid.Row="1">
+                    <Label Content="R:" Width="20" />
+                    <Slider x:Name="redSlider" VerticalAlignment="Center" Maximum="255" ValueChanged="ColorSliders_ValueChanged" TickFrequency="1" IsSnapToTickEnabled="True" />
+                </DockPanel>
+                <DockPanel Grid.Row="2">
+                    <Label Content="G:" Width="20" />
+                    <Slider x:Name="greenSlider" VerticalAlignment="Center" Maximum="255" ValueChanged="ColorSliders_ValueChanged" TickFrequency="1" IsSnapToTickEnabled="True" />
+                </DockPanel>
+                <DockPanel Grid.Row="3">
+                    <Label Content="B:" Width="20" />
+                    <Slider x:Name="blueSlider" VerticalAlignment="Center" Maximum="255" ValueChanged="ColorSliders_ValueChanged" TickFrequency="1" IsSnapToTickEnabled="True" />
+                </DockPanel>
+            </Grid>
+            <DockPanel Margin="0 5 0 0">
+                <Border CornerRadius="1" BorderThickness="1.5" BorderBrush="{DynamicResource ControlStrokeColorDefaultBrush}" Background="White" Height="35" Width="35" Margin="0,0,5,0">
                     <Rectangle x:Name="colorRechtangle" Fill="White" />
                 </Border>
-                <TextBox x:Name="colorHexTextBox" MaxLength="9" CharacterCasing="Upper" Height="23" TextWrapping="Wrap" Width="350" TextChanged="ColorHexTextBox_TextChanged" RenderTransformOrigin="0.5,0.5" VerticalContentAlignment="Center">
-                    <materialDesign:TextFieldAssist.CharacterCounterStyle>
-                        <Style TargetType="TextBlock" />
-                    </materialDesign:TextFieldAssist.CharacterCounterStyle>
-                </TextBox>
-            </StackPanel>
-            <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" Margin="0,10,0,0">
-                <Button x:Name="okButton" Content="{DynamicResource ok }" HorizontalAlignment="Left" Margin="0,0,10,0" VerticalAlignment="Top" Width="100" Click="OkButton_Click" Cursor="Hand" />
-                <Button x:Name="cancelButton" Content="{DynamicResource cancel }" HorizontalAlignment="Left" Margin="0,0,0,0" VerticalAlignment="Top" Width="100" Click="CancelButton_Click" />
-            </StackPanel>
+                <TextBox x:Name="colorHexTextBox" MaxLength="9" CharacterCasing="Upper" TextWrapping="Wrap" TextChanged="ColorHexTextBox_TextChanged" RenderTransformOrigin="0.5,0.5" VerticalContentAlignment="Center"/>
+            </DockPanel>
+        </StackPanel>
+        <StackPanel Grid.Row="2" Orientation="Horizontal" HorizontalAlignment="Right" Margin="5">
+            <Button x:Name="okButton" Content="{DynamicResource ok }" HorizontalAlignment="Left" Margin="0 0 5 0" VerticalAlignment="Top" Width="100" Click="OkButton_Click" Cursor="Hand" />
+            <Button x:Name="cancelButton" Content="{DynamicResource cancel }" HorizontalAlignment="Left" Margin="0 0 0 0" VerticalAlignment="Top" Width="100" Click="CancelButton_Click" />
         </StackPanel>
     </Grid>
-</Window>
\ No newline at end of file
+</ui:FluentWindow>
\ No newline at end of file
diff --git a/src/DesktopMagic/Dialogs/ColorDialog.xaml.cs b/src/DesktopMagic/Dialogs/ColorDialog.xaml.cs
index af9b60c..4669e7c 100644
--- a/src/DesktopMagic/Dialogs/ColorDialog.xaml.cs
+++ b/src/DesktopMagic/Dialogs/ColorDialog.xaml.cs
@@ -4,12 +4,14 @@ using System.Windows;
 using System.Windows.Controls;
 using System.Windows.Media;
 
+using Wpf.Ui.Controls;
+
 namespace DesktopMagic.Dialogs;
 
 /// <summary>
 /// Interaction logic for ColorDialog.xaml
 /// </summary>
-public partial class ColorDialog : Window
+public partial class ColorDialog : FluentWindow
 {
     public System.Drawing.Color ResultColor { get; private set; }
 
@@ -87,7 +89,7 @@ public partial class ColorDialog : Window
             ResultBrush = brush;
             ResultColor = systemColor;
             colorRechtangle.Fill = brush;
-            colorHexTextBox.Foreground = Brushes.Black;
+            colorHexTextBox.Foreground = FindResource("TextFillColorPrimaryBrush") as Brush;
         }
         else
         {
diff --git a/src/DesktopMagic/Dialogs/InputDialog.xaml b/src/DesktopMagic/Dialogs/InputDialog.xaml
index d873210..3e5a734 100644
--- a/src/DesktopMagic/Dialogs/InputDialog.xaml
+++ b/src/DesktopMagic/Dialogs/InputDialog.xaml
@@ -1,22 +1,47 @@
-<Window x:Class="DesktopMagic.Dialogs.InputDialog"
+<ui:FluentWindow x:Class="DesktopMagic.Dialogs.InputDialog"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+        xmlns:ui="http://schemas.lepo.co/wpfui/2022/xaml"
+        xmlns:tray="http://schemas.lepo.co/wpfui/2022/xaml/tray"
+        xmlns:pages="clr-namespace:DesktopMagic.Pages"
+        xmlns:plugins="clr-namespace:DesktopMagic.Plugins"
+        mc:Ignorable="d"
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-        xmlns:local="clr-namespace:DesktopMagic.Dialogs"
-        mc:Ignorable="d"
-        Title="InputDialog"
-        ResizeMode="NoResize"
+        xmlns:dataContext="clr-namespace:DesktopMagic.DataContexts"
+        d:DataContext="{d:DesignInstance Type=dataContext:MainWindowDataContext}"
+        ui:Design.Background="{DynamicResource ApplicationBackgroundBrush}"
+        ui:Design.Foreground="{DynamicResource TextFillColorPrimaryBrush}"
+        Foreground="{DynamicResource TextFillColorPrimaryBrush}"
+        WindowCornerPreference="Round"
+        WindowBackdropType="Tabbed"
+        Height="200"
+        Width="300"
+        MinHeight="160"
+        MinWidth="300"
         WindowStartupLocation="CenterOwner"
-        SizeToContent="WidthAndHeight">
+        ExtendsContentIntoTitleBar="True">
     <Grid>
-        <StackPanel VerticalAlignment="Center" HorizontalAlignment="Center" Margin="15">
+        <Grid.RowDefinitions>
+            <RowDefinition Height="Auto" />
+            <RowDefinition Height="*" />
+            <RowDefinition Height="Auto" />
+        </Grid.RowDefinitions>
+
+        <ui:TitleBar ShowMinimize="False" ShowMaximize="False">
+            <ui:TitleBar.Icon>
+                <ui:ImageIcon Source="{StaticResource Icon}" />
+            </ui:TitleBar.Icon>
+        </ui:TitleBar>
+
+        <StackPanel Grid.Row="1" VerticalAlignment="Center" HorizontalAlignment="Stretch" Margin="15">
             <Label x:Name="label" Content="Label" HorizontalAlignment="Left" VerticalAlignment="Top" />
-            <TextBox x:Name="textBox" HorizontalAlignment="Left" Height="23" TextWrapping="Wrap" VerticalAlignment="Top" Width="280" VerticalContentAlignment="Center" />
-            <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" Margin="0,10,0,0">
-                <Button x:Name="okButton" Content="{DynamicResource ok }" HorizontalAlignment="Left" Margin="0,0,10,0" VerticalAlignment="Top" Width="100" Click="OkButton_Click" Cursor="Hand" />
-                <Button x:Name="cancelButton" Content="{DynamicResource cancel }" HorizontalAlignment="Left" Margin="0,0,0,0" VerticalAlignment="Top" Width="100" Click="CancelButton_Click" />
-            </StackPanel>
+            <ui:TextBox x:Name="textBox" HorizontalAlignment="Stretch" Margin="5" TextWrapping="Wrap" VerticalAlignment="Top" VerticalContentAlignment="Center" />
+        </StackPanel>
+
+        <StackPanel Grid.Row="2" Orientation="Horizontal" HorizontalAlignment="Right" Margin="5">
+            <Button x:Name="okButton" Content="{DynamicResource ok }" HorizontalAlignment="Left" Margin="0 0 5 0" VerticalAlignment="Top" Width="100" Click="OkButton_Click" Cursor="Hand" />
+            <Button x:Name="cancelButton" Content="{DynamicResource cancel }" HorizontalAlignment="Left" Margin="0 0 0 0" VerticalAlignment="Top" Width="100" Click="CancelButton_Click" />
         </StackPanel>
     </Grid>
-</Window>
\ No newline at end of file
+</ui:FluentWindow>
\ No newline at end of file
diff --git a/src/DesktopMagic/Dialogs/InputDialog.xaml.cs b/src/DesktopMagic/Dialogs/InputDialog.xaml.cs
index c0beac8..981bd82 100644
--- a/src/DesktopMagic/Dialogs/InputDialog.xaml.cs
+++ b/src/DesktopMagic/Dialogs/InputDialog.xaml.cs
@@ -2,7 +2,7 @@
 
 namespace DesktopMagic.Dialogs;
 
-public partial class InputDialog : Window
+public partial class InputDialog : Wpf.Ui.Controls.FluentWindow
 {
     public string ResponseText
     {
diff --git a/src/DesktopMagic/Dialogs/ThemeDialog.xaml b/src/DesktopMagic/Dialogs/ThemeDialog.xaml
index 4611d40..cf31ce8 100644
--- a/src/DesktopMagic/Dialogs/ThemeDialog.xaml
+++ b/src/DesktopMagic/Dialogs/ThemeDialog.xaml
@@ -1,22 +1,45 @@
-<Window x:Class="DesktopMagic.Dialogs.ThemeDialog"
+<ui:FluentWindow x:Class="DesktopMagic.Dialogs.ThemeDialog"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+        xmlns:ui="http://schemas.lepo.co/wpfui/2022/xaml"
+        xmlns:tray="http://schemas.lepo.co/wpfui/2022/xaml/tray"
+        xmlns:pages="clr-namespace:DesktopMagic.Pages"
+        xmlns:plugins="clr-namespace:DesktopMagic.Plugins"
+        mc:Ignorable="d"
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-        xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
-        xmlns:local="clr-namespace:DesktopMagic.Dialogs"
-        mc:Ignorable="d"
-        ResizeMode="NoResize"
-        Title="ThemeDialog"
+        xmlns:dataContext="clr-namespace:DesktopMagic.DataContexts"
+        d:DataContext="{d:DesignInstance Type=dataContext:MainWindowDataContext}"
+        ui:Design.Background="{DynamicResource ApplicationBackgroundBrush}"
+        ui:Design.Foreground="{DynamicResource TextFillColorPrimaryBrush}"
+        Foreground="{DynamicResource TextFillColorPrimaryBrush}"
+        WindowCornerPreference="Round"
+        WindowBackdropType="Tabbed"
+        Height="290"
+        Width="550"
+        MinHeight="290"
+        MinWidth="550"
         WindowStartupLocation="CenterOwner"
-        SizeToContent="WidthAndHeight">
+        ExtendsContentIntoTitleBar="True">
     <Grid>
-        <StackPanel Margin="15">
+        <Grid.RowDefinitions>
+            <RowDefinition Height="Auto" />
+            <RowDefinition Height="*" />
+            <RowDefinition Height="Auto" />
+        </Grid.RowDefinitions>
+
+        <ui:TitleBar ShowMinimize="False" ShowMaximize="False">
+            <ui:TitleBar.Icon>
+                <ui:ImageIcon Source="{StaticResource Icon}" />
+            </ui:TitleBar.Icon>
+        </ui:TitleBar>
+        
+        <StackPanel Grid.Row="1" Margin="15">
             <Label x:Name="label" Content="Label" HorizontalAlignment="Left" VerticalAlignment="Top" />
             <Grid>
                 <Grid.ColumnDefinitions>
                     <ColumnDefinition Width="*"/>
-                    <ColumnDefinition Width="*"/>
+                    <ColumnDefinition Width="auto"/>
                 </Grid.ColumnDefinitions>
                 <Grid Grid.Column="0" Margin="{StaticResource DefaultMargin}" HorizontalAlignment="Stretch">
                     <Grid.ColumnDefinitions>
@@ -33,44 +56,43 @@
                     <ComboBox x:Name="fontComboBox" Grid.Column="1" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Top" SelectionChanged="FontComboBox_SelectionChanged" Margin="0,0,0,5" />
 
                     <TextBlock Text="Corner Radius: " Grid.Column="0" Grid.Row="1" VerticalAlignment="Center"></TextBlock>
-                    <TextBox x:Name="cornerRadiusTextBox" Grid.Column="1" Grid.Row="1" TextChanged="CornerRadiusTextBox_TextChanged" materialDesign:HintAssist.Hint="Enter a number">
-                        <materialDesign:TextFieldAssist.CharacterCounterStyle>
-                            <Style TargetType="TextBlock" />
-                        </materialDesign:TextFieldAssist.CharacterCounterStyle>
-                    </TextBox>
+                    <ui:NumberBox x:Name="cornerRadiusTextBox" Grid.Column="1" Grid.Row="1" ValueChanged="CornerRadiusTextBox_ValueChanged" PlaceholderText="Enter a number" Margin="0,0,0,5" />
 
                     <TextBlock Text="Margin: " Grid.Column="0" Grid.Row="3" VerticalAlignment="Center"></TextBlock>
-                    <TextBox x:Name="marginTextBox" Grid.Column="1" Grid.Row="3" TextChanged="MarginTextBox_TextChanged" materialDesign:HintAssist.Hint="Enter a number">
-                        <materialDesign:TextFieldAssist.CharacterCounterStyle>
-                            <Style TargetType="TextBlock" />
-                        </materialDesign:TextFieldAssist.CharacterCounterStyle>
-                    </TextBox>
+                    <ui:NumberBox x:Name="marginTextBox" Grid.Column="1" Grid.Row="3" ValueChanged="MarginTextBox_ValueChanged" PlaceholderText="Enter a number"/>
                 </Grid>
-                <StackPanel Grid.Column="1" Margin="{StaticResource DefaultMargin}" HorizontalAlignment="Stretch">
-                    <DockPanel Margin="0,0,0,5">
-                        <Border CornerRadius="1" BorderThickness="1.5" BorderBrush="Gray" Height="23" Width="23"  Margin="0,0,5,0">
+                <Grid Grid.Column="1" Margin="{StaticResource DefaultMargin}" HorizontalAlignment="Stretch">
+
+                    <Grid.RowDefinitions>
+                        <RowDefinition Height="*" />
+                        <RowDefinition Height="*" />
+                        <RowDefinition Height="*" />
+                    </Grid.RowDefinitions>
+
+                    <DockPanel Grid.Row="0">
+                        <Border CornerRadius="1" BorderThickness="1.5" BorderBrush="{DynamicResource ControlStrokeColorDefaultBrush}" Background="White" Height="30" Width="30" Margin="0,0,5,0">
                             <Rectangle x:Name="primaryColorRechtangle" Fill="White" />
                         </Border>
-                        <Button Content="Change Primary Color" Height="23" FontSize="12" FontWeight="Regular" Click="ChangePrimaryColorButton_Click" />
+                        <Button Content="Change Primary Color" FontWeight="Regular" Click="ChangePrimaryColorButton_Click" HorizontalAlignment="Stretch" />
                     </DockPanel>
-                    <DockPanel Margin="0,0,0,5">
-                        <Border CornerRadius="1" BorderThickness="1.5" BorderBrush="Gray" Height="23" Width="23"  Margin="0,0,5,0">
+                    <DockPanel Grid.Row="1">
+                        <Border CornerRadius="1" BorderThickness="1.5" BorderBrush="{DynamicResource ControlStrokeColorDefaultBrush}" Background="White" Height="30" Width="30" Margin="0,0,5,0">
                             <Rectangle x:Name="secondaryColorRechtangle" Fill="White" />
                         </Border>
-                        <Button Content="Change Secondary Color" Height="23" FontSize="12" FontWeight="Regular" Click="ChangeSecondaryColorButton_Click" />
+                        <Button Content="Change Secondary Color" FontWeight="Regular" Click="ChangeSecondaryColorButton_Click" HorizontalAlignment="Stretch" />
                     </DockPanel>
-                    <DockPanel>
-                        <Border CornerRadius="1" BorderThickness="1.5" BorderBrush="Gray" Height="23" Width="23"  Margin="0,0,5,0">
+                    <DockPanel Grid.Row="2">
+                        <Border CornerRadius="1" BorderThickness="1.5" BorderBrush="{DynamicResource ControlStrokeColorDefaultBrush}" Background="White" Height="30" Width="30" Margin="0,0,5,0">
                             <Rectangle x:Name="backgroundColorRechtangle" Fill="White" />
                         </Border>
-                        <Button Content="Change Background Color" Height="23" FontSize="12" FontWeight="Regular" Click="ChangeBackgroundColorButton_Click" />
+                        <Button Content="Change Background Color" FontWeight="Regular" Click="ChangeBackgroundColorButton_Click" HorizontalAlignment="Stretch" />
                     </DockPanel>
-                </StackPanel>
+                </Grid>
             </Grid>
-            <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" Margin="0,10,0,0">
-                <Button x:Name="okButton" Content="{DynamicResource ok }" HorizontalAlignment="Left" Margin="0,0,10,0" VerticalAlignment="Top" Width="100" Click="OkButton_Click" Cursor="Hand" />
-                <Button x:Name="cancelButton" Content="{DynamicResource cancel }" HorizontalAlignment="Left" Margin="0,0,0,0" VerticalAlignment="Top" Width="100" Click="CancelButton_Click" />
-            </StackPanel>
+        </StackPanel>
+        <StackPanel Grid.Row="2" Orientation="Horizontal" HorizontalAlignment="Right" Margin="5">
+            <Button x:Name="okButton" Content="{DynamicResource ok }" HorizontalAlignment="Left" Margin="0 0 5 0" VerticalAlignment="Top" Width="100" Click="OkButton_Click" Cursor="Hand" />
+            <Button x:Name="cancelButton" Content="{DynamicResource cancel }" HorizontalAlignment="Left" Margin="0 0 0 0" VerticalAlignment="Top" Width="100" Click="CancelButton_Click" />
         </StackPanel>
     </Grid>
-</Window>
\ No newline at end of file
+</ui:FluentWindow>
\ No newline at end of file
diff --git a/src/DesktopMagic/Dialogs/ThemeDialog.xaml.cs b/src/DesktopMagic/Dialogs/ThemeDialog.xaml.cs
index d922c03..16642fb 100644
--- a/src/DesktopMagic/Dialogs/ThemeDialog.xaml.cs
+++ b/src/DesktopMagic/Dialogs/ThemeDialog.xaml.cs
@@ -10,7 +10,7 @@ namespace DesktopMagic.Dialogs;
 /// <summary>
 /// Interaction logic for ColorDialog.xaml
 /// </summary>
-public partial class ThemeDialog : Window
+public partial class ThemeDialog : Wpf.Ui.Controls.FluentWindow
 {
     private readonly Theme theme;
 
@@ -22,8 +22,8 @@ public partial class ThemeDialog : Window
 
         Resources.MergedDictionaries.Add(App.LanguageDictionary);
 
-        cornerRadiusTextBox.Text = theme.CornerRadius.ToString();
-        marginTextBox.Text = theme.Margin.ToString();
+        cornerRadiusTextBox.Value = theme.CornerRadius;
+        marginTextBox.Value = theme.Margin;
         primaryColorRechtangle.Fill = new SolidColorBrush(MultiColorConverter.ConvertToMediaColor(theme.PrimaryColor));
         secondaryColorRechtangle.Fill = new SolidColorBrush(MultiColorConverter.ConvertToMediaColor(theme.SecondaryColor));
         backgroundColorRechtangle.Fill = new SolidColorBrush(MultiColorConverter.ConvertToMediaColor(theme.BackgroundColor));
@@ -113,31 +113,19 @@ public partial class ThemeDialog : Window
         }
     }
 
-    private void CornerRadiusTextBox_TextChanged(object? sender, TextChangedEventArgs? e)
+    private void MarginTextBox_ValueChanged(object sender, Wpf.Ui.Controls.NumberBoxValueChangedEventArgs args)
     {
-        bool success = int.TryParse(cornerRadiusTextBox.Text, out int cornerRadius);
-        if (success)
+        if (args.NewValue != null)
         {
-            cornerRadiusTextBox.Foreground = Brushes.Black;
-            theme.CornerRadius = cornerRadius;
-        }
-        else
-        {
-            cornerRadiusTextBox.Foreground = Brushes.Red;
+            theme.Margin = (int)args.NewValue;
         }
     }
 
-    private void MarginTextBox_TextChanged(object? sender, TextChangedEventArgs? e)
+    private void CornerRadiusTextBox_ValueChanged(object sender, Wpf.Ui.Controls.NumberBoxValueChangedEventArgs args)
     {
-        bool success = int.TryParse(marginTextBox.Text, out int margin);
-        if (success)
+        if (args.NewValue != null)
         {
-            marginTextBox.Foreground = Brushes.Black;
-            theme.Margin = margin;
-        }
-        else
-        {
-            marginTextBox.Foreground = Brushes.Red;
+            theme.Margin = (int)args.NewValue;
         }
     }
 }
\ No newline at end of file
diff --git a/src/DesktopMagic/GlobalSuppressions.cs b/src/DesktopMagic/GlobalSuppressions.cs
index a76efbd..6930d88 100644
--- a/src/DesktopMagic/GlobalSuppressions.cs
+++ b/src/DesktopMagic/GlobalSuppressions.cs
@@ -9,6 +9,7 @@ using System.Diagnostics.CodeAnalysis;
 [assembly: SuppressMessage("Performance", "CA1822:Mark members as static", Justification = "No need to")]
 [assembly: SuppressMessage("Minor Code Smell", "S1075:URIs should not be hardcoded", Justification = "<Pending>")]
 [assembly: SuppressMessage("Critical Code Smell", "S2696:Instance members should not write to \"static\" fields", Justification = "<Pending>", Scope = "member", Target = "~P:DesktopMagic.DataContexts.MainWindowDataContext.Settings")]
+[assembly: SuppressMessage("Critical Code Smell", "S2696:Instance members should not write to \"static\" fields", Justification = "<Pending>", Scope = "member", Target = "~P:DesktopMagic.DataContexts.MainWindowDataContext.DialogService")]
 [assembly: SuppressMessage("Major Code Smell", "S3885:\"Assembly.Load\" should be used", Justification = "Assembly.Load does not load dependencies", Scope = "member", Target = "~M:DesktopMagic.PluginWindow.ExecuteSource")]
 [assembly: SuppressMessage("Minor Code Smell", "S2325:Methods and properties that don't access instance data should be static", Justification = "<Pending>", Scope = "member", Target = "~M:DesktopMagic.MainWindow.OpenPluginsFolderButton_Click(System.Object,System.Windows.RoutedEventArgs)")]
 [assembly: SuppressMessage("Minor Code Smell", "S2325:Methods and properties that don't access instance data should be static", Justification = "<Pending>", Scope = "member", Target = "~M:DesktopMagic.MainWindow.ScrollViewer_PreviewMouseWheel(System.Object,System.Windows.Input.MouseWheelEventArgs)")]
diff --git a/src/DesktopMagic/MainWindow.xaml b/src/DesktopMagic/MainWindow.xaml
index 1dfe583..87d1dd7 100644
--- a/src/DesktopMagic/MainWindow.xaml
+++ b/src/DesktopMagic/MainWindow.xaml
@@ -102,5 +102,6 @@
                 </Grid>
             </Border>
         </Grid>
+        <ContentPresenter x:Name="rootContentDialog" Grid.Row="1" Grid.RowSpan="2" />
     </Grid>
 </ui:FluentWindow>
\ No newline at end of file
diff --git a/src/DesktopMagic/MainWindow.xaml.cs b/src/DesktopMagic/MainWindow.xaml.cs
index 614e1b6..8f8eae5 100644
--- a/src/DesktopMagic/MainWindow.xaml.cs
+++ b/src/DesktopMagic/MainWindow.xaml.cs
@@ -25,6 +25,7 @@ public partial class MainWindow : FluentWindow
         _mainWindowDataContext.Settings = _manager.Settings;
 
         Resources.MergedDictionaries.Add(App.LanguageDictionary);
+        App.DialogService.SetDialogHost(rootContentDialog);
     }
 
     private void Window_Loaded(object sender, RoutedEventArgs e)
diff --git a/src/DesktopMagic/Pages/MainPage.xaml b/src/DesktopMagic/Pages/MainPage.xaml
index 752027b..5c2f7ca 100644
--- a/src/DesktopMagic/Pages/MainPage.xaml
+++ b/src/DesktopMagic/Pages/MainPage.xaml
@@ -72,7 +72,6 @@
                     <ColumnDefinition Width="0.5*" />
                 </Grid.ColumnDefinitions>
 
-
                 <ComboBox x:Name="layoutsComboBox" ItemsSource="{Binding Settings.Layouts}" DisplayMemberPath="Name" SelectedValue="{Binding Settings.CurrentLayoutName}" SelectedValuePath="Name" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Padding="4" SelectionChanged="LayoutsComboBox_SelectionChanged" />
                 <Button x:Name="newLayoutButton" Grid.Column="2" HorizontalAlignment="Stretch" Click="NewLayoutButton_Click" FontWeight="Regular">
                     <StackPanel Orientation="Horizontal">
diff --git a/src/DesktopMagic/Pages/ThemePage.xaml b/src/DesktopMagic/Pages/ThemePage.xaml
index 0b3ad60..653b9eb 100644
--- a/src/DesktopMagic/Pages/ThemePage.xaml
+++ b/src/DesktopMagic/Pages/ThemePage.xaml
@@ -9,39 +9,57 @@
       d:DesignHeight="450" d:DesignWidth="800"
       Title="ThemePage">
 
-    <Grid>
-        <Grid.ColumnDefinitions>
-            <ColumnDefinition />
-            <ColumnDefinition />
-        </Grid.ColumnDefinitions>
-
-        <ui:ListView x:Name="themesListBox" Grid.Row="0" Grid.ColumnSpan="1" Margin="{StaticResource DefaultMargin}" ItemsSource="{Binding Settings.Themes}" SelectedValue="{Binding Settings.CurrentLayout.CurrentThemeName}" SelectedValuePath="Name" SelectedIndex="2" SelectionMode="Single">
+    <Grid Margin="{StaticResource DefaultMargin}">
+        <Grid.RowDefinitions>
+            <RowDefinition Height="*" />
+            <RowDefinition Height="auto" />
+        </Grid.RowDefinitions>
+        
+        <ui:ListView x:Name="themesListBox" Grid.Row="0" Grid.ColumnSpan="1" ItemsSource="{Binding Settings.Themes}" SelectedValue="{Binding Settings.CurrentLayout.CurrentThemeName}" SelectedValuePath="Name" SelectedIndex="2" SelectionMode="Single">
             <ui:ListView.ItemTemplate>
                 <DataTemplate>
-                    <TextBlock Margin="8,4" Text="{Binding Name, Mode=OneWay}" />
+                    <Grid>
+                        <Grid.ColumnDefinitions>
+                            <ColumnDefinition Width="*" />
+                            <ColumnDefinition Width="Auto" />
+                        </Grid.ColumnDefinitions>
+                        <TextBlock Margin="8" VerticalAlignment="Center" FontWeight="SemiBold" Text="{Binding Name, Mode=OneWay}" />
+                        <StackPanel Grid.Column="1" VerticalAlignment="Center" Orientation="Horizontal" Margin="{StaticResource DefaultMargin}">
+                            <Button x:Name="editThemeButton" HorizontalAlignment="Stretch" Click="EditThemeButton_Click" FontWeight="Regular" Tag="{Binding}">
+                                <StackPanel Orientation="Horizontal">
+                                    <ui:SymbolIcon Symbol="Color24" Margin="0 0 10 0" />
+                                    <TextBlock Text="{DynamicResource editTheme}" />
+                                </StackPanel>
+                            </Button>
+                        </StackPanel>
+                    </Grid>
                 </DataTemplate>
             </ui:ListView.ItemTemplate>
         </ui:ListView>
+        
+        <ui:Card Grid.Row="1" Grid.ColumnSpan="2" Margin="0 5 0 0" Padding="5">
+            <Grid  >
+                <Grid.ColumnDefinitions>
+                    <ColumnDefinition Width="1*" />
+                    <ColumnDefinition Width="5" />
+                    <ColumnDefinition Width="0.5*" />
+                    <ColumnDefinition Width="5" />
+                    <ColumnDefinition Width="0.5*" />
+                </Grid.ColumnDefinitions>
 
-        <StackPanel Grid.Row="0" Grid.Column="1" VerticalAlignment="Center" Margin="{StaticResource DefaultMargin}">
-            <Button x:Name="addThemeButton" Margin="0,0,0,5" HorizontalAlignment="Stretch" Click="AddThemeButton_Click" FontWeight="Regular">
-                <StackPanel Orientation="Horizontal">
-                    <ui:SymbolIcon Symbol="Add24" Margin="0 0 10 0" />
-                    <TextBlock Text="{DynamicResource newTheme}" />
-                </StackPanel>
-            </Button>
-            <Button x:Name="deleteThemeButton" Margin="0,0,0,5" HorizontalAlignment="Stretch" Click="DeleteThemeButton_Click" FontWeight="Regular">
-                <StackPanel Orientation="Horizontal">
-                    <ui:SymbolIcon Symbol="Delete24" Margin="0 0 10 0" />
-                    <TextBlock Text="{DynamicResource deleteTheme}" />
-                </StackPanel>
-            </Button>
-            <Button x:Name="changeThemeButton" Margin="0,0,0,5" HorizontalAlignment="Stretch" Click="ChangeThemeButton_Click" FontWeight="Regular">
-                <StackPanel Orientation="Horizontal">
-                    <ui:SymbolIcon Symbol="Color24" Margin="0 0 10 0" />
-                    <TextBlock Text="{DynamicResource changeTheme}" />
-                </StackPanel>
-            </Button>
-        </StackPanel>
+                <Button x:Name="newThemeButton" Grid.Column="2" HorizontalAlignment="Stretch" Click="AddThemeButton_Click" FontWeight="Regular">
+                    <StackPanel Orientation="Horizontal">
+                        <ui:SymbolIcon Symbol="Add24" Margin="0 0 10 0" />
+                        <TextBlock Text="{DynamicResource newTheme}" />
+                    </StackPanel>
+                </Button>
+                <Button x:Name="deleteThemeButton" Grid.Column="4"  HorizontalAlignment="Stretch" Click="DeleteThemeButton_Click" FontWeight="Regular">
+                    <StackPanel Orientation="Horizontal">
+                        <ui:SymbolIcon Symbol="Delete24" Margin="0 0 10 0" />
+                        <TextBlock Text="{DynamicResource deleteTheme}" />
+                    </StackPanel>
+                </Button>
+            </Grid>
+        </ui:Card>
     </Grid>
 </Page>
diff --git a/src/DesktopMagic/Pages/ThemePage.xaml.cs b/src/DesktopMagic/Pages/ThemePage.xaml.cs
index e7e3baf..06186d5 100644
--- a/src/DesktopMagic/Pages/ThemePage.xaml.cs
+++ b/src/DesktopMagic/Pages/ThemePage.xaml.cs
@@ -89,9 +89,12 @@ public partial class ThemePage : Page
         }
     }
 
-    private void ChangeThemeButton_Click(object sender, RoutedEventArgs e)
+    private void EditThemeButton_Click(object sender, RoutedEventArgs e)
     {
-        Theme theme = themesListBox.SelectedItem as Theme ?? _manager.Settings.CurrentLayout.Theme;
+        if (sender is not Button button || button.Tag is not Theme theme)
+        {
+            return;
+        }
 
         ThemeDialog themeDialog = new(theme.Name, theme, App.AppName)
         {
diff --git a/src/DesktopMagic/Plugins/PluginManager.xaml b/src/DesktopMagic/Plugins/PluginManager.xaml
index 1003f0f..8406acf 100644
--- a/src/DesktopMagic/Plugins/PluginManager.xaml
+++ b/src/DesktopMagic/Plugins/PluginManager.xaml
@@ -15,7 +15,7 @@
         Title="{DynamicResource pluginManager}">
 
     <busyIndicator:BusyMask x:Name="BusyIndicator" IsBusy="{Binding IsLoading}" IndicatorType="Cogs" BusyContent="Please wait..." BusyContentMargin="0,20,0,0" IsBusyAtStartup="False" Foreground="{DynamicResource TextFillColorPrimaryBrush}" Background="{DynamicResource ControlStrokeColorDefaultBrush}">
-        <Grid Margin="5">
+        <Grid Margin="{StaticResource DefaultMargin}">
             <Grid.RowDefinitions>
                 <RowDefinition Height="auto" />
                 <RowDefinition Height="auto" />
@@ -32,7 +32,7 @@
                 <Grid>
                     <Grid.ColumnDefinitions>
                         <ColumnDefinition />
-                        <ColumnDefinition Width="5" />
+                        <ColumnDefinition Width="10" />
                         <ColumnDefinition />
                     </Grid.ColumnDefinitions>
 
@@ -101,7 +101,7 @@
                 <Grid>
                     <Grid.ColumnDefinitions>
                         <ColumnDefinition Width="*" />
-                        <ColumnDefinition Width="10" />
+                        <ColumnDefinition Width="15" />
                         <ColumnDefinition Width="0.5*" />
                         <ColumnDefinition Width="5" />
                         <ColumnDefinition Width="0.5*" />
diff --git a/src/DesktopMagic/Resources/Strings/StringResources.de.xaml b/src/DesktopMagic/Resources/Strings/StringResources.de.xaml
index 96ca827..9218420 100644
--- a/src/DesktopMagic/Resources/Strings/StringResources.de.xaml
+++ b/src/DesktopMagic/Resources/Strings/StringResources.de.xaml
@@ -42,7 +42,7 @@
     <system:String x:Key="deleteLayout">Layout Löschen</system:String>
     <system:String x:Key="newTheme">Neues Theme</system:String>
     <system:String x:Key="deleteTheme">Theme Löschen</system:String>
-    <system:String x:Key="changeTheme">Theme Ändern</system:String>
+    <system:String x:Key="editTheme">Theme Bearbeiten</system:String>
     <system:String x:Key="themes">Themes</system:String>
     <system:String x:Key="ok">Ok</system:String>
     <system:String x:Key="cancel">Abbrechen</system:String>
diff --git a/src/DesktopMagic/Resources/Strings/StringResources.en.xaml b/src/DesktopMagic/Resources/Strings/StringResources.en.xaml
index 703a1ad..c524080 100644
--- a/src/DesktopMagic/Resources/Strings/StringResources.en.xaml
+++ b/src/DesktopMagic/Resources/Strings/StringResources.en.xaml
@@ -42,7 +42,7 @@
     <system:String x:Key="deleteLayout">Delete Layout</system:String>
     <system:String x:Key="newTheme">New Theme</system:String>
     <system:String x:Key="deleteTheme">Delete Theme</system:String>
-    <system:String x:Key="changeTheme">Change Theme</system:String>
+    <system:String x:Key="editTheme">Edit Theme</system:String>
     <system:String x:Key="themes">Themes</system:String>
     <system:String x:Key="ok">Ok</system:String>
     <system:String x:Key="cancel">Cancel</system:String>