From 2b3608078ea33439364d5ff61cf1868e2026b3bf Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Thu, 7 Jul 2022 11:03:55 +0200
Subject: [PATCH 01/70] WIP: Porting fluent theme to use control themes.

Co-Authored-By: Takoooooo <tako0qq@gmail.com>
---
 .../DateTimePickers/DateTimePickerPanel.cs    |   2 +-
 .../Controls/AutoCompleteBox.xaml             | 110 ++--
 .../Controls/Button.xaml                      |  41 +-
 .../Controls/ButtonSpinner.xaml               | 229 +++----
 .../Controls/Calendar.xaml                    |  56 +-
 .../Controls/CalendarButton.xaml              | 204 +++---
 .../Controls/CalendarDatePicker.xaml          | 346 +++++-----
 .../Controls/CalendarDayButton.xaml           | 194 +++---
 .../Controls/CalendarItem.xaml                | 275 ++++----
 .../Controls/CaptionButtons.xaml              | 129 ++--
 .../Controls/Carousel.xaml                    |  37 +-
 .../Controls/CheckBox.xaml                    | 572 ++++++++--------
 .../Controls/ComboBox.xaml                    | 440 ++++++-------
 .../Controls/ComboBoxItem.xaml                | 171 +++--
 .../Controls/Common.xaml                      |   6 -
 .../Controls/ContentControl.xaml              |  35 +-
 .../Controls/ContextMenu.xaml                 | 136 ++--
 .../Controls/DataValidationErrors.xaml        | 207 +++---
 .../Controls/DatePicker.xaml                  | 622 +++++++++---------
 .../Controls/DropDownButton.xaml              | 198 +++---
 .../Controls/EmbeddableControlRoot.xaml       |  42 +-
 .../Controls/Expander.xaml                    | 354 +++++-----
 .../Controls/FluentControls.xaml              | 146 ++--
 .../Controls/FlyoutPresenter.xaml             |  14 +-
 .../Controls/FocusAdorner.xaml                |   2 +-
 .../Controls/GridSplitter.xaml                |  46 +-
 .../Controls/ItemsControl.xaml                |  35 +-
 .../Controls/Label.xaml                       |  40 +-
 .../Controls/ListBox.xaml                     |  92 +--
 .../Controls/ListBoxItem.xaml                 | 155 ++---
 .../Controls/ManagedFileChooser.xaml          | 608 ++++++++---------
 src/Avalonia.Themes.Fluent/Controls/Menu.xaml |  65 +-
 .../Controls/MenuFlyoutPresenter.xaml         |  69 +-
 .../Controls/MenuItem.xaml                    |   4 +-
 .../Controls/NativeMenuBar.xaml               |  59 +-
 .../Controls/NotificationCard.xaml            |  37 +-
 .../Controls/NumericUpDown.xaml               | 135 ++--
 .../Controls/OverlayPopupHost.xaml            |  43 +-
 .../Controls/PathIcon.xaml                    |  55 +-
 .../Controls/PopupRoot.xaml                   |  56 +-
 .../Controls/ProgressBar.xaml                 | 343 +++++-----
 .../Controls/RadioButton.xaml                 | 286 ++++----
 .../Controls/RepeatButton.xaml                | 118 ++--
 .../Controls/ScrollBar.xaml                   |   2 +-
 .../Controls/ScrollViewer.xaml                | 245 +++----
 .../Controls/Separator.xaml                   |  15 +-
 .../Controls/Slider.xaml                      | 603 ++++++++++-------
 .../Controls/SplitButton.xaml                 |   1 -
 .../Controls/SplitView.xaml                   |   2 +-
 .../Controls/TabControl.xaml                  | 122 ++--
 .../Controls/TabItem.xaml                     | 237 +++----
 .../Controls/TabStrip.xaml                    |  66 +-
 .../Controls/TabStripItem.xaml                | 193 +++---
 .../Controls/TextBox.xaml                     |  62 +-
 .../Controls/TimePicker.xaml                  | 409 ++++--------
 .../Controls/TitleBar.xaml                    |  94 +--
 .../Controls/ToggleButton.xaml                | 189 +++---
 .../Controls/ToggleSwitch.xaml                | 585 ++++++++--------
 .../Controls/ToolTip.xaml                     | 146 ++--
 .../Controls/TransitioningContentControl.xaml |  39 +-
 .../Controls/TreeView.xaml                    |  59 +-
 .../Controls/TreeViewItem.xaml                |   3 +-
 .../Controls/UserControl.xaml                 |  38 +-
 .../Controls/Window.xaml                      |  57 +-
 .../Controls/WindowNotificationManager.xaml   |  97 +--
 65 files changed, 4976 insertions(+), 5102 deletions(-)
 delete mode 100644 src/Avalonia.Themes.Fluent/Controls/Common.xaml

diff --git a/src/Avalonia.Controls/DateTimePickers/DateTimePickerPanel.cs b/src/Avalonia.Controls/DateTimePickers/DateTimePickerPanel.cs
index 667f994a1d..3fdfbee54d 100644
--- a/src/Avalonia.Controls/DateTimePickers/DateTimePickerPanel.cs
+++ b/src/Avalonia.Controls/DateTimePickers/DateTimePickerPanel.cs
@@ -454,7 +454,7 @@ namespace Avalonia.Controls.Primitives
                 children.Add(new ListBoxItem
                 {
                     Height = ItemHeight,
-                    Classes = new Classes("DateTimePickerItem", $"{PanelType}Item"),
+                    Classes = new Classes($"{PanelType}Item"),
                     VerticalContentAlignment = Avalonia.Layout.VerticalAlignment.Center,
                     Focusable = false
                 });
diff --git a/src/Avalonia.Themes.Fluent/Controls/AutoCompleteBox.xaml b/src/Avalonia.Themes.Fluent/Controls/AutoCompleteBox.xaml
index 58295d024f..6004d42120 100644
--- a/src/Avalonia.Themes.Fluent/Controls/AutoCompleteBox.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/AutoCompleteBox.xaml
@@ -1,5 +1,5 @@
-<Styles xmlns="https://github.com/avaloniaui" 
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
   <Design.PreviewWith>
     <Border Padding="20">
       <AutoCompleteBox Width="200">
@@ -16,56 +16,56 @@
       </AutoCompleteBox>
     </Border>
   </Design.PreviewWith>
-
-  <Style Selector="AutoCompleteBox">
-    <Setter Property="VerticalAlignment" Value="Top" />
-    <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
-    <Setter Property="Background" Value="{DynamicResource TextControlBackground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrush}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThickness}" />
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-    <Setter Property="Padding" Value="{DynamicResource TextControlThemePadding}" />
-    <Setter Property="MaxDropDownHeight" Value="{DynamicResource AutoCompleteListMaxHeight}" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Grid Name="PART_LayoutRoot">
-          <TextBox Name="PART_TextBox"
-                   Watermark="{TemplateBinding Watermark}"
-                   Width="{TemplateBinding Width}"
-                   Foreground="{TemplateBinding Foreground}"
-                   Background="{TemplateBinding Background}"
-                   BorderBrush="{TemplateBinding BorderBrush}"
-                   BorderThickness="{TemplateBinding BorderThickness}"
-                   CornerRadius="{TemplateBinding CornerRadius}"
-                   FontSize="{TemplateBinding FontSize}"
-                   FontFamily="{TemplateBinding FontFamily}"
-                   FontWeight="{TemplateBinding FontWeight}"
-                   Padding="{TemplateBinding Padding}"
-                   Margin="0"
-                   DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}" />
-          
-          <Popup Name="PART_Popup"
-                 WindowManagerAddShadowHint="False"
-                 MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
-                 MaxHeight="{TemplateBinding MaxDropDownHeight}"
-                 IsLightDismissEnabled="True"
-                 PlacementTarget="{TemplateBinding}">            
-            <Border Name="PART_SuggestionsContainer"
-                    Padding="{DynamicResource AutoCompleteListMargin}"
-                    BorderThickness="{DynamicResource AutoCompleteListBorderThemeThickness}"
-                    BorderBrush="{DynamicResource AutoCompleteBoxSuggestionsListBorderBrush}"
-                    Background="{DynamicResource AutoCompleteBoxSuggestionsListBackground}"
-                    CornerRadius="{DynamicResource OverlayCornerRadius}">
-              <ListBox Name="PART_SelectingItemsControl"
-                       BorderThickness="0"
-                       Background="Transparent"
-                       ItemTemplate="{TemplateBinding ItemTemplate}"
-                       Margin="{DynamicResource AutoCompleteListPadding}" />
-            </Border>
-          </Popup>
-        </Grid>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-</Styles>
+  
+    <ControlTheme x:Key="{x:Type AutoCompleteBox}" TargetType="AutoCompleteBox">
+      <Setter Property="VerticalAlignment" Value="Top" />
+      <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
+      <Setter Property="Background" Value="{DynamicResource TextControlBackground}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrush}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThickness}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="Padding" Value="{DynamicResource TextControlThemePadding}" />
+      <Setter Property="MaxDropDownHeight" Value="{DynamicResource AutoCompleteListMaxHeight}" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Grid Name="PART_LayoutRoot">
+            <TextBox Name="PART_TextBox"
+                     Watermark="{TemplateBinding Watermark}"
+                     Width="{TemplateBinding Width}"
+                     Foreground="{TemplateBinding Foreground}"
+                     Background="{TemplateBinding Background}"
+                     BorderBrush="{TemplateBinding BorderBrush}"
+                     BorderThickness="{TemplateBinding BorderThickness}"
+                     CornerRadius="{TemplateBinding CornerRadius}"
+                     FontSize="{TemplateBinding FontSize}"
+                     FontFamily="{TemplateBinding FontFamily}"
+                     FontWeight="{TemplateBinding FontWeight}"
+                     Padding="{TemplateBinding Padding}"
+                     Margin="0"
+                     DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}" />
+            <Popup Name="PART_Popup" 
+                   WindowManagerAddShadowHint="False"
+                   MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}" 
+                   MaxHeight="{TemplateBinding MaxDropDownHeight}"
+                   IsLightDismissEnabled="True"
+                   PlacementTarget="{TemplateBinding}">
+              <Border Name="PART_SuggestionsContainer"
+                      Padding="{DynamicResource AutoCompleteListMargin}"
+                      BorderThickness="{DynamicResource AutoCompleteListBorderThemeThickness}"
+                      BorderBrush="{DynamicResource AutoCompleteBoxSuggestionsListBorderBrush}"
+                      Background="{DynamicResource AutoCompleteBoxSuggestionsListBackground}"
+                      CornerRadius="{DynamicResource OverlayCornerRadius}">
+                <ListBox Name="PART_SelectingItemsControl"
+                         BorderThickness="0"
+                         Background="Transparent"
+                         ItemTemplate="{TemplateBinding ItemTemplate}"
+                         Margin="{DynamicResource AutoCompleteListPadding}" />
+              </Border>
+            </Popup>
+          </Grid>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+  
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/Button.xaml b/src/Avalonia.Themes.Fluent/Controls/Button.xaml
index 3fb0d43342..b8fea84ae0 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Button.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Button.xaml
@@ -1,4 +1,5 @@
-<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
   <Design.PreviewWith>
     <Border Padding="20">
       <StackPanel Spacing="20">
@@ -7,14 +8,11 @@
       </StackPanel>
     </Border>
   </Design.PreviewWith>
-
-  <Styles.Resources>
-    <Thickness x:Key="ButtonPadding">8,5,8,6</Thickness>
-  </Styles.Resources>
   
-  <Style Selector="Button">
+  <Thickness x:Key="ButtonPadding">8,5,8,6</Thickness>
+
+  <ControlTheme x:Key="{x:Type Button}" TargetType="Button">
     <Setter Property="Background" Value="{DynamicResource ButtonBackground}" />
-    <!--<Setter Property="BackgroundSizing" Value="OuterBorderEdge" />-->
     <Setter Property="Foreground" Value="{DynamicResource ButtonForeground}" />
     <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrush}" />
     <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThemeThickness}" />
@@ -22,8 +20,13 @@
     <Setter Property="Padding" Value="{DynamicResource ButtonPadding}" />
     <Setter Property="HorizontalAlignment" Value="Left" />
     <Setter Property="VerticalAlignment" Value="Center" />
-    <!--<Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
-    <Setter Property="FocusVisualMargin" Value="-3" />-->
+    <Setter Property="RenderTransform" Value="none" />
+    <Setter Property="Transitions">
+      <Transitions>
+        <TransformOperationsTransition Property="RenderTransform" Duration="0:0:.075" />
+      </Transitions>
+    </Setter>
+
     <Setter Property="Template">
       <ControlTemplate>
         <ContentPresenter x:Name="PART_ContentPresenter"
@@ -83,19 +86,9 @@
         <Setter Property="Foreground" Value="{DynamicResource AccentButtonForegroundDisabled}" />
       </Style>
     </Style>
-  </Style>
 
-  <Style Selector="Button, RepeatButton, ToggleButton, DropDownButton">
-    <Setter Property="RenderTransform" Value="none" />
-    <Setter Property="Transitions">
-      <Transitions>
-        <TransformOperationsTransition Property="RenderTransform" Duration="0:0:.075" />
-      </Transitions>
-    </Setter>
-  </Style>
-
-  <Style Selector="Button:pressed, RepeatButton:pressed, ToggleButton:pressed, DropDownButton:pressed">
-    <Setter Property="RenderTransform" Value="scale(0.98)" />    
-  </Style>
-
-</Styles>
+    <Style Selector="^:pressed">
+      <Setter Property="RenderTransform" Value="scale(0.98)" />
+    </Style>
+  </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml b/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml
index 836cc27db3..a5234f5771 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml
@@ -1,28 +1,26 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        xmlns:sys="clr-namespace:System;assembly=netstandard"
-        xmlns:converters="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls"
-        x:CompileBindings="True">
-  <Design.PreviewWith>
-    <Border Padding="20"
-            Background="Black">
-      <StackPanel Spacing="20">
-        <ButtonSpinner ButtonSpinnerLocation="Right"
-                       Content="Right disabled inline spinner"
-                       AllowSpin="False">
-          <DataValidationErrors.Error>
-            <sys:Exception />
-          </DataValidationErrors.Error>
-        </ButtonSpinner>
-        <ButtonSpinner ButtonSpinnerLocation="Left"
-                       Content="Left spinner" />
-        <ButtonSpinner ShowButtonSpinner="False"
-                       Content="Hide spinner" />
-      </StackPanel>
-    </Border>
-  </Design.PreviewWith>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:sys="clr-namespace:System;assembly=netstandard"
+                    xmlns:converters="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls"
+                    x:CompileBindings="True">
+    <Design.PreviewWith>
+      <Border Padding="20" Background="Black">
+        <StackPanel Spacing="20">
+          <ButtonSpinner ButtonSpinnerLocation="Right"
+                         Content="Right disabled inline spinner"
+                         AllowSpin="False">
+            <DataValidationErrors.Error>
+              <sys:Exception />
+            </DataValidationErrors.Error>
+          </ButtonSpinner>
+          <ButtonSpinner ButtonSpinnerLocation="Left"
+                         Content="Left spinner" />
+          <ButtonSpinner ShowButtonSpinner="False"
+                         Content="Hide spinner" />
+        </StackPanel>
+      </Border>
+    </Design.PreviewWith>
 
-  <Styles.Resources>
     <converters:MarginMultiplierConverter x:Key="ButtonSpinner_OnlyLeftThinknessConverter"
                                           Indent="1"
                                           Left="True" />
@@ -32,118 +30,79 @@
 
     <StreamGeometry x:Key="ButtonSpinnerIncreaseButtonIcon">M0,9 L10,0 20,9 19,10 10,2 1,10 z</StreamGeometry>
     <StreamGeometry x:Key="ButtonSpinnerDecreaseButtonIcon">M0,1 L10,10 20,1 19,0 10,8 1,0 z</StreamGeometry>
-  </Styles.Resources>
 
-  <!--  RepeatButton.ButtonSpinnerRepeatButton  -->
-  <Style Selector="RepeatButton.ButtonSpinnerRepeatButton">
-    <Setter Property="MinWidth" Value="34" />
-    <Setter Property="VerticalAlignment" Value="Stretch" />
-  </Style>
+    <ControlTheme x:Key="{x:Type ButtonSpinner}" TargetType="ButtonSpinner">
+      <Setter Property="Background" Value="Transparent" />
+      <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
+      <Setter Property="Padding" Value="10, 0" />
+      <Setter Property="Background" Value="{DynamicResource TextControlBackground}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrush}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThickness}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="MinHeight" Value="{DynamicResource TextControlThemeMinHeight}" />
+      <Setter Property="MinWidth" Value="{DynamicResource TextControlThemeMinWidth}" />
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="HorizontalContentAlignment" Value="Stretch" />
+      <Setter Property="VerticalContentAlignment" Value="Center" />
+      <Setter Property="Focusable" Value="True" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <DataValidationErrors>
+            <Border Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    CornerRadius="{TemplateBinding CornerRadius}"
+                    MinHeight="{TemplateBinding MinHeight}">
+              <Grid ColumnDefinitions="Auto,*,Auto">
+                <ContentPresenter Name="PART_ContentPresenter"
+                                  Grid.Column="1"
+                                  ContentTemplate="{TemplateBinding ContentTemplate}"
+                                  Content="{TemplateBinding Content}"
+                                  HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                  VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                                  Padding="{TemplateBinding Padding}" />
+                <StackPanel Name="PART_SpinnerPanel"
+                            Orientation="Horizontal"
+                            IsVisible="{TemplateBinding ShowButtonSpinner}">
+                  <RepeatButton Name="PART_IncreaseButton"
+                                Classes="ButtonSpinnerRepeatButton"
+                                VerticalContentAlignment="Center"
+                                Foreground="{TemplateBinding Foreground}"
+                                BorderBrush="{TemplateBinding BorderBrush}"
+                                Background="{TemplateBinding Background}"
+                                FontSize="{TemplateBinding FontSize}">
+                    <Path Fill="{TemplateBinding Foreground}" Width="16" Height="8" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" Data="{StaticResource ButtonSpinnerIncreaseButtonIcon}" />
+                  </RepeatButton>
+                  <RepeatButton Name="PART_DecreaseButton" Classes="ButtonSpinnerRepeatButton" Foreground="{TemplateBinding Foreground}" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" VerticalContentAlignment="Center" FontSize="{TemplateBinding FontSize}">
+                    <Path Fill="{TemplateBinding Foreground}" Width="16" Height="8" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" Data="{StaticResource ButtonSpinnerDecreaseButtonIcon}" />
+                  </RepeatButton>
+                </StackPanel>
+              </Grid>
+            </Border>
+          </DataValidationErrors>
+        </ControlTemplate>
+      </Setter>
 
-  <Style Selector="RepeatButton.ButtonSpinnerRepeatButton /template/ ContentPresenter">
-    <Setter Property="CornerRadius" Value="0" />
-    <Setter Property="BorderBrush" Value="{TemplateBinding BorderBrush}" />
-  </Style>
-  <Style Selector="RepeatButton.ButtonSpinnerRepeatButton:disabled">
-    <Setter Property="BorderBrush" Value="{TemplateBinding BorderBrush}" />
-  </Style>
-  <Style Selector="RepeatButton.ButtonSpinnerRepeatButton:disabled > Path">
-    <Setter Property="Fill" Value="{DynamicResource RepeatButtonForegroundDisabled}" />
-  </Style>
+      <Style Selector="^:error">
+        <Setter Property="BorderBrush" Value="{DynamicResource SystemErrorTextColor}" />
+      </Style>
 
-  <!--  ButtonSpinner  -->
-  <Style Selector="ButtonSpinner">
-    <Setter Property="Background" Value="Transparent" />
-    <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
-    <Setter Property="Padding" Value="10, 0" />
-    <Setter Property="Background" Value="{DynamicResource TextControlBackground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrush}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThickness}" />
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="MinHeight" Value="{DynamicResource TextControlThemeMinHeight}" />
-    <Setter Property="MinWidth" Value="{DynamicResource TextControlThemeMinWidth}" />    
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
-    <Setter Property="VerticalContentAlignment" Value="Center" />
-    <Setter Property="Focusable" Value="True"/>
-    <Setter Property="Template">
-      <ControlTemplate>
-        <DataValidationErrors>
-          <Border Background="{TemplateBinding Background}"
-                  BorderBrush="{TemplateBinding BorderBrush}"
-                  BorderThickness="{TemplateBinding BorderThickness}"
-                  CornerRadius="{TemplateBinding CornerRadius}"
-                  MinHeight="{TemplateBinding MinHeight}">
-            <Grid ColumnDefinitions="Auto,*,Auto">
-              <ContentPresenter Name="PART_ContentPresenter"
-                                Grid.Column="1"
-                                ContentTemplate="{TemplateBinding ContentTemplate}"
-                                Content="{TemplateBinding Content}"
-                                HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                                Padding="{TemplateBinding Padding}" />
+      <Style Selector="^:left /template/">
+        <Style Selector="^ StackPanel#PART_SpinnerPanel">
+          <Setter Property="Grid.Column" Value="0" />
+        </Style>
+        <Style Selector="^ RepeatButton.ButtonSpinnerRepeatButton">
+          <Setter Property="BorderThickness" Value="{Binding $parent[ButtonSpinner].BorderThickness, Converter={StaticResource ButtonSpinner_OnlyRightThinknessConverter}}" />
+        </Style>
+      </Style>
 
-              <StackPanel Name="PART_SpinnerPanel"
-                          Orientation="Horizontal"
-                          IsVisible="{TemplateBinding ShowButtonSpinner}">
-                <RepeatButton Name="PART_IncreaseButton"
-                              Classes="ButtonSpinnerRepeatButton"
-                              VerticalContentAlignment="Center"
-                              Foreground="{TemplateBinding Foreground}"
-                              BorderBrush="{TemplateBinding BorderBrush}"
-                              Background="{TemplateBinding Background}"
-                              FontSize="{TemplateBinding FontSize}">
-                  <Path Fill="{TemplateBinding Foreground}"
-                        Width="16"
-                        Height="8"
-                        Stretch="Uniform"
-                        HorizontalAlignment="Center"
-                        VerticalAlignment="Center"
-                        Data="{StaticResource ButtonSpinnerIncreaseButtonIcon}" />
-                </RepeatButton>
-
-                <RepeatButton Name="PART_DecreaseButton"
-                              Classes="ButtonSpinnerRepeatButton"
-                              Foreground="{TemplateBinding Foreground}"
-                              BorderBrush="{TemplateBinding BorderBrush}"
-                              Background="{TemplateBinding Background}"
-                              VerticalContentAlignment="Center"
-                              FontSize="{TemplateBinding FontSize}">
-                  <Path Fill="{TemplateBinding Foreground}"
-                        Width="16"
-                        Height="8"
-                        Stretch="Uniform"
-                        HorizontalAlignment="Center"
-                        VerticalAlignment="Center"
-                        Data="{StaticResource ButtonSpinnerDecreaseButtonIcon}" />
-                </RepeatButton>
-              </StackPanel>
-            </Grid>
-          </Border>
-        </DataValidationErrors>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-
-  <!--  ButtonSpinnerLocation=Right  -->
-  <Style Selector="ButtonSpinner:right /template/ StackPanel#PART_SpinnerPanel">
-    <Setter Property="Grid.Column" Value="2" />
-  </Style>
-  <Style Selector="ButtonSpinner:right /template/ RepeatButton.ButtonSpinnerRepeatButton">
-    <Setter Property="BorderThickness" Value="{Binding $parent[ButtonSpinner].BorderThickness, Converter={StaticResource ButtonSpinner_OnlyLeftThinknessConverter}}" />
-  </Style>
-
-  <!--  ButtonSpinnerLocation=Left  -->
-  <Style Selector="ButtonSpinner:left /template/ StackPanel#PART_SpinnerPanel">
-    <Setter Property="Grid.Column" Value="0" />
-  </Style>
-  <Style Selector="ButtonSpinner:left /template/ RepeatButton.ButtonSpinnerRepeatButton">
-    <Setter Property="BorderThickness" Value="{Binding $parent[ButtonSpinner].BorderThickness, Converter={StaticResource ButtonSpinner_OnlyRightThinknessConverter}}" />
-  </Style>
-
-  <!--  Error state  -->
-  <Style Selector="ButtonSpinner:error">
-    <Setter Property="BorderBrush" Value="{DynamicResource SystemErrorTextColor}" />
-  </Style>
-
-</Styles>
+      <Style Selector="^:right /template/">
+        <Style Selector="^ StackPanel#PART_SpinnerPanel">
+          <Setter Property="Grid.Column" Value="2" />
+        </Style>
+        <Style Selector="^ RepeatButton.ButtonSpinnerRepeatButton">
+          <Setter Property="BorderThickness" Value="{Binding $parent[ButtonSpinner].BorderThickness, Converter={StaticResource ButtonSpinner_OnlyLeftThinknessConverter}}" />
+        </Style>
+      </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/Calendar.xaml b/src/Avalonia.Themes.Fluent/Controls/Calendar.xaml
index 43e4a1fcea..3434f9b6e5 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Calendar.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Calendar.xaml
@@ -1,38 +1,40 @@
-<!--
-// (c) Copyright Microsoft Corporation.
-// This source is subject to the Microsoft Public License (Ms-PL).
-// Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
-// All other rights reserved.
+<!--
+    // (c) Copyright Microsoft Corporation.
+    // This source is subject to the Microsoft Public License (Ms-PL).
+    // Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
+    // All other rights reserved.
 -->
 
-<Styles xmlns="https://github.com/avaloniaui">
-  <Design.PreviewWith>
+<ResourceDictionary xmlns="https://github.com/avaloniaui" 
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+   <Design.PreviewWith>
     <Border Padding="20">
       <Calendar />
     </Border>
   </Design.PreviewWith>
-  <Style Selector="Calendar">
-    <Setter Property="Foreground" Value="{DynamicResource CalendarViewForeground}" />
-    <Setter Property="Background" Value="{DynamicResource CalendarViewBackground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewBorderBrush}" />
-    <Setter Property="BorderThickness" Value="1" />
-    <Setter Property="HorizontalAlignment" Value="Left" />
-    <Setter Property="VerticalAlignment" Value="Center" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <StackPanel Name="Root"
+
+    <ControlTheme x:Key="{x:Type Calendar}" TargetType="Calendar">
+        <Setter Property="Foreground" Value="{DynamicResource CalendarViewForeground}" />
+        <Setter Property="Background" Value="{DynamicResource CalendarViewBackground}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewBorderBrush}" />
+        <Setter Property="BorderThickness" Value="1" />
+        <Setter Property="HorizontalAlignment" Value="Left" />
+        <Setter Property="VerticalAlignment" Value="Center" />
+        <Setter Property="Template">
+            <ControlTemplate>
+                <StackPanel
+                    Name="Root"
                     HorizontalAlignment="Center"
                     ClipToBounds="True">
-
-                    <CalendarItem Name="CalendarItem"
+                    <CalendarItem
+                        Name="CalendarItem"
                         Background="{TemplateBinding Background}"
                         BorderBrush="{TemplateBinding BorderBrush}"
                         BorderThickness="{TemplateBinding BorderThickness}"
-                        HeaderBackground="{TemplateBinding HeaderBackground}"
-                        CornerRadius="{TemplateBinding CornerRadius}"/>
-
-        </StackPanel>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-</Styles>
+                        CornerRadius="{TemplateBinding CornerRadius}"
+                        HeaderBackground="{TemplateBinding HeaderBackground}" />
+                </StackPanel>
+            </ControlTemplate>
+        </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/CalendarButton.xaml b/src/Avalonia.Themes.Fluent/Controls/CalendarButton.xaml
index 3a6af60983..0381022910 100644
--- a/src/Avalonia.Themes.Fluent/Controls/CalendarButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/CalendarButton.xaml
@@ -1,121 +1,109 @@
-<!--
+<!--
 // (c) Copyright Microsoft Corporation.
 // This source is subject to the Microsoft Public License (Ms-PL).
 // Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
 // All other rights reserved.
 -->
+<ResourceDictionary xmlns="https://github.com/avaloniaui" 
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <ControlTheme x:Key="{x:Type CalendarButton}" TargetType="CalendarButton">
+      <Setter Property="ClickMode" Value="Release" />
+      <Setter Property="MinWidth" Value="40" />
+      <Setter Property="MinHeight" Value="40" />
+      <Setter Property="Margin" Value="1" />
+      <Setter Property="Padding" Value="0,0,0,0" />
+      <!--These are actually set on the CalendarView in WinUI-->
+      <Setter Property="Foreground" Value="{DynamicResource CalendarViewCalendarItemForeground}" />
+      <Setter Property="Background" Value="{DynamicResource CalendarViewCalendarItemRevealBackground}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewCalendarItemRevealBorderBrush}" />
+      <Setter Property="BorderThickness" Value="2" />
+      <Setter Property="FontSize" Value="20" />
+      <Setter Property="ClipToBounds" Value="False" />
+      <Setter Property="HorizontalContentAlignment" Value="Center" />
+      <Setter Property="VerticalContentAlignment" Value="Center" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Panel>
+            <!-- To mimic WinUI SystemFocusVisual, Focus visual is drawn outside the bounds of the item -->
+            <Border Name="Root" Background="{TemplateBinding Background}"
+                    BorderThickness="0" ClipToBounds="True">
+              <ContentControl Name="Content"
+                              ContentTemplate="{TemplateBinding ContentTemplate}"
+                              Content="{TemplateBinding Content}"
+                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                              FontSize="{TemplateBinding FontSize}"
+                              Margin="{TemplateBinding Padding}" />
+            </Border>
+            
+            <!-- Drawn Border should render on top of background to preserve the 1px margin between items -->
+            <Border Name="Border"
+                    BorderThickness="2"
+                    BorderBrush="{TemplateBinding BorderBrush}" />
+          </Panel>
+        </ControlTemplate>
+      </Setter>
 
-<Styles xmlns="https://github.com/avaloniaui">
-  <Style Selector="CalendarButton">
-    <Setter Property="ClickMode" Value="Release"/>
-    <Setter Property="MinWidth" Value="40"/>
-    <Setter Property="MinHeight" Value="40"/>
-    <Setter Property="Margin" Value="1"/>
-    <Setter Property="Padding" Value="0,0,0,0"/>
-    <!--These are actually set on the CalendarView in WinUI-->
-    <Setter Property="Foreground" Value="{DynamicResource CalendarViewCalendarItemForeground}"/>
-    <Setter Property="Background" Value="{DynamicResource CalendarViewCalendarItemRevealBackground}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewCalendarItemRevealBorderBrush}"/>
-    <Setter Property="BorderThickness" Value="2"/>
-    <Setter Property="FontSize" Value="20"/>
-    <Setter Property="ClipToBounds" Value="False"/>
-    <Setter Property="HorizontalContentAlignment" Value="Center"/>
-    <Setter Property="VerticalContentAlignment" Value="Center"/>
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Panel>
-          <!-- To mimic WinUI SystemFocusVisual, Focus visual is drawn outside the bounds of the item -->
-          <Border Name="Root" Background="{TemplateBinding Background}"
-                  BorderThickness="0" ClipToBounds="True">
+      <Style Selector="^:pointerover /template/ Border#Border">
+        <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewHoverBorderBrush}" />
+      </Style>
+      
+      <Style Selector="^:pressed /template/ Border#Border">
+        <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark2}" />
+      </Style>
 
-            <ContentControl Name="Content"
-                  ContentTemplate="{TemplateBinding ContentTemplate}"
-                  Content="{TemplateBinding Content}"
-                  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                  VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                  FontSize="{TemplateBinding FontSize}"
-                  Margin="{TemplateBinding Padding}"/>
+      <!-- Adjusted :selected to look like :today from DayItem -->
+      <Style Selector="^:selected">
+        <Style Selector="^ /template/ Border#Root">
+          <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
+        </Style>
+        
+        <Style Selector="^ /template/ Border#Border">
+          <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedBorderBrush}" />
+        </Style>
 
-          </Border>
+        <Style Selector="^ /template/ ContentControl#Content">
+          <Setter Property="Foreground" Value="{DynamicResource CalendarViewTodayForeground}" />
+          <Setter Property="FontWeight" Value="SemiBold" />
+        </Style>
 
-          <!-- Drawn Border should render on top of background to preserve the 1px
-                        margin between items-->
-          <Border Name="Border"
-                  BorderThickness="2"
-                  BorderBrush="{TemplateBinding BorderBrush}"/>
+        <Style Selector="^:pointerover">
+          <Style Selector="^ /template/ Border#Border">
+            <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark1}" />
+          </Style>
+          <Style Selector="^ /template/ Border#Root">
+            <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
+          </Style>
+        </Style>
 
-          <!--Removed for now...WinUI doesn't have selection follow focus, and only uses 
-              focus visual w/ keyboard focus
-          <Border Name="FocusVisual" BorderThickness="2"
-                     BorderBrush="{DynamicResource SystemControlHighlightBaseHighBrush}"
-                     IsHitTestVisible="False"
-                     Margin="-2"  CornerRadius="{DynamicResource ControlCornerRadius}"/>-->
-        </Panel>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-  <!--<Style Selector="CalendarButton /template/ Border#FocusVisual">
-    <Setter Property="IsVisible" Value="False"/>
-  </Style>-->
+        <Style Selector="^:pressed">
+          <Style Selector="^ /template/ Border#Border">
+            <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark2}" />
+          </Style>
+          
+          <Style Selector="^ /template/ Border#Root">
+            <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
+          </Style>
+        </Style>
+      </Style>
 
-  <Style Selector="CalendarButton:pointerover /template/ Border#Border">
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewHoverBorderBrush}"/>
-  </Style>
-  <Style Selector="CalendarButton:pressed /template/ Border#Border">
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewPressedBorderBrush}"/>
-  </Style>
+      <!-- WinUI calls this OutOfFocus -->
+      <Style Selector="^:inactive">
+        <Style Selector="^ /template/ Border#Root">
+          <!-- These are probably set in code, but consistent -->
+          <Setter Property="Background" Value="{DynamicResource CalendarViewOutOfScopeBackground}"/>
+        </Style>
+        <Style Selector="^ /template/ ContentControl#Content">
+          <Setter Property="Foreground" Value="{DynamicResource CalendarViewOutOfScopeForeground}"/>
+        </Style>
+      </Style>
 
-  <!-- Adjusted :selected to look like :today from DayItem -->
-  <Style Selector="CalendarButton:selected /template/ Border#Root">
-    <Setter Property="Background" Value="{DynamicResource SystemAccentColor}"/>
-  </Style>
-  <Style Selector="CalendarButton:selected /template/ Border#Border">
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedBorderBrush}"/>
-  </Style>
-  <Style Selector="CalendarButton:selected:pointerover /template/ Border#Root">
-    <Setter Property="Background">
-      <SolidColorBrush Color="{DynamicResource SystemAccentColor}"/>
-    </Setter>
-  </Style>
-  <Style Selector="CalendarButton:selected:pointerover /template/ Border#Border">
-    <Setter Property="BorderBrush">
-      <SolidColorBrush Color="{DynamicResource SystemAccentColorDark1}"/>
-    </Setter>
-  </Style>
-  <Style Selector="CalendarButton:selected:pressed /template/ Border#Root">
-    <Setter Property="Background">
-      <SolidColorBrush Color="{DynamicResource SystemAccentColor}"/>
-    </Setter>
-  </Style>
-  <Style Selector="CalendarButton:pressed /template/ Border#Border">
-    <Setter Property="BorderBrush">
-      <SolidColorBrush Color="{DynamicResource SystemAccentColorDark2}"/>
-    </Setter>
-  </Style>
+      <Style Selector="^:blackout /template/ ContentControl#Content">
+        <Setter Property="Foreground" Value="{DynamicResource CalendarViewBlackoutForeground}" />
+      </Style>
 
-  <Style Selector="CalendarButton:selected /template/ ContentControl#Content">
-    <Setter Property="Foreground" Value="{DynamicResource CalendarViewTodayForeground}"/>
-    <Setter Property="FontWeight" Value="SemiBold"/>
-  </Style>
-
-  <!-- WinUI calls this OutOfFocus -->
-  <Style Selector="CalendarButton:inactive /template/ Border#Root">
-    <!-- These are probably set in code, but consistent -->
-    <Setter Property="Background" Value="{DynamicResource CalendarViewOutOfScopeBackground}"/>
-  </Style>
-  <Style Selector="CalendarButton:inactive /template/ ContentControl#Content">
-    <Setter Property="Foreground" Value="{DynamicResource CalendarViewOutOfScopeForeground}"/>
-  </Style>
-
-  <Style Selector="CalendarButton:blackout /template/ ContentControl#Content">
-    <Setter Property="Foreground" Value="{DynamicResource CalendarViewBlackoutForeground}"/>
-  </Style>
-
-  <!--<Style Selector="CalendarButton:dayfocused /template/ Border#FocusVisual">
-            <Setter Property="IsVisible" Value="True"/>
-      </Style>-->
-
-  <Style Selector="CalendarDayButton:disabled /template/ ContentControl#Content">
-    <Setter Property="Foreground" Value="{DynamicResource CalendarViewWeekDayForegroundDisabled}"/>
-  </Style>
-</Styles>
+      <Style Selector="^:disabled /template/ ContentControl#Content">
+        <Setter Property="Foreground" Value="{DynamicResource CalendarViewWeekDayForegroundDisabled}" />
+      </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/CalendarDatePicker.xaml b/src/Avalonia.Themes.Fluent/Controls/CalendarDatePicker.xaml
index c6f70d05e1..83a254be56 100644
--- a/src/Avalonia.Themes.Fluent/Controls/CalendarDatePicker.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/CalendarDatePicker.xaml
@@ -1,182 +1,180 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        xmlns:sys="clr-namespace:System;assembly=netstandard"
-        x:CompileBindings="True">
-  <Design.PreviewWith>
-    <Border Margin="20, 20, 20, 200">
-      <CalendarDatePicker Width="200"
-                          VerticalContentAlignment="Center"
-                          HorizontalContentAlignment="Center" />
-    </Border>
-  </Design.PreviewWith>
-
-  <Styles.Resources>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:sys="clr-namespace:System;assembly=netstandard"
+                    x:CompileBindings="True">
+    <Design.PreviewWith>
+      <Border Margin="20, 20, 20, 200">
+        <CalendarDatePicker Width="200" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" />
+      </Border>
+    </Design.PreviewWith>
+  
     <x:Double x:Key="CalendarDatePickerCurrentDayFontSize">12</x:Double>
     <x:Double x:Key="CalendarDatePickerMinHeight">32</x:Double>
-  </Styles.Resources>
-  
-  <Style Selector="CalendarDatePicker">
-    <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackground}"/>
-    <Setter Property="Foreground" Value="{DynamicResource CalendarDatePickerForeground}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrush}"/>
-    <Setter Property="BorderThickness" Value="{DynamicResource CalendarDatePickerBorderThemeThickness}"/>
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="MinHeight" Value="{DynamicResource CalendarDatePickerMinHeight}" />
-    <Setter Property="HorizontalAlignment" Value="Left" />
-    <Setter Property="VerticalAlignment" Value="Center" />
-    <Setter Property="HorizontalContentAlignment" Value="Left" />
-    <Setter Property="VerticalContentAlignment" Value="Center" />
-    <Setter Property="Padding" Value="4"/>
-    <Setter Property="Template">
-      <ControlTemplate>
-        <DataValidationErrors>
-          <Panel x:Name="LayoutRoot"
-                 HorizontalAlignment="Stretch"
-                 VerticalAlignment="Stretch">
-            <Border x:Name="Background"
-                    CornerRadius="{TemplateBinding CornerRadius}"
-                    BorderThickness="{TemplateBinding BorderThickness}"
-                    BorderBrush="{TemplateBinding BorderBrush}"
-                    Background="{TemplateBinding Background}" />
-            <Grid ColumnDefinitions="*,Auto">
-              <TextBox Name="PART_TextBox"
-                       Foreground="{TemplateBinding Foreground}"
-                       Background="Transparent"
-                       BorderBrush="Transparent"
-                       BorderThickness="0"
-                       CornerRadius="{TemplateBinding CornerRadius}"
-                       Margin="{TemplateBinding BorderThickness}"
-                       Padding="{TemplateBinding Padding}"
-                       Watermark="{TemplateBinding Watermark}"
-                       UseFloatingWatermark="{TemplateBinding UseFloatingWatermark}"
-                       HorizontalAlignment="Stretch"
-                       VerticalAlignment="Stretch"
-                       VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                       HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                       Grid.Column="0" />
-              <Button Name="PART_Button"
-                      Grid.Column="1"
-                      Focusable="False" />
-              <Popup Name="PART_Popup"
-                     PlacementTarget="{TemplateBinding}"
-                     IsLightDismissEnabled="True">
-                <Calendar Name="PART_Calendar"
-                          FirstDayOfWeek="{TemplateBinding FirstDayOfWeek}"
-                          IsTodayHighlighted="{TemplateBinding IsTodayHighlighted}"
-                          SelectedDate="{TemplateBinding SelectedDate, Mode=TwoWay}"
-                          DisplayDate="{TemplateBinding DisplayDate}"
-                          DisplayDateStart="{TemplateBinding DisplayDateStart}"
-                          DisplayDateEnd="{TemplateBinding DisplayDateEnd}" />
-              </Popup>
-            </Grid>
-          </Panel>
-        </DataValidationErrors>
-      </ControlTemplate>
-    </Setter>
-  </Style>
 
-  <!-- Normal State -->
-  <Style Selector="CalendarDatePicker /template/ Button#PART_Button">
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerCalendarGlyphForeground}" />
-    <Setter Property="Background" Value="Transparent" />
-    <Setter Property="BorderThickness" Value="0" />
-    <Setter Property="Margin" Value="2,0,4,0" />
-    <Setter Property="Padding" Value="0" />
-    <Setter Property="Width" Value="20" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Grid Height="24"
-              Width="20"
-              HorizontalAlignment="Center"
-              VerticalAlignment="Center"
-              Margin="0"
-              ColumnDefinitions="*,*,*,*"
-              RowDefinitions="23*,19*,19*,19*"
-              ClipToBounds="False">
-          <Border Name="Background"
-                  Margin="0,-1,0,0"
-                  Grid.ColumnSpan="4"
-                  Grid.Row="1"
-                  Grid.RowSpan="3"
-                  BorderThickness="0.5,0,0.5,0.5"
-                  BorderBrush="{TemplateBinding Foreground}"
-                  CornerRadius="0,0,2,2" />
-          <Border Grid.ColumnSpan="4"
-                  Grid.RowSpan="1"
-                  BorderBrush="{TemplateBinding Foreground}"
-                  BorderThickness="0.5"
-                  CornerRadius="2,2,0,0" />
-          <TextBlock Margin="0,-1,0,0"
+    <ControlTheme x:Key="FluentCalendarDatePickerButton" TargetType="Button">
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerCalendarGlyphForeground}" />
+      <Setter Property="Margin" Value="2,0,4,0" />
+      <Setter Property="Width" Value="20" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Grid Height="24"
+                Width="20"
+                HorizontalAlignment="Center"
+                VerticalAlignment="Center"
+                Margin="0"
+                ColumnDefinitions="*,*,*,*"
+                RowDefinitions="23*,19*,19*,19*"
+                ClipToBounds="False">
+            <Border Name="Background"
+                    Margin="0,-1,0,0"
+                    Grid.ColumnSpan="4"
+                    Grid.Row="1"
+                    Grid.RowSpan="3"
+                    BorderThickness="0.5,0,0.5,0.5"
+                    BorderBrush="{TemplateBinding Foreground}"
+                    CornerRadius="0,0,2,2" />
+            <Border Grid.ColumnSpan="4"
+                    Grid.RowSpan="1"
+                    BorderBrush="{TemplateBinding Foreground}"
+                    BorderThickness="0.5"
+                    CornerRadius="2,2,0,0" />
+            <TextBlock Margin="0,-1,0,0"
+                       VerticalAlignment="Center"
+                       HorizontalAlignment="Center"
+                       Grid.Column="0"
+                       Grid.Row="1"
+                       Grid.ColumnSpan="4"
+                       Grid.RowSpan="3"
+                       Foreground="{TemplateBinding Foreground}"
+                       FontSize="{DynamicResource CalendarDatePickerCurrentDayFontSize}"
+                       Text="{Binding Source={x:Static sys:DateTime.Today}, Path=Day}" />
+            <Ellipse HorizontalAlignment="Center"
                      VerticalAlignment="Center"
-                     HorizontalAlignment="Center"
-                     Grid.Column="0"
-                     Grid.Row="1"
+                     Fill="{TemplateBinding Foreground}"
+                     StrokeThickness="0"
                      Grid.ColumnSpan="4"
-                     Grid.RowSpan="3"
-                     Foreground="{TemplateBinding Foreground}"
-                     FontSize="{DynamicResource CalendarDatePickerCurrentDayFontSize}"
-                     Text="{Binding Source={x:Static sys:DateTime.Today}, Path=Day}" />
-          <Ellipse HorizontalAlignment="Center"
-                   VerticalAlignment="Center"
-                   Fill="{TemplateBinding Foreground}"
-                   StrokeThickness="0"
-                   Grid.ColumnSpan="4"
-                   Width="3"
-                   Height="3" />
-        </Grid>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-
-  <!-- Pressed State -->
-  <Style Selector="CalendarDatePicker:pressed /template/ Border#Background">
-    <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackgroundPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrushPressed}" />
-  </Style>
+                     Width="3"
+                     Height="3" />
+          </Grid>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+    
+    <ControlTheme x:Key="{x:Type CalendarDatePicker}" TargetType="CalendarDatePicker">
+      <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackground}" />
+      <Setter Property="Foreground" Value="{DynamicResource CalendarDatePickerForeground}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrush}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource CalendarDatePickerBorderThemeThickness}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="MinHeight" Value="{DynamicResource CalendarDatePickerMinHeight}" />
+      <Setter Property="HorizontalAlignment" Value="Left" />
+      <Setter Property="VerticalAlignment" Value="Center" />
+      <Setter Property="HorizontalContentAlignment" Value="Left" />
+      <Setter Property="VerticalContentAlignment" Value="Center" />
+      <Setter Property="Padding" Value="4" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <DataValidationErrors>
+            <Panel x:Name="LayoutRoot"
+                   HorizontalAlignment="Stretch"
+                   VerticalAlignment="Stretch">
+              <Border x:Name="Background"
+                      CornerRadius="{TemplateBinding CornerRadius}"
+                      BorderThickness="{TemplateBinding BorderThickness}"
+                      BorderBrush="{TemplateBinding BorderBrush}"
+                      Background="{TemplateBinding Background}" />
+              <Grid ColumnDefinitions="*,Auto">
+                <TextBox Name="PART_TextBox"
+                         Foreground="{TemplateBinding Foreground}"
+                         Background="Transparent"
+                         BorderBrush="Transparent"
+                         BorderThickness="0"
+                         CornerRadius="{TemplateBinding CornerRadius}"
+                         Margin="{TemplateBinding BorderThickness}"
+                         Padding="{TemplateBinding Padding}"
+                         Watermark="{TemplateBinding Watermark}"
+                         UseFloatingWatermark="{TemplateBinding UseFloatingWatermark}"
+                         HorizontalAlignment="Stretch"
+                         VerticalAlignment="Stretch"
+                         VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                         HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                         Grid.Column="0">
+                  <TextBox.Styles>
+                    <Style Selector="TextBox#PART_TextBox:focus /template/ Border#PART_BorderElement">
+                      <!-- By default the TextBox has its own focused state, override this to disable it here -->
+                      <Setter Property="Background" Value="Transparent"/>
+                      <Setter Property="BorderBrush" Value="Transparent"/>
+                      <Setter Property="BorderThickness" Value="0" />
+                    </Style>
+                    <Style Selector="TextBox#PART_TextBox:disabled /template/">
+                      <Style Selector="^ Border#PART_BorderElement">
+                        <!-- By default the TextBox has its own disabled state, override this to make the border background show through -->
+                        <Setter Property="Background" Value="Transparent" />
+                        <Setter Property="BorderBrush" Value="Transparent" />
+                      </Style>
+                      <Style Selector="^ TextBlock#PART_Watermark, ^ TextBlock#PART_FloatingWatermark">
+                        <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerTextForegroundDisabled}" />
+                      </Style>
+                    </Style>
+                  </TextBox.Styles>
+                </TextBox>
+                <Button Name="PART_Button" 
+                        Theme="{StaticResource FluentCalendarDatePickerButton}"
+                        Grid.Column="1"
+                        Focusable="False" />
+                <Popup Name="PART_Popup"
+                       PlacementTarget="{TemplateBinding}"
+                       IsLightDismissEnabled="True">
+                  <Calendar Name="PART_Calendar" 
+                            FirstDayOfWeek="{TemplateBinding FirstDayOfWeek}" 
+                            IsTodayHighlighted="{TemplateBinding IsTodayHighlighted}"
+                            SelectedDate="{TemplateBinding SelectedDate, Mode=TwoWay}"
+                            DisplayDate="{TemplateBinding DisplayDate}" 
+                            DisplayDateStart="{TemplateBinding DisplayDateStart}"
+                            DisplayDateEnd="{TemplateBinding DisplayDateEnd}" />
+                </Popup>
+              </Grid>
+            </Panel>
+          </DataValidationErrors>
+        </ControlTemplate>
+      </Setter>
+     
+      <!-- Pressed State -->
+      <Style Selector="^:pressed /template/ Border#Background">
+        <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackgroundPressed}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrushPressed}" />
+      </Style>
+      
+      <!-- Pointer-over State -->
+      <Style Selector="^:pointerover /template/ Border#Background">
+        <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackgroundPointerOver}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrushPointerOver}" />
+      </Style>
 
-  <!-- Pointer-over State -->
-  <Style Selector="CalendarDatePicker:pointerover /template/ Border#Background">
-    <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackgroundPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrushPointerOver}" />
-  </Style>
+      <!-- Disabled State -->
+      <Style Selector="^:disabled /template/">
+        <Style Selector="^ Border#Background">
+          <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackgroundDisabled}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrushDisabled}" />
+        </Style>
+        
+        <Style Selector="^ Button#PART_Button">
+          <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerCalendarGlyphForegroundDisabled}" />
+        </Style>
 
-  <!-- Disabled State -->
-  <Style Selector="CalendarDatePicker:disabled /template/ Border#Background">
-    <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackgroundDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrushDisabled}" />
-  </Style>
+      </Style>
 
-  <Style Selector="CalendarDatePicker:disabled /template/ Button#PART_Button">
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerCalendarGlyphForegroundDisabled}" />
-  </Style>
-
-  <Style Selector="CalendarDatePicker:disabled /template/ TextBox#PART_TextBox:disabled /template/ Border#PART_BorderElement">
-    <!-- By default the TextBox has its own disabled state, override this to make the border background show through -->
-    <Setter Property="Background" Value="Transparent" />
-    <Setter Property="BorderBrush" Value="Transparent" />
-  </Style>
-
-  <Style Selector="CalendarDatePicker:disabled /template/ TextBox#PART_TextBox:disabled /template/ TextBlock#PART_Watermark,
-                   CalendarDatePicker:disabled /template/ TextBox#PART_TextBox:disabled /template/ TextBlock#PART_FloatingWatermark">
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerTextForegroundDisabled}" />
-  </Style>
-
-  <!-- Focused State -->
-  <Style Selector="CalendarDatePicker:focus-within:not(CalendarDatePicker:focus) /template/ Border#Background">
-    <Setter Property="Background" Value="{DynamicResource TextControlBackgroundFocused}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrushFocused}"/>
-    <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThicknessFocused}" />
-  </Style>
-
-  <Style Selector="CalendarDatePicker /template/ TextBox#PART_TextBox:focus /template/ Border#PART_BorderElement">
-    <!-- By default the TextBox has its own focused state, override this to disable it here -->
-    <Setter Property="Background" Value="Transparent"/>
-    <Setter Property="BorderBrush" Value="Transparent"/>
-    <Setter Property="BorderThickness" Value="0" />
-  </Style>
-
-  <!-- Error State -->
-  <Style Selector="CalendarDatePicker:error /template/ Border#Background">
-    <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
-  </Style>
-</Styles>
+      <!-- Focused State -->
+      <Style Selector="^:focus-within:not(CalendarDatePicker:focus) /template/ Border#Background">
+        <Setter Property="Background" Value="{DynamicResource TextControlBackgroundFocused}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrushFocused}" />
+        <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThicknessFocused}" />
+      </Style>
+      
+      <!-- Error State -->
+      <Style Selector="^:error /template/ Border#Background">
+        <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
+      </Style>
+    </ControlTheme>
+  
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/CalendarDayButton.xaml b/src/Avalonia.Themes.Fluent/Controls/CalendarDayButton.xaml
index 9223c0dd71..b119dd1355 100644
--- a/src/Avalonia.Themes.Fluent/Controls/CalendarDayButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/CalendarDayButton.xaml
@@ -1,116 +1,104 @@
-<!--
+<!--
 // (c) Copyright Microsoft Corporation.
 // This source is subject to the Microsoft Public License (Ms-PL).
 // Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
 // All other rights reserved.
 -->
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <ControlTheme x:Key="{x:Type CalendarDayButton}" TargetType="CalendarDayButton">
+      <Setter Property="ClickMode" Value="Release" />
+      <Setter Property="MinWidth" Value="40" />
+      <Setter Property="MinHeight" Value="40" />
+      <Setter Property="Margin" Value="1" />
+      <Setter Property="Padding" Value="0,0,0,0" />
+      <!--These are actually set on the CalendarView in WinUI-->
+      <Setter Property="Foreground" Value="{DynamicResource CalendarViewCalendarItemForeground}" />
+      <Setter Property="Background" Value="{DynamicResource CalendarViewCalendarItemRevealBackground}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewCalendarItemRevealBorderBrush}" />
+      <Setter Property="BorderThickness" Value="2" />
+      <Setter Property="FontSize" Value="20" />
+      <Setter Property="ClipToBounds" Value="False" />
+      <Setter Property="HorizontalContentAlignment" Value="Center" />
+      <Setter Property="VerticalContentAlignment" Value="Center" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Panel>
+            <!-- To mimic WinUI SystemFocusVisual, Focus visual is drawn outside the bounds of the item -->
+            <Border Name="Root" Background="{TemplateBinding Background}"
+                    BorderThickness="0" ClipToBounds="True">
 
-<Styles xmlns="https://github.com/avaloniaui">
-  <Style Selector="CalendarDayButton">
-    <Setter Property="ClickMode" Value="Release"/>
-    <Setter Property="MinWidth" Value="40"/>
-    <Setter Property="MinHeight" Value="40"/>
-    <Setter Property="Margin" Value="1"/>
-    <Setter Property="Padding" Value="0,0,0,0"/>
-    <!--These are actually set on the CalendarView in WinUI-->
-    <Setter Property="Foreground" Value="{DynamicResource CalendarViewCalendarItemForeground}"/>
-    <Setter Property="Background" Value="{DynamicResource CalendarViewCalendarItemRevealBackground}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewCalendarItemRevealBorderBrush}"/>
-    <Setter Property="BorderThickness" Value="2"/>
-    <Setter Property="FontSize" Value="20"/>
-    <Setter Property="ClipToBounds" Value="False"/>
-    <Setter Property="HorizontalContentAlignment" Value="Center"/>
-    <Setter Property="VerticalContentAlignment" Value="Center"/>
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Panel>
-          <!-- To mimic WinUI SystemFocusVisual, Focus visual is drawn outside the bounds of the item -->
-          <Border Name="Root" Background="{TemplateBinding Background}"
-                  BorderThickness="0" ClipToBounds="True">
+              <ContentControl Name="Content"
+                              ContentTemplate="{TemplateBinding ContentTemplate}"
+                              Content="{TemplateBinding Content}"
+                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                              FontSize="{TemplateBinding FontSize}"
+                              Margin="{TemplateBinding Padding}" />
+              
+            </Border>
+            
+            <!-- Drawn Border should render on top of background to preserve the 1px margin between items-->
+            <Border Name="Border"
+                    BorderThickness="2"
+                    BorderBrush="{TemplateBinding BorderBrush}" />
+          </Panel>
+        </ControlTemplate>
+      </Setter>
 
-            <ContentControl Name="Content"
-                  ContentTemplate="{TemplateBinding ContentTemplate}"
-                  Content="{TemplateBinding Content}"
-                  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                  VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                  FontSize="{TemplateBinding FontSize}"
-                  Margin="{TemplateBinding Padding}"/>
+      <Style Selector="^:pointerover /template/ Border#Border">
+        <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewHoverBorderBrush}" />
+      </Style>
 
-          </Border>
+      <Style Selector="^:pressed /template/ Border#Border">
+        <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewPressedBorderBrush}" />
+      </Style>
 
-          <!-- Drawn Border should render on top of background to preserve the 1px
-                        margin between items-->
-          <Border Name="Border"
-                  BorderThickness="2"
-                  BorderBrush="{TemplateBinding BorderBrush}"/>
+      <Style Selector="^:selected">
+        <Style Selector="^ /template/ Border#Border">
+          <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedBorderBrush}" />
+        </Style>
+        <Style Selector="^:pointerover /template/ Border#Border">
+          <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedHoverBorderBrush}" />
+        </Style>
+        <Style Selector="^:pressed /template/ Border#Border">
+          <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedPressedBorderBrush}" />
+        </Style>
+      </Style>
 
-          <!--Removed for now...WinUI doesn't have selection follow focus, and only uses 
-              focus visual w/ keyboard focus
-                <Border Name="FocusVisual" BorderThickness="2"
-                            BorderBrush="{DynamicResource SystemControlHighlightBaseHighBrush}"
-                            IsHitTestVisible="False"
-                            Margin="-2"  CornerRadius="2"/>-->
-        </Panel>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-  <!--<Style Selector="CalendarDayButton /template/ Border#FocusVisual">
-    <Setter Property="IsVisible" Value="False"/>
-  </Style>-->
+      <Style Selector="^:today">
+        <Style Selector="^ /template/ Border#Root">
+          <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
+        </Style>
+        <!-- These are probably set in code, but consistent -->
+        <Style Selector="^:pointerover /template/ Border#Border">
+          <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark1}" />
+        </Style>
+        <Style Selector="^:pressed /template/ Border#Border">
+          <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark2}" />
+        </Style>
+        <Style Selector="^ ContentControl#Content">
+          <Setter Property="Foreground" Value="{DynamicResource CalendarViewTodayForeground}" />
+          <Setter Property="FontWeight" Value="SemiBold" />
+        </Style>
+      </Style>
 
-  <Style Selector="CalendarDayButton:pointerover /template/ Border#Border">
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewHoverBorderBrush}"/>
-  </Style>
-  <Style Selector="CalendarDayButton:pressed /template/ Border#Border">
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewPressedBorderBrush}"/>
-  </Style>
-  <Style Selector="CalendarDayButton:selected /template/ Border#Border">
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedBorderBrush}"/>
-  </Style>
-  <Style Selector="CalendarDayButton:selected:pointerover /template/ Border#Border">
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedHoverBorderBrush}"/>
-  </Style>
-  <Style Selector="CalendarDayButton:selected:pressed /template/ Border#Border">
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedPressedBorderBrush}"/>
-  </Style>
+      <!-- WinUI calls this OutOfFocus -->
+      <Style Selector="^:inactive /template/">
+        <Style Selector="^ Border#Root">
+          <Setter Property="Background" Value="{DynamicResource CalendarViewOutOfScopeBackground}" />
+        </Style>
+        <Style Selector="^ ContentControl#Content">
+          <Setter Property="Foreground" Value="{DynamicResource CalendarViewOutOfScopeForeground}" />
+        </Style>
+      </Style>
 
-  <Style Selector="CalendarDayButton:today /template/ Border#Root">
-    <!-- These are probably set in code, but consistent -->
-    <Setter Property="Background">
-      <SolidColorBrush Color="{DynamicResource SystemAccentColor}"/>
-    </Setter>
-  </Style>
-  <Style Selector="CalendarDayButton:today:pointerover /template/ Border#Border">
-    <Setter Property="BorderBrush">
-      <SolidColorBrush Color="{DynamicResource SystemAccentColorDark1}"/>
-    </Setter>
-  </Style>
-  <Style Selector="CalendarDayButton:today:pressed /template/ Border#Border">
-    <Setter Property="BorderBrush">
-      <SolidColorBrush Color="{DynamicResource SystemAccentColorDark2}"/>
-    </Setter>
-  </Style>
-  <Style Selector="CalendarDayButton:today /template/ ContentControl#Content">
-    <Setter Property="Foreground" Value="{DynamicResource CalendarViewTodayForeground}"/>
-    <Setter Property="FontWeight" Value="SemiBold"/>
-  </Style>
+      <Style Selector="^:blackout /template/ ContentControl#Content">
+        <Setter Property="Foreground" Value="{DynamicResource CalendarViewBlackoutForeground}" />
+      </Style>
 
-  <!-- WinUI calls this OutOfFocus -->
-  <Style Selector="CalendarDayButton:inactive /template/ Border#Root">
-    <Setter Property="Background" Value="{DynamicResource CalendarViewOutOfScopeBackground}"/>
-  </Style>
-  <Style Selector="CalendarDayButton:inactive /template/ ContentControl#Content">
-    <Setter Property="Foreground" Value="{DynamicResource CalendarViewOutOfScopeForeground}"/>
-  </Style>
-
-  <Style Selector="CalendarDayButton:blackout /template/ ContentControl#Content">
-    <Setter Property="Foreground" Value="{DynamicResource CalendarViewBlackoutForeground}"/>
-  </Style>
-
-  <!--<Style Selector="CalendarDayButton:dayfocused /template/ Border#FocusVisual">
-            <Setter Property="IsVisible" Value="True"/>
-      </Style>-->
-  <Style Selector="CalendarDayButton:disabled /template/ ContentControl#Content">
-    <Setter Property="Foreground" Value="{DynamicResource CalendarViewWeekDayForegroundDisabled}"/>
-  </Style>
-</Styles>
+      <Style Selector="^:disabled /template/ ContentControl#Content">
+        <Setter Property="Foreground" Value="{DynamicResource CalendarViewWeekDayForegroundDisabled}" />
+      </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/CalendarItem.xaml b/src/Avalonia.Themes.Fluent/Controls/CalendarItem.xaml
index e8e2df03b4..f8fec58ef7 100644
--- a/src/Avalonia.Themes.Fluent/Controls/CalendarItem.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/CalendarItem.xaml
@@ -1,143 +1,150 @@
-<!--
+<!--
 // (c) Copyright Microsoft Corporation.
 // This source is subject to the Microsoft Public License (Ms-PL).
 // Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
 // All other rights reserved.
 -->
-
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         x:CompileBindings="True"
         x:DataType="CalendarItem">
-  <Design.PreviewWith>
-    <Border Padding="20">
-      <Calendar />
-    </Border>
-  </Design.PreviewWith>
-  <Style Selector="CalendarItem">
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="DayTitleTemplate">
-      <Template>
-        <TextBlock Text="{Binding}"
-                   HorizontalAlignment="Center"
-                   VerticalAlignment="Center"
-                   FontSize="12"/>
-      </Template>
-    </Setter>
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border BorderThickness="{TemplateBinding BorderThickness}"
-                Background="{TemplateBinding Background}"
-                BorderBrush="{TemplateBinding BorderBrush}"
-                CornerRadius="{TemplateBinding CornerRadius}">
-          <Border.Styles>
-            <Style Selector="Button.CalendarHeader">
-              <Setter Property="HorizontalAlignment" Value="Stretch" />
-              <Setter Property="VerticalAlignment" Value="Stretch" />
-              <Setter Property="VerticalContentAlignment" Value="Center" />
-              <Setter Property="FontSize" Value="20" />
-              <Setter Property="Background" Value="{DynamicResource CalendarViewNavigationButtonBackground}"/>
-              <Setter Property="Template">
-                <ControlTemplate>
-                  <!-- HCA was changed here to ensure nav arrows display correctly -->
-                  <ContentPresenter Name="Text" Background="{TemplateBinding Background}"
-                                    BorderBrush="{DynamicResource CalendarViewNavigationButtonBorderBrush}"
-                                    BorderThickness="{TemplateBinding BorderThickness}"
-                                    Content="{TemplateBinding Content}"
-                                    Margin="{TemplateBinding Padding}"
-                                    HorizontalContentAlignment="Stretch"
-                                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
-                </ControlTemplate>
-              </Setter>
-            </Style>
-            <Style Selector="Button.CalendarNavigation > Path">
-              <Setter Property="Stroke" Value="{DynamicResource CalendarViewForeground}"/>
-            </Style>
-            <Style Selector="Button.CalendarNavigation:pointerover > Path">
-              <Setter Property="Stroke" Value="{DynamicResource CalendarViewNavigationButtonForegroundPointerOver}"/>
-            </Style>
-            <Style Selector="Button.CalendarNavigation:pressed > Path">
-              <Setter Property="Stroke" Value="{DynamicResource CalendarViewNavigationButtonForegroundPressed}"/>
-            </Style>
-            <Style Selector="Button.CalendarHeader:pointerover /template/ ContentPresenter#Text">
-              <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewNavigationButtonBorderBrushPointerOver}" />
-              <Setter Property="Foreground" Value="{DynamicResource CalendarViewNavigationButtonForegroundPointerOver}"/>
-              <!-- Prevent base button template:pointerover from overriding background here -->
-              <Setter Property="Background" Value="{DynamicResource CalendarViewNavigationButtonBackground}"/>
-            </Style>
-            <Style Selector="Button.CalendarHeader:pressed /template/ ContentPresenter#Text">
-              <Setter Property="Foreground" Value="{DynamicResource CalendarViewNavigationButtonForegroundPressed}"/>
-              <!-- Prevent base button template:pointerover from overriding background here -->
-              <Setter Property="Background" Value="{DynamicResource CalendarViewNavigationButtonBackground}"/>
-            </Style>
-            <Style Selector="Button.CalendarHeader:disabled /template/ ContentPresenter">
-              <Setter Property="Foreground" Value="{DynamicResource CalendarViewWeekDayForegroundDisabled}"/>
-            </Style>
-          </Border.Styles>
-          <!--  To keep calendar from resizing when switching DisplayMode
-                In WinUI Min-Width from TemplateSettings
-                basically...MinWidth of DayItem = 40, 40 * 7 = 280 + margins/padding = ~294
-                Viewport height is set from # of rows displayed (2-8) in Month mode, = ~290 for 6 weeks (+ day names)
-                -->
-          <Grid VerticalAlignment="Stretch" HorizontalAlignment="Stretch" RowDefinitions="40,*" MinWidth="294">
-            <Grid ColumnDefinitions="5*,*,*">
-              <Button Name="HeaderButton" Classes="CalendarHeader" Foreground="{TemplateBinding Foreground}" Padding="12,0,0,0" HorizontalContentAlignment="Left" />
-              <Button Name="PreviousButton" Grid.Column="1" Classes="CalendarHeader CalendarNavigation" Foreground="{TemplateBinding Foreground}" Padding="1" HorizontalContentAlignment="Left">
-                <!--Path mimics Segoe MDL2 Assets font glyph used in WinUI-->
-                <Path StrokeThickness="1.5" Data="M 0,9 L 9,0 L 18,9"  HorizontalAlignment="Center" VerticalAlignment="Center"/>
-              </Button>
-              <Button Name="NextButton" Grid.Column="2" Classes="CalendarHeader CalendarNavigation" Foreground="{TemplateBinding Foreground}" Padding="1" HorizontalContentAlignment="Left">
-                <!--Path mimics Segoe MDL2 Assets font glyph used in WinUI-->
-                <Path StrokeThickness="1.5" Data="M 0,0 L 9,9 L 18,0" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-              </Button>
-            </Grid>
-            <Border Name="BackgroundLayer" Background="{TemplateBinding BorderBrush}" Grid.Row="1" />
-            <Grid Name="MonthView" Grid.Row="1" IsVisible="False" MinHeight="290" >
-              <Grid.RowDefinitions>
-                <!--This should always be the week day names??-->
-                <RowDefinition Height="38" />
-                <RowDefinition Height="Auto" />
-                <RowDefinition Height="Auto" />
-                <RowDefinition Height="Auto" />
-                <RowDefinition Height="Auto" />
-                <RowDefinition Height="Auto" />
-                <RowDefinition Height="Auto" />
-              </Grid.RowDefinitions>
-              <Grid.ColumnDefinitions>
-                <ColumnDefinition Width="Auto" />
-                <ColumnDefinition Width="Auto" />
-                <ColumnDefinition Width="Auto" />
-                <ColumnDefinition Width="Auto" />
-                <ColumnDefinition Width="Auto" />
-                <ColumnDefinition Width="Auto" />
-                <ColumnDefinition Width="Auto" />
-              </Grid.ColumnDefinitions>
-            </Grid>
-            <Grid Name="YearView" MinHeight="290"
-                    Grid.Row="1" IsVisible="False">
-              <Grid.RowDefinitions>
-                <RowDefinition Height="*" />
-                <RowDefinition Height="*" />
-                <RowDefinition Height="*" />
-              </Grid.RowDefinitions>
-              <Grid.ColumnDefinitions>
-                <ColumnDefinition Width="*" />
-                <ColumnDefinition Width="*" />
-                <ColumnDefinition Width="*" />
-                <ColumnDefinition Width="*" />
-              </Grid.ColumnDefinitions>
-            </Grid>
-
-          </Grid>
-
-        </Border>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-
-  <!-- BackgroundLayer shouldn't show in the week day names row-->
-  <Style Selector="Calendar[DisplayMode=Month] CalendarItem /template/ Border#BackgroundLayer">
-    <Setter Property="Margin" Value="0,38,0,0"/>
-  </Style>
+    <Design.PreviewWith>
+      <Border Padding="20">
+        <Calendar />
+      </Border>
+    </Design.PreviewWith>
   
-</Styles>
+    <ControlTheme x:Key="FluentCalendarItemButton" TargetType="Button">
+      <Setter Property="HorizontalAlignment" Value="Stretch" />
+      <Setter Property="VerticalAlignment" Value="Stretch" />
+      <Setter Property="VerticalContentAlignment" Value="Center" />
+      <Setter Property="FontSize" Value="20" />
+      <Setter Property="Background" Value="{DynamicResource CalendarViewNavigationButtonBackground}" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <!-- HCA was changed here to ensure nav arrows display correctly -->
+          <ContentPresenter Name="Text" Background="{TemplateBinding Background}"
+                            BorderBrush="{DynamicResource CalendarViewNavigationButtonBorderBrush}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
+                            Content="{TemplateBinding Content}"
+                            Margin="{TemplateBinding Padding}"
+                            HorizontalContentAlignment="Stretch"
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
+        </ControlTemplate>
+      </Setter>
+      
+      <Style Selector="^:pointerover /template/ ContentPresenter#Text">
+        <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewNavigationButtonBorderBrushPointerOver}" />
+        <Setter Property="Foreground" Value="{DynamicResource CalendarViewNavigationButtonForegroundPointerOver}" />
+      </Style>
+      <Style Selector="^:pressed /template/ ContentPresenter#Text">
+        <Setter Property="Foreground" Value="{DynamicResource CalendarViewNavigationButtonForegroundPressed}" />
+      </Style>
+      <Style Selector="^:disabled /template/ ContentPresenter">
+        <Setter Property="Foreground" Value="{DynamicResource CalendarViewWeekDayForegroundDisabled}" />
+      </Style>
+    </ControlTheme>
+
+    <ControlTheme x:Key="{x:Type CalendarItem}" TargetType="CalendarItem">
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="DayTitleTemplate">
+        <Template>
+          <TextBlock Text="{Binding}"
+                     HorizontalAlignment="Center"
+                     VerticalAlignment="Center"
+                     FontSize="12" />
+        </Template>
+      </Setter>
+      
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Border BorderThickness="{TemplateBinding BorderThickness}" 
+                  Background="{TemplateBinding Background}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
+                  CornerRadius="{TemplateBinding CornerRadius}">
+            <!-- To keep calendar from resizing when switching DisplayMode
+                 In WinUI Min-Width from TemplateSettings
+                 basically...MinWidth of DayItem = 40, 40 * 7 = 280 + margins/padding = ~294
+                 Viewport height is set from # of rows displayed (2-8) in Month mode, = ~290 for 6 weeks (+ day names)
+                 -->
+            <Grid VerticalAlignment="Stretch" HorizontalAlignment="Stretch" RowDefinitions="40,*" MinWidth="294">
+              <Grid ColumnDefinitions="5*,*,*">
+                <Button Name="HeaderButton" 
+                        Theme="{StaticResource FluentCalendarItemButton}"
+                        Foreground="{TemplateBinding Foreground}"
+                        Padding="12,0,0,0"
+                        HorizontalContentAlignment="Left" />
+                <Button Name="PreviousButton"
+                        Grid.Column="1"
+                        Theme="{StaticResource FluentCalendarItemButton}"
+                        Foreground="{TemplateBinding Foreground}"
+                        Padding="1"
+                        HorizontalContentAlignment="Left">
+                  <!--Path mimics Segoe MDL2 Assets font glyph used in WinUI-->
+                  <Path StrokeThickness="1.5" Data="M 0,9 L 9,0 L 18,9" HorizontalAlignment="Center" VerticalAlignment="Center" />
+                </Button>
+                <Button Name="NextButton"
+                        Grid.Column="2"
+                        Theme="{StaticResource FluentCalendarItemButton}"
+                        Foreground="{TemplateBinding Foreground}" 
+                        Padding="1"
+                        HorizontalContentAlignment="Left">
+                  <!--Path mimics Segoe MDL2 Assets font glyph used in WinUI-->
+                  <Path StrokeThickness="1.5" Data="M 0,0 L 9,9 L 18,0" HorizontalAlignment="Center" VerticalAlignment="Center" />
+                </Button>
+              </Grid>
+              <!--Border below is used only for MonthView but it can't be moved inside of Grid because CalendarItem expects it to be empty and it will cause side-effects-->
+              <Border Name="BackgroundLayer" Background="{TemplateBinding BorderBrush}" Margin="0,38,0,0" IsVisible="{ReflectionBinding #MonthView.IsVisible}" Grid.Row="1" />
+              <Grid Name="MonthView" Grid.Row="1" IsVisible="False" MinHeight="290">
+                <Grid.RowDefinitions>
+                  <!--This should always be the week day names??-->
+                  <RowDefinition Height="38" />
+                  <RowDefinition Height="Auto" />
+                  <RowDefinition Height="Auto" />
+                  <RowDefinition Height="Auto" />
+                  <RowDefinition Height="Auto" />
+                  <RowDefinition Height="Auto" />
+                  <RowDefinition Height="Auto" />
+                </Grid.RowDefinitions>
+                <Grid.ColumnDefinitions>
+                  <ColumnDefinition Width="Auto" />
+                  <ColumnDefinition Width="Auto" />
+                  <ColumnDefinition Width="Auto" />
+                  <ColumnDefinition Width="Auto" />
+                  <ColumnDefinition Width="Auto" />
+                  <ColumnDefinition Width="Auto" />
+                  <ColumnDefinition Width="Auto" />
+                </Grid.ColumnDefinitions>
+              </Grid>
+              <Grid Name="YearView"
+                    Background="{TemplateBinding BorderBrush}"
+                    MinHeight="290"
+                    Grid.Row="1"
+                    IsVisible="False">
+                <Grid.RowDefinitions>
+                  <RowDefinition Height="*" />
+                  <RowDefinition Height="*" />
+                  <RowDefinition Height="*" />
+                </Grid.RowDefinitions>
+                <Grid.ColumnDefinitions>
+                  <ColumnDefinition Width="*" />
+                  <ColumnDefinition Width="*" />
+                  <ColumnDefinition Width="*" />
+                  <ColumnDefinition Width="*" />
+                </Grid.ColumnDefinitions>
+              </Grid>
+            </Grid>
+          </Border>
+        </ControlTemplate>
+      </Setter>
+      <Style Selector="^ /template/ Button > Path">
+        <Setter Property="Stroke" Value="{DynamicResource CalendarViewForeground}" />
+      </Style>
+      <Style Selector="^ /template/ Button:pointerover > Path">
+        <Setter Property="Stroke" Value="{DynamicResource CalendarViewNavigationButtonForegroundPointerOver}" />
+      </Style>
+      <Style Selector="^ /template/ Button:pressed > Path">
+        <Setter Property="Stroke" Value="{DynamicResource CalendarViewNavigationButtonForegroundPressed}" />
+      </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/CaptionButtons.xaml b/src/Avalonia.Themes.Fluent/Controls/CaptionButtons.xaml
index 62874f4884..3c45de18c6 100644
--- a/src/Avalonia.Themes.Fluent/Controls/CaptionButtons.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/CaptionButtons.xaml
@@ -1,72 +1,57 @@
-<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Style Selector="CaptionButtons">    
-    <Setter Property="MaxHeight" Value="30" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <StackPanel Spacing="2" VerticalAlignment="Stretch" TextElement.FontSize="10" Orientation="Horizontal">
-          <StackPanel.Styles>
-            <Style Selector="Panel">
-              <Setter Property="Width" Value="45" />
-              <Setter Property="Background" Value="Transparent" />
-            </Style>
-            <Style Selector="Panel:pointerover">
-              <Setter Property="Background" Value="#7F7f7f7f" />
-            </Style>
-            <Style Selector="Panel#PART_CloseButton:pointerover">
-              <Setter Property="Background" Value="#7FFF0000" />
-            </Style>
-            <Style Selector="Viewbox">
-              <Setter Property="Width" Value="11" />
-              <Setter Property="Margin" Value="2" />
-            </Style>
-          </StackPanel.Styles>
-          <Panel x:Name="PART_FullScreenButton">
-            <Viewbox>
-              <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}" />
-            </Viewbox>
-          </Panel>
-
-          <Panel x:Name="PART_MinimiseButton">
-            <Viewbox>
-              <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}" Data="M2048 1229v-205h-2048v205h2048z" />
-            </Viewbox>
-          </Panel>
-
-          <Panel x:Name="PART_RestoreButton">
-            <Viewbox>
-              <Viewbox.RenderTransform>
-                <RotateTransform Angle="-90" />
-              </Viewbox.RenderTransform>
-              <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}"/>
-            </Viewbox>
-          </Panel>
-
-          <Panel x:Name="PART_CloseButton">
-            <Viewbox>
-              <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}" Data="M1169 1024l879 -879l-145 -145l-879 879l-879 -879l-145 145l879 879l-879 879l145 145l879 -879l879 879l145 -145z" />
-            </Viewbox>
-          </Panel>
-        </StackPanel>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-  <Style Selector="CaptionButtons Panel#PART_RestoreButton Path">
-    <Setter Property="Data" Value="M2048 2048v-2048h-2048v2048h2048zM1843 1843h-1638v-1638h1638v1638z" />
-  </Style>
-  <Style Selector="CaptionButtons:maximized Panel#PART_RestoreButton Path">
-    <Setter Property="Data" Value="M2048 410h-410v-410h-1638v1638h410v410h1638v-1638zM1434 1434h-1229v-1229h1229v1229zM1843 1843h-1229v-205h1024v-1024h205v1229z" />
-  </Style>
-  <Style Selector="CaptionButtons Panel#PART_FullScreenButton">
-    <Setter Property="IsVisible" Value="False" />
-  </Style>
-  <Style Selector="CaptionButtons Panel#PART_FullScreenButton Path">
-    <Setter Property="Data" Value="M2048 2048v-819h-205v469l-1493 -1493h469v-205h-819v819h205v-469l1493 1493h-469v205h819z" />
-  </Style>
-  <Style Selector="CaptionButtons:fullscreen Panel#PART_FullScreenButton Path">
-    <Setter Property="IsVisible" Value="True" />
-    <Setter Property="Data" Value="M205 1024h819v-819h-205v469l-674 -674l-145 145l674 674h-469v205zM1374 1229h469v-205h-819v819h205v-469l674 674l145 -145z" />
-  </Style>
-  <Style Selector="CaptionButtons:fullscreen Panel#PART_RestoreButton, CaptionButtons:fullscreen Panel#PART_MinimiseButton">
-    <Setter Property="IsVisible" Value="False" />
-  </Style>
- </Styles>
+<ResourceDictionary 
+  xmlns="https://github.com/avaloniaui" 
+  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <ControlTheme x:Key="{x:Type CaptionButtons}" TargetType="CaptionButtons">
+      <Setter Property="MaxHeight" Value="30" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <StackPanel Spacing="2" VerticalAlignment="Stretch" TextElement.FontSize="10" Orientation="Horizontal">
+            <StackPanel.Styles>
+              <Style Selector="Panel:pointerover">
+                <Setter Property="Background" Value="#7F7f7f7f" />
+              </Style>
+              <Style Selector="Panel#PART_CloseButton:pointerover">
+                <Setter Property="Background" Value="#7FFF0000" />
+              </Style>
+            </StackPanel.Styles>
+            <Panel x:Name="PART_FullScreenButton" IsVisible="False" Width="45" Background="Transparent">
+              <Viewbox Width="11" Margin="2">
+                <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}" Data="M2048 2048v-819h-205v469l-1493 -1493h469v-205h-819v819h205v-469l1493 1493h-469v205h819z" />
+              </Viewbox>
+            </Panel>
+            <Panel x:Name="PART_MinimiseButton" Width="45" Background="Transparent">
+              <Viewbox Width="11" Margin="2">
+                <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}" Data="M2048 1229v-205h-2048v205h2048z" />
+              </Viewbox>
+            </Panel>
+            <Panel x:Name="PART_RestoreButton" Width="45" Background="Transparent">
+              <Viewbox Width="11" Margin="2">
+                <Viewbox.RenderTransform>
+                  <RotateTransform Angle="-90" />
+                </Viewbox.RenderTransform>
+                <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}" Data="M2048 2048v-2048h-2048v2048h2048zM1843 1843h-1638v-1638h1638v1638z"/>
+              </Viewbox>
+            </Panel>
+            <Panel x:Name="PART_CloseButton" Width="45" Background="Transparent">
+              <Viewbox Width="11" Margin="2">
+                <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}" Data="M1169 1024l879 -879l-145 -145l-879 879l-879 -879l-145 145l879 879l-879 879l145 145l879 -879l879 879l145 -145z" />
+              </Viewbox>
+            </Panel>
+          </StackPanel>
+        </ControlTemplate>
+      </Setter>
+      <Style Selector="^:maximized /template/ Panel#PART_RestoreButton Path">
+        <Setter Property="Data" Value="M2048 410h-410v-410h-1638v1638h410v410h1638v-1638zM1434 1434h-1229v-1229h1229v1229zM1843 1843h-1229v-205h1024v-1024h205v1229z" />
+      </Style>
+      <Style Selector="^:fullscreen /template/ Panel#PART_FullScreenButton Path">
+        <Setter Property="IsVisible" Value="True" />
+        <Setter Property="Data" Value="M205 1024h819v-819h-205v469l-674 -674l-145 145l674 674h-469v205zM1374 1229h469v-205h-819v819h205v-469l674 674l145 -145z" />
+      </Style>
+      <Style Selector="^:fullscreen /template/ Panel#PART_RestoreButton">
+        <Setter Property="IsVisible" Value="False" />
+      </Style>
+      <Style Selector="^:fullscreen /template/ Panel#PART_MinimiseButton">
+        <Setter Property="IsVisible" Value="False" />
+      </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/Carousel.xaml b/src/Avalonia.Themes.Fluent/Controls/Carousel.xaml
index baba0649aa..6c05a62250 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Carousel.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Carousel.xaml
@@ -1,17 +1,20 @@
-<Style xmlns="https://github.com/avaloniaui" Selector="Carousel">
-  <Setter Property="Template">
-    <ControlTemplate>
-      <Border Background="{TemplateBinding Background}"
-              BorderBrush="{TemplateBinding BorderBrush}"
-              BorderThickness="{TemplateBinding BorderThickness}"
-              CornerRadius="{TemplateBinding CornerRadius}">
-        <CarouselPresenter IsVirtualized="{TemplateBinding IsVirtualized}"
-                           Items="{TemplateBinding Items}"
-                           ItemsPanel="{TemplateBinding ItemsPanel}"
-                           Margin="{TemplateBinding Padding}"
-                           SelectedIndex="{TemplateBinding SelectedIndex}"
-                           PageTransition="{TemplateBinding PageTransition}"/>
-      </Border>
-    </ControlTemplate>
-  </Setter>
-</Style>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <ControlTheme x:Key="{x:Type Carousel}" TargetType="Carousel">
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Border Background="{TemplateBinding Background}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
+                  CornerRadius="{TemplateBinding CornerRadius}">
+            <CarouselPresenter IsVirtualized="{TemplateBinding IsVirtualized}"
+                               Items="{TemplateBinding Items}"
+                               ItemsPanel="{TemplateBinding ItemsPanel}"
+                               Margin="{TemplateBinding Padding}"
+                               SelectedIndex="{TemplateBinding SelectedIndex}"
+                               PageTransition="{TemplateBinding PageTransition}"/>
+          </Border>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/CheckBox.xaml b/src/Avalonia.Themes.Fluent/Controls/CheckBox.xaml
index e9830fb228..2eee425cb0 100644
--- a/src/Avalonia.Themes.Fluent/Controls/CheckBox.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/CheckBox.xaml
@@ -1,297 +1,293 @@
-<Style xmlns="https://github.com/avaloniaui"
-       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-       Selector="CheckBox">
-  <Design.PreviewWith>
-    <Border Padding="20">
-      <CheckBox IsThreeState="True" IsChecked="True" Content="Content" Foreground="Gold" />
-    </Border>
-  </Design.PreviewWith>
-  
-  <Setter Property="Padding" Value="8,0,0,0" />
-  <Setter Property="HorizontalAlignment" Value="Left" />
-  <Setter Property="VerticalAlignment" Value="Center" />
-  <Setter Property="HorizontalContentAlignment" Value="Left" />
-  <Setter Property="VerticalContentAlignment" Value="Center" />    
-  <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-  <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-  <Setter Property="MinHeight" Value="32" />
-  <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUnchecked}" />
-  <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUnchecked}" />
-  <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUnchecked}" />
-  <Setter Property="Template">
-    <ControlTemplate>
-      <Grid x:Name="RootGrid" ColumnDefinitions="20,*">
-        <Border x:Name="PART_Border"
-                Grid.ColumnSpan="2"
-                Background="{TemplateBinding Background}"
-                BorderBrush="{TemplateBinding BorderBrush}"
-                BorderThickness="{TemplateBinding BorderThickness}"
-                CornerRadius="{TemplateBinding CornerRadius}" />
-
-        <Grid VerticalAlignment="Top" Height="32">
-          <Border x:Name="NormalRectangle"
-              BorderThickness="{DynamicResource CheckBoxBorderThemeThickness}"
-              CornerRadius="{TemplateBinding CornerRadius}"
-              UseLayoutRounding="False"
-              Height="20"
-              Width="20" />
-
-          <Viewbox UseLayoutRounding="False">
-            <Panel>
-              <Panel Height="16" Width="16" />
-              <Path x:Name="CheckGlyph" Stretch="Uniform" VerticalAlignment="Center" />
-            </Panel>
-          </Viewbox>
-        </Grid>
-        <ContentPresenter x:Name="ContentPresenter"
-                        ContentTemplate="{TemplateBinding ContentTemplate}"
-                        Content="{TemplateBinding Content}"
-                        Margin="{TemplateBinding Padding}"
-                        RecognizesAccessKey="True"
-                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                        Grid.Column="1" />
-        <!-- TODO: TextWrapping="Wrap" on contentpresenter -->
-      </Grid>
-    </ControlTemplate>
-  </Setter>
-
-  <!-- Unchecked Normal State -->
-  <Style Selector="^ /template/ Border#NormalRectangle">
-    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUnchecked}" />
-    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUnchecked}" />
-  </Style>
-
-  <Style Selector="^ /template/ Path#CheckGlyph">
-    <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUnchecked}" />
-    <Setter Property="Opacity" Value="0" />
-  </Style>
-
-  <!-- Unchecked PointerOver State -->
-  <Style Selector="^:pointerover">
-    <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-      <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUncheckedPointerOver}" />
-    </Style>
-
-    <Style Selector="^ /template/ Border#PART_Border">
-      <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUncheckedPointerOver}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUncheckedPointerOver}" />
-    </Style>
-
-    <Style Selector="^ /template/ Border#NormalRectangle">
-      <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUncheckedPointerOver}" />
-      <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUncheckedPointerOver}" />
-    </Style>
-
-    <Style Selector="^ /template/ Path#CheckGlyph">
-      <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUncheckedPointerOver}" />
-    </Style>
-  </Style>
-
-  <!-- Unchecked Pressed State -->
-  <Style Selector="^:pressed">
-    <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-      <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUncheckedPressed}" />
-    </Style>
-
-    <Style Selector="^ /template/ Border#PART_Border">
-      <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUncheckedPressed}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUncheckedPressed}" />
-    </Style>
-
-    <Style Selector="^ /template/ Border#NormalRectangle">
-      <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUncheckedPressed}" />
-      <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUncheckedPressed}" />
-    </Style>
-
-    <Style Selector="^ /template/ Path#CheckGlyph">
-      <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUncheckedPressed}" />
-    </Style>
-  </Style>
-
-  <!-- Unchecked Disabled state -->
-  <Style Selector="^:disabled">
-    <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-      <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUncheckedDisabled}" />
-    </Style>
-
-    <Style Selector="^ /template/ Border#PART_Border">
-      <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUncheckedDisabled}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUncheckedDisabled}" />
-    </Style>
-
-    <Style Selector="^ /template/ Border#NormalRectangle">
-      <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUncheckedDisabled}" />
-      <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUncheckedDisabled}" />
-    </Style>
-
-    <Style Selector="^ /template/ Path#CheckGlyph">
-      <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUncheckedDisabled}" />
-    </Style>
-  </Style>
-
-  <Style Selector="^:checked">
-    <!-- Checked Normal State -->
-    <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundChecked}" />
-    <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundChecked}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushChecked}" />
-
-    <Style Selector="^ /template/ Border#NormalRectangle">
-      <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundFillChecked}" />
-      <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillChecked}" />
-    </Style>
-
-    <Style Selector="^ /template/ Path#CheckGlyph">
-      <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundChecked}" />
-      <Setter Property="Data" Value="M1507 31L438 1101L-119 543L-29 453L438 919L1417 -59L1507 31Z" />
-      <Setter Property="Width" Value="9" />
-      <Setter Property="Opacity" Value="1" />
-      <Setter Property="FlowDirection" Value="LeftToRight" />
-    </Style>
-
-    <!-- Checked PointerOver State -->
-    <Style Selector="^:pointerover">
-      <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-        <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundCheckedPointerOver}" />
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <Design.PreviewWith>
+      <Border Padding="20">
+        <CheckBox IsThreeState="True" IsChecked="True" Content="Content" Foreground="Gold" />
+      </Border>
+    </Design.PreviewWith>
+
+    <ControlTheme x:Key="{x:Type CheckBox}" TargetType="CheckBox">
+      <Setter Property="Padding" Value="8,0,0,0" />
+      <Setter Property="HorizontalAlignment" Value="Left" />
+      <Setter Property="VerticalAlignment" Value="Center" />
+      <Setter Property="HorizontalContentAlignment" Value="Left" />
+      <Setter Property="VerticalContentAlignment" Value="Center" />
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="MinHeight" Value="32" />
+      <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUnchecked}" />
+      <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUnchecked}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUnchecked}" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Grid x:Name="RootGrid" ColumnDefinitions="20,*">
+            <Border x:Name="PART_Border"
+                    Grid.ColumnSpan="2"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    CornerRadius="{TemplateBinding CornerRadius}" />
+
+            <Grid VerticalAlignment="Top" Height="32">
+              <Border x:Name="NormalRectangle"
+                      BorderBrush="{DynamicResource CheckBoxCheckBackgroundStrokeUnchecked}"
+                      Background="{DynamicResource CheckBoxCheckBackgroundFillUnchecked}"
+                      BorderThickness="{DynamicResource CheckBoxBorderThemeThickness}"
+                      CornerRadius="{TemplateBinding CornerRadius}"
+                      UseLayoutRounding="False"
+                      Height="20"
+                      Width="20" />
+
+              <Viewbox UseLayoutRounding="False">
+                <Panel>
+                  <Panel Height="16" Width="16" />
+                  <Path x:Name="CheckGlyph" 
+                        Opacity="0" 
+                        Fill="{DynamicResource CheckBoxCheckGlyphForegroundUnchecked}" 
+                        Stretch="Uniform" 
+                        VerticalAlignment="Center" />
+                </Panel>
+              </Viewbox>
+            </Grid>
+            <ContentPresenter x:Name="ContentPresenter"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
+                            Content="{TemplateBinding Content}"
+                            Margin="{TemplateBinding Padding}"
+                            RecognizesAccessKey="True"
+                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                            Grid.Column="1" />
+            <!-- TODO: TextWrapping="Wrap" on contentpresenter -->
+          </Grid>
+        </ControlTemplate>
+      </Setter>
+
+      <!-- Unchecked PointerOver State -->
+      <Style Selector="^:pointerover /template/">
+        <Style Selector="^ ContentPresenter#ContentPresenter">
+          <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUncheckedPointerOver}" />
+        </Style>
+
+        <Style Selector="^ Border#PART_Border">
+          <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUncheckedPointerOver}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUncheckedPointerOver}" />
+        </Style>
+
+        <Style Selector="^ Border#NormalRectangle">
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUncheckedPointerOver}" />
+          <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUncheckedPointerOver}" />
+        </Style>
+
+        <Style Selector="^ Path#CheckGlyph">
+          <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUncheckedPointerOver}" />
+        </Style>
       </Style>
 
-      <Style Selector="^ /template/ Border#PART_Border">
-        <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundCheckedPointerOver}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushCheckedPointerOver}" />
+      <!-- Unchecked Pressed State -->
+      <Style Selector="^:pressed /template/">
+        <Style Selector="^ ContentPresenter#ContentPresenter">
+          <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUncheckedPressed}" />
+        </Style>
+
+        <Style Selector="^ Border#PART_Border">
+          <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUncheckedPressed}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUncheckedPressed}" />
+        </Style>
+
+        <Style Selector="^ Border#NormalRectangle">
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUncheckedPressed}" />
+          <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUncheckedPressed}" />
+        </Style>
+
+        <Style Selector="^ Path#CheckGlyph">
+          <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUncheckedPressed}" />
+        </Style>
       </Style>
 
-      <Style Selector="^ /template/ Border#NormalRectangle">
-        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeCheckedPointerOver}" />
-        <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillCheckedPointerOver}" />
+      <!-- Unchecked Disabled state -->
+      <Style Selector="^:disabled /template/">
+        <Style Selector="^ ContentPresenter#ContentPresenter">
+          <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUncheckedDisabled}" />
+        </Style>
+
+        <Style Selector="^ Border#PART_Border">
+          <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUncheckedDisabled}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUncheckedDisabled}" />
+        </Style>
+
+        <Style Selector="^ Border#NormalRectangle">
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUncheckedDisabled}" />
+          <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUncheckedDisabled}" />
+        </Style>
+
+        <Style Selector="^ Path#CheckGlyph">
+          <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUncheckedDisabled}" />
+        </Style>
       </Style>
 
-      <Style Selector="^ /template/ Path#CheckGlyph">
-        <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundCheckedPointerOver}" />
+      <Style Selector="^:checked">
+        <!-- Checked Normal State -->
+        <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundChecked}" />
+        <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundChecked}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushChecked}" />
+
+        <Style Selector="^ /template/ Border#NormalRectangle">
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundFillChecked}" />
+          <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillChecked}" />
+        </Style>
+
+        <Style Selector="^ /template/ Path#CheckGlyph">
+          <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundChecked}" />
+          <Setter Property="Data" Value="M1507 31L438 1101L-119 543L-29 453L438 919L1417 -59L1507 31Z" />
+          <Setter Property="Width" Value="9" />
+          <Setter Property="Opacity" Value="1" />
+          <Setter Property="FlowDirection" Value="LeftToRight" />
+        </Style>
+
+        <!-- Checked PointerOver State -->
+        <Style Selector="^:pointerover /template/">
+          <Style Selector="^ ContentPresenter#ContentPresenter">
+            <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundCheckedPointerOver}" />
+          </Style>
+
+          <Style Selector="^ Border#PART_Border">
+            <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundCheckedPointerOver}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushCheckedPointerOver}" />
+          </Style>
+
+          <Style Selector="^ Border#NormalRectangle">
+            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeCheckedPointerOver}" />
+            <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillCheckedPointerOver}" />
+          </Style>
+
+          <Style Selector="^ Path#CheckGlyph">
+            <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundCheckedPointerOver}" />
+          </Style>
+        </Style>
+
+        <!-- Checked Pressed State -->
+        <Style Selector="^:pressed /template/">
+          <Style Selector="^ ContentPresenter#ContentPresenter">
+            <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundCheckedPressed}" />
+          </Style>
+
+          <Style Selector="^ Border#PART_Border">
+            <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundCheckedPressed}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushCheckedPressed}" />
+          </Style>
+
+          <Style Selector="^ Border#NormalRectangle">
+            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeCheckedPressed}" />
+            <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillCheckedPressed}" />
+          </Style>
+
+          <Style Selector="^ Path#CheckGlyph">
+            <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundCheckedPressed}" />
+          </Style>
+        </Style>
+
+        <!-- Checked Disabled State -->
+        <Style Selector="^:disabled /template/">
+          <Style Selector="^ ContentPresenter#ContentPresenter">
+            <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundCheckedDisabled}" />
+          </Style>
+
+          <Style Selector="^ Border#PART_Border">
+            <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundCheckedDisabled}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushCheckedDisabled}" />
+          </Style>
+
+          <Style Selector="^ Border#NormalRectangle">
+            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeCheckedDisabled}" />
+            <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillCheckedDisabled}" />
+          </Style>
+
+          <Style Selector="^ Path#CheckGlyph">
+            <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundCheckedDisabled}" />
+          </Style>
+        </Style>
       </Style>
-    </Style>
 
-    <!-- Checked Pressed State -->
-    <Style Selector="^:pressed">
-      <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-        <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundCheckedPressed}" />
+      <Style Selector="^:indeterminate">
+        <!-- Indeterminate Normal State -->
+        <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminate}" />
+        <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminate}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminate}" />
+
+        <Style Selector="^ /template/ Border#NormalRectangle">
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminate}" />
+          <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminate}" />
+        </Style>
+
+        <Style Selector="^ /template/ Path#CheckGlyph">
+          <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminate}" />
+          <Setter Property="Data" Value="M1536 1536v-1024h-1024v1024h1024z" />
+          <Setter Property="Width" Value="7" />
+          <Setter Property="Opacity" Value="1" />
+        </Style>
+
+        <!-- Indeterminate PointerOver State -->
+        <Style Selector="^:pointerover /template/">
+          <Style Selector="^ ContentPresenter#ContentPresenter">
+            <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminatePointerOver}" />
+          </Style>
+
+          <Style Selector="^ Border#PART_Border">
+            <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminatePointerOver}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminatePointerOver}" />
+          </Style>
+
+          <Style Selector="^ Border#NormalRectangle">
+            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminatePointerOver}" />
+            <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminatePointerOver}" />
+          </Style>
+
+          <Style Selector="^ Path#CheckGlyph">
+            <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminatePointerOver}" />
+          </Style>
+        </Style>
+
+        <!-- Indeterminate Pressed State -->
+        <Style Selector="^:pressed /template/">
+          <Style Selector="^ ContentPresenter#ContentPresenter">
+            <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminatePressed}" />
+          </Style>
+
+          <Style Selector="^ Border#PART_Border">
+            <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminatePressed}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminatePressed}" />
+          </Style>
+
+          <Style Selector="^ Border#NormalRectangle">
+            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminatePressed}" />
+            <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminatePressed}" />
+          </Style>
+
+          <Style Selector="^ Path#CheckGlyph">
+            <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminatePressed}" />
+          </Style>
+        </Style>
+
+        <!-- Indeterminate Disabled State -->
+        <Style Selector="^:disabled /template/">
+          <Style Selector="^ ContentPresenter#ContentPresenter">
+            <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminateDisabled}" />
+          </Style>
+
+          <Style Selector="^ Border#PART_Border">
+            <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminateDisabled}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminateDisabled}" />
+          </Style>
+
+          <Style Selector="^ Border#NormalRectangle">
+            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminateDisabled}" />
+            <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminateDisabled}" />
+          </Style>
+
+          <Style Selector="^ Path#CheckGlyph">
+            <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminateDisabled}" />
+          </Style>
+        </Style>
       </Style>
-
-      <Style Selector="^ /template/ Border#PART_Border">
-        <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundCheckedPressed}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushCheckedPressed}" />
-      </Style>
-
-      <Style Selector="^ /template/ Border#NormalRectangle">
-        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeCheckedPressed}" />
-        <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillCheckedPressed}" />
-      </Style>
-
-      <Style Selector="^ /template/ Path#CheckGlyph">
-        <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundCheckedPressed}" />
-      </Style>
-    </Style>
-
-    <!-- Checked Disabled State -->
-    <Style Selector="^:disabled">
-      <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-        <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundCheckedDisabled}" />
-      </Style>
-
-      <Style Selector="^ /template/ Border#PART_Border">
-        <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundCheckedDisabled}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushCheckedDisabled}" />
-      </Style>
-
-      <Style Selector="^ /template/ Border#NormalRectangle">
-        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeCheckedDisabled}" />
-        <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillCheckedDisabled}" />
-      </Style>
-
-      <Style Selector="^ /template/ Path#CheckGlyph">
-        <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundCheckedDisabled}" />
-      </Style>
-    </Style>
-  </Style>
-
-  <Style Selector="^:indeterminate">
-    <!-- Indeterminate Normal State -->
-    <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminate}" />
-    <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminate}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminate}" />
-
-    <Style Selector="^ /template/ Border#NormalRectangle">
-      <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminate}" />
-      <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminate}" />
-    </Style>
-
-    <Style Selector="^ /template/ Path#CheckGlyph">
-      <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminate}" />
-      <Setter Property="Data" Value="M1536 1536v-1024h-1024v1024h1024z" />
-      <Setter Property="Width" Value="7" />
-      <Setter Property="Opacity" Value="1" />
-    </Style>
-
-    <!-- Indeterminate PointerOver State -->
-    <Style Selector="^:pointerover">
-      <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-        <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminatePointerOver}" />
-      </Style>
-
-      <Style Selector="^ /template/ Border#PART_Border">
-        <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminatePointerOver}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminatePointerOver}" />
-      </Style>
-
-      <Style Selector="^ /template/ Border#NormalRectangle">
-        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminatePointerOver}" />
-        <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminatePointerOver}" />
-      </Style>
-
-      <Style Selector="^ /template/ Path#CheckGlyph">
-        <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminatePointerOver}" />
-      </Style>
-    </Style>
-
-    <!-- Indeterminate Pressed State -->
-    <Style Selector="^:pressed">
-      <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-        <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminatePressed}" />
-      </Style>
-
-      <Style Selector="^ /template/ Border#PART_Border">
-        <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminatePressed}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminatePressed}" />
-      </Style>
-
-      <Style Selector="^ /template/ Border#NormalRectangle">
-        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminatePressed}" />
-        <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminatePressed}" />
-      </Style>
-
-      <Style Selector="^ /template/ Path#CheckGlyph">
-        <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminatePressed}" />
-      </Style>
-    </Style>
-
-    <!-- Indeterminate Disabled State -->
-    <Style Selector="^:disabled">
-      <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-        <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminateDisabled}" />
-      </Style>
-
-      <Style Selector="^ /template/ Border#PART_Border">
-        <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminateDisabled}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminateDisabled}" />
-      </Style>
-
-      <Style Selector="^ /template/ Border#NormalRectangle">
-        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminateDisabled}" />
-        <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminateDisabled}" />
-      </Style>
-
-      <Style Selector="^ /template/ Path#CheckGlyph">
-        <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminateDisabled}" />
-      </Style>
-    </Style>
-  </Style>
-</Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml b/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
index 93ecc438eb..2dc7439001 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
@@ -1,232 +1,228 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Design.PreviewWith>
-    <Border Padding="20">
-      <StackPanel Spacing="10">
-        <ComboBox PlaceholderText="Select an item">
-          <ComboBoxItem>Item 1</ComboBoxItem>
-          <ComboBoxItem>Item 2</ComboBoxItem>
-        </ComboBox>
-        <ComboBox IsEnabled="False"
-                  Width="200"
-                  SelectedIndex="1"
-                  HorizontalContentAlignment="Center">
-          <ComboBoxItem>Item 1</ComboBoxItem>
-          <ComboBoxItem>Item 2</ComboBoxItem>
-        </ComboBox>
-      </StackPanel>
-    </Border>
-  </Design.PreviewWith>
-  <Styles.Resources>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <Design.PreviewWith>
+      <Border Padding="20">
+        <StackPanel Spacing="10">
+          <ComboBox PlaceholderText="Select an item">
+            <ComboBoxItem>Item 1</ComboBoxItem>
+            <ComboBoxItem>Item 2</ComboBoxItem>
+          </ComboBox>
+          <ComboBox IsEnabled="False" 
+                    Width="200" 
+                    SelectedIndex="1" 
+                    HorizontalContentAlignment="Center">
+            <ComboBoxItem>Item 1</ComboBoxItem>
+            <ComboBoxItem>Item 2</ComboBoxItem>
+          </ComboBox>
+        </StackPanel>
+      </Border>
+    </Design.PreviewWith>
+  
     <Thickness x:Key="ComboBoxTopHeaderMargin">0,0,0,4</Thickness>
     <x:Int32 x:Key="ComboBoxPopupMaxNumberOfItems">15</x:Int32>
     <x:Int32 x:Key="ComboBoxPopupMaxNumberOfItemsThatCanBeShownOnOneSide">7</x:Int32>
-
+    
     <Thickness x:Key="ComboBoxPadding">12,5,0,7</Thickness>
     <Thickness x:Key="ComboBoxEditableTextPadding">11,5,32,6</Thickness>
     <x:Double x:Key="ComboBoxMinHeight">32</x:Double>
-  </Styles.Resources>
-  <Style Selector="ComboBox">
-    <Setter Property="Padding" Value="{DynamicResource ComboBoxPadding}" />
-    <Setter Property="FocusAdorner" Value="{x:Null}" />
-    <Setter Property="MaxDropDownHeight" Value="504" />
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxForeground}" />
-    <Setter Property="Background" Value="{DynamicResource ComboBoxBackground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrush}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource ComboBoxBorderThemeThickness}" />
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
-    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
-    <Setter Property="MinHeight" Value="{DynamicResource ComboBoxMinHeight}" />
-    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
-    <Setter Property="VerticalContentAlignment" Value="Center" />
-    <Setter Property="HorizontalAlignment" Value="Left" />
-    <Setter Property="VerticalAlignment" Value="Top" />    
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-    <Setter Property="PlaceholderForeground" Value="{DynamicResource ComboBoxPlaceHolderForeground}" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <DataValidationErrors>
-          <Grid RowDefinitions="Auto, *, Auto"
-                ColumnDefinitions="*,32">
-            <ContentPresenter x:Name="HeaderContentPresenter"
-                              Grid.Row="0"
+    
+    <ControlTheme x:Key="{x:Type ComboBox}" TargetType="ComboBox">
+      <Setter Property="Padding" Value="{DynamicResource ComboBoxPadding}" />
+      <Setter Property="FocusAdorner" Value="{x:Null}" />
+      <Setter Property="MaxDropDownHeight" Value="504" />
+      <Setter Property="Foreground" Value="{DynamicResource ComboBoxForeground}" />
+      <Setter Property="Background" Value="{DynamicResource ComboBoxBackground}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrush}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource ComboBoxBorderThemeThickness}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
+      <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
+      <Setter Property="MinHeight" Value="{DynamicResource ComboBoxMinHeight}" />
+      <Setter Property="HorizontalContentAlignment" Value="Stretch" />
+      <Setter Property="VerticalContentAlignment" Value="Center" />
+      <Setter Property="HorizontalAlignment" Value="Left" />
+      <Setter Property="VerticalAlignment" Value="Top" />
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="PlaceholderForeground" Value="{DynamicResource ComboBoxPlaceHolderForeground}" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <DataValidationErrors>
+            <Grid RowDefinitions="Auto, *, Auto" ColumnDefinitions="*,32">
+              <ContentPresenter x:Name="HeaderContentPresenter"
+                                Grid.Row="0"
+                                Grid.Column="0" 
+                                Grid.ColumnSpan="2"
+                                IsVisible="False"
+                                FontWeight="{DynamicResource ComboBoxHeaderThemeFontWeight}" 
+                                Margin="{DynamicResource ComboBoxTopHeaderMargin}"
+                                VerticalAlignment="Top" />
+              <Border x:Name="Background"
+                      Grid.Row="1"
+                      Grid.Column="0"
+                      Grid.ColumnSpan="2"
+                      Background="{TemplateBinding Background}"
+                      BorderBrush="{TemplateBinding BorderBrush}"
+                      BorderThickness="{TemplateBinding BorderThickness}"
+                      CornerRadius="{TemplateBinding CornerRadius}"
+                      MinWidth="{DynamicResource ComboBoxThemeMinWidth}" />
+              <Border x:Name="HighlightBackground"
+                      Grid.Row="1"
+                      Grid.Column="0"
+                      Grid.ColumnSpan="2"
+                      Background="{DynamicResource ComboBoxBackgroundUnfocused}"
+                      BorderBrush="{DynamicResource ComboBoxBackgroundBorderBrushUnfocused}"
+                      BorderThickness="{TemplateBinding BorderThickness}"
+                      CornerRadius="{TemplateBinding CornerRadius}" />
+              <TextBlock x:Name="PlaceholderTextBlock"
+                         Grid.Row="1"
+                         Grid.Column="0"
+                         HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                         VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                         Margin="{TemplateBinding Padding}"
+                         Text="{TemplateBinding PlaceholderText}"
+                         Foreground="{TemplateBinding PlaceholderForeground}"
+                         IsVisible="{TemplateBinding SelectionBoxItem, Converter={x:Static ObjectConverters.IsNull}}" />
+              <ContentControl x:Name="ContentPresenter"
+                              Content="{TemplateBinding SelectionBoxItem}"
+                              ContentTemplate="{TemplateBinding ItemTemplate}"
+                              Grid.Row="1"
                               Grid.Column="0"
-                              Grid.ColumnSpan="2"
-                              IsVisible="False"
-                              FontWeight="{DynamicResource ComboBoxHeaderThemeFontWeight}"
-                              Margin="{DynamicResource ComboBoxTopHeaderMargin}"
-                              VerticalAlignment="Top" />
-            <Border x:Name="Background"
-                    Grid.Row="1"
-                    Grid.Column="0"
-                    Grid.ColumnSpan="2"
-                    Background="{TemplateBinding Background}"
-                    BorderBrush="{TemplateBinding BorderBrush}"
-                    BorderThickness="{TemplateBinding BorderThickness}"
-                    CornerRadius="{TemplateBinding CornerRadius}"
-                    MinWidth="{DynamicResource ComboBoxThemeMinWidth}" />
-
-            <Border x:Name="HighlightBackground"
-                    Grid.Row="1"
-                    Grid.Column="0"
-                    Grid.ColumnSpan="2"
-                    Background="{DynamicResource ComboBoxBackgroundUnfocused}"
-                    BorderBrush="{DynamicResource ComboBoxBackgroundBorderBrushUnfocused}"
-                    BorderThickness="{TemplateBinding BorderThickness}"
-                    CornerRadius="{TemplateBinding CornerRadius}" />
-            <TextBlock x:Name="PlaceholderTextBlock"
-                       Grid.Row="1"
-                       Grid.Column="0"
-                       HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                       VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                       Margin="{TemplateBinding Padding}"
-                       Text="{TemplateBinding PlaceholderText}"
-                       Foreground="{TemplateBinding PlaceholderForeground}"
-                       IsVisible="{TemplateBinding SelectionBoxItem, Converter={x:Static ObjectConverters.IsNull}}" />
-            <ContentControl x:Name="ContentPresenter"
-                            Content="{TemplateBinding SelectionBoxItem}"
-                            ContentTemplate="{TemplateBinding ItemTemplate}"
-                            Grid.Row="1"
-                            Grid.Column="0"
-                            Margin="{TemplateBinding Padding}"
-                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
-
-            <Border x:Name="DropDownOverlay"
-                    Grid.Row="1"
-                    Grid.Column="1"
-                    Background="Transparent"
-                    Margin="0,1,1,1"
-                    Width="30"
-                    IsVisible="False"
-                    HorizontalAlignment="Right" />
-
-            <PathIcon x:Name="DropDownGlyph"
+                              Margin="{TemplateBinding Padding}"
+                              HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                              VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
+              
+              <Border x:Name="DropDownOverlay"
                       Grid.Row="1"
                       Grid.Column="1"
-                      UseLayoutRounding="False"
-                      IsHitTestVisible="False"
-                      Height="12"
-                      Width="12"
-                      Margin="0,0,10,0"
-                      HorizontalAlignment="Right"
-                      VerticalAlignment="Center" />
-
-            <Popup Name="PART_Popup"
-                   WindowManagerAddShadowHint="False"
-                   IsOpen="{TemplateBinding IsDropDownOpen, Mode=TwoWay}"
-                   MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
-                   MaxHeight="{TemplateBinding MaxDropDownHeight}"
-                   PlacementTarget="Background"
-                   IsLightDismissEnabled="True"
-                   InheritsTransform="True">
-              <Border x:Name="PopupBorder"
-                      Background="{DynamicResource ComboBoxDropDownBackground}"
-                      BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}"
-                      BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}"
-                      Margin="0,-1,0,-1"
-                      Padding="{DynamicResource ComboBoxDropdownBorderPadding}"
-                      HorizontalAlignment="Stretch"
-                      CornerRadius="{DynamicResource OverlayCornerRadius}">
-                <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
-                              VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
-                  <ItemsPresenter Name="PART_ItemsPresenter"
-                                  Items="{TemplateBinding Items}"
-                                  Margin="{DynamicResource ComboBoxDropdownContentMargin}"
-                                  ItemsPanel="{TemplateBinding ItemsPanel}"
-                                  ItemTemplate="{TemplateBinding ItemTemplate}"
-                                  VirtualizationMode="{TemplateBinding VirtualizationMode}" />
-                </ScrollViewer>
-              </Border>
-            </Popup>
-          </Grid>
-        </DataValidationErrors>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-
-  <!--  Normal State  -->
-  <Style Selector="ComboBox /template/ TextBlock#PlaceholderTextBlock">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxPlaceHolderForeground}" />
-  </Style>
-
-  <Style Selector="ComboBox /template/ Border#HighlightBackground">
-    <Setter Property="IsVisible" Value="False" />
-  </Style>
-
-  <Style Selector="ComboBox /template/ PathIcon#DropDownGlyph">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForeground}" />
-    <Setter Property="Data" Value="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" />
-  </Style>
-
-  <!--  PointerOver State  -->
-  <Style Selector="ComboBox:pointerover /template/ Border#Background">
-    <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushPointerOver}" />
-  </Style>
-
-  <!--  Pressed State  -->
-  <Style Selector="ComboBox:pressed /template/ Border#Background">
-    <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushPressed}" />
-  </Style>
-
-  <!--  Disabled State  -->
-  <Style Selector="ComboBox:disabled /template/ Border#Background">
-    <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushDisabled}" />
-  </Style>
-
-  <Style Selector="ComboBox:disabled /template/ ContentPresenter#HeaderContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
-  </Style>
-
-  <Style Selector="ComboBox:disabled /template/ ContentControl#ContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
-  </Style>
-
-  <Style Selector="ComboBox:disabled /template/ TextBlock#PlaceholderTextBlock">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
-  </Style>
-
-  <Style Selector="ComboBox:disabled /template/ PathIcon#DropDownGlyph">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundDisabled}" />
-  </Style>
-
-  <!--  Focused State  -->
-  <Style Selector="ComboBox:focus-visible /template/ Border#HighlightBackground">
-    <Setter Property="IsVisible" Value="True" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBackgroundBorderBrushFocused}" />
-  </Style>
-
-  <Style Selector="ComboBox:focus-visible /template/ ContentControl#ContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocused}" />
-  </Style>
-
-  <Style Selector="ComboBox:focus-visible /template/ TextBlock#PlaceholderTextBlock">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocused}" />
-  </Style>
-
-  <Style Selector="ComboBox:focus-visible /template/ PathIcon#DropDownGlyph">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundFocused}" />
-  </Style>
-
-  <!--  Focus Pressed State  -->
-  <Style Selector="ComboBox:focused:pressed /template/ ContentControl#ContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocusedPressed}" />
-  </Style>
-
-  <Style Selector="ComboBox:focused:pressed /template/ TextBlock#PlaceholderTextBlock">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxPlaceHolderForegroundFocusedPressed}" />
-  </Style>
-
-  <Style Selector="ComboBox:focused:pressed /template/ PathIcon#DropDownGlyph">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundFocusedPressed}" />
-  </Style>
+                      Background="Transparent"
+                      Margin="0,1,1,1" 
+                      Width="30" 
+                      IsVisible="False" 
+                      HorizontalAlignment="Right" />
+              
+              <PathIcon x:Name="DropDownGlyph"
+                        Grid.Row="1"
+                        Grid.Column="1"
+                        UseLayoutRounding="False"
+                        IsHitTestVisible="False"
+                        Height="12"
+                        Width="12"
+                        Margin="0,0,10,0" 
+                        HorizontalAlignment="Right"
+                        VerticalAlignment="Center" />
+              
+              <Popup Name="PART_Popup" 
+                     WindowManagerAddShadowHint="False"
+                     IsOpen="{TemplateBinding IsDropDownOpen, Mode=TwoWay}" 
+                     MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}" 
+                     MaxHeight="{TemplateBinding MaxDropDownHeight}"
+                     PlacementTarget="Background" 
+                     IsLightDismissEnabled="True" 
+                     InheritsTransform="True">
+                <Border x:Name="PopupBorder"
+                        Background="{DynamicResource ComboBoxDropDownBackground}"
+                        BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}" 
+                        BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}"
+                        Margin="0,-1,0,-1"
+                        Padding="{DynamicResource ComboBoxDropdownBorderPadding}"
+                        HorizontalAlignment="Stretch"
+                        CornerRadius="{DynamicResource OverlayCornerRadius}">
+                  <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
+                                VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
+                    <ItemsPresenter Name="PART_ItemsPresenter"
+                                    Items="{TemplateBinding Items}" 
+                                    Margin="{DynamicResource ComboBoxDropdownContentMargin}" 
+                                    ItemsPanel="{TemplateBinding ItemsPanel}"
+                                    ItemTemplate="{TemplateBinding ItemTemplate}" 
+                                    VirtualizationMode="{TemplateBinding VirtualizationMode}" />
+                  </ScrollViewer>
+                </Border>
+              </Popup>
+            </Grid>
+          </DataValidationErrors>
+        </ControlTemplate>
+      </Setter>
+
+      <!--  Normal State  -->
+      <Style Selector="^ /template/">
+        <Style Selector="^ TextBlock#PlaceholderTextBlock">
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxPlaceHolderForeground}" />
+        </Style>
+        <Style Selector="^ Border#HighlightBackground">
+          <Setter Property="IsVisible" Value="False" />
+        </Style>
+        <Style Selector="^ PathIcon#DropDownGlyph">
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForeground}" />
+          <Setter Property="Data" Value="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" />
+        </Style>
+      </Style>
+
+      <!--  PointerOver State  -->
+      <Style Selector="^:pointerover /template/ Border#Background">
+        <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundPointerOver}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushPointerOver}" />
+      </Style>
+      
+      <!--  Pressed State  -->
+      <Style Selector="^:pressed /template/ Border#Background">
+        <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundPressed}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushPressed}" />
+      </Style>
+      
+      <!-- Error State -->
+      <Style Selector="^:error /template/ Border#Background">
+        <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
+      </Style>
+
+      <!--  Focus Pressed State  -->
+      <Style Selector="^:focused:pressed /template/">
+        <Style Selector="^ ContentControl#ContentPresenter">
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocusedPressed}" />
+        </Style>
+        <Style Selector="^ TextBlock#PlaceholderTextBlock">
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxPlaceHolderForegroundFocusedPressed}" />
+        </Style>
+        <Style Selector="^ PathIcon#DropDownGlyph">
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundFocusedPressed}" />
+        </Style>
+      </Style>
+
+      <!--  Focused State  -->
+      <Style Selector="^:focus-visible /template/">
+        <Style Selector="^ Border#HighlightBackground">
+          <Setter Property="IsVisible" Value="True" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBackgroundBorderBrushFocused}" />
+        </Style>
+        <Style Selector="^ ContentControl#ContentPresenter">
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocused}" />
+        </Style>
+        <Style Selector="^ TextBlock#PlaceholderTextBlock">
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocused}" />
+        </Style>
+        <Style Selector="^ PathIcon#DropDownGlyph">
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundFocused}" />
+        </Style>
+      </Style>
+
+      <!--  Disabled State  -->
+      <Style Selector="^:disabled /template/">
+        <Style Selector="^ Border#Background">
+          <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundDisabled}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushDisabled}" />
+        </Style>
+        <Style Selector="^ ContentPresenter#HeaderContentPresenter">
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
+        </Style>
+        <Style Selector="^ ContentControl#ContentPresenter">
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
+        </Style>
+        <Style Selector="^ TextBlock#PlaceholderTextBlock">
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
+        </Style>
+        <Style Selector="^ PathIcon#DropDownGlyph">
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundDisabled}" />
+        </Style>
+      </Style>
+    </ControlTheme>
   
-  <!-- Error State -->
-  <Style Selector="ComboBox:error /template/ Border#Background">
-    <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
-  </Style>
-</Styles>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ComboBoxItem.xaml b/src/Avalonia.Themes.Fluent/Controls/ComboBoxItem.xaml
index 0debe87445..88f9c0ea15 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ComboBoxItem.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ComboBoxItem.xaml
@@ -1,90 +1,85 @@
-<Styles xmlns="https://github.com/avaloniaui">
-  <Design.PreviewWith>
-    <Border Padding="20">
-      <Border Background="{DynamicResource ComboBoxDropDownBackground}"
-              BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}"
-              BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}"
-              Margin="0,-1,0,-1"
-              Padding="{DynamicResource ComboBoxDropdownBorderPadding}"
-              CornerRadius="{DynamicResource OverlayCornerRadius}">
-        <StackPanel HorizontalAlignment="Stretch">
-          <ComboBoxItem>Item 1</ComboBoxItem>
-          <ComboBoxItem>Item 2 long</ComboBoxItem>
-          <ComboBoxItem IsSelected="True">Item 3</ComboBoxItem>
-          <ComboBoxItem IsEnabled="False">Item 4</ComboBoxItem>
-        </StackPanel>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <Design.PreviewWith>
+      <Border Padding="20">
+        <Border Background="{DynamicResource ComboBoxDropDownBackground}" BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}" BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}" Margin="0,-1,0,-1" Padding="{DynamicResource ComboBoxDropdownBorderPadding}" CornerRadius="{DynamicResource OverlayCornerRadius}">
+          <StackPanel HorizontalAlignment="Stretch">
+            <ComboBoxItem>Item 1</ComboBoxItem>
+            <ComboBoxItem>Item 2 long</ComboBoxItem>
+            <ComboBoxItem IsSelected="True">Item 3</ComboBoxItem>
+            <ComboBoxItem IsEnabled="False">Item 4</ComboBoxItem>
+          </StackPanel>
+        </Border>
       </Border>
-    </Border>
-  </Design.PreviewWith>
+    </Design.PreviewWith>
+  
+    <ControlTheme x:Key="{x:Type ComboBoxItem}" TargetType="ComboBoxItem">
+      <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForeground}" />
+      <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackground}" />
+      <Setter Property="Padding" Value="{DynamicResource ComboBoxItemThemePadding}" />
+      <Setter Property="HorizontalContentAlignment" Value="Stretch" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <ContentPresenter Name="PART_ContentPresenter"
+                            Foreground="{TemplateBinding Foreground}"
+                            Background="{TemplateBinding Background}" 
+                            BorderBrush="{TemplateBinding BorderBrush}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
+                            CornerRadius="{TemplateBinding CornerRadius}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
+                            Content="{TemplateBinding Content}" 
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                            Padding="{TemplateBinding Padding}" />
+        </ControlTemplate>
+      </Setter>
+      
+      <!--  PointerOver state  -->
+      <Style Selector="^:pointerover /template/ ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundPointerOver}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushPointerOver}" />
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundPointerOver}" />
+      </Style>
+      
+      <!--  Disabled state  -->
+      <Style Selector="^:disabled /template/ ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundDisabled}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushDisabled}" />
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundDisabled}" />
+      </Style>
+      
+      <!--  Pressed state  -->
+      <Style Selector="^:pressed /template/ ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundPressed}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushPressed}" />
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundPressed}" />
+      </Style>
 
-  <Style Selector="ComboBoxItem">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForeground}" />
-    <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackground}" />
-    <Setter Property="Padding" Value="{DynamicResource ComboBoxItemThemePadding}" />
-    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <ContentPresenter Name="PART_ContentPresenter"
-                          Foreground="{TemplateBinding Foreground}"
-                          Background="{TemplateBinding Background}"
-                          BorderBrush="{TemplateBinding BorderBrush}"
-                          BorderThickness="{TemplateBinding BorderThickness}"
-                          CornerRadius="{TemplateBinding CornerRadius}"
-                          ContentTemplate="{TemplateBinding ContentTemplate}"
-                          Content="{TemplateBinding Content}"
-                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                          Padding="{TemplateBinding Padding}" />
-      </ControlTemplate>
-    </Setter>
-  </Style>
-
-  <!--  PointerOver state  -->
-  <Style Selector="ComboBoxItem:pointerover /template/ ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushPointerOver}" />
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundPointerOver}" />
-  </Style>
-
-  <!--  Disabled state  -->
-  <Style Selector="ComboBoxItem:disabled /template/ ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushDisabled}" />
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundDisabled}" />
-  </Style>
-
-  <!--  Pressed state  -->
-  <Style Selector="ComboBoxItem:pressed /template/ ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushPressed}" />
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundPressed}" />
-  </Style>
-
-  <!--  Selected state  -->
-  <Style Selector="ComboBoxItem:selected /template/ ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelected}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelected}" />
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelected}" />
-  </Style>
-
-  <!--  Selected Disabled state  -->
-  <Style Selector="ComboBoxItem:selected:disabled /template/ ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedDisabled}" />
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedDisabled}" />
-  </Style>
-
-  <!--  Selected PointerOver state  -->
-  <Style Selector="ComboBoxItem:selected:pointerover /template/ ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedPointerOver}" />
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedPointerOver}" />
-  </Style>
-
-  <!--  Selected Pressed state  -->
-  <Style Selector="ComboBoxItem:selected:pressed /template/ ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedPressed}" />
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedPressed}" />
-  </Style>
-</Styles>
+      <!--  Selected state  -->
+      <Style Selector="^:selected">
+        <Style Selector="^ /template/ ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelected}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelected}" />
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelected}" />
+        </Style>
+        <!--  Selected Disabled state  -->
+        <Style Selector="^:disabled /template/ ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedDisabled}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedDisabled}" />
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedDisabled}" />
+        </Style>
+        <!--  Selected PointerOver state  -->
+        <Style Selector="^:pointerover /template/ ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedPointerOver}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedPointerOver}" />
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedPointerOver}" />
+        </Style>
+        <!--  Selected Pressed state  -->
+        <Style Selector="^:pressed /template/ ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedPressed}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedPressed}" />
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedPressed}" />
+        </Style>
+      </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/Common.xaml b/src/Avalonia.Themes.Fluent/Controls/Common.xaml
deleted file mode 100644
index e09e39d7cb..0000000000
--- a/src/Avalonia.Themes.Fluent/Controls/Common.xaml
+++ /dev/null
@@ -1,6 +0,0 @@
-<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Style Selector="TextBlock.CaptionTextBlockStyle">
-    <Setter Property="FontSize" Value="12" />
-    <Setter Property="FontWeight" Value="Normal" />
-  </Style>
-</Styles>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ContentControl.xaml b/src/Avalonia.Themes.Fluent/Controls/ContentControl.xaml
index d32bc399b6..5777603074 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ContentControl.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ContentControl.xaml
@@ -1,16 +1,19 @@
-<Style xmlns="https://github.com/avaloniaui" Selector="ContentControl">
-  <Setter Property="Template">
-    <ControlTemplate>
-      <ContentPresenter Name="PART_ContentPresenter"
-                        Background="{TemplateBinding Background}"
-                        BorderBrush="{TemplateBinding BorderBrush}"
-                        BorderThickness="{TemplateBinding BorderThickness}"
-                        CornerRadius="{TemplateBinding CornerRadius}"
-                        ContentTemplate="{TemplateBinding ContentTemplate}"
-                        Content="{TemplateBinding Content}"
-                        Padding="{TemplateBinding Padding}"
-                        VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                        HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
-    </ControlTemplate>
-  </Setter>
-</Style>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <ControlTheme x:Key="{x:Type ContentControl}" TargetType="ContentControl">
+      <Setter Property="Template">
+        <ControlTemplate>
+          <ContentPresenter Name="PART_ContentPresenter"
+                            Background="{TemplateBinding Background}"
+                            BorderBrush="{TemplateBinding BorderBrush}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
+                            CornerRadius="{TemplateBinding CornerRadius}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
+                            Content="{TemplateBinding Content}"
+                            Padding="{TemplateBinding Padding}"
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ContextMenu.xaml b/src/Avalonia.Themes.Fluent/Controls/ContextMenu.xaml
index df800b4a06..fe0f0f3f6c 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ContextMenu.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ContextMenu.xaml
@@ -1,72 +1,72 @@
-<Style xmlns="https://github.com/avaloniaui"
-       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-       Selector="ContextMenu">
-  <Design.PreviewWith>
-    <Border Background="{DynamicResource SystemAccentColor}"
-            Margin="16"
-            Padding="48"
-            Width="400"
-            Height="200">
-      <Border.ContextMenu>
-        <ContextMenu>
-          <MenuItem Header="Standard _Menu Item" />
-          <MenuItem Header="Disabled"
-                    IsEnabled="False" />
-          <Separator />
-          <MenuItem Header="Menu with _Submenu">
-            <MenuItem Header="Submenu _1" />
-            <MenuItem Header="Submenu _2" />
-          </MenuItem>
-          <MenuItem Header="Menu Item with _Icon" />
-          <MenuItem Header="Menu Item with _Checkbox">
-            <MenuItem.Icon>
-              <CheckBox BorderThickness="0"
-                        IsHitTestVisible="False"
-                        IsChecked="True" />
-            </MenuItem.Icon>
-          </MenuItem>
-        </ContextMenu>
-      </Border.ContextMenu>
-      <TextBlock Text="Defined in XAML" />
-    </Border>
-  </Design.PreviewWith>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <Design.PreviewWith>
+      <Border Background="{DynamicResource SystemAccentColor}"
+              Margin="16"
+              Padding="48"
+              Width="400"
+              Height="200">
+        <Border.ContextMenu>
+          <ContextMenu>
+            <MenuItem Header="Standard _Menu Item" />
+            <MenuItem Header="Disabled"
+                      IsEnabled="False" />
+            <Separator />
+            <MenuItem Header="Menu with _Submenu">
+              <MenuItem Header="Submenu _1" />
+              <MenuItem Header="Submenu _2" />
+            </MenuItem>
+            <MenuItem Header="Menu Item with _Icon" />
+            <MenuItem Header="Menu Item with _Checkbox">
+              <MenuItem.Icon>
+                <CheckBox BorderThickness="0"
+                          IsHitTestVisible="False"
+                          IsChecked="True" />
+              </MenuItem.Icon>
+            </MenuItem>
+          </ContextMenu>
+        </Border.ContextMenu>
+        <TextBlock Text="Defined in XAML" />
+      </Border>
+    </Design.PreviewWith>
 
-  <Style.Resources>
     <!-- Added missing resource -->
     <Thickness x:Key="MenuFlyoutScrollerMargin">0,4,0,4</Thickness>
-  </Style.Resources>
 
-  <Setter Property="Background" Value="{DynamicResource MenuFlyoutPresenterBackground}" />
-  <Setter Property="BorderBrush" Value="{DynamicResource MenuFlyoutPresenterBorderBrush}" />
-  <Setter Property="BorderThickness" Value="{DynamicResource MenuFlyoutPresenterBorderThemeThickness}" />
-  <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
-  <Setter Property="MaxWidth" Value="{DynamicResource FlyoutThemeMaxWidth}" />
-  <Setter Property="MinHeight" Value="{DynamicResource MenuFlyoutThemeMinHeight}" />
-  <Setter Property="Padding" Value="{DynamicResource MenuFlyoutPresenterThemePadding}" />
-  <Setter Property="HorizontalAlignment" Value="Stretch" />
-  <Setter Property="TextBlock.FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-  <Setter Property="TextBlock.FontWeight" Value="Normal" />
-  <Setter Property="WindowManagerAddShadowHint" Value="False" />
-  <Setter Property="Template">
-    <ControlTemplate>
-      <Border Background="{TemplateBinding Background}"
-              BorderBrush="{TemplateBinding BorderBrush}"
-              BorderThickness="{TemplateBinding BorderThickness}"
-              Padding="{TemplateBinding Padding}"
-              MaxWidth="{TemplateBinding MaxWidth}"
-              MinHeight="{TemplateBinding MinHeight}"
-              HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
-              CornerRadius="{TemplateBinding CornerRadius}">
-        <ScrollViewer Classes="menuscroller">
-          <ItemsPresenter Name="PART_ItemsPresenter"
-                          Items="{TemplateBinding Items}"
-                          ItemsPanel="{TemplateBinding ItemsPanel}"
-                          ItemTemplate="{TemplateBinding ItemTemplate}"
-                          Margin="{DynamicResource MenuFlyoutScrollerMargin}"
-                          KeyboardNavigation.TabNavigation="Continue"
-                          Grid.IsSharedSizeScope="True" />
-        </ScrollViewer>
-      </Border>
-    </ControlTemplate>
-  </Setter>
-</Style>
+    <ControlTheme x:Key="{x:Type ContextMenu}" TargetType="ContextMenu">
+      <Setter Property="Background" Value="{DynamicResource MenuFlyoutPresenterBackground}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource MenuFlyoutPresenterBorderBrush}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource MenuFlyoutPresenterBorderThemeThickness}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
+      <Setter Property="MaxWidth" Value="{DynamicResource FlyoutThemeMaxWidth}" />
+      <Setter Property="MinHeight" Value="{DynamicResource MenuFlyoutThemeMinHeight}" />
+      <Setter Property="Padding" Value="{DynamicResource MenuFlyoutPresenterThemePadding}" />
+      <Setter Property="HorizontalAlignment" Value="Stretch" />
+      <Setter Property="TextBlock.FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="TextBlock.FontWeight" Value="Normal" />
+      <Setter Property="WindowManagerAddShadowHint" Value="False" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Border Background="{TemplateBinding Background}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
+                  Padding="{TemplateBinding Padding}"
+                  MaxWidth="{TemplateBinding MaxWidth}"
+                  MinHeight="{TemplateBinding MinHeight}"
+                  HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
+                  CornerRadius="{TemplateBinding CornerRadius}">
+            <ScrollViewer Classes="menuscroller">
+              <ItemsPresenter Name="PART_ItemsPresenter"
+                              Items="{TemplateBinding Items}"
+                              ItemsPanel="{TemplateBinding ItemsPanel}"
+                              ItemTemplate="{TemplateBinding ItemTemplate}"
+                              Margin="{DynamicResource MenuFlyoutScrollerMargin}"
+                              KeyboardNavigation.TabNavigation="Continue"
+                              Grid.IsSharedSizeScope="True" />
+            </ScrollViewer>
+          </Border>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/DataValidationErrors.xaml b/src/Avalonia.Themes.Fluent/Controls/DataValidationErrors.xaml
index 649a186c7e..6ed73148a7 100644
--- a/src/Avalonia.Themes.Fluent/Controls/DataValidationErrors.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/DataValidationErrors.xaml
@@ -1,104 +1,103 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        xmlns:sys="using:System"
-        x:CompileBindings="True"
-        x:DataType="DataValidationErrors">
-  <Design.PreviewWith>
-    <Border Padding="20">
-      <StackPanel Spacing="20">
-        <TextBox Text="Sample">
-          <DataValidationErrors.Error>
-            <sys:Exception />
-          </DataValidationErrors.Error>
-        </TextBox>
-        <TextBox Text="Sample">
-          <TextBox.Styles>
-            <Style Selector="DataValidationErrors">
-              <Setter Property="Template" Value="{DynamicResource TooltipDataValidationContentTemplate}" />
-              <Setter Property="ErrorTemplate" Value="{DynamicResource TooltipDataValidationErrorTemplate}" />
-            </Style>
-          </TextBox.Styles>
-          <DataValidationErrors.Error>
-            <sys:Exception />
-          </DataValidationErrors.Error>
-        </TextBox>
-      </StackPanel>
-    </Border>
-  </Design.PreviewWith>
-
-  <Style Selector="DataValidationErrors">
-    <Style.Resources>
-      <DataTemplate x:Key="InlineDataValidationErrorTemplate">
-        <ItemsControl Items="{Binding}" x:DataType="DataValidationErrors" Foreground="{DynamicResource SystemControlErrorTextForegroundBrush}">
-          <ItemsControl.Styles>
-            <Style Selector="TextBlock">
-              <Setter Property="TextWrapping" Value="Wrap" />
-            </Style>
-          </ItemsControl.Styles>
-        </ItemsControl>
-      </DataTemplate>
-      <ControlTemplate x:Key="InlineDataValidationContentTemplate" TargetType="DataValidationErrors">
-        <DockPanel LastChildFill="True">
-          <ContentControl x:Name="InlineDataValidationContentControl"
-                          Margin="0,4,0,0"
-                          Content="{Binding (DataValidationErrors.Errors)}"
-                          ContentTemplate="{TemplateBinding ErrorTemplate}"
-                          DataContext="{TemplateBinding Owner}"
-                          DockPanel.Dock="Bottom"
-                          IsVisible="{Binding (DataValidationErrors.HasErrors)}" />
-          <ContentPresenter Name="PART_ContentPresenter"
-                            Padding="{TemplateBinding Padding}"
-                            Background="{TemplateBinding Background}"
-                            BorderThickness="{TemplateBinding BorderThickness}"
-                            CornerRadius="{TemplateBinding CornerRadius}"
-                            Content="{TemplateBinding Content}"
-                            ContentTemplate="{TemplateBinding ContentTemplate}" />
-        </DockPanel>
-      </ControlTemplate>
-
-      <DataTemplate x:DataType="DataValidationErrors" x:Key="TooltipDataValidationErrorTemplate">
-        <Panel Name="PART_InlineErrorTemplatePanel" Background="Transparent">
-          <Panel.Styles>
-            <Style Selector="Panel#PART_InlineErrorTemplatePanel">
-              <Setter Property="Margin" Value="8,0" />
-            </Style>
-            <Style Selector="Panel#PART_InlineErrorTemplatePanel ToolTip">
-              <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
-            </Style>
-            <Style Selector="Panel#PART_InlineErrorTemplatePanel ToolTip TextBlock">
-              <Setter Property="TextWrapping" Value="Wrap" />
-            </Style>
-          </Panel.Styles>
-          <ToolTip.Tip>
-            <ItemsControl Items="{Binding}" />
-          </ToolTip.Tip>
-          <Path Width="14"
-                Height="14"
-                Data="M14,7 A7,7 0 0,0 0,7 M0,7 A7,7 0 1,0 14,7 M7,3l0,5 M7,9l0,2"
-                Stroke="{DynamicResource SystemControlErrorTextForegroundBrush}"
-                StrokeThickness="2" />
-        </Panel>
-      </DataTemplate>
-      <ControlTemplate x:Key="TooltipDataValidationContentTemplate" TargetType="DataValidationErrors">
-        <DockPanel LastChildFill="True">
-          <ContentControl Content="{Binding (DataValidationErrors.Errors)}"
-                          ContentTemplate="{TemplateBinding ErrorTemplate}"
-                          DataContext="{TemplateBinding Owner}"
-                          DockPanel.Dock="Right"
-                          IsVisible="{Binding (DataValidationErrors.HasErrors)}" />
-          <ContentPresenter Name="PART_ContentPresenter"
-                            Padding="{TemplateBinding Padding}"
-                            Background="{TemplateBinding Background}"
-                            BorderBrush="{TemplateBinding BorderBrush}"
-                            BorderThickness="{TemplateBinding BorderThickness}"
-                            CornerRadius="{TemplateBinding CornerRadius}"
-                            Content="{TemplateBinding Content}"
-                            ContentTemplate="{TemplateBinding ContentTemplate}" />
-        </DockPanel>
-      </ControlTemplate>
-    </Style.Resources>
-
-    <Setter Property="Template" Value="{StaticResource InlineDataValidationContentTemplate}" />
-    <Setter Property="ErrorTemplate" Value="{StaticResource InlineDataValidationErrorTemplate}" />
-  </Style>
-</Styles>
+<ResourceDictionary xmlns="https://github.com/avaloniaui" 
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:sys="using:System" 
+                    x:CompileBindings="True"
+                    x:DataType="DataValidationErrors">
+    <Design.PreviewWith>
+      <Border Padding="20">
+        <StackPanel Spacing="20">
+          <TextBox Text="Sample">
+            <DataValidationErrors.Error>
+              <sys:Exception />
+            </DataValidationErrors.Error>
+          </TextBox>
+          <TextBox Text="Sample">
+            <TextBox.Styles>
+              <Style Selector="DataValidationErrors">
+                <Setter Property="Template" Value="{DynamicResource TooltipDataValidationContentTemplate}" />
+                <Setter Property="ErrorTemplate" Value="{DynamicResource TooltipDataValidationErrorTemplate}" />
+              </Style>
+            </TextBox.Styles>
+            <DataValidationErrors.Error>
+              <sys:Exception />
+            </DataValidationErrors.Error>
+          </TextBox>
+        </StackPanel>
+      </Border>
+    </Design.PreviewWith>
+  
+    <ControlTheme x:Key="{x:Type DataValidationErrors}" TargetType="DataValidationErrors">
+      <ControlTheme.Resources>
+        <DataTemplate x:Key="InlineDataValidationErrorTemplate">
+          <ItemsControl Items="{Binding}" x:DataType="DataValidationErrors" Foreground="{DynamicResource SystemControlErrorTextForegroundBrush}">
+            <ItemsControl.Styles>
+              <Style Selector="TextBlock">
+                <Setter Property="TextWrapping" Value="Wrap" />
+              </Style>
+            </ItemsControl.Styles>
+          </ItemsControl>
+        </DataTemplate>
+        <ControlTemplate x:Key="InlineDataValidationContentTemplate" TargetType="DataValidationErrors">
+          <DockPanel LastChildFill="True">
+            <ContentControl x:Name="InlineDataValidationContentControl"
+                            Margin="0,4,0,0" 
+                            Content="{Binding (DataValidationErrors.Errors)}" 
+                            ContentTemplate="{TemplateBinding ErrorTemplate}" 
+                            DataContext="{TemplateBinding Owner}" 
+                            DockPanel.Dock="Bottom"
+                            IsVisible="{Binding (DataValidationErrors.HasErrors)}" />
+            <ContentPresenter Name="PART_ContentPresenter"
+                              Padding="{TemplateBinding Padding}" 
+                              Background="{TemplateBinding Background}"
+                              BorderThickness="{TemplateBinding BorderThickness}" 
+                              CornerRadius="{TemplateBinding CornerRadius}"
+                              Content="{TemplateBinding Content}" 
+                              ContentTemplate="{TemplateBinding ContentTemplate}" />
+          </DockPanel>
+        </ControlTemplate>
+        
+        <DataTemplate x:DataType="DataValidationErrors" x:Key="TooltipDataValidationErrorTemplate">
+          <Panel Name="PART_InlineErrorTemplatePanel" Background="Transparent">
+            <Panel.Styles>
+              <Style Selector="Panel#PART_InlineErrorTemplatePanel">
+                <Setter Property="Margin" Value="8,0" />
+              </Style>
+              <Style Selector="Panel#PART_InlineErrorTemplatePanel ToolTip">
+                <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
+              </Style>
+              <Style Selector="Panel#PART_InlineErrorTemplatePanel ToolTip TextBlock">
+                <Setter Property="TextWrapping" Value="Wrap" />
+              </Style>
+            </Panel.Styles>
+            <ToolTip.Tip>
+              <ItemsControl Items="{Binding}" />
+            </ToolTip.Tip>
+            <Path Width="14"
+                  Height="14"
+                  Data="M14,7 A7,7 0 0,0 0,7 M0,7 A7,7 0 1,0 14,7 M7,3l0,5 M7,9l0,2"
+                  Stroke="{DynamicResource SystemControlErrorTextForegroundBrush}"
+                  StrokeThickness="2" />
+          </Panel>
+        </DataTemplate>
+        <ControlTemplate x:Key="TooltipDataValidationContentTemplate" TargetType="DataValidationErrors">
+          <DockPanel LastChildFill="True">
+            <ContentControl Content="{Binding (DataValidationErrors.Errors)}"
+                            ContentTemplate="{TemplateBinding ErrorTemplate}" 
+                            DataContext="{TemplateBinding Owner}" 
+                            DockPanel.Dock="Right" 
+                            IsVisible="{Binding (DataValidationErrors.HasErrors)}" />
+            <ContentPresenter Name="PART_ContentPresenter"
+                              Padding="{TemplateBinding Padding}"
+                              Background="{TemplateBinding Background}"
+                              BorderBrush="{TemplateBinding BorderBrush}" 
+                              BorderThickness="{TemplateBinding BorderThickness}" 
+                              CornerRadius="{TemplateBinding CornerRadius}" 
+                              Content="{TemplateBinding Content}"
+                              ContentTemplate="{TemplateBinding ContentTemplate}" />
+          </DockPanel>
+        </ControlTemplate>
+      </ControlTheme.Resources>
+      <Setter Property="Template" Value="{StaticResource InlineDataValidationContentTemplate}" />
+      <Setter Property="ErrorTemplate" Value="{StaticResource InlineDataValidationErrorTemplate}" />
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml b/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml
index 11d6b9fdfc..a7093c1341 100644
--- a/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml
@@ -5,17 +5,16 @@
 // All other rights reserved.
 -->
 
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:sys="clr-namespace:System;assembly=netstandard"
         x:CompileBindings="True">
-  <Design.PreviewWith>
-    <Border Padding="20">
-      <DatePicker CornerRadius="10" />
-    </Border>
-  </Design.PreviewWith>
-  
-  <Styles.Resources>
+    <Design.PreviewWith>
+      <Border Padding="20">
+        <DatePicker CornerRadius="10" />
+      </Border>
+    </Design.PreviewWith>
+
     <Thickness x:Key="DatePickerTopHeaderMargin">0,0,0,4</Thickness>
     <x:Double x:Key="DatePickerFlyoutPresenterHighlightHeight">40</x:Double>
     <x:Double x:Key="DatePickerFlyoutPresenterItemHeight">40</x:Double>
@@ -27,328 +26,327 @@
     <Thickness x:Key="DatePickerHostPadding">0,3,0,6</Thickness>
     <Thickness x:Key="DatePickerHostMonthPadding">9,3,0,6</Thickness>
     <x:Double x:Key="DatePickerSpacerThemeWidth">1</x:Double>
-  </Styles.Resources>
-
-  <!-- Styles for the items displayed in the selectors -->
-  <Style Selector="ListBoxItem.DateTimePickerItem">
-    <Setter Property="Padding" Value="{DynamicResource DatePickerFlyoutPresenterItemPadding}"/>
-    <Setter Property="VerticalContentAlignment" Value="Center" />
-    <Setter Property="HorizontalContentAlignment" Value="Center" />
-  </Style>
-  <Style Selector="ListBoxItem.DateTimePickerItem:selected">
-    <Setter Property="IsHitTestVisible" Value="False"/>
-  </Style>
-  <Style Selector="ListBoxItem.DateTimePickerItem:selected /template/ Rectangle#PressedBackground">
-    <Setter Property="Fill" Value="Transparent"/>
-  </Style>
-  <Style Selector="ListBoxItem.DateTimePickerItem:selected /template/ ContentPresenter">
-    <Setter Property="Background" Value="Transparent" />
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>
-  </Style>
-  <Style Selector="ListBoxItem.DateTimePickerItem.MonthItem">
-    <Setter Property="Padding" Value="{DynamicResource DatePickerFlyoutPresenterMonthPadding}"/>
-    <Setter Property="VerticalContentAlignment" Value="Center" />
-    <Setter Property="HorizontalContentAlignment" Value="Left" />
-  </Style>
 
+    <!-- Theme for the items displayed in the selectors -->
+    <ControlTheme x:Key="FluentDateTimePickerItem" TargetType="ListBoxItem" BasedOn="{StaticResource {x:Type ListBoxItem}}">
+      <Setter Property="Padding" Value="{DynamicResource DatePickerFlyoutPresenterItemPadding}"/>
+      <Setter Property="VerticalContentAlignment" Value="Center" />
+      <Setter Property="HorizontalContentAlignment" Value="Center" />
+      
+      <Style Selector="^:selected">
+        <Setter Property="IsHitTestVisible" Value="False"/>
+        <Style Selector="^/template/ Rectangle#PressedBackground">
+          <Setter Property="Fill" Value="Transparent"/>
+        </Style>
+        <Style Selector="^/template/ ContentPresenter">
+          <Setter Property="Background" Value="Transparent" />
+          <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>
+        </Style>
+      </Style>
+      <Style Selector="^.MonthItem">
+        <Setter Property="Padding" Value="{DynamicResource DatePickerFlyoutPresenterMonthPadding}"/>
+        <Setter Property="VerticalContentAlignment" Value="Center" />
+        <Setter Property="HorizontalContentAlignment" Value="Left" />
+      </Style>
+    </ControlTheme>
 
-  <!-- This is used for both the accept/dismiss & repeatbuttons in the presenter-->
-  <Style Selector=":is(Button).DateTimeFlyoutButtonStyle">
-    <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackground}" />
-    <Setter Property="HorizontalContentAlignment" Value="Center"/>
-    <Setter Property="VerticalContentAlignment" Value="Center"/>
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <!-- 
+    <!-- This is used for both the accept/dismiss & repeatbuttons in the presenter-->
+    <ControlTheme x:Key="FluentDateTimePickerButton" TargetType="Button">
+      <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackground}" />
+      <Setter Property="HorizontalContentAlignment" Value="Center"/>
+      <Setter Property="VerticalContentAlignment" Value="Center"/>
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <!-- 
                 The background is doubled here for the loopingselector up/down repeat buttons 
                 that appear opaque. Not sure how MS does it though I suspect this is it
                 but source isn't MIT yet, so this is my solution -->
-        <Border Background="{TemplateBinding Background}">
-          <ContentPresenter x:Name="ContentPresenter"
-                  Background="{TemplateBinding Background}"
-                  BorderBrush="{DynamicResource DateTimePickerFlyoutButtonBorderBrush}"
-                  BorderThickness="{DynamicResource DateTimeFlyoutButtonBorderThickness}"
-                  Content="{TemplateBinding Content}"
-                  Foreground="{DynamicResource SystemControlHighlightAltBaseHighBrush}"
-                  ContentTemplate="{TemplateBinding ContentTemplate}"
-                  Padding="{TemplateBinding Padding}"
-                  HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                  VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                  CornerRadius="{TemplateBinding CornerRadius}"/>
-        </Border>
-      </ControlTemplate>
-    </Setter>
-  </Style>
+          <Border Background="{TemplateBinding Background}">
+            <ContentPresenter x:Name="ContentPresenter"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{DynamicResource DateTimePickerFlyoutButtonBorderBrush}"
+                    BorderThickness="{DynamicResource DateTimeFlyoutButtonBorderThickness}"
+                    Content="{TemplateBinding Content}"
+                    Foreground="{DynamicResource SystemControlHighlightAltBaseHighBrush}"
+                    ContentTemplate="{TemplateBinding ContentTemplate}"
+                    Padding="{TemplateBinding Padding}"
+                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                    CornerRadius="{TemplateBinding CornerRadius}"/>
+          </Border>
+        </ControlTemplate>
+      </Setter>
 
-  <Style Selector=":is(Button).DateTimeFlyoutButtonStyle:pointerover /template/ ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackgroundPointerOver}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerFlyoutButtonBorderBrushPointerOver}"/>
-    <Setter Property="Foreground" Value="{DynamicResource DateTimePickerFlyoutButtonForegroundPointerOver}"/>
-  </Style>
+      <Style Selector="^:pointerover /template/ ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackgroundPointerOver}"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerFlyoutButtonBorderBrushPointerOver}"/>
+        <Setter Property="Foreground" Value="{DynamicResource DateTimePickerFlyoutButtonForegroundPointerOver}"/>
+      </Style>
 
-  <Style Selector=":is(Button).DateTimeFlyoutButtonStyle:pressed /template/ ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackgroundPressed}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerFlyoutButtonBorderBrushPressed}"/>
-    <Setter Property="Foreground" Value="{DynamicResource DateTimePickerFlyoutButtonForegroundPressed}"/>
-  </Style>
+      <Style Selector="^:pressed /template/ ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackgroundPressed}"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerFlyoutButtonBorderBrushPressed}"/>
+        <Setter Property="Foreground" Value="{DynamicResource DateTimePickerFlyoutButtonForegroundPressed}"/>
+      </Style>
+    </ControlTheme>
 
+    <ControlTheme x:Key="FluentDateTimePickerUpButton" TargetType="RepeatButton" BasedOn="{StaticResource FluentDateTimePickerButton}">
+      <Setter Property="VerticalAlignment" Value="Top"/>
+      <Setter Property="Height" Value="22" />
+      <Setter Property="HorizontalAlignment" Value="Stretch" />
+      <Setter Property="Focusable" Value="False" />
+      <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
+      <Setter Property="Content">
+        <Template>
+          <Viewbox Height="10" Width="10" HorizontalAlignment="Center" VerticalAlignment="Center">
+            <Path Stroke="{Binding $parent[RepeatButton].Foreground}" StrokeThickness="1" Data="M 0,9 L 9,0 L 18,9"/>
+          </Viewbox>
+        </Template>
+      </Setter>
+    </ControlTheme>
 
-  <Style Selector="RepeatButton.UpButton">
-    <Setter Property="VerticalAlignment" Value="Top"/>
-    <Setter Property="Height" Value="22" />
-    <Setter Property="HorizontalAlignment" Value="Stretch" />
-    <Setter Property="Focusable" Value="False" />
-    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
-    <Setter Property="Content">
-      <Template>
-        <Viewbox Height="10" Width="10" HorizontalAlignment="Center" VerticalAlignment="Center">
-          <Path Stroke="{Binding $parent[RepeatButton].Foreground}" StrokeThickness="1" Data="M 0,9 L 9,0 L 18,9"/>
-        </Viewbox>
-      </Template>
-    </Setter>
-  </Style>
-  <Style Selector="RepeatButton.DownButton">
-    <Setter Property="VerticalAlignment" Value="Bottom"/>
-    <Setter Property="Height" Value="22" />
-    <Setter Property="HorizontalAlignment" Value="Stretch" />
-    <Setter Property="Focusable" Value="False" />
-    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
-    <Setter Property="Content">
-      <Template>
-        <Viewbox Height="10" Width="10" HorizontalAlignment="Center" VerticalAlignment="Center">
-          <Path Stroke="{Binding $parent[RepeatButton].Foreground}" StrokeThickness="1" Data="M 0,0 L 9,9 L 18,0"/>
-        </Viewbox>
-      </Template>
-    </Setter>
-  </Style>
+    <ControlTheme x:Key="FluentDateTimePickerDownButton" TargetType="RepeatButton" BasedOn="{StaticResource FluentDateTimePickerButton}">
+      <Setter Property="VerticalAlignment" Value="Bottom"/>
+      <Setter Property="Height" Value="22" />
+      <Setter Property="HorizontalAlignment" Value="Stretch" />
+      <Setter Property="Focusable" Value="False" />
+      <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
+      <Setter Property="Content">
+        <Template>
+          <Viewbox Height="10" Width="10" HorizontalAlignment="Center" VerticalAlignment="Center">
+            <Path Stroke="{Binding $parent[RepeatButton].Foreground}" StrokeThickness="1" Data="M 0,0 L 9,9 L 18,0"/>
+          </Viewbox>
+        </Template>
+      </Setter>
+    </ControlTheme>
 
-  <Style Selector="DatePicker">    
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-    <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForeground}" />
-    <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackground}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrush}"/>
-    <Setter Property="BorderThickness" Value="1"/>
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="HorizontalAlignment" Value="Left" />
-    <Setter Property="VerticalAlignment" Value="Center" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <DataValidationErrors>
-          <Grid Name="LayoutRoot" Margin="{TemplateBinding Padding}" RowDefinitions="Auto,*">
-            <ContentPresenter Name="HeaderContentPresenter" Grid.Row="0"
-                              Content="{TemplateBinding Header}"
-                              ContentTemplate="{TemplateBinding HeaderTemplate}"
-                              Margin="{DynamicResource DatePickerTopHeaderMargin}"
-                              MaxWidth="{DynamicResource DatePickerThemeMaxWidth}"
-                              HorizontalAlignment="Stretch"
-                              VerticalAlignment="Top"/>
+    <ControlTheme x:Key="{x:Type DatePicker}" TargetType="DatePicker">
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForeground}" />
+      <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackground}"/>
+      <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrush}"/>
+      <Setter Property="BorderThickness" Value="1"/>
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="HorizontalAlignment" Value="Left" />
+      <Setter Property="VerticalAlignment" Value="Center" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <DataValidationErrors>
+            <Grid Name="LayoutRoot" Margin="{TemplateBinding Padding}" RowDefinitions="Auto,*">
+              <ContentPresenter Name="HeaderContentPresenter" Grid.Row="0"
+                                Content="{TemplateBinding Header}"
+                                Foreground="{DynamicResource DatePickerHeaderForeground}"
+                                ContentTemplate="{TemplateBinding HeaderTemplate}"
+                                Margin="{DynamicResource DatePickerTopHeaderMargin}"
+                                MaxWidth="{DynamicResource DatePickerThemeMaxWidth}"
+                                HorizontalAlignment="Stretch"
+                                VerticalAlignment="Top"/>
 
-            <Button Name="FlyoutButton" Grid.Row="1"
-                    Foreground="{TemplateBinding Foreground}"
-                    Background="{TemplateBinding Background}"
-                    BorderBrush="{TemplateBinding BorderBrush}"
-                    BorderThickness="{TemplateBinding BorderThickness}"
-                    CornerRadius="{TemplateBinding CornerRadius}"
-                    IsEnabled="{TemplateBinding IsEnabled}"
-                    MinWidth="{DynamicResource DatePickerThemeMinWidth}"
-                    MaxWidth="{DynamicResource DatePickerThemeMaxWidth}"
-                    HorizontalAlignment="Stretch"
-                    VerticalAlignment="Stretch"
-                    HorizontalContentAlignment="Stretch"
-                    VerticalContentAlignment="Stretch"
-                    TemplatedControl.IsTemplateFocusTarget="True">
-              <Button.Template>
-                <ControlTemplate>
-                  <ContentPresenter Name="ContentPresenter"
-                                    BorderBrush="{TemplateBinding BorderBrush}"
-                                    Background="{TemplateBinding Background}"
-                                    BorderThickness="{TemplateBinding BorderThickness}"
-                                    Content="{TemplateBinding Content}"
-                                    Foreground="{TemplateBinding Foreground}"
-                                    HorizontalContentAlignment="Stretch"
-                                    VerticalContentAlignment="Stretch"
-                                    CornerRadius="{TemplateBinding CornerRadius}"/>
-                </ControlTemplate>
-              </Button.Template>
-              <Grid Name="ButtonContentGrid" ColumnDefinitions="78*,Auto,132*,Auto,78*">
-                <TextBlock Name="DayText" Text="day" HorizontalAlignment="Center"
-                           Padding="{DynamicResource DatePickerHostPadding}"
-                           FontFamily="{TemplateBinding FontFamily}"
-                           FontWeight="{TemplateBinding FontWeight}"
-                           FontSize="{TemplateBinding FontSize}"/>
-                <TextBlock Name="MonthText" Text="month" TextAlignment="Left"
-                           Padding="{DynamicResource DatePickerHostMonthPadding}"
-                           FontFamily="{TemplateBinding FontFamily}"
-                           FontWeight="{TemplateBinding FontWeight}"
-                           FontSize="{TemplateBinding FontSize}"/>
-                <TextBlock Name="YearText" Text="year" HorizontalAlignment="Center"
-                           Padding="{DynamicResource DatePickerHostPadding}"
-                           FontFamily="{TemplateBinding FontFamily}"
-                           FontWeight="{TemplateBinding FontWeight}"
-                           FontSize="{TemplateBinding FontSize}"/>
-                <Rectangle x:Name="FirstSpacer"
-                      Fill="{DynamicResource DatePickerSpacerFill}"
-                      HorizontalAlignment="Center"
-                      Width="1"
-                      Grid.Column="1" />
-                <Rectangle x:Name="SecondSpacer"
-                      Fill="{DynamicResource DatePickerSpacerFill}"
-                      HorizontalAlignment="Center"
-                      Width="1"
-                      Grid.Column="3" />
-              </Grid>
-            </Button>
+              <Button Name="FlyoutButton" Grid.Row="1"
+                      Foreground="{TemplateBinding Foreground}"
+                      Background="{TemplateBinding Background}"
+                      BorderBrush="{TemplateBinding BorderBrush}"
+                      BorderThickness="{TemplateBinding BorderThickness}"
+                      CornerRadius="{TemplateBinding CornerRadius}"
+                      IsEnabled="{TemplateBinding IsEnabled}"
+                      MinWidth="{DynamicResource DatePickerThemeMinWidth}"
+                      MaxWidth="{DynamicResource DatePickerThemeMaxWidth}"
+                      HorizontalAlignment="Stretch"
+                      VerticalAlignment="Stretch"
+                      HorizontalContentAlignment="Stretch"
+                      VerticalContentAlignment="Stretch"
+                      TemplatedControl.IsTemplateFocusTarget="True">
+                <Button.Template>
+                  <ControlTemplate>
+                    <ContentPresenter Name="ContentPresenter"
+                                      BorderBrush="{TemplateBinding BorderBrush}"
+                                      Background="{TemplateBinding Background}"
+                                      BorderThickness="{TemplateBinding BorderThickness}"
+                                      Content="{TemplateBinding Content}"
+                                      Foreground="{TemplateBinding Foreground}"
+                                      HorizontalContentAlignment="Stretch"
+                                      VerticalContentAlignment="Stretch"
+                                      CornerRadius="{TemplateBinding CornerRadius}"/>
+                  </ControlTemplate>
+                </Button.Template>
+                <Grid Name="ButtonContentGrid" ColumnDefinitions="78*,Auto,132*,Auto,78*">
+                  <TextBlock Name="DayText" Text="day" HorizontalAlignment="Center"
+                             Padding="{DynamicResource DatePickerHostPadding}"
+                             FontFamily="{TemplateBinding FontFamily}"
+                             FontWeight="{TemplateBinding FontWeight}"
+                             FontSize="{TemplateBinding FontSize}"/>
+                  <TextBlock Name="MonthText" Text="month" TextAlignment="Left"
+                             Padding="{DynamicResource DatePickerHostMonthPadding}"
+                             FontFamily="{TemplateBinding FontFamily}"
+                             FontWeight="{TemplateBinding FontWeight}"
+                             FontSize="{TemplateBinding FontSize}"/>
+                  <TextBlock Name="YearText" Text="year" HorizontalAlignment="Center"
+                             Padding="{DynamicResource DatePickerHostPadding}"
+                             FontFamily="{TemplateBinding FontFamily}"
+                             FontWeight="{TemplateBinding FontWeight}"
+                             FontSize="{TemplateBinding FontSize}"/>
+                  <Rectangle x:Name="FirstSpacer"
+                        Fill="{DynamicResource DatePickerSpacerFill}"
+                        HorizontalAlignment="Center"
+                        Width="1"
+                        Grid.Column="1" />
+                  <Rectangle x:Name="SecondSpacer"
+                        Fill="{DynamicResource DatePickerSpacerFill}"
+                        HorizontalAlignment="Center"
+                        Width="1"
+                        Grid.Column="3" />
+                </Grid>
+              </Button>
 
-            <Popup Name="Popup" WindowManagerAddShadowHint="False"
-                   IsLightDismissEnabled="True" PlacementTarget="{TemplateBinding}"
-                   PlacementMode="Bottom">
-              <DatePickerPresenter Name="PickerPresenter" />
-            </Popup>
+              <Popup Name="Popup" WindowManagerAddShadowHint="False"
+                     IsLightDismissEnabled="True" PlacementTarget="{TemplateBinding}"
+                     PlacementMode="Bottom">
+                <DatePickerPresenter Name="PickerPresenter" />
+              </Popup>
 
-          </Grid>
-        </DataValidationErrors>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-  <Style Selector="DatePicker /template/ ContentPresenter#HeaderContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource DatePickerHeaderForeground}"/>
-  </Style>
-  <Style Selector="DatePicker:disabled /template/ Rectangle">
-    <Setter Property="Fill" Value="{DynamicResource DatePickerSpacerFillDisabled}"/>
-  </Style>
+            </Grid>
+          </DataValidationErrors>
+        </ControlTemplate>
+      </Setter>
 
-  <Style Selector="DatePicker /template/ Button#FlyoutButton:pointerover /template/ ContentPresenter">
-    <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushPointerOver}"/>
-    <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundPointerOver}"/>
-    <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundPointerOver}"/>
-  </Style>
+      <Style Selector="^:disabled /template/ Rectangle">
+        <Setter Property="Fill" Value="{DynamicResource DatePickerSpacerFillDisabled}"/>
+      </Style>
 
-  <Style Selector="DatePicker /template/ Button#FlyoutButton:pressed /template/ ContentPresenter">
-    <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushPressed}"/>
-    <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundPressed}"/>
-    <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundPressed}"/>
-  </Style>
+      <!-- Changes foreground for watermark text when SelectedDate is null-->
+      <Style Selector="^:hasnodate /template/ Button#FlyoutButton TextBlock">
+        <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForeground}"/>
+      </Style>
+      <Style Selector="^/template/ Button#FlyoutButton">
+        <Style Selector="^:pointerover">
+          <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushPointerOver}"/>
+          <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundPointerOver}"/>
+          <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundPointerOver}"/>
+        </Style>
 
-  <Style Selector="DatePicker /template/ Button#FlyoutButton:disabled /template/ ContentPresenter">
-    <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushDisabled}"/>
-    <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundDisabled}"/>
-    <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundDisabled}"/>
-  </Style>
+        <Style Selector="^:pressed">
+          <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushPressed}"/>
+          <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundPressed}"/>
+          <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundPressed}"/>
+        </Style>
 
-  <!-- Changes foreground for watermark text when SelectedDate is null-->
-  <Style Selector="DatePicker:hasnodate /template/ Button#FlyoutButton TextBlock">
-    <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForeground}"/>
-  </Style>
-  
-  <Style Selector="DatePicker:error /template/ Button#FlyoutButton /template/ ContentPresenter">
-    <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
-  </Style>
-  
+        <Style Selector="^:disabled">
+          <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushDisabled}"/>
+          <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundDisabled}"/>
+          <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundDisabled}"/>
+        </Style>
+      </Style>
+      <Style Selector="^:error /template/ Button#FlyoutButton">
+        <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
+      </Style>
+    </ControlTheme>
 
-  <!--WinUI: DatePickerFlyoutPresenter-->
-  <Style Selector="DatePickerPresenter">
-    <Setter Property="Width" Value="296" />
-    <Setter Property="MinWidth" Value="296" />
-    <Setter Property="MaxHeight" Value="398" />    
-    <Setter Property="FontWeight" Value="Normal" />
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-    <Setter Property="Background" Value="{DynamicResource DatePickerFlyoutPresenterBackground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource DatePickerFlyoutPresenterBorderBrush}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource DateTimeFlyoutBorderThickness}" />
-    <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border Name="Background" Background="{TemplateBinding Background}"
-                BorderBrush="{TemplateBinding BorderBrush}"
-                BorderThickness="{TemplateBinding BorderThickness}"
-                Padding="{DynamicResource DateTimeFlyoutBorderPadding}"
-                MaxHeight="398" CornerRadius="{TemplateBinding CornerRadius}">
-          <Grid Name="ContentRoot" RowDefinitions="*,Auto">
-            <Grid Name="PickerContainer">
-              <!--Column Definitions set in code, ignore here-->
-              <Panel Name="MonthHost">
-                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
-                              VerticalScrollBarVisibility="Hidden">
-                  <DateTimePickerPanel Name="MonthSelector"
-                                      PanelType="Month"
-                                      ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
-                                      ShouldLoop="True" />
-                </ScrollViewer>
-                <RepeatButton Name="MonthUpButton"
-                              Classes="DateTimeFlyoutButtonStyle UpButton"/>
-                <RepeatButton Name="MonthDownButton"
-                              Classes="DateTimeFlyoutButtonStyle DownButton"/>
-              </Panel>
-              <Panel Name="DayHost">
-                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
-                              VerticalScrollBarVisibility="Hidden">
-                  <DateTimePickerPanel Name="DaySelector"
-                                      PanelType="Day"
-                                      ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
-                                      ShouldLoop="True" />
-                </ScrollViewer>
-                <RepeatButton Name="DayUpButton"
-                              Classes="DateTimeFlyoutButtonStyle UpButton"/>
-                <RepeatButton Name="DayDownButton"
-                              Classes="DateTimeFlyoutButtonStyle DownButton"/>
-              </Panel>
-              <Panel Name="YearHost">
-                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
-                              VerticalScrollBarVisibility="Hidden">
-                  <DateTimePickerPanel Name="YearSelector"
-                                      PanelType="Year"
-                                      ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
-                                      ShouldLoop="False" />
-                </ScrollViewer>
-                <RepeatButton Name="YearUpButton"
-                              Classes="DateTimeFlyoutButtonStyle UpButton"/>
-                <RepeatButton Name="YearDownButton"
-                              Classes="DateTimeFlyoutButtonStyle DownButton"/>
-              </Panel>
-              <Rectangle Name="HighlightRect" IsHitTestVisible="False" ZIndex="-1"
-                         Fill="{DynamicResource DatePickerFlyoutPresenterHighlightFill}"
-                         Grid.Column="0" Grid.ColumnSpan="5" VerticalAlignment="Center"
-                         Height="{DynamicResource DatePickerFlyoutPresenterHighlightHeight}" />
-              <Rectangle Name="FirstSpacer"
-                         Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
-                         HorizontalAlignment="Center"
-                         Width="{DynamicResource DatePickerSpacerThemeWidth}"
-                         Grid.Column="1" />
-              <Rectangle Name="SecondSpacer"
-                         Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
-                         HorizontalAlignment="Center"
-                         Width="{DynamicResource DatePickerSpacerThemeWidth}"
-                         Grid.Column="3" />
-            </Grid>
-            <Grid Grid.Row="1" Height="{DynamicResource DatePickerFlyoutPresenterAcceptDismissHostGridHeight}"
-                  Name="AcceptDismissGrid" ColumnDefinitions="*,*">
-              <Rectangle Height="{DynamicResource DatePickerSpacerThemeWidth}" VerticalAlignment="Top"
-                         Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
-                         Grid.ColumnSpan="2"/>
-              <Button Name="AcceptButton" Grid.Column="0" Classes="DateTimeFlyoutButtonStyle"
-                          HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
-                      StrokeThickness="0.75" Data="M0.5,8.5 5,13.5 15.5,3" />
-              </Button>
-              <Button Name="DismissButton" Grid.Column="1" Classes="DateTimeFlyoutButtonStyle"
-                         FontSize="16" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
-                      StrokeThickness="0.75" Data="M2,2 14,14 M2,14 14 2" />
-              </Button>
+    <!--WinUI: DatePickerFlyoutPresenter-->
+    <ControlTheme x:Key="{x:Type DatePickerPresenter}" TargetType="DatePickerPresenter">
+      <Setter Property="Width" Value="296" />
+      <Setter Property="MinWidth" Value="296" />
+      <Setter Property="MaxHeight" Value="398" />
+      <Setter Property="FontWeight" Value="Normal" />
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="Background" Value="{DynamicResource DatePickerFlyoutPresenterBackground}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource DatePickerFlyoutPresenterBorderBrush}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource DateTimeFlyoutBorderThickness}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Border Name="Background" Background="{TemplateBinding Background}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
+                  Padding="{DynamicResource DateTimeFlyoutBorderPadding}"
+                  MaxHeight="398" CornerRadius="{TemplateBinding CornerRadius}">
+            <Grid Name="ContentRoot" RowDefinitions="*,Auto">
+              <Grid Name="PickerContainer">
+                <Grid.Styles>
+                  <Style Selector="DateTimePickerPanel > ListBoxItem">
+                    <Setter Property="Theme" Value="{StaticResource FluentDateTimePickerItem}" />
+                  </Style>
+                </Grid.Styles>
+                <!--Column Definitions set in code, ignore here-->
+                <Panel Name="MonthHost">
+                  <ScrollViewer HorizontalScrollBarVisibility="Disabled"
+                                VerticalScrollBarVisibility="Hidden">
+                    <DateTimePickerPanel Name="MonthSelector"
+                                         PanelType="Month"
+                                         ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
+                                         ShouldLoop="True" />
+                  </ScrollViewer>
+                  <RepeatButton Name="MonthUpButton" Theme="{StaticResource FluentDateTimePickerUpButton}"/>
+                  <RepeatButton Name="MonthDownButton" Theme="{StaticResource FluentDateTimePickerDownButton}"/>
+                </Panel>
+                <Panel Name="DayHost">
+                  <ScrollViewer HorizontalScrollBarVisibility="Disabled"
+                                VerticalScrollBarVisibility="Hidden">
+                    <DateTimePickerPanel Name="DaySelector"
+                                         PanelType="Day"
+                                         ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
+                                         ShouldLoop="True" />
+                  </ScrollViewer>
+                  <RepeatButton Name="DayUpButton" Theme="{StaticResource FluentDateTimePickerUpButton}"/>
+                  <RepeatButton Name="DayDownButton" Theme="{StaticResource FluentDateTimePickerDownButton}"/>
+                </Panel>
+                <Panel Name="YearHost">
+                  <ScrollViewer HorizontalScrollBarVisibility="Disabled"
+                                VerticalScrollBarVisibility="Hidden">
+                    <DateTimePickerPanel Name="YearSelector"
+                                         PanelType="Year"
+                                         ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
+                                         ShouldLoop="False" />
+                  </ScrollViewer>
+                  <RepeatButton Name="YearUpButton" Theme="{StaticResource FluentDateTimePickerUpButton}"/>
+                  <RepeatButton Name="YearDownButton" Theme="{StaticResource FluentDateTimePickerDownButton}"/>
+                </Panel>
+                <Rectangle Name="HighlightRect" IsHitTestVisible="False" ZIndex="-1"
+                           Fill="{DynamicResource DatePickerFlyoutPresenterHighlightFill}"
+                           Grid.Column="0" Grid.ColumnSpan="5" VerticalAlignment="Center"
+                           Height="{DynamicResource DatePickerFlyoutPresenterHighlightHeight}" />
+                <Rectangle Name="FirstSpacer"
+                           Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
+                           HorizontalAlignment="Center"
+                           Width="{DynamicResource DatePickerSpacerThemeWidth}"
+                           Grid.Column="1" />
+                <Rectangle Name="SecondSpacer"
+                           Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
+                           HorizontalAlignment="Center"
+                           Width="{DynamicResource DatePickerSpacerThemeWidth}"
+                           Grid.Column="3" />
+              </Grid>
+              <Grid Grid.Row="1" Height="{DynamicResource DatePickerFlyoutPresenterAcceptDismissHostGridHeight}"
+                    Name="AcceptDismissGrid" ColumnDefinitions="*,*">
+                <Rectangle Height="{DynamicResource DatePickerSpacerThemeWidth}" VerticalAlignment="Top"
+                           Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
+                           Grid.ColumnSpan="2"/>
+                <Button Name="AcceptButton" Grid.Column="0" Theme="{StaticResource FluentDateTimePickerButton}"
+                        HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                  <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
+                        StrokeThickness="0.75" Data="M0.5,8.5 5,13.5 15.5,3" />
+                </Button>
+                <Button Name="DismissButton" Grid.Column="1" Theme="{StaticResource FluentDateTimePickerButton}"
+                        FontSize="16" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                  <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
+                        StrokeThickness="0.75" Data="M2,2 14,14 M2,14 14 2" />
+                </Button>
+              </Grid>
             </Grid>
-          </Grid>
-        </Border>
-      </ControlTemplate>
-    </Setter>
-  </Style>
+          </Border>
+        </ControlTemplate>
+      </Setter>
+
+      <Style Selector="^ /template/ Panel">
+        <Style Selector="^ RepeatButton">
+          <Setter Property="IsVisible" Value="False" />
+        </Style>
+
+        <Style Selector="^:pointerover RepeatButton">
+          <Setter Property="IsVisible" Value="True" />
+        </Style>
+      </Style> 
+    </ControlTheme>
 
-  <Style Selector="DatePickerPresenter /template/ Panel RepeatButton">
-    <Setter Property="IsVisible" Value="False" />
-  </Style>
 
-  <Style Selector="DatePickerPresenter /template/ Panel:pointerover RepeatButton">
-    <Setter Property="IsVisible" Value="True" />
-  </Style>
-  
-</Styles>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml b/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml
index b96c689ab6..3206cb8cb1 100644
--- a/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml
@@ -1,103 +1,101 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        x:CompileBindings="True">
-
-  <Design.PreviewWith>
-    <Border Padding="20">
-      <StackPanel Spacing="20">
-        <DropDownButton Content="Click Me!" />
-        <DropDownButton Content="Disabled" IsEnabled="False" />
-      </StackPanel>
-    </Border>
-  </Design.PreviewWith>
-
-  <Styles.Resources>
-    <x:Double x:Key="DropDownButtonMinHeight">32</x:Double>
-  </Styles.Resources>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    x:CompileBindings="True">
+    <Design.PreviewWith>
+      <Border Padding="20">
+        <StackPanel Spacing="20">
+          <DropDownButton Content="Click Me!" />
+          <DropDownButton Content="Disabled" IsEnabled="False" />
+        </StackPanel>
+      </Border>
+    </Design.PreviewWith>
   
-  <Style Selector="DropDownButton">
-    <Setter Property="Background" Value="{DynamicResource ButtonBackground}" />
-    <Setter Property="Foreground" Value="{DynamicResource ButtonForeground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrush}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThemeThickness}" />
-    <Setter Property="Padding" Value="{DynamicResource ButtonPadding}" />
-    <Setter Property="MinHeight" Value="{DynamicResource DropDownButtonMinHeight}" />
-    <Setter Property="HorizontalAlignment" Value="Left" />
-    <Setter Property="VerticalAlignment" Value="Center" />
-    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
-    <Setter Property="VerticalContentAlignment" Value="Center" />
-    <!--<Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
-    <Setter Property="FocusVisualMargin" Value="-3" />-->
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="Template">
-      <Setter.Value>
-        <ControlTemplate>
-          <Border x:Name="RootBorder"
-                  Background="{TemplateBinding Background}"
-                  BorderBrush="{TemplateBinding BorderBrush}"
-                  BorderThickness="{TemplateBinding BorderThickness}"
-                  CornerRadius="{TemplateBinding CornerRadius}"
-                  ClipToBounds="True">
-            <Grid x:Name="InnerGrid">
-              <Grid.ColumnDefinitions>
-                <ColumnDefinition Width="*" />
-                <ColumnDefinition Width="Auto" />
-              </Grid.ColumnDefinitions>
-
-              <ContentPresenter x:Name="PART_ContentPresenter"
-                                Grid.Column="0"
-                                Content="{TemplateBinding Content}"
-                                ContentTemplate="{TemplateBinding ContentTemplate}"
-                                Padding="{TemplateBinding Padding}"
-                                RecognizesAccessKey="True"
-                                HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
-
-              <PathIcon x:Name="DropDownGlyph"
-                        Grid.Column="1"
-                        UseLayoutRounding="False"
-                        IsHitTestVisible="False"
-                        Height="12"
-                        Width="12"
-                        Margin="0,0,10,0"
-                        HorizontalAlignment="Right"
-                        VerticalAlignment="Center" />
-
-            </Grid>
-          </Border>
-        </ControlTemplate>
-      </Setter.Value>
-    </Setter>
-  </Style>
-
-  <!--  Normal State  -->
-  <Style Selector="DropDownButton /template/ PathIcon#DropDownGlyph">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForeground}" />
-    <Setter Property="Data" Value="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" />
-  </Style>
-
-  <!--  PointerOver State  -->
-  <Style Selector="DropDownButton:pointerover /template/ Border#RootBorder">
-    <Setter Property="Background" Value="{DynamicResource ButtonBackgroundPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushPointerOver}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource ButtonForegroundPointerOver}" />
-  </Style>
-
-  <!--  Pressed State  -->
-  <Style Selector="DropDownButton:pressed  /template/ Border#RootBorder">
-    <Setter Property="Background" Value="{DynamicResource ButtonBackgroundPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushPressed}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource ButtonForegroundPressed}" />
-  </Style>
+    <x:Double x:Key="DropDownButtonMinHeight">32</x:Double>
+    
+    <ControlTheme x:Key="{x:Type DropDownButton}" TargetType="DropDownButton">
+      <Setter Property="Background" Value="{DynamicResource ButtonBackground}" />
+      <Setter Property="Foreground" Value="{DynamicResource ButtonForeground}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrush}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThemeThickness}" />
+      <Setter Property="Padding" Value="{DynamicResource ButtonPadding}" />
+      <Setter Property="MinHeight" Value="{DynamicResource DropDownButtonMinHeight}" />
+      <Setter Property="HorizontalAlignment" Value="Left" />
+      <Setter Property="VerticalAlignment" Value="Center" />
+      <Setter Property="HorizontalContentAlignment" Value="Stretch" />
+      <Setter Property="VerticalContentAlignment" Value="Center" />
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="Template">
+        <Setter.Value>
+          <ControlTemplate>
+            <Border x:Name="RootBorder" 
+                    Background="{TemplateBinding Background}" 
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}" 
+                    CornerRadius="{TemplateBinding CornerRadius}"
+                    ClipToBounds="True">
+              <Grid x:Name="InnerGrid">
+                <Grid.ColumnDefinitions>
+                  <ColumnDefinition Width="*" />
+                  <ColumnDefinition Width="Auto" />
+                </Grid.ColumnDefinitions>
+                
+                <ContentPresenter x:Name="PART_ContentPresenter" 
+                                  Grid.Column="0" 
+                                  Content="{TemplateBinding Content}" 
+                                  ContentTemplate="{TemplateBinding ContentTemplate}"
+                                  Padding="{TemplateBinding Padding}" 
+                                  RecognizesAccessKey="True" 
+                                  HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                  VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
+                
+                <PathIcon x:Name="DropDownGlyph"
+                          Grid.Column="1" 
+                          UseLayoutRounding="False"
+                          IsHitTestVisible="False" 
+                          Height="12" 
+                          Width="12"
+                          Margin="0,0,10,0"
+                          Data="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z"
+                          HorizontalAlignment="Right"
+                          VerticalAlignment="Center" />
+              </Grid>
+            </Border>
+          </ControlTemplate>
+        </Setter.Value>
+      </Setter>
+      
+      <!--  Normal State  -->
+      <Style Selector="^ /template/ PathIcon#DropDownGlyph">
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForeground}" />
+      </Style>
+      
+      <!--  PointerOver State  -->
+      <Style Selector="^:pointerover /template/ Border#RootBorder">
+        <Setter Property="Background" Value="{DynamicResource ButtonBackgroundPointerOver}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushPointerOver}" />
+        <Setter Property="TextElement.Foreground" Value="{DynamicResource ButtonForegroundPointerOver}" />
+      </Style>
+      
+      <!--  Pressed State  -->
+      <Style Selector="^:pressed /template/ Border#RootBorder">
+        <Setter Property="Background" Value="{DynamicResource ButtonBackgroundPressed}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushPressed}" />
+        <Setter Property="TextElement.Foreground" Value="{DynamicResource ButtonForegroundPressed}" />
+      </Style>
 
-  <!--  Disabled State  -->
-  <Style Selector="DropDownButton:disabled /template/ Border#RootBorder">
-    <Setter Property="Background" Value="{DynamicResource ButtonBackgroundDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushDisabled}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource ButtonForegroundDisabled}" />
-  </Style>
-  <Style Selector="DropDownButton:disabled /template/ PathIcon#DropDownGlyph">
-    <Setter Property="Foreground" Value="{DynamicResource ButtonForegroundDisabled}" />
-  </Style>
+      <!--  Disabled State  -->
+      <Style Selector="^:disabled /template/ Border#RootBorder">
+        <Setter Property="Background" Value="{DynamicResource ButtonBackgroundDisabled}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushDisabled}" />
+        <Setter Property="TextElement.Foreground" Value="{DynamicResource ButtonForegroundDisabled}" />
+      </Style>
+      <Style Selector="^:disabled /template/ PathIcon#DropDownGlyph">
+        <Setter Property="Foreground" Value="{DynamicResource ButtonForegroundDisabled}" />
+      </Style>
 
-</Styles>
+      <Style Selector="^:pressed">
+        <Setter Property="RenderTransform" Value="scale(0.98)" />
+      </Style>
+    </ControlTheme>
+  
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/EmbeddableControlRoot.xaml b/src/Avalonia.Themes.Fluent/Controls/EmbeddableControlRoot.xaml
index 79560be933..89eaec70ad 100644
--- a/src/Avalonia.Themes.Fluent/Controls/EmbeddableControlRoot.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/EmbeddableControlRoot.xaml
@@ -1,19 +1,23 @@
-<Style xmlns="https://github.com/avaloniaui" Selector="EmbeddableControlRoot">
-  <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltHighBrush}"/>
-  <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}"/>
-  <Setter Property="Template">
-    <ControlTemplate>
-      <Panel>
-        <Border Name="PART_TransparencyFallback" IsHitTestVisible="False" />
-        <Border Background="{TemplateBinding Background}">
-          <VisualLayerManager>
-            <ContentPresenter Name="PART_ContentPresenter"
-                              ContentTemplate="{TemplateBinding ContentTemplate}"
-                              Content="{TemplateBinding Content}"
-                              Margin="{TemplateBinding Padding}"/>
-          </VisualLayerManager>
-        </Border>
-      </Panel>
-    </ControlTemplate>
-  </Setter>
-</Style>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <ControlTheme x:Key="{x:Type EmbeddableControlRoot}" TargetType="EmbeddableControlRoot">
+      <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltHighBrush}"/>
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}"/>
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Panel>
+            <Border Name="PART_TransparencyFallback" IsHitTestVisible="False" />
+            <Border Background="{TemplateBinding Background}">
+              <VisualLayerManager>
+                <ContentPresenter Name="PART_ContentPresenter"
+                                  ContentTemplate="{TemplateBinding ContentTemplate}"
+                                  Content="{TemplateBinding Content}"
+                                  Margin="{TemplateBinding Padding}"/>
+              </VisualLayerManager>
+            </Border>
+          </Panel>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/Expander.xaml b/src/Avalonia.Themes.Fluent/Controls/Expander.xaml
index 33d502772e..36f6008782 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Expander.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Expander.xaml
@@ -1,6 +1,6 @@
-<Styles xmlns="https://github.com/avaloniaui" 
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        x:CompileBindings="True">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    x:CompileBindings="True">
   <Design.PreviewWith>
     <Border Padding="20">
       <StackPanel Orientation="Vertical" Spacing="20" Width="350">
@@ -34,72 +34,34 @@
     </Border>
   </Design.PreviewWith>
 
-  <Styles.Resources>
-    <Thickness x:Key="ExpanderHeaderPadding">16</Thickness>
-    <Thickness x:Key="ExpanderContentPadding">16</Thickness>
+  <Thickness x:Key="ExpanderHeaderPadding">16</Thickness>
+  <Thickness x:Key="ExpanderContentPadding">16</Thickness>
 
-    <Thickness x:Key="ExpanderBorderThickness">1</Thickness>
+  <Thickness x:Key="ExpanderBorderThickness">1</Thickness>
 
-    <Thickness x:Key="ExpanderDropdownLeftBorderThickness">1,1,0,1</Thickness>
-    <Thickness x:Key="ExpanderDropdownUpBorderThickness">1,1,1,0</Thickness>
-    <Thickness x:Key="ExpanderDropdownRightBorderThickness">0,1,1,1</Thickness>
-    <Thickness x:Key="ExpanderDropdownDownBorderThickness">1,0,1,1</Thickness>
+  <Thickness x:Key="ExpanderDropdownLeftBorderThickness">1,1,0,1</Thickness>
+  <Thickness x:Key="ExpanderDropdownUpBorderThickness">1,1,1,0</Thickness>
+  <Thickness x:Key="ExpanderDropdownRightBorderThickness">0,1,1,1</Thickness>
+  <Thickness x:Key="ExpanderDropdownDownBorderThickness">1,0,1,1</Thickness>
 
-    <SolidColorBrush x:Key="ExpanderBackground" Color="{DynamicResource SystemAltMediumHighColor}" />
-    <SolidColorBrush x:Key="ExpanderBorderBrush" Color="{DynamicResource SystemBaseLowColor}" />
+  <SolidColorBrush x:Key="ExpanderBackground" Color="{DynamicResource SystemAltMediumHighColor}" />
+  <SolidColorBrush x:Key="ExpanderBorderBrush" Color="{DynamicResource SystemBaseLowColor}" />
 
-    <SolidColorBrush x:Key="ExpanderDropDownBackground" Color="{DynamicResource SystemChromeMediumLowColor}" />
-    <SolidColorBrush x:Key="ExpanderDropDownBorderBrush" Color="{DynamicResource SystemBaseLowColor}" />
+  <SolidColorBrush x:Key="ExpanderDropDownBackground" Color="{DynamicResource SystemChromeMediumLowColor}" />
+  <SolidColorBrush x:Key="ExpanderDropDownBorderBrush" Color="{DynamicResource SystemBaseLowColor}" />
 
-    <SolidColorBrush x:Key="ExpanderForeground" Color="{DynamicResource SystemBaseHighColor}" />
+  <SolidColorBrush x:Key="ExpanderForeground" Color="{DynamicResource SystemBaseHighColor}" />
 
-    <SolidColorBrush x:Key="ExpanderChevronForeground" Color="{DynamicResource SystemBaseHighColor}" />
-  </Styles.Resources>
-  <Style Selector="Expander">
-    <Setter Property="Background" Value="{DynamicResource ExpanderBackground}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource ExpanderBorderThickness}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ExpanderBorderBrush}" />
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="Padding" Value="{DynamicResource ExpanderHeaderPadding}" />
-    <Setter Property="HorizontalAlignment" Value="Stretch" />
-    <Setter Property="HorizontalContentAlignment" Value="Left" />
-    <Setter Property="VerticalContentAlignment" Value="Center" />
-  </Style>
-  <Style Selector="Expander">
-    <Setter Property="Template">
-      <ControlTemplate>
-        <DockPanel>
-          <ToggleButton x:Name="ExpanderHeader"
-                        Padding="{TemplateBinding Padding}"
-                        HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
-                        Background="{TemplateBinding Background}"
-                        BorderBrush="{TemplateBinding BorderBrush}"
-                        BorderThickness="{TemplateBinding BorderThickness}"
-                        Content="{TemplateBinding Header}"
-                        ContentTemplate="{TemplateBinding HeaderTemplate}"
-                        IsChecked="{TemplateBinding IsExpanded, Mode=TwoWay}"
-                        IsEnabled="{TemplateBinding IsEnabled}" />
-          <Border x:Name="ExpanderContent"
-                  Padding="{DynamicResource ExpanderContentPadding}"
-                  Background="{DynamicResource ExpanderDropDownBackground}"
-                  BorderBrush="{DynamicResource ExpanderDropDownBorderBrush}"
-                  IsVisible="{TemplateBinding IsExpanded, Mode=TwoWay}">
-            <ContentPresenter x:Name="PART_ContentPresenter"
-                              HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                              VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                              Content="{TemplateBinding Content}"
-                              ContentTemplate="{TemplateBinding ContentTemplate}" />
-          </Border>
-        </DockPanel>
-      </ControlTemplate>
-    </Setter>
-  </Style>
+  <SolidColorBrush x:Key="ExpanderChevronForeground" Color="{DynamicResource SystemBaseHighColor}" />
 
-  <Style Selector="Expander /template/ ToggleButton#ExpanderHeader">
-    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
+  <ControlTheme x:Key="FluentExpanderToggleButtonTheme" TargetType="ToggleButton" BasedOn="{StaticResource {x:Type ToggleButton}}">
     <Setter Property="Template">
       <ControlTemplate>
-        <Border x:Name="ToggleButtonBackground">
+        <Border x:Name="ToggleButtonBackground"
+                Background="{TemplateBinding Background}"
+                BorderBrush="{TemplateBinding BorderBrush}"
+                CornerRadius="{TemplateBinding CornerRadius}"
+                BorderThickness="{TemplateBinding BorderThickness}">
           <Grid ColumnDefinitions="*,Auto">
             <ContentPresenter x:Name="PART_ContentPresenter"
                               Margin="{TemplateBinding Padding}"
@@ -132,110 +94,168 @@
         </Border>
       </ControlTemplate>
     </Setter>
-  </Style>
-  <Style Selector="Expander /template/ ToggleButton#ExpanderHeader:pressed">
-    <Setter Property="RenderTransform" Value="{x:Null}" />
-  </Style>
-
-  <Style Selector="Expander:left /template/ ToggleButton#ExpanderHeader, Expander:right /template/ ToggleButton#ExpanderHeader">
-    <Setter Property="VerticalAlignment" Value="Stretch" />
-  </Style>
-
-
-  <Style Selector="Expander /template/ ToggleButton#ExpanderHeader /template/ Border#ToggleButtonBackground">
-    <Setter Property="Background" Value="{TemplateBinding Background}" />
-    <Setter Property="BorderBrush" Value="{TemplateBinding BorderBrush}" />
-    <Setter Property="BorderThickness" Value="{TemplateBinding BorderThickness}" />
-  </Style>
-
-  <Style Selector="Expander:not(:expanded) /template/ ToggleButton#ExpanderHeader /template/ Border#ToggleButtonBackground">
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius}" />
-  </Style>
-  <Style Selector="Expander:expanded:up /template/ ToggleButton#ExpanderHeader /template/ Border#ToggleButtonBackground">
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource BottomCornerRadiusFilterConverter}}" />
-  </Style>
-  <Style Selector="Expander:expanded:up /template/ Border#ExpanderContent">
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource TopCornerRadiusFilterConverter}}" />
-  </Style>
-  <Style Selector="Expander:expanded:down /template/ ToggleButton#ExpanderHeader /template/ Border#ToggleButtonBackground">
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource TopCornerRadiusFilterConverter}}" />
-  </Style>
-  <Style Selector="Expander:expanded:down /template/ Border#ExpanderContent">
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource BottomCornerRadiusFilterConverter}}" />
-  </Style>
-  <Style Selector="Expander:expanded:left /template/ ToggleButton#ExpanderHeader /template/ Border#ToggleButtonBackground">
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource RightCornerRadiusFilterConverter}}" />
-  </Style>
-  <Style Selector="Expander:expanded:left /template/ Border#ExpanderContent">
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
-  </Style>
-  <Style Selector="Expander:expanded:right /template/ ToggleButton#ExpanderHeader /template/ Border#ToggleButtonBackground">
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
-  </Style>
-  <Style Selector="Expander:expanded:right /template/ Border#ExpanderContent">
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource RightCornerRadiusFilterConverter}}" />
-  </Style>
-
-  <Style Selector="Expander:left /template/ ToggleButton#ExpanderHeader">
-    <Setter Property="DockPanel.Dock" Value="Right" />
-  </Style>
-  <Style Selector="Expander:up /template/ ToggleButton#ExpanderHeader">
-    <Setter Property="DockPanel.Dock" Value="Bottom" />
-  </Style>
-  <Style Selector="Expander:right /template/ ToggleButton#ExpanderHeader">
-    <Setter Property="DockPanel.Dock" Value="Left" />
-  </Style>
-  <Style Selector="Expander:down /template/ ToggleButton#ExpanderHeader">
-    <Setter Property="DockPanel.Dock" Value="Top" />
-  </Style>
-
-
-  <Style Selector="Expander:expanded /template/ ToggleButton#ExpanderHeader /template/ Border#ExpandCollapseChevronBorder">
-    <Style.Animations>
-      <Animation FillMode="Both" Duration="0:0:0.0625">
-        <KeyFrame Cue="100%">
-          <Setter Property="RotateTransform.Angle" Value="180" />
-        </KeyFrame>
-      </Animation>
-    </Style.Animations>
-  </Style>
-  <Style Selector="Expander:not(:expanded) /template/ ToggleButton#ExpanderHeader /template/ Border#ExpandCollapseChevronBorder">
-    <Style.Animations>
-      <Animation FillMode="Both" Duration="0:0:0.0625">
-        <KeyFrame Cue="0%">
-          <Setter Property="RotateTransform.Angle" Value="180" />
-        </KeyFrame>
-        <KeyFrame Cue="100%">
-          <Setter Property="RotateTransform.Angle" Value="0" />
-        </KeyFrame>
-      </Animation>
-    </Style.Animations>
-  </Style>
-
-  <Style Selector="Expander:left /template/ ToggleButton#ExpanderHeader /template/ Path#ExpandCollapseChevron">
-    <Setter Property="Data" Value="M 7 0 L 0 7 L 7 14" />
-  </Style>
-  <Style Selector="Expander:up /template/ ToggleButton#ExpanderHeader /template/ Path#ExpandCollapseChevron">
-    <Setter Property="Data" Value="M 0 7 L 7 0 L 14 7" />
-  </Style>
-  <Style Selector="Expander:right /template/ ToggleButton#ExpanderHeader /template/ Path#ExpandCollapseChevron">
-    <Setter Property="Data" Value="M 0 0 L 7 7 L 0 14" />
-  </Style>
-  <Style Selector="Expander:down /template/ ToggleButton#ExpanderHeader /template/ Path#ExpandCollapseChevron">
-    <Setter Property="Data" Value="M 0 0 L 7 7 L 14 0" />
-  </Style>
-
-
-  <Style Selector="Expander:left /template/ Border#ExpanderContent">
-    <Setter Property="BorderThickness" Value="{DynamicResource ExpanderDropdownLeftBorderThickness}" />
-  </Style>
-  <Style Selector="Expander:up /template/ Border#ExpanderContent">
-    <Setter Property="BorderThickness" Value="{DynamicResource ExpanderDropdownUpBorderThickness}" />
-  </Style>
-  <Style Selector="Expander:right /template/ Border#ExpanderContent">
-    <Setter Property="BorderThickness" Value="{DynamicResource ExpanderDropdownRightBorderThickness}" />
-  </Style>
-  <Style Selector="Expander:down /template/ Border#ExpanderContent">
-    <Setter Property="BorderThickness" Value="{DynamicResource ExpanderDropdownDownBorderThickness}" />
-  </Style>
-</Styles>
+    <Style Selector="^[Tag=Expanded] /template/ Border#ExpandCollapseChevronBorder">
+      <Style.Animations>
+        <Animation FillMode="Both" Duration="0:0:0.0625">
+          <KeyFrame Cue="100%">
+            <Setter Property="RotateTransform.Angle" Value="180" />
+          </KeyFrame>
+        </Animation>
+      </Style.Animations>
+    </Style>
+    <Style Selector="^[Tag=NotExpanded] /template/ Border#ExpandCollapseChevronBorder">
+      <Style.Animations>
+        <Animation FillMode="Both" Duration="0:0:0.0625">
+          <KeyFrame Cue="0%">
+            <Setter Property="RotateTransform.Angle" Value="180" />
+          </KeyFrame>
+          <KeyFrame Cue="100%">
+            <Setter Property="RotateTransform.Angle" Value="0" />
+          </KeyFrame>
+        </Animation>
+      </Style.Animations>
+    </Style>
+  </ControlTheme>
+  <ControlTheme x:Key="FluentExpanderToggleButtonUpTheme" TargetType="ToggleButton" BasedOn="{StaticResource FluentExpanderToggleButtonTheme}">
+    <Style Selector="^ /template/ Path#ExpandCollapseChevron">
+      <Setter Property="Data" Value="M 0 7 L 7 0 L 14 7" />
+    </Style>
+  </ControlTheme>
+  <ControlTheme x:Key="FluentExpanderToggleButtonDownTheme" TargetType="ToggleButton" BasedOn="{StaticResource FluentExpanderToggleButtonTheme}">
+    <Style Selector="^ /template/ Path#ExpandCollapseChevron">
+      <Setter Property="Data" Value="M 0 0 L 7 7 L 14 0" />
+    </Style>
+  </ControlTheme>
+  <ControlTheme x:Key="FluentExpanderToggleButtonLeftTheme" TargetType="ToggleButton" BasedOn="{StaticResource FluentExpanderToggleButtonTheme}">
+    <Style Selector="^ /template/ Path#ExpandCollapseChevron">
+      <Setter Property="Data" Value="M 7 0 L 0 7 L 7 14" />
+    </Style>
+  </ControlTheme>
+  <ControlTheme x:Key="FluentExpanderToggleButtonRightTheme" TargetType="ToggleButton" BasedOn="{StaticResource FluentExpanderToggleButtonTheme}">
+    <Style Selector="^ /template/ Path#ExpandCollapseChevron">
+      <Setter Property="Data" Value="M 0 0 L 7 7 L 0 14" />
+    </Style>
+  </ControlTheme>
+  <ControlTheme x:Key="{x:Type Expander}" TargetType="Expander">
+    <Setter Property="Background" Value="{DynamicResource ExpanderBackground}" />
+    <Setter Property="BorderThickness" Value="{DynamicResource ExpanderBorderThickness}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource ExpanderBorderBrush}" />
+    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+    <Setter Property="Padding" Value="{DynamicResource ExpanderHeaderPadding}" />
+    <Setter Property="HorizontalAlignment" Value="Stretch" />
+    <Setter Property="HorizontalContentAlignment" Value="Left" />
+    <Setter Property="VerticalContentAlignment" Value="Center" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <DockPanel>
+          <ToggleButton x:Name="ExpanderHeader"
+                        Padding="{TemplateBinding Padding}"
+                        HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
+                        Background="{TemplateBinding Background}"
+                        BorderBrush="{TemplateBinding BorderBrush}"
+                        BorderThickness="{TemplateBinding BorderThickness}"
+                        HorizontalContentAlignment="Stretch"
+                        Content="{TemplateBinding Header}"
+                        ContentTemplate="{TemplateBinding HeaderTemplate}"
+                        IsChecked="{TemplateBinding IsExpanded, Mode=TwoWay}"
+                        IsEnabled="{TemplateBinding IsEnabled}"/>
+          <Border x:Name="ExpanderContent"
+                  Padding="{DynamicResource ExpanderContentPadding}"
+                  Background="{DynamicResource ExpanderDropDownBackground}"
+                  BorderBrush="{DynamicResource ExpanderDropDownBorderBrush}"
+                  IsVisible="{TemplateBinding IsExpanded, Mode=TwoWay}">
+            <ContentPresenter x:Name="PART_ContentPresenter"
+                              HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                              VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                              Content="{TemplateBinding Content}"
+                              ContentTemplate="{TemplateBinding ContentTemplate}" />
+          </Border>
+        </DockPanel>
+      </ControlTemplate>
+    </Setter>
+ 
+    <Style Selector="^ /template/ ToggleButton#ExpanderHeader:pressed">
+      <Setter Property="RenderTransform" Value="{x:Null}" />
+    </Style>
+
+    <Style Selector="^:left /template/ ToggleButton#ExpanderHeader, ^:right /template/ ToggleButton#ExpanderHeader">
+      <Setter Property="VerticalAlignment" Value="Stretch" />
+    </Style>
+
+    <Style Selector="^:not(:expanded) /template/ ToggleButton#ExpanderHeader">
+      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius}" />
+    </Style>
+    <Style Selector="^:expanded:up /template/ ToggleButton#ExpanderHeader">
+      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource BottomCornerRadiusFilterConverter}}" />
+    </Style>
+    <Style Selector="^:expanded:up /template/ Border#ExpanderContent">
+      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource TopCornerRadiusFilterConverter}}" />
+    </Style>
+    <Style Selector="^:expanded:down /template/ ToggleButton#ExpanderHeader">
+      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource TopCornerRadiusFilterConverter}}" />
+    </Style>
+    <Style Selector="^:expanded:down /template/ Border#ExpanderContent">
+      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource BottomCornerRadiusFilterConverter}}" />
+    </Style>
+    <Style Selector="^:expanded:left /template/ ToggleButton#ExpanderHeader">
+      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource RightCornerRadiusFilterConverter}}" />
+    </Style>
+    <Style Selector="^:expanded:left /template/ Border#ExpanderContent">
+      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
+    </Style>
+    <Style Selector="^:expanded:right /template/ ToggleButton#ExpanderHeader">
+      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
+    </Style>
+    <Style Selector="^:expanded:right /template/ Border#ExpanderContent">
+      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource RightCornerRadiusFilterConverter}}" />
+    </Style>
+
+    <Style Selector="^:left /template/ ToggleButton#ExpanderHeader">
+      <Setter Property="DockPanel.Dock" Value="Right" />
+    </Style>
+    <Style Selector="^:up /template/ ToggleButton#ExpanderHeader">
+      <Setter Property="DockPanel.Dock" Value="Bottom" />
+    </Style>
+    <Style Selector="^:right /template/ ToggleButton#ExpanderHeader">
+      <Setter Property="DockPanel.Dock" Value="Left" />
+    </Style>
+    <Style Selector="^:down /template/ ToggleButton#ExpanderHeader">
+      <Setter Property="DockPanel.Dock" Value="Top" />
+    </Style>
+
+
+    <Style Selector="^:expanded /template/ ToggleButton#ExpanderHeader">
+      <Setter Property="Tag" Value="Expanded"/>
+    </Style>
+    <Style Selector="^:not(:expanded) /template/ ToggleButton#ExpanderHeader">
+      <Setter Property="Tag" Value="NotExpanded"/>
+    </Style>
+
+    <Style Selector="^:left /template/ ToggleButton#ExpanderHeader">
+      <Setter Property="Theme" Value="{StaticResource FluentExpanderToggleButtonLeftTheme}" />
+    </Style>
+    <Style Selector="^:up /template/ ToggleButton#ExpanderHeader">
+      <Setter Property="Theme" Value="{StaticResource FluentExpanderToggleButtonUpTheme}" />
+    </Style>
+    <Style Selector="^:right /template/ ToggleButton#ExpanderHeader">
+      <Setter Property="Theme" Value="{StaticResource FluentExpanderToggleButtonRightTheme}" />
+    </Style>
+    <Style Selector="^:down /template/ ToggleButton#ExpanderHeader">
+      <Setter Property="Theme" Value="{StaticResource FluentExpanderToggleButtonDownTheme}" />
+    </Style>
+
+
+    <Style Selector="^:left /template/ Border#ExpanderContent">
+      <Setter Property="BorderThickness" Value="{DynamicResource ExpanderDropdownLeftBorderThickness}" />
+    </Style>
+    <Style Selector="^:up /template/ Border#ExpanderContent">
+      <Setter Property="BorderThickness" Value="{DynamicResource ExpanderDropdownUpBorderThickness}" />
+    </Style>
+    <Style Selector="^:right /template/ Border#ExpanderContent">
+      <Setter Property="BorderThickness" Value="{DynamicResource ExpanderDropdownRightBorderThickness}" />
+    </Style>
+    <Style Selector="^:down /template/ Border#ExpanderContent">
+      <Setter Property="BorderThickness" Value="{DynamicResource ExpanderDropdownDownBorderThickness}" />
+    </Style>
+  </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
index 5b217e4764..286b3e3fcd 100644
--- a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
@@ -1,70 +1,78 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        x:Class="Avalonia.Themes.Fluent.Controls.FluentControls">
-  <!-- Define ToolTip first so its styles can be overriden by other controls (e.g. TextBox) -->  
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ToolTip.xaml"/>
-  <!-- PathIcon also needs to be defined early so it can be overriden by other styles (e.g. ComboBox) -->
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/PathIcon.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/DataValidationErrors.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/FocusAdorner.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Button.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/CaptionButtons.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Carousel.xaml"/>  
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/CheckBox.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ComboBox.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ComboBoxItem.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ContentControl.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/DropDownButton.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Label.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/GridSplitter.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ItemsControl.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ListBox.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ListBoxItem.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Menu.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ContextMenu.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/MenuItem.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/OverlayPopupHost.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/PopupRoot.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ProgressBar.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/RadioButton.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/RepeatButton.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Separator.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Slider.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ScrollBar.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabStrip.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabStripItem.xaml"/>
-  <!-- TabControl needs to come after TabStrip as it redefines the inner TabStrip.ItemsPanel-->
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabControl.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabItem.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TextBox.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ToggleButton.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TransitioningContentControl.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Expander.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TitleBar.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TreeView.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TreeViewItem.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/UserControl.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Window.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/EmbeddableControlRoot.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/CalendarButton.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/CalendarDayButton.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/CalendarItem.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Calendar.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/CalendarDatePicker.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/NumericUpDown.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/AutoCompleteBox.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/WindowNotificationManager.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/NotificationCard.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/NativeMenuBar.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ToggleSwitch.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitButton.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitView.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/DatePicker.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TimePicker.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/FlyoutPresenter.xaml"/>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/MenuFlyoutPresenter.xaml"/>
-  <!-- ManagedFileChooser comes last because it uses (and overrides) styles for a multitude of other controls...the dialogs were originally UserControls, after all-->
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ManagedFileChooser.xaml"/>
+<Styles
+    x:Class="Avalonia.Themes.Fluent.Controls.FluentControls"
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <Styles.Resources>
+        <ResourceDictionary>
+            <ResourceDictionary.MergedDictionaries>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Button.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/RadioButton.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Expander.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ProgressBar.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/AutoCompleteBox.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Calendar.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/CalendarButton.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/CalendarDatePicker.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/CalendarDayButton.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/CalendarItem.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/CaptionButtons.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Carousel.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/CheckBox.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/FlyoutPresenter.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/GridSplitter.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ItemsControl.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Label.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ListBox.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ListBoxItem.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Menu.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/MenuFlyoutPresenter.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/NativeMenuBar.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/NotificationCard.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/NumericUpDown.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/OverlayPopupHost.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/PopupRoot.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/PathIcon.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/RepeatButton.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Separator.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabControl.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabItem.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabStrip.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabStripItem.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ToggleButton.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ToggleSwitch.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ToolTip.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TitleBar.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TransitioningContentControl.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TreeView.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/WindowNotificationManager.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Window.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ComboBox.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ComboBoxItem.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ContentControl.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ContextMenu.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/DataValidationErrors.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/DatePicker.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/DropDownButton.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/EmbeddableControlRoot.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Slider.xaml" />
+            </ResourceDictionary.MergedDictionaries>
+        </ResourceDictionary>
+    </Styles.Resources>
+
+    <!--  Define ToolTip first so its styles can be overriden by other controls (e.g. TextBox)  -->
+    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/FocusAdorner.xaml" />
+    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/MenuItem.xaml" />
+    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ScrollBar.xaml" />
+    <!--  TabControl needs to come after TabStrip as it redefines the inner TabStrip.ItemsPanel  -->
+    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TextBox.xaml" />
+    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TreeViewItem.xaml" />
+    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitButton.xaml" />
+    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitView.xaml" />
+    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/UserControl.xaml" />
+    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TimePicker.xaml" />
+    <!--  ManagedFileChooser comes last because it uses (and overrides) styles for a multitude of other controls...the dialogs were originally UserControls, after all  -->
+    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ManagedFileChooser.xaml" />
+    <Styles.Resources />
 </Styles>
diff --git a/src/Avalonia.Themes.Fluent/Controls/FlyoutPresenter.xaml b/src/Avalonia.Themes.Fluent/Controls/FlyoutPresenter.xaml
index 92f8177ead..2dca5b0770 100644
--- a/src/Avalonia.Themes.Fluent/Controls/FlyoutPresenter.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/FlyoutPresenter.xaml
@@ -1,9 +1,7 @@
-<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Styles.Resources>
-    <Thickness x:Key="FlyoutBorderThemeThickness">1</Thickness>
-  </Styles.Resources>
-  
-  <Style Selector="FlyoutPresenter">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+  <Thickness x:Key="FlyoutBorderThemeThickness">1</Thickness>
+  <ControlTheme x:Key="{x:Type FlyoutPresenter}" TargetType="FlyoutPresenter">
     <Setter Property="HorizontalContentAlignment" Value="Stretch" />
     <Setter Property="VerticalContentAlignment" Value="Stretch" />
     <Setter Property="Background" Value="{DynamicResource FlyoutPresenterBackground}" />
@@ -38,5 +36,5 @@
         </Border>
       </ControlTemplate>
     </Setter>
-  </Style>
-</Styles>
+  </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/FocusAdorner.xaml b/src/Avalonia.Themes.Fluent/Controls/FocusAdorner.xaml
index 91bf71ed4d..c3f489da80 100644
--- a/src/Avalonia.Themes.Fluent/Controls/FocusAdorner.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/FocusAdorner.xaml
@@ -1,4 +1,4 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<Styles xmlns="https://github.com/avaloniaui"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
   <Styles.Resources>
     <Thickness x:Key="SystemControlFocusVisualMargin">0</Thickness>
diff --git a/src/Avalonia.Themes.Fluent/Controls/GridSplitter.xaml b/src/Avalonia.Themes.Fluent/Controls/GridSplitter.xaml
index e3a7b04f33..ca57eccd13 100644
--- a/src/Avalonia.Themes.Fluent/Controls/GridSplitter.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/GridSplitter.xaml
@@ -1,24 +1,22 @@
-<Styles xmlns="https://github.com/avaloniaui">
-
-  <Style Selector="GridSplitter">
-    <Setter Property="Focusable" Value="True" />
-    <Setter Property="MinWidth" Value="6" />
-    <Setter Property="MinHeight" Value="6" />
-    <Setter Property="Background" Value="{DynamicResource SystemAltMediumLowColor}" />
-    <Setter Property="PreviewContent">
-      <Template>
-        <Rectangle Fill="{DynamicResource SystemAccentColor}" />
-      </Template>
-    </Setter>
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border 
-          BorderBrush="{TemplateBinding BorderBrush}"
-          BorderThickness="{TemplateBinding BorderThickness}"
-          CornerRadius="{TemplateBinding CornerRadius}"
-          Background="{TemplateBinding Background}"/>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-
-</Styles>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <ControlTheme x:Key="{x:Type GridSplitter}" TargetType="GridSplitter">
+      <Setter Property="Focusable" Value="True" />
+      <Setter Property="MinWidth" Value="6" />
+      <Setter Property="MinHeight" Value="6" />
+      <Setter Property="Background" Value="{DynamicResource SystemAltMediumLowColor}" />
+      <Setter Property="PreviewContent">
+        <Template>
+          <Rectangle Fill="{DynamicResource SystemAccentColor}" />
+        </Template>
+      </Setter>
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Border BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
+                  CornerRadius="{TemplateBinding CornerRadius}"
+                  Background="{TemplateBinding Background}" />
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ItemsControl.xaml b/src/Avalonia.Themes.Fluent/Controls/ItemsControl.xaml
index 19d13b6399..b8d7c2c4ef 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ItemsControl.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ItemsControl.xaml
@@ -1,16 +1,19 @@
-<Style xmlns="https://github.com/avaloniaui" Selector="ItemsControl">
-  <Setter Property="Template">
-    <ControlTemplate>
-      <Border Background="{TemplateBinding Background}"
-              BorderBrush="{TemplateBinding BorderBrush}"
-              BorderThickness="{TemplateBinding BorderThickness}"
-              CornerRadius="{TemplateBinding CornerRadius}"
-              Padding="{TemplateBinding Padding}">
-        <ItemsPresenter Name="PART_ItemsPresenter"
-                        Items="{TemplateBinding Items}"
-                        ItemsPanel="{TemplateBinding ItemsPanel}"
-                        ItemTemplate="{TemplateBinding ItemTemplate}"/>
-      </Border>
-    </ControlTemplate>
-  </Setter>
-</Style>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <ControlTheme x:Key="{x:Type ItemsControl}" TargetType="ItemsControl">
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Border Background="{TemplateBinding Background}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
+                  CornerRadius="{TemplateBinding CornerRadius}"
+                  Padding="{TemplateBinding Padding}">
+            <ItemsPresenter Name="PART_ItemsPresenter"
+                            Items="{TemplateBinding Items}"
+                            ItemsPanel="{TemplateBinding ItemsPanel}"
+                            ItemTemplate="{TemplateBinding ItemTemplate}"/>
+          </Border>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/Label.xaml b/src/Avalonia.Themes.Fluent/Controls/Label.xaml
index d41e4e2166..ad57239648 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Label.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Label.xaml
@@ -1,18 +1,22 @@
-<Style xmlns="https://github.com/avaloniaui" Selector="Label">
-  <Setter Property="Padding" Value="3"/>
-  <Setter Property="Template">
-    <ControlTemplate>
-      <ContentPresenter Name="PART_ContentPresenter"
-                        Background="{TemplateBinding Background}"
-                        BorderBrush="{TemplateBinding BorderBrush}"
-                        BorderThickness="{TemplateBinding BorderThickness}"                        
-                        CornerRadius="{TemplateBinding CornerRadius}"
-                        ContentTemplate="{TemplateBinding ContentTemplate}"
-                        Content="{TemplateBinding Content}"
-                        Padding="{TemplateBinding Padding}"
-                        RecognizesAccessKey="True"
-                        VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                        HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
-    </ControlTemplate>
-  </Setter>
-</Style>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+
+    <ControlTheme x:Key="{x:Type Label}" TargetType="Label">
+      <Setter Property="Padding" Value="3"/>
+      <Setter Property="Template">
+        <ControlTemplate>
+          <ContentPresenter Name="PART_ContentPresenter"
+                            Background="{TemplateBinding Background}"
+                            BorderBrush="{TemplateBinding BorderBrush}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
+                            CornerRadius="{TemplateBinding CornerRadius}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
+                            Content="{TemplateBinding Content}"
+                            Padding="{TemplateBinding Padding}"
+                            RecognizesAccessKey="True"
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ListBox.xaml b/src/Avalonia.Themes.Fluent/Controls/ListBox.xaml
index 8011ed9daf..b1d4b77a3f 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ListBox.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ListBox.xaml
@@ -1,45 +1,47 @@
-<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Design.PreviewWith>
-    <Border Padding="20">
-      <ListBox>
-        <ListBoxItem>Test</ListBoxItem>
-        <ListBoxItem>Test</ListBoxItem>
-        <ListBoxItem>Test</ListBoxItem>
-        <ListBoxItem>Test</ListBoxItem>
-      </ListBox>
-    </Border>
-  </Design.PreviewWith>
-  <Style Selector="ListBox">
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}" />
-    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource SystemControlForegroundBaseHighBrush}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource ListBoxBorderThemeThickness}" />
-    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
-    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />        
-    <Setter Property="ScrollViewer.IsScrollChainingEnabled" Value="True" />        
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />    
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border Name="border"
-                ClipToBounds="{TemplateBinding ClipToBounds}"
-                Background="{TemplateBinding Background}"
-                BorderBrush="{TemplateBinding BorderBrush}"
-                BorderThickness="{TemplateBinding BorderThickness}"
-                CornerRadius="{TemplateBinding CornerRadius}">
-          <ScrollViewer Name="PART_ScrollViewer"
-                        HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}"
-                        VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}"
-                        IsScrollChainingEnabled="{TemplateBinding (ScrollViewer.IsScrollChainingEnabled)}"
-                        AllowAutoHide="{TemplateBinding (ScrollViewer.AllowAutoHide)}">
-            <ItemsPresenter Name="PART_ItemsPresenter"
-                            Items="{TemplateBinding Items}"
-                            ItemsPanel="{TemplateBinding ItemsPanel}"
-                            ItemTemplate="{TemplateBinding ItemTemplate}"
-                            Margin="{TemplateBinding Padding}"
-                            VirtualizationMode="{TemplateBinding VirtualizationMode}"/>
-          </ScrollViewer>
-        </Border>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-</Styles>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <Design.PreviewWith>
+      <Border Padding="20">
+        <ListBox>
+          <ListBoxItem>Test</ListBoxItem>
+          <ListBoxItem>Test</ListBoxItem>
+          <ListBoxItem>Test</ListBoxItem>
+          <ListBoxItem>Test</ListBoxItem>
+        </ListBox>
+      </Border>
+    </Design.PreviewWith>
+  
+    <ControlTheme x:Key="{x:Type ListBox}" TargetType="ListBox">
+      <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}" />
+      <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource SystemControlForegroundBaseHighBrush}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource ListBoxBorderThemeThickness}" />
+      <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
+      <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
+      <Setter Property="ScrollViewer.IsScrollChainingEnabled" Value="True" />
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Border Name="border"
+                  ClipToBounds="{TemplateBinding ClipToBounds}" 
+                  Background="{TemplateBinding Background}" 
+                  BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
+                  CornerRadius="{TemplateBinding CornerRadius}">
+            <ScrollViewer Name="PART_ScrollViewer" 
+                          HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}" 
+                          VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}"
+                          IsScrollChainingEnabled="{TemplateBinding (ScrollViewer.IsScrollChainingEnabled)}"
+                          AllowAutoHide="{TemplateBinding (ScrollViewer.AllowAutoHide)}">
+              <ItemsPresenter Name="PART_ItemsPresenter" 
+                              Items="{TemplateBinding Items}" 
+                              ItemsPanel="{TemplateBinding ItemsPanel}"
+                              ItemTemplate="{TemplateBinding ItemTemplate}" 
+                              Margin="{TemplateBinding Padding}"
+                              VirtualizationMode="{TemplateBinding VirtualizationMode}" />
+            </ScrollViewer>
+          </Border>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ListBoxItem.xaml b/src/Avalonia.Themes.Fluent/Controls/ListBoxItem.xaml
index 11f3c12772..c00e920f75 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ListBoxItem.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ListBoxItem.xaml
@@ -1,94 +1,79 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Design.PreviewWith>
-    <Border Padding="0">
-      <ListBox>
-        <ListBoxItem IsEnabled="False">Disabled</ListBoxItem>
-        <ListBoxItem Background="#66000000"
-                     Padding="20">
-          Test
-        </ListBoxItem>
-        <ListBoxItem>Test</ListBoxItem>
-      </ListBox>
-    </Border>
-  </Design.PreviewWith>
-  <Styles.Resources>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <Design.PreviewWith>
+      <Border Padding="0">
+        <ListBox>
+          <ListBoxItem IsEnabled="False">Disabled</ListBoxItem>
+          <ListBoxItem Background="#66000000"
+                       Padding="20">
+            Test
+          </ListBoxItem>
+          <ListBoxItem>Test</ListBoxItem>
+        </ListBox>
+      </Border>
+    </Design.PreviewWith>
     <Thickness x:Key="ListBoxItemPadding">12,9,12,12</Thickness>
-  </Styles.Resources>
-  <Style Selector="ListBoxItem">
-    <Setter Property="Background" Value="Transparent" />
-    <Setter Property="Padding" Value="{DynamicResource ListBoxItemPadding}" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <ContentPresenter Name="PART_ContentPresenter"
-                          Background="{TemplateBinding Background}"
-                          BorderBrush="{TemplateBinding BorderBrush}"
-                          BorderThickness="{TemplateBinding BorderThickness}"
-                          CornerRadius="{TemplateBinding CornerRadius}"
-                          ContentTemplate="{TemplateBinding ContentTemplate}"
-                          Content="{TemplateBinding Content}"
-                          Padding="{TemplateBinding Padding}"
-                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" />
-      </ControlTemplate>
-    </Setter>
-  </Style>
+    <ControlTheme x:Key="{x:Type ListBoxItem}" TargetType="ListBoxItem">
+      <Setter Property="Background" Value="Transparent" />
+      <Setter Property="Padding" Value="{DynamicResource ListBoxItemPadding}" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <ContentPresenter Name="PART_ContentPresenter"
+                            Background="{TemplateBinding Background}"
+                            BorderBrush="{TemplateBinding BorderBrush}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
+                            CornerRadius="{TemplateBinding CornerRadius}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
+                            Content="{TemplateBinding Content}"
+                            FontWeight="Normal"
+                            FontSize="{DynamicResource ControlContentThemeFontSize}"
+                            Padding="{TemplateBinding Padding}"
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" />
+        </ControlTemplate>
+      </Setter>
 
-  <Style Selector="ListBoxItem /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="FontWeight" Value="Normal" />
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-  </Style>
+      <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Foreground" Value="{DynamicResource SystemControlDisabledBaseMediumLowBrush}" />
+      </Style>
 
-  <!--  Disabled State  -->
-  <Style Selector="ListBoxItem:disabled /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlDisabledBaseMediumLowBrush}" />
-  </Style>
+      <!--  PointerOver State  -->
+      <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListLowBrush}" />
+        <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
+      </Style>
 
-  <!--  PointerOver State  -->
-  <Style Selector="ListBoxItem:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListLowBrush}" />
-  </Style>
-  <Style Selector="ListBoxItem:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-  </Style>
+      <!--  Pressed State  -->
+      <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListMediumBrush}" />
+        <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
+      </Style>
 
-  <!--  Pressed State  -->
-  <Style Selector="ListBoxItem:pressed /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListMediumBrush}" />
-  </Style>
-  <Style Selector="ListBoxItem:pressed /template/ ContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-  </Style>
+      <!--  Selected State  -->
+      <Style Selector="^:selected">
 
-  <!--  Selected State  -->
-  <Style Selector="ListBoxItem:selected /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentLowBrush}" />
-  </Style>
-  <Style Selector="ListBoxItem:selected /template/ ContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-  </Style>
+        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentLowBrush}" />
+          <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
+        </Style>
 
-  <!--  Selected Unfocused State  -->
-  <Style Selector="ListBoxItem:selected:not(:focus) /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentLowBrush}" />
-  </Style>
-  <Style Selector="ListBoxItem:selected:not(:focus) /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-  </Style>
+        <!--  Selected Unfocused State  -->
+        <Style Selector="^:not(:focus) /template/ ContentPresenter#PART_ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentLowBrush}" />
+          <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
+        </Style>
 
-  <!--  Selected PointerOver State  -->
-  <Style Selector="ListBoxItem:selected:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentMediumBrush}" />
-  </Style>
-  <Style Selector="ListBoxItem:selected:pointerover /template/ ContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-  </Style>
+        <!--  Selected PointerOver State  -->
+        <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentMediumBrush}" />
+          <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
+        </Style>
 
-  <!--  Selected Pressed State  -->
-  <Style Selector="ListBoxItem:selected:pressed /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentHighBrush}" />
-  </Style>
-  <Style Selector="ListBoxItem:selected:pressed /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-  </Style>
-</Styles>
+        <!--  Selected Pressed State  -->
+        <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentHighBrush}" />
+          <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
+        </Style>
+      </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ManagedFileChooser.xaml b/src/Avalonia.Themes.Fluent/Controls/ManagedFileChooser.xaml
index 60e16fcff2..dc454e4fdb 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ManagedFileChooser.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ManagedFileChooser.xaml
@@ -1,324 +1,324 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<Styles xmlns="https://github.com/avaloniaui"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:dialogs="clr-namespace:Avalonia.Dialogs;assembly=Avalonia.Dialogs">
-    <Style Selector="dialogs|ManagedFileChooser">
-        <Style.Resources>
-            <ResourceDictionary>
-                <GradientStops x:Key="IconRes.FolderBackGradientStops">
-                </GradientStops>
-                <GradientStops x:Key="IconRes.FolderFrontGradientStops">
-                    <GradientStop Offset="0" Color="#FFFFDA6F"/>
-                    <GradientStop Offset="1" Color="#FFFEC326"/>
-                </GradientStops>
-                <DrawingGroup x:Key="LevelUp">
-                    <GeometryDrawing Brush="#00FFFFFF" Geometry="F1M16,16L0,16 0,0 16,0z" />
-                    <GeometryDrawing Brush="#FFF6F6F6" Geometry="F1M14.5,0L6.39,0 5.39,2 2.504,2C1.677,2,1,2.673,1,3.5L1,10.582 1,10.586 1,15.414 3,13.414 3,16 7,16 7,13.414 9,15.414 9,13 14.5,13C15.327,13,16,12.327,16,11.5L16,1.5C16,0.673,15.327,0,14.5,0" />
-                    <GeometryDrawing Brush="#FFDCB679" Geometry="F1M14,3L7.508,3 8.008,2 8.012,2 14,2z M14.5,1L7.008,1 6.008,3 2.504,3C2.227,3,2,3.224,2,3.5L2,9.582 4.998,6.586 9,10.586 9,12 14.5,12C14.775,12,15,11.776,15,11.5L15,1.5C15,1.224,14.775,1,14.5,1" />
-                    <GeometryDrawing Brush="#FF00529C" Geometry="F1M8,11L5,8 2,11 2,13 4,11 4,15 6,15 6,11 8,13z" />
-                    <GeometryDrawing Brush="#FFF0EFF1" Geometry="F1M8.0001,1.9996L7.5001,3.0006 14.0001,3.0006 14.0001,1.9996z" />
-                </DrawingGroup>
-                <dialogs:ResourceSelectorConverter x:Key="Icons">
-                    <DrawingGroup x:Key="Icon_Folder">
-                        <GeometryDrawing Geometry="M 0 0 L 16 16"/>
-                        <GeometryDrawing Geometry="M 0 3 C 0,1 0,1 2,1 L 5 1 C 5.5,1 6,1 6.5,1.5 L 8 3 L 14 3 C 16,3 16,3 16,5
+  <Style Selector="dialogs|ManagedFileChooser">
+    <Style.Resources>
+      <ResourceDictionary>
+        <GradientStops x:Key="IconRes.FolderBackGradientStops">
+        </GradientStops>
+        <GradientStops x:Key="IconRes.FolderFrontGradientStops">
+          <GradientStop Offset="0" Color="#FFFFDA6F"/>
+          <GradientStop Offset="1" Color="#FFFEC326"/>
+        </GradientStops>
+        <DrawingGroup x:Key="LevelUp">
+          <GeometryDrawing Brush="#00FFFFFF" Geometry="F1M16,16L0,16 0,0 16,0z" />
+          <GeometryDrawing Brush="#FFF6F6F6" Geometry="F1M14.5,0L6.39,0 5.39,2 2.504,2C1.677,2,1,2.673,1,3.5L1,10.582 1,10.586 1,15.414 3,13.414 3,16 7,16 7,13.414 9,15.414 9,13 14.5,13C15.327,13,16,12.327,16,11.5L16,1.5C16,0.673,15.327,0,14.5,0" />
+          <GeometryDrawing Brush="#FFDCB679" Geometry="F1M14,3L7.508,3 8.008,2 8.012,2 14,2z M14.5,1L7.008,1 6.008,3 2.504,3C2.227,3,2,3.224,2,3.5L2,9.582 4.998,6.586 9,10.586 9,12 14.5,12C14.775,12,15,11.776,15,11.5L15,1.5C15,1.224,14.775,1,14.5,1" />
+          <GeometryDrawing Brush="#FF00529C" Geometry="F1M8,11L5,8 2,11 2,13 4,11 4,15 6,15 6,11 8,13z" />
+          <GeometryDrawing Brush="#FFF0EFF1" Geometry="F1M8.0001,1.9996L7.5001,3.0006 14.0001,3.0006 14.0001,1.9996z" />
+        </DrawingGroup>
+        <dialogs:ResourceSelectorConverter x:Key="Icons">
+          <DrawingGroup x:Key="Icon_Folder">
+            <GeometryDrawing Geometry="M 0 0 L 16 16"/>
+            <GeometryDrawing Geometry="M 0 3 C 0,1 0,1 2,1 L 5 1 C 5.5,1 6,1 6.5,1.5 L 8 3 L 14 3 C 16,3 16,3 16,5
                         L 16,12 C 16,14 16,14 14,14
                         L 2,14 C 0,14 0,14 0,12 Z">
-                            <GeometryDrawing.Brush>
-                                <LinearGradientBrush StartPoint="1,4" EndPoint="23,20">
-                                    <GradientStop Offset="0" Color="#FFFFC018"/>
-                                    <GradientStop Offset="1" Color="#FFDFA32D"/>
-                                </LinearGradientBrush>
-                            </GeometryDrawing.Brush>
-                        </GeometryDrawing>
-                        <GeometryDrawing Geometry="M 0 4.5 L 8 4.5 L 8 9 L 0 9 Z">
-                            <GeometryDrawing.Brush>
-                                <LinearGradientBrush StartPoint="0,4.5" EndPoint="0,5">
-                                    <GradientStop Offset="0" Color="#00D7A018"/>
-                                    <GradientStop Offset="1" Color="#7FD7A018"/>
-                                </LinearGradientBrush>
-                            </GeometryDrawing.Brush>
-                        </GeometryDrawing>
-                        <GeometryDrawing Geometry="M 0 9 C 0,5 0,5 2,5 L 5 5 C 5.5,5 6,5 6.5,4.75 L 8 4 L 14 4 C 16,4 16,4 16,6
+              <GeometryDrawing.Brush>
+                <LinearGradientBrush StartPoint="1,4" EndPoint="23,20">
+                  <GradientStop Offset="0" Color="#FFFFC018"/>
+                  <GradientStop Offset="1" Color="#FFDFA32D"/>
+                </LinearGradientBrush>
+              </GeometryDrawing.Brush>
+            </GeometryDrawing>
+            <GeometryDrawing Geometry="M 0 4.5 L 8 4.5 L 8 9 L 0 9 Z">
+              <GeometryDrawing.Brush>
+                <LinearGradientBrush StartPoint="0,4.5" EndPoint="0,5">
+                  <GradientStop Offset="0" Color="#00D7A018"/>
+                  <GradientStop Offset="1" Color="#7FD7A018"/>
+                </LinearGradientBrush>
+              </GeometryDrawing.Brush>
+            </GeometryDrawing>
+            <GeometryDrawing Geometry="M 0 9 C 0,5 0,5 2,5 L 5 5 C 5.5,5 6,5 6.5,4.75 L 8 4 L 14 4 C 16,4 16,4 16,6
                                                     L 16,11 C 16,13 16,13 14,13
                                                     L 2,13 C 0,13 0,13 0,11 Z">
-                            <GeometryDrawing.Brush>
-                                <LinearGradientBrush StartPoint="1,6" EndPoint="23,19">
-                                    <GradientStop Offset="0" Color="#FFFFE69D"/>
-                                    <GradientStop Offset="1" Color="#FFFFC937"/>
-                                </LinearGradientBrush>
-                            </GeometryDrawing.Brush>
-                        </GeometryDrawing>
-                        <GeometryDrawing Geometry="M 0 9 C 0,5 0,5 2,5 L 5 5 C 5.5,5 6,5 6.5,4.75 L 8 4 L 14 4
+              <GeometryDrawing.Brush>
+                <LinearGradientBrush StartPoint="1,6" EndPoint="23,19">
+                  <GradientStop Offset="0" Color="#FFFFE69D"/>
+                  <GradientStop Offset="1" Color="#FFFFC937"/>
+                </LinearGradientBrush>
+              </GeometryDrawing.Brush>
+            </GeometryDrawing>
+            <GeometryDrawing Geometry="M 0 9 C 0,5 0,5 2,5 L 5 5 C 5.5,5 6,5 6.5,4.75 L 8 4 L 14 4
                                                     L 8 4.25 C 6,5.25 5.5,5.25 5.125,5.25 L 2 5.25 C 0,5.25 0,5.25 0,9.25 z" Brush="#7FFFFFFF"/>
-                    </DrawingGroup>
-                    <DrawingGroup x:Key="Icon_File">
-                        <GeometryDrawing Geometry="M 0 0 L 16 16"/>
-                        <GeometryDrawing Geometry="M 2 0 L 10 0 L 14 4 L 14 16 L 2 16 Z" Brush="#FF797774"/>
-                        <GeometryDrawing Geometry="M 3 1 L 9.7 1 L 13 4.3 L 13 15 L 3 15 Z" Brush="#FFFAFAFA"/>
-                        <GeometryDrawing Geometry="L 9 1 L 9 5 L 14 5 L 14 4 L 10 4 L 10 1 Z" Brush="#FF797774"/>
-                    </DrawingGroup>
-                    <DrawingGroup x:Key="Icon_Volume">
-                        <GeometryDrawing Geometry="M 0 0 L 16 16"/>
-                        <GeometryDrawing Geometry="M 4 5 L 12 5 L 14.5 7.5 C 15,8 15,8 15,9 L 1 9 C 1,8 1,8 1.5 7.5 Z" Brush="#FFE1E3E6"/>
-                        <GeometryDrawing Geometry="M 12 5 L 14.5 7.5 C 15,8 15,8 15,9 L 10 9 L 10 5 Z">
-                            <GeometryDrawing.Brush>
-                                <LinearGradientBrush StartPoint="12,5" EndPoint="11.5,5.5">
-                                    <GradientStop Offset="0" Color="#FFCDCFD1"/>
-                                    <GradientStop Offset="1" Color="#00CDCFD1"/>
-                                </LinearGradientBrush>
-                            </GeometryDrawing.Brush>
-                        </GeometryDrawing>
-                        <GeometryDrawing Geometry="M 4 5 L 1.5 7.5 C 1,8 1,8 1,9 L 4 9 L 6 9 L 6 5 Z">
-                            <GeometryDrawing.Brush>
-                                <LinearGradientBrush StartPoint="4,5" EndPoint="4.5,5.5">
-                                    <GradientStop Offset="0" Color="#FFCDCFD1"/>
-                                    <GradientStop Offset="1" Color="#00CDCFD1"/>
-                                </LinearGradientBrush>
-                            </GeometryDrawing.Brush>
-                        </GeometryDrawing>
-                        <GeometryDrawing Geometry="M 1 9 C 1,8 1,8 2,8 L 14 8
+          </DrawingGroup>
+          <DrawingGroup x:Key="Icon_File">
+            <GeometryDrawing Geometry="M 0 0 L 16 16"/>
+            <GeometryDrawing Geometry="M 2 0 L 10 0 L 14 4 L 14 16 L 2 16 Z" Brush="#FF797774"/>
+            <GeometryDrawing Geometry="M 3 1 L 9.7 1 L 13 4.3 L 13 15 L 3 15 Z" Brush="#FFFAFAFA"/>
+            <GeometryDrawing Geometry="L 9 1 L 9 5 L 14 5 L 14 4 L 10 4 L 10 1 Z" Brush="#FF797774"/>
+          </DrawingGroup>
+          <DrawingGroup x:Key="Icon_Volume">
+            <GeometryDrawing Geometry="M 0 0 L 16 16"/>
+            <GeometryDrawing Geometry="M 4 5 L 12 5 L 14.5 7.5 C 15,8 15,8 15,9 L 1 9 C 1,8 1,8 1.5 7.5 Z" Brush="#FFE1E3E6"/>
+            <GeometryDrawing Geometry="M 12 5 L 14.5 7.5 C 15,8 15,8 15,9 L 10 9 L 10 5 Z">
+              <GeometryDrawing.Brush>
+                <LinearGradientBrush StartPoint="12,5" EndPoint="11.5,5.5">
+                  <GradientStop Offset="0" Color="#FFCDCFD1"/>
+                  <GradientStop Offset="1" Color="#00CDCFD1"/>
+                </LinearGradientBrush>
+              </GeometryDrawing.Brush>
+            </GeometryDrawing>
+            <GeometryDrawing Geometry="M 4 5 L 1.5 7.5 C 1,8 1,8 1,9 L 4 9 L 6 9 L 6 5 Z">
+              <GeometryDrawing.Brush>
+                <LinearGradientBrush StartPoint="4,5" EndPoint="4.5,5.5">
+                  <GradientStop Offset="0" Color="#FFCDCFD1"/>
+                  <GradientStop Offset="1" Color="#00CDCFD1"/>
+                </LinearGradientBrush>
+              </GeometryDrawing.Brush>
+            </GeometryDrawing>
+            <GeometryDrawing Geometry="M 1 9 C 1,8 1,8 2,8 L 14 8
                                                     C 15,8 15,8 15,9 L 15 11
                                                     C 15,12 15,12 14,12 L 2 12
                                                     C 1,12 1,12 1,11 Z">
-                            <GeometryDrawing.Brush>
-                                <LinearGradientBrush StartPoint="0,8" EndPoint="0,12">
-                                    <GradientStop Offset="0" Color="#FF737374"/>
-                                    <GradientStop Offset="1" Color="#FFA8A8A8"/>
-                                </LinearGradientBrush>
-                            </GeometryDrawing.Brush>
-                        </GeometryDrawing>
-                        <GeometryDrawing Geometry="M 2 9 C 2,8 2,8 3,8 L 13 8
+              <GeometryDrawing.Brush>
+                <LinearGradientBrush StartPoint="0,8" EndPoint="0,12">
+                  <GradientStop Offset="0" Color="#FF737374"/>
+                  <GradientStop Offset="1" Color="#FFA8A8A8"/>
+                </LinearGradientBrush>
+              </GeometryDrawing.Brush>
+            </GeometryDrawing>
+            <GeometryDrawing Geometry="M 2 9 C 2,8 2,8 3,8 L 13 8
                                                     C 14,8 14,8 14,9 L 14 10
                                                     C 14,11 14,11 13,11 L 3 11
                                                     C 2,11 2,11 2,10 Z">
-                            <GeometryDrawing.Brush>
-                                <LinearGradientBrush StartPoint="0,8" EndPoint="0,11">
-                                    <GradientStop Offset="0" Color="#FF333333"/>
-                                    <GradientStop Offset="1" Color="#FF5A5A5A"/>
-                                </LinearGradientBrush>
-                            </GeometryDrawing.Brush>
-                        </GeometryDrawing>
-                        <GeometryDrawing>
-                            <GeometryDrawing.Geometry>
-                                <EllipseGeometry Rect="2.5,8.5,2,2"/>
-                            </GeometryDrawing.Geometry>
-                            <GeometryDrawing.Brush>
-                                <RadialGradientBrush GradientOrigin="3.5,9.5" Center="3.5,9.5">
-                                    <GradientStop Offset="0.8" Color="#4001FF01"/>
-                                    <GradientStop Offset="1" Color="#0001FF01"/>
-                                </RadialGradientBrush>
-                            </GeometryDrawing.Brush>
-                        </GeometryDrawing>
-                        <GeometryDrawing>
-                            <GeometryDrawing.Geometry>
-                                <EllipseGeometry Rect="3,9,1,1"/>
-                            </GeometryDrawing.Geometry>
-                            <GeometryDrawing.Brush>
-                                <RadialGradientBrush GradientOrigin="3.5,9.5" Center="3.25,9.75">
-                                    <GradientStop Offset="0" Color="#FFB6FFB6"/>
-                                    <GradientStop Offset="1" Color="#FF01FF01"/>
-                                </RadialGradientBrush>
-                            </GeometryDrawing.Brush>
-                        </GeometryDrawing>
-                        <GeometryDrawing Geometry="M 3.23483495705 9.76516504295 A 0.375,0.375 180 1 0 3.76516504295,9.23483495705 A 0.4375,0.4375 135 0 1 3.23483495705,9.76516504295 Z" Brush="#FF00B300"/>
-                    </DrawingGroup>
-                </dialogs:ResourceSelectorConverter>
-            </ResourceDictionary>
-        </Style.Resources>
-        <Setter Property="Template">
-            <ControlTemplate>
-                <DockPanel>
-                    <ListBox x:Name="QuickLinks" DockPanel.Dock="Left" Items="{Binding QuickLinks}" SelectedIndex="{Binding QuickLinksSelectedIndex}" Focusable="False">
-                        <ListBox.ItemTemplate>
-                            <DataTemplate>
-                                <StackPanel Spacing="4" Orientation="Horizontal" Background="Transparent">
-                                    <DrawingPresenter Width="16" Height="16" Drawing="{Binding IconKey, Converter={StaticResource Icons}}"/>
-                                    <TextBlock Text="{Binding DisplayName}"/>
-                                </StackPanel>
-                            </DataTemplate>
-                        </ListBox.ItemTemplate>
-                    </ListBox>
-                    <DockPanel x:Name="NavBar" DockPanel.Dock="Top" Margin="8,5,8,0" VerticalAlignment="Center">
-                        <Rectangle Fill="{DynamicResource SystemControlHighlightAltBaseMediumLowBrush}" Height="1" Margin="0,5,0,0" DockPanel.Dock="Bottom"/>
-                        <DockPanel Margin="4,0">
-                            <Button Command="{Binding GoUp}" DockPanel.Dock="Left">
-                                <Path Data="M 0 7 L 7 0 L 14 7 M 7 0 L 7 16" Stroke="{CompiledBinding $parent[Button].Foreground}" StrokeThickness="1" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="0,1,0,-1"/>
-                            </Button>
-                            <TextBox x:Name="Location" Text="{Binding Location}">
-                                <TextBox.KeyBindings>
-                                    <KeyBinding Command="{Binding EnterPressed}" Gesture="Enter"/>
-                                </TextBox.KeyBindings>
-                            </TextBox>
-                        </DockPanel>
-                    </DockPanel>
-                    <DockPanel Margin="8,0,8,5" DockPanel.Dock="Bottom">
-                        <Rectangle Fill="{DynamicResource SystemControlHighlightAltBaseMediumLowBrush}" Height="1" Margin="0,0,0,5" DockPanel.Dock="Top"/>
-                        <DockPanel Margin="4,0">
-                            <DockPanel DockPanel.Dock="Top" Margin="0,0,0,4">
-                                <ComboBox DockPanel.Dock="Right"
-                                    IsVisible="{Binding ShowFilters}" 
-                                    Items="{Binding Filters}"
-                                    SelectedItem="{Binding SelectedFilter}" />
-                                <TextBox Text="{Binding FileName}" Watermark="File name" IsVisible="{Binding !SelectingFolder}" />
-                            </DockPanel>
-                            <CheckBox IsChecked="{Binding ShowHiddenFiles}" Content="Show hidden files" DockPanel.Dock="Left"/>
-                            <UniformGrid x:Name="Finalize" HorizontalAlignment="Right" Rows="1">
-                                <Button Command="{Binding Ok}">OK</Button>
-                                <Button Command="{Binding Cancel}">Cancel</Button>
-                            </UniformGrid>
-                        </DockPanel>
-                    </DockPanel>
+              <GeometryDrawing.Brush>
+                <LinearGradientBrush StartPoint="0,8" EndPoint="0,11">
+                  <GradientStop Offset="0" Color="#FF333333"/>
+                  <GradientStop Offset="1" Color="#FF5A5A5A"/>
+                </LinearGradientBrush>
+              </GeometryDrawing.Brush>
+            </GeometryDrawing>
+            <GeometryDrawing>
+              <GeometryDrawing.Geometry>
+                <EllipseGeometry Rect="2.5,8.5,2,2"/>
+              </GeometryDrawing.Geometry>
+              <GeometryDrawing.Brush>
+                <RadialGradientBrush GradientOrigin="3.5,9.5" Center="3.5,9.5">
+                  <GradientStop Offset="0.8" Color="#4001FF01"/>
+                  <GradientStop Offset="1" Color="#0001FF01"/>
+                </RadialGradientBrush>
+              </GeometryDrawing.Brush>
+            </GeometryDrawing>
+            <GeometryDrawing>
+              <GeometryDrawing.Geometry>
+                <EllipseGeometry Rect="3,9,1,1"/>
+              </GeometryDrawing.Geometry>
+              <GeometryDrawing.Brush>
+                <RadialGradientBrush GradientOrigin="3.5,9.5" Center="3.25,9.75">
+                  <GradientStop Offset="0" Color="#FFB6FFB6"/>
+                  <GradientStop Offset="1" Color="#FF01FF01"/>
+                </RadialGradientBrush>
+              </GeometryDrawing.Brush>
+            </GeometryDrawing>
+            <GeometryDrawing Geometry="M 3.23483495705 9.76516504295 A 0.375,0.375 180 1 0 3.76516504295,9.23483495705 A 0.4375,0.4375 135 0 1 3.23483495705,9.76516504295 Z" Brush="#FF00B300"/>
+          </DrawingGroup>
+        </dialogs:ResourceSelectorConverter>
+      </ResourceDictionary>
+    </Style.Resources>
+    <Setter Property="Template">
+      <ControlTemplate>
+        <DockPanel>
+          <ListBox x:Name="QuickLinks" DockPanel.Dock="Left" Items="{Binding QuickLinks}" SelectedIndex="{Binding QuickLinksSelectedIndex}" Focusable="False">
+            <ListBox.ItemTemplate>
+              <DataTemplate>
+                <StackPanel Spacing="4" Orientation="Horizontal" Background="Transparent">
+                  <DrawingPresenter Width="16" Height="16" Drawing="{Binding IconKey, Converter={StaticResource Icons}}"/>
+                  <TextBlock Text="{Binding DisplayName}"/>
+                </StackPanel>
+              </DataTemplate>
+            </ListBox.ItemTemplate>
+          </ListBox>
+          <DockPanel x:Name="NavBar" DockPanel.Dock="Top" Margin="8,5,8,0" VerticalAlignment="Center">
+            <Rectangle Fill="{DynamicResource SystemControlHighlightAltBaseMediumLowBrush}" Height="1" Margin="0,5,0,0" DockPanel.Dock="Bottom"/>
+            <DockPanel Margin="4,0">
+              <Button Command="{Binding GoUp}" DockPanel.Dock="Left">
+                <Path Data="M 0 7 L 7 0 L 14 7 M 7 0 L 7 16" Stroke="{CompiledBinding $parent[Button].Foreground}" StrokeThickness="1" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="0,1,0,-1"/>
+              </Button>
+              <TextBox x:Name="Location" Text="{Binding Location}">
+                <TextBox.KeyBindings>
+                  <KeyBinding Command="{Binding EnterPressed}" Gesture="Enter"/>
+                </TextBox.KeyBindings>
+              </TextBox>
+            </DockPanel>
+          </DockPanel>
+          <DockPanel Margin="8,0,8,5" DockPanel.Dock="Bottom">
+            <Rectangle Fill="{DynamicResource SystemControlHighlightAltBaseMediumLowBrush}" Height="1" Margin="0,0,0,5" DockPanel.Dock="Top"/>
+            <DockPanel Margin="4,0">
+              <DockPanel DockPanel.Dock="Top" Margin="0,0,0,4">
+                <ComboBox DockPanel.Dock="Right"
+                    IsVisible="{Binding ShowFilters}"
+                    Items="{Binding Filters}"
+                    SelectedItem="{Binding SelectedFilter}" />
+                <TextBox Text="{Binding FileName}" Watermark="File name" IsVisible="{Binding !SelectingFolder}" />
+              </DockPanel>
+              <CheckBox IsChecked="{Binding ShowHiddenFiles}" Content="Show hidden files" DockPanel.Dock="Left"/>
+              <UniformGrid x:Name="Finalize" HorizontalAlignment="Right" Rows="1">
+                <Button Command="{Binding Ok}">OK</Button>
+                <Button Command="{Binding Cancel}">Cancel</Button>
+              </UniformGrid>
+            </DockPanel>
+          </DockPanel>
 
-                    <DockPanel Grid.IsSharedSizeScope="True">
-                        <Grid DockPanel.Dock="Top" Margin="15 5 0 0" HorizontalAlignment="Stretch">
-                            <Grid.ColumnDefinitions>
-                                <ColumnDefinition Width="20" SharedSizeGroup="Icon" />
-                                <ColumnDefinition Width="16" SharedSizeGroup="Splitter"  />
-                                <ColumnDefinition Width="275" SharedSizeGroup="Name" />
-                                <ColumnDefinition Width="16" SharedSizeGroup="Splitter" />
-                                <ColumnDefinition Width="200" SharedSizeGroup="Modified" />
-                                <ColumnDefinition Width="16" SharedSizeGroup="Splitter" />
-                                <ColumnDefinition Width="150" SharedSizeGroup="Type" />
-                                <ColumnDefinition Width="16" SharedSizeGroup="Splitter" />
-                                <ColumnDefinition Width="200" SharedSizeGroup="Size" />
-                            </Grid.ColumnDefinitions>
-                            <Grid.Styles>
-                                <Style Selector="GridSplitter">
-                                    <Setter Property="Background" Value="{DynamicResource SystemControlHighlightAltBaseMediumLowBrush}"/>
-                                    <Setter Property="Template">
-                                        <ControlTemplate>
-                                            <Border VerticalAlignment="Stretch" BorderThickness="0" Background="#01000000">
-                                                <Rectangle Width="1" VerticalAlignment="Stretch" Fill="{TemplateBinding Background}"/>
-                                            </Border>
-                                        </ControlTemplate>
-                                    </Setter>
-                                </Style>
-                            </Grid.Styles>
-                            <GridSplitter Grid.Column="1" />
-                            <TextBlock Grid.Column="2" Text="Name" />
-                            <GridSplitter Grid.Column="3" />
-                            <TextBlock Grid.Column="4" Text="Date Modified" />
-                            <GridSplitter Grid.Column="5" />
-                            <TextBlock Grid.Column="6" Text="Type" />
-                            <GridSplitter Grid.Column="7" />
-                            <TextBlock Grid.Column="8" Text="Size" />
-                        </Grid>
-                        <ListBox x:Name="Files"
-                            VirtualizationMode="Simple"
-                            Items="{Binding Items}"
-                            Margin="0 5"
-                            SelectionMode="{Binding SelectionMode}"
-                            SelectedItems="{Binding SelectedItems}"
-                            Background="Transparent"
-                            ScrollViewer.HorizontalScrollBarVisibility="Disabled">
-                            <ListBox.ItemTemplate>
-                                <DataTemplate>
-                                    <Grid Background="Transparent">
-                                        <Grid.ColumnDefinitions>
-                                            <ColumnDefinition SharedSizeGroup="Icon" />
-                                            <ColumnDefinition SharedSizeGroup="Splitter"  />
-                                            <ColumnDefinition SharedSizeGroup="Name" />
-                                            <ColumnDefinition SharedSizeGroup="Splitter" />
-                                            <ColumnDefinition SharedSizeGroup="Modified" />
-                                            <ColumnDefinition SharedSizeGroup="Splitter" />
-                                            <ColumnDefinition SharedSizeGroup="Type" />
-                                            <ColumnDefinition SharedSizeGroup="Splitter" />
-                                            <ColumnDefinition SharedSizeGroup="Size" />
-                                        </Grid.ColumnDefinitions>
-                                        <DrawingPresenter Width="16" Height="16" Drawing="{Binding IconKey, Converter={StaticResource Icons}}"/>
-                                        <TextBlock Grid.Column="2" Text="{Binding DisplayName}"/>
-                                        <TextBlock Grid.Column="4" Text="{Binding Modified}" />
-                                        <TextBlock Grid.Column="6" Text="{Binding Type}" />
-                                        <TextBlock Grid.Column="8">
-                                            <TextBlock.Text>
-                                                <Binding Path="Size">
-                                                    <Binding.Converter>
-                                                        <dialogs:FileSizeStringConverter/>
-                                                    </Binding.Converter>
-                                                </Binding>
-                                            </TextBlock.Text>
-                                        </TextBlock>
-                                    </Grid>
-                                </DataTemplate>
-                            </ListBox.ItemTemplate>
-                        </ListBox>
-                    </DockPanel>
-                </DockPanel>
-            </ControlTemplate>
-        </Setter>
-    </Style>
+          <DockPanel Grid.IsSharedSizeScope="True">
+            <Grid DockPanel.Dock="Top" Margin="15 5 0 0" HorizontalAlignment="Stretch">
+              <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="20" SharedSizeGroup="Icon" />
+                <ColumnDefinition Width="16" SharedSizeGroup="Splitter"  />
+                <ColumnDefinition Width="275" SharedSizeGroup="Name" />
+                <ColumnDefinition Width="16" SharedSizeGroup="Splitter" />
+                <ColumnDefinition Width="200" SharedSizeGroup="Modified" />
+                <ColumnDefinition Width="16" SharedSizeGroup="Splitter" />
+                <ColumnDefinition Width="150" SharedSizeGroup="Type" />
+                <ColumnDefinition Width="16" SharedSizeGroup="Splitter" />
+                <ColumnDefinition Width="200" SharedSizeGroup="Size" />
+              </Grid.ColumnDefinitions>
+              <Grid.Styles>
+                <Style Selector="GridSplitter">
+                  <Setter Property="Background" Value="{DynamicResource SystemControlHighlightAltBaseMediumLowBrush}"/>
+                  <Setter Property="Template">
+                    <ControlTemplate>
+                      <Border VerticalAlignment="Stretch" BorderThickness="0" Background="#01000000">
+                        <Rectangle Width="1" VerticalAlignment="Stretch" Fill="{TemplateBinding Background}"/>
+                      </Border>
+                    </ControlTemplate>
+                  </Setter>
+                </Style>
+              </Grid.Styles>
+              <GridSplitter Grid.Column="1" />
+              <TextBlock Grid.Column="2" Text="Name" />
+              <GridSplitter Grid.Column="3" />
+              <TextBlock Grid.Column="4" Text="Date Modified" />
+              <GridSplitter Grid.Column="5" />
+              <TextBlock Grid.Column="6" Text="Type" />
+              <GridSplitter Grid.Column="7" />
+              <TextBlock Grid.Column="8" Text="Size" />
+            </Grid>
+            <ListBox x:Name="Files"
+                VirtualizationMode="Simple"
+                Items="{Binding Items}"
+                Margin="0 5"
+                SelectionMode="{Binding SelectionMode}"
+                SelectedItems="{Binding SelectedItems}"
+                Background="Transparent"
+                ScrollViewer.HorizontalScrollBarVisibility="Disabled">
+              <ListBox.ItemTemplate>
+                <DataTemplate>
+                  <Grid Background="Transparent">
+                    <Grid.ColumnDefinitions>
+                      <ColumnDefinition SharedSizeGroup="Icon" />
+                      <ColumnDefinition SharedSizeGroup="Splitter"  />
+                      <ColumnDefinition SharedSizeGroup="Name" />
+                      <ColumnDefinition SharedSizeGroup="Splitter" />
+                      <ColumnDefinition SharedSizeGroup="Modified" />
+                      <ColumnDefinition SharedSizeGroup="Splitter" />
+                      <ColumnDefinition SharedSizeGroup="Type" />
+                      <ColumnDefinition SharedSizeGroup="Splitter" />
+                      <ColumnDefinition SharedSizeGroup="Size" />
+                    </Grid.ColumnDefinitions>
+                    <DrawingPresenter Width="16" Height="16" Drawing="{Binding IconKey, Converter={StaticResource Icons}}"/>
+                    <TextBlock Grid.Column="2" Text="{Binding DisplayName}"/>
+                    <TextBlock Grid.Column="4" Text="{Binding Modified}" />
+                    <TextBlock Grid.Column="6" Text="{Binding Type}" />
+                    <TextBlock Grid.Column="8">
+                      <TextBlock.Text>
+                        <Binding Path="Size">
+                          <Binding.Converter>
+                            <dialogs:FileSizeStringConverter/>
+                          </Binding.Converter>
+                        </Binding>
+                      </TextBlock.Text>
+                    </TextBlock>
+                  </Grid>
+                </DataTemplate>
+              </ListBox.ItemTemplate>
+            </ListBox>
+          </DockPanel>
+        </DockPanel>
+      </ControlTemplate>
+    </Setter>
+  </Style>
 
 
-    <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks">
-        <Setter Property="Margin" Value="0"/>
-        <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumBrush}"/>
-        <Setter Property="BorderThickness" Value="0"/>
-        <Setter Property="Width" Value="240"/>
-        <Setter Property="Padding" Value="0,20"/>
-        <Setter Property="Template">
-            <ControlTemplate>
-                <Border Name="border" BoxShadow="inset -6 0 3 -3 #20000000" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
-                    <ScrollViewer Name="PART_ScrollViewer" HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}" VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}">
-                        <ItemsPresenter Name="PART_ItemsPresenter"
-                                        Items="{TemplateBinding Items}"
-                                        ItemsPanel="{TemplateBinding ItemsPanel}"
-                                        ItemTemplate="{TemplateBinding ItemTemplate}"
-                                        Margin="{TemplateBinding Padding}"
-                                        VirtualizationMode="{TemplateBinding VirtualizationMode}"/>
-                    </ScrollViewer>
-                </Border>
-            </ControlTemplate>
-        </Setter>
-    </Style>
-    <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks ListBoxItem">
-        <Setter Property="Height" Value="32"/>
-        <Setter Property="Padding" Value="30,6"/>
-        <Setter Property="Template">
-            <ControlTemplate>
-                <Border x:Name="LayoutRoot" CornerRadius="2" Margin="10,0">
-                    <Panel>
-                        <Border x:Name="SelectedLine" HorizontalAlignment="Left" Margin="2,6" CornerRadius="0.5" Width="3" Background="{DynamicResource SystemControlHighlightAccentBrush}" IsVisible="{TemplateBinding IsSelected}"/>
-                        <ContentPresenter Name="PART_ContentPresenter"
-                                    Background="Transparent"
-                                    BorderBrush="Transparent"
-                                    BorderThickness="0"
-                                    ContentTemplate="{TemplateBinding ContentTemplate}"
-                                    Content="{TemplateBinding Content}"
-                                    Padding="{TemplateBinding Padding}"
-                                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
+  <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks">
+    <Setter Property="Margin" Value="0"/>
+    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumBrush}"/>
+    <Setter Property="BorderThickness" Value="0"/>
+    <Setter Property="Width" Value="240"/>
+    <Setter Property="Padding" Value="0,20"/>
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Name="border" BoxShadow="inset -6 0 3 -3 #20000000" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
+          <ScrollViewer Name="PART_ScrollViewer" HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}" VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}">
+            <ItemsPresenter Name="PART_ItemsPresenter"
+                            Items="{TemplateBinding Items}"
+                            ItemsPanel="{TemplateBinding ItemsPanel}"
+                            ItemTemplate="{TemplateBinding ItemTemplate}"
+                            Margin="{TemplateBinding Padding}"
+                            VirtualizationMode="{TemplateBinding VirtualizationMode}"/>
+          </ScrollViewer>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+  </Style>
+  <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks ListBoxItem">
+    <Setter Property="Height" Value="32"/>
+    <Setter Property="Padding" Value="30,6"/>
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border x:Name="LayoutRoot" CornerRadius="2" Margin="10,0">
+          <Panel>
+            <Border x:Name="SelectedLine" HorizontalAlignment="Left" Margin="2,6" CornerRadius="0.5" Width="3" Background="{DynamicResource SystemControlHighlightAccentBrush}" IsVisible="{TemplateBinding IsSelected}"/>
+            <ContentPresenter Name="PART_ContentPresenter"
+                        Background="Transparent"
+                        BorderBrush="Transparent"
+                        BorderThickness="0"
+                        ContentTemplate="{TemplateBinding ContentTemplate}"
+                        Content="{TemplateBinding Content}"
+                        Padding="{TemplateBinding Padding}"
+                        VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                        HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
 
-                    </Panel>
-                </Border>
-            </ControlTemplate>
-        </Setter>
-    </Style>
-    <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks ListBoxItem:pointerover /template/ Border#LayoutRoot">
-        <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltMediumBrush}"/>
-    </Style>
-    <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks ListBoxItem:selected /template/ Border#LayoutRoot">
-        <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltMediumHighBrush}"/>
-    </Style>
-    <Style Selector="dialogs|ManagedFileChooser /template/ DockPanel#NavBar Button,
+          </Panel>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+  </Style>
+  <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks ListBoxItem:pointerover /template/ Border#LayoutRoot">
+    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltMediumBrush}"/>
+  </Style>
+  <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks ListBoxItem:selected /template/ Border#LayoutRoot">
+    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltMediumHighBrush}"/>
+  </Style>
+  <Style Selector="dialogs|ManagedFileChooser /template/ DockPanel#NavBar Button,
                     dialogs|ManagedFileChooser /template/ DockPanel#NavBar TextBox">
-        <Setter Property="Height" Value="30"/>
-    </Style>
-    <Style Selector="dialogs|ManagedFileChooser /template/ DockPanel#NavBar Button">
-        <Setter Property="VerticalAlignment" Value="Stretch"/>
-        <Setter Property="Width" Value="40"/>
-        <Setter Property="Margin" Value="0,0,8,0"/>
-        <Setter Property="BorderThickness" Value="0"/>
-    </Style>
-    <Style Selector="dialogs|ManagedFileChooser /template/ DockPanel#NavBar Button:not(:pointerover):not(:pressed)">
-        <Setter Property="Background" Value="Transparent"/>
-    </Style>
+    <Setter Property="Height" Value="30"/>
+  </Style>
+  <Style Selector="dialogs|ManagedFileChooser /template/ DockPanel#NavBar Button">
+    <Setter Property="VerticalAlignment" Value="Stretch"/>
+    <Setter Property="Width" Value="40"/>
+    <Setter Property="Margin" Value="0,0,8,0"/>
+    <Setter Property="BorderThickness" Value="0"/>
+  </Style>
+  <Style Selector="dialogs|ManagedFileChooser /template/ DockPanel#NavBar Button:not(:pointerover):not(:pressed)">
+    <Setter Property="Background" Value="Transparent"/>
+  </Style>
 
-    <Style Selector="dialogs|ManagedFileChooser /template/ UniformGrid#Finalize > Button">
-            <Setter Property="HorizontalContentAlignment" Value="Center"/>
-            <Setter Property="HorizontalAlignment" Value="Stretch"/>
-            <Setter Property="Margin" Value="4,0,0,0"/>
-    </Style>
-    <Style Selector="dialogs|ManagedFileChooser /template/ UniformGrid#Finalize > Button /template/ ContentPresenter#PART_ContentPresenter">
-            <Setter Property="HorizontalAlignment" Value="Stretch"/>
-    </Style>
+  <Style Selector="dialogs|ManagedFileChooser /template/ UniformGrid#Finalize > Button">
+    <Setter Property="HorizontalContentAlignment" Value="Center"/>
+    <Setter Property="HorizontalAlignment" Value="Stretch"/>
+    <Setter Property="Margin" Value="4,0,0,0"/>
+  </Style>
+  <Style Selector="dialogs|ManagedFileChooser /template/ UniformGrid#Finalize > Button /template/ ContentPresenter#PART_ContentPresenter">
+    <Setter Property="HorizontalAlignment" Value="Stretch"/>
+  </Style>
 </Styles>
diff --git a/src/Avalonia.Themes.Fluent/Controls/Menu.xaml b/src/Avalonia.Themes.Fluent/Controls/Menu.xaml
index 4eb724a926..d42e413f00 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Menu.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Menu.xaml
@@ -1,36 +1,35 @@
-<Style xmlns="https://github.com/avaloniaui"
-       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-       Selector="Menu">
-  <Design.PreviewWith>
-    <Border Padding="20">
-      <Menu>
-        <MenuItem Header="New" />
-        <MenuItem Header="Open" />
-      </Menu>
-    </Border>
-  </Design.PreviewWith>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <Design.PreviewWith>
+      <Border Padding="20">
+        <Menu>
+          <MenuItem Header="New" />
+          <MenuItem Header="Open" />
+        </Menu>
+      </Border>
+    </Design.PreviewWith>
 
-  <Style.Resources>
     <x:Double x:Key="MenuBarHeight">32</x:Double>
-  </Style.Resources>
 
-  <Setter Property="Background" Value="Transparent" />
-  <Setter Property="Height" Value="{DynamicResource MenuBarHeight}" />
-  <Setter Property="Template">
-    <ControlTemplate>
-      <Border Background="{TemplateBinding Background}"
-              BorderBrush="{TemplateBinding BorderBrush}"
-              BorderThickness="{TemplateBinding BorderThickness}"
-              CornerRadius="{TemplateBinding CornerRadius}"
-              HorizontalAlignment="Stretch"
-              Padding="{TemplateBinding Padding}">
-        <ItemsPresenter Name="PART_ItemsPresenter"
-                        Items="{TemplateBinding Items}"
-                        ItemsPanel="{TemplateBinding ItemsPanel}"
-                        ItemTemplate="{TemplateBinding ItemTemplate}"
-                        VerticalAlignment="Stretch"
-                        KeyboardNavigation.TabNavigation="Continue" />
-      </Border>
-    </ControlTemplate>
-  </Setter>
-</Style>
+    <ControlTheme x:Key="{x:Type Menu}" TargetType="Menu">
+      <Setter Property="Background" Value="Transparent" />
+      <Setter Property="Height" Value="{DynamicResource MenuBarHeight}" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Border Background="{TemplateBinding Background}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
+                  CornerRadius="{TemplateBinding CornerRadius}"
+                  HorizontalAlignment="Stretch"
+                  Padding="{TemplateBinding Padding}">
+            <ItemsPresenter Name="PART_ItemsPresenter"
+                            Items="{TemplateBinding Items}"
+                            ItemsPanel="{TemplateBinding ItemsPanel}"
+                            ItemTemplate="{TemplateBinding ItemTemplate}"
+                            VerticalAlignment="Stretch"
+                            KeyboardNavigation.TabNavigation="Continue" />
+          </Border>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/MenuFlyoutPresenter.xaml b/src/Avalonia.Themes.Fluent/Controls/MenuFlyoutPresenter.xaml
index ff50acab5e..7769f0a5c9 100644
--- a/src/Avalonia.Themes.Fluent/Controls/MenuFlyoutPresenter.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/MenuFlyoutPresenter.xaml
@@ -1,35 +1,34 @@
-<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  
-  <Style Selector="MenuFlyoutPresenter">
-    <Setter Property="Background" Value="{DynamicResource MenuFlyoutPresenterBackground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource MenuFlyoutPresenterBorderBrush}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource MenuFlyoutPresenterBorderThemeThickness}" />
-    <Setter Property="Padding" Value="{DynamicResource MenuFlyoutPresenterThemePadding}" />
-    <Setter Property="MaxWidth" Value="{DynamicResource FlyoutThemeMaxWidth}" />
-    <Setter Property="MinHeight" Value="{DynamicResource MenuFlyoutThemeMinHeight}" />
-    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
-    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
-    <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border Name="LayoutRoot"
-                Background="{TemplateBinding Background}"
-                BorderBrush="{TemplateBinding BorderBrush}"
-                BorderThickness="{TemplateBinding BorderThickness}"
-                Padding="{DynamicResource FlyoutBorderThemePadding}"
-                CornerRadius="{TemplateBinding CornerRadius}">
-          <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
-                        VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
-            <ItemsPresenter Name="PART_ItemsPresenter"
-                            Items="{TemplateBinding Items}"
-                            ItemsPanel="{TemplateBinding ItemsPanel}"
-                            ItemTemplate="{TemplateBinding ItemTemplate}"
-                            Margin="{DynamicResource MenuFlyoutScrollerMargin}"
-                            KeyboardNavigation.TabNavigation="Continue"
-                            Grid.IsSharedSizeScope="True" />
-          </ScrollViewer>
-        </Border>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-</Styles>
+<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <ControlTheme x:Key="{x:Type MenuFlyoutPresenter}" TargetType="MenuFlyoutPresenter">
+      <Setter Property="Background" Value="{DynamicResource MenuFlyoutPresenterBackground}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource MenuFlyoutPresenterBorderBrush}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource MenuFlyoutPresenterBorderThemeThickness}" />
+      <Setter Property="Padding" Value="{DynamicResource MenuFlyoutPresenterThemePadding}" />
+      <Setter Property="MaxWidth" Value="{DynamicResource FlyoutThemeMaxWidth}" />
+      <Setter Property="MinHeight" Value="{DynamicResource MenuFlyoutThemeMinHeight}" />
+      <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
+      <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
+      <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Border Name="LayoutRoot"
+                  Background="{TemplateBinding Background}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
+                  Padding="{DynamicResource FlyoutBorderThemePadding}"
+                  CornerRadius="{TemplateBinding CornerRadius}">
+            <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
+                          VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
+              <ItemsPresenter Name="PART_ItemsPresenter"
+                              Items="{TemplateBinding Items}"
+                              ItemsPanel="{TemplateBinding ItemsPanel}"
+                              ItemTemplate="{TemplateBinding ItemTemplate}"
+                              Margin="{DynamicResource MenuFlyoutScrollerMargin}"
+                              KeyboardNavigation.TabNavigation="Continue"
+                              Grid.IsSharedSizeScope="True" />
+            </ScrollViewer>
+          </Border>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/MenuItem.xaml b/src/Avalonia.Themes.Fluent/Controls/MenuItem.xaml
index 33cf6bfdde..b7a9435749 100644
--- a/src/Avalonia.Themes.Fluent/Controls/MenuItem.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/MenuItem.xaml
@@ -1,4 +1,4 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<Styles xmlns="https://github.com/avaloniaui"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:conv="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls"
         xmlns:sys="clr-namespace:System;assembly=netstandard"
@@ -45,7 +45,7 @@
 
   <Styles.Resources>
     <conv:PlatformKeyGestureConverter x:Key="KeyGestureConverter" />
-    <x:Double x:Key="MenuFlyoutSubItemPopupHorizontalOffset">-4</x:Double>    
+    <x:Double x:Key="MenuFlyoutSubItemPopupHorizontalOffset">-4</x:Double>
     <Thickness x:Key="MenuIconPresenterMargin">0,0,12,0</Thickness>
     <Thickness x:Key="MenuInputGestureTextMargin">24,0,0,0</Thickness>
     <StreamGeometry x:Key="MenuItemChevronPathData">M 1,0 10,10 l -9,10 -1,-1 L 8,10 -0,1 Z</StreamGeometry>
diff --git a/src/Avalonia.Themes.Fluent/Controls/NativeMenuBar.xaml b/src/Avalonia.Themes.Fluent/Controls/NativeMenuBar.xaml
index d40ba0cc1d..753c03992a 100644
--- a/src/Avalonia.Themes.Fluent/Controls/NativeMenuBar.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/NativeMenuBar.xaml
@@ -1,30 +1,29 @@
-<Style xmlns="https://github.com/avaloniaui"
-       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-       xmlns:local="clr-namespace:Avalonia.Themes.Fluent"
-       x:CompileBindings="True"
-       Selector="NativeMenuBar">
-  <Style.Resources>
-    <local:InverseBooleanValueConverter x:Key="AvaloniaThemesFluentNativeMenuBarInverseBooleanValueConverter" Default="True"/>
-    <local:IBitmapToImageConverter x:Key="AvaloniaThemesFluentNativeMenuBarIBitmapToImageConverter"/>
-  </Style.Resources>
-  <Setter Property="Template">
-    <ControlTemplate>
-      <Menu
-        IsVisible="{Binding $parent[TopLevel].(NativeMenu.IsNativeMenuExported), Converter={StaticResource AvaloniaThemesFluentNativeMenuBarInverseBooleanValueConverter}}"
-        Items="{Binding $parent[TopLevel].(NativeMenu.Menu).Items}">
-        <Menu.Styles>
-          <Style x:CompileBindings="False" Selector="MenuItem">
-            <Setter Property="Header" Value="{Binding Header}"/>
-            <Setter Property="InputGesture" Value="{Binding Gesture}"/>
-            <Setter Property="Items" Value="{Binding Menu.Items}"/>
-            <Setter Property="Command" Value="{Binding Command}"/>
-            <Setter Property="CommandParameter" Value="{Binding CommandParameter}"/>
-            <Setter Property="(NativeMenuBar.EnableMenuItemClickForwarding)" Value="True"/>
-            <!--NativeMenuItem is IBitmap and MenuItem is Image-->
-            <Setter Property="Icon" Value="{Binding Icon , Converter={StaticResource AvaloniaThemesFluentNativeMenuBarIBitmapToImageConverter}}"/>
-          </Style>
-        </Menu.Styles>
-      </Menu>
-    </ControlTemplate>
-  </Setter>
-</Style>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:local="clr-namespace:Avalonia.Themes.Fluent"
+                    x:CompileBindings="True">
+  <local:InverseBooleanValueConverter x:Key="AvaloniaThemesFluentNativeMenuBarInverseBooleanValueConverter" Default="True"/>
+  <local:IBitmapToImageConverter x:Key="AvaloniaThemesFluentNativeMenuBarIBitmapToImageConverter"/>
+  <ControlTheme x:Key="{x:Type NativeMenuBar}" TargetType="NativeMenuBar">
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Menu
+          IsVisible="{Binding $parent[TopLevel].(NativeMenu.IsNativeMenuExported), Converter={StaticResource AvaloniaThemesFluentNativeMenuBarInverseBooleanValueConverter}}"
+          Items="{Binding $parent[TopLevel].(NativeMenu.Menu).Items}">
+          <Menu.Styles>
+            <Style x:CompileBindings="False" Selector="MenuItem">
+              <Setter Property="Header" Value="{Binding Header}"/>
+              <Setter Property="InputGesture" Value="{Binding Gesture}"/>
+              <Setter Property="Items" Value="{Binding Menu.Items}"/>
+              <Setter Property="Command" Value="{Binding Command}"/>
+              <Setter Property="CommandParameter" Value="{Binding CommandParameter}"/>
+              <Setter Property="(NativeMenuBar.EnableMenuItemClickForwarding)" Value="True"/>
+              <!--NativeMenuItem is IBitmap and MenuItem is Image-->
+              <Setter Property="Icon" Value="{Binding Icon , Converter={StaticResource AvaloniaThemesFluentNativeMenuBarIBitmapToImageConverter}}"/>
+            </Style>
+          </Menu.Styles>
+        </Menu>
+      </ControlTemplate>
+    </Setter>
+   </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/NotificationCard.xaml b/src/Avalonia.Themes.Fluent/Controls/NotificationCard.xaml
index 924d977eb5..e55fcb90e8 100644
--- a/src/Avalonia.Themes.Fluent/Controls/NotificationCard.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/NotificationCard.xaml
@@ -1,11 +1,11 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
   <Design.PreviewWith>
     <Border Padding="0" Background="White">
       <NotificationCard Content="Testing" />
     </Border>
   </Design.PreviewWith>
-  <Style Selector="NotificationCard">
+  <ControlTheme x:Key="{x:Type NotificationCard}" TargetType="NotificationCard">
     <Setter Property="UseLayoutRounding" Value="True"/>
     <Setter Property="Width" Value="350"/>
     <Setter Property="FontSize" Value="14"/>
@@ -24,8 +24,8 @@
                     CornerRadius="{TemplateBinding CornerRadius}"
                     ClipToBounds="True">
               <DockPanel>
-                <Panel x:Name="PART_HeaderBar" Height="4" DockPanel.Dock="Top" />
-                <ContentControl Name="PART_Content" Content="{TemplateBinding Content}" />
+                <Panel x:Name="PART_HeaderBar" Height="4" Background="{DynamicResource NotificationCardProgressBackgroundBrush}" DockPanel.Dock="Top" />
+                <ContentControl Name="PART_Content" MinHeight="64" Content="{TemplateBinding Content}" />
               </DockPanel>
             </Border>
           </Border>
@@ -33,7 +33,7 @@
       </ControlTemplate>
     </Setter>
 
-    <Style.Animations>
+    <ControlTheme.Animations>
       <Animation Duration="0:0:0.45" Easing="QuadraticEaseIn" FillMode="Forward">
         <KeyFrame Cue="0%">
           <Setter Property="Opacity" Value="0"/>
@@ -51,14 +51,9 @@
           <Setter Property="ScaleTransform.ScaleY" Value="1"/>
         </KeyFrame>
       </Animation>
-    </Style.Animations>
-  </Style>
+    </ControlTheme.Animations>
 
-  <Style Selector="NotificationCard/template/ ContentControl#PART_Content">
-    <Setter Property="MinHeight" Value="64" />
-  </Style>
-
-  <Style Selector="NotificationCard[IsClosing=true] /template/ LayoutTransformControl#PART_LayoutTransformControl">
+  <Style Selector="^[IsClosing=true] /template/ LayoutTransformControl#PART_LayoutTransformControl">
     <Setter Property="RenderTransformOrigin" Value="50%,0%"/>
     <Style.Animations>
       <Animation Duration="0:0:0.75" Easing="QuadraticEaseOut" FillMode="Forward">
@@ -78,7 +73,7 @@
     </Style.Animations>
   </Style>
 
-  <Style Selector="NotificationCard[IsClosing=true]">
+  <Style Selector="^[IsClosing=true]">
     <Style.Animations>
       <Animation Duration="0:0:1.25" Easing="QuadraticEaseOut" FillMode="Forward">
         <KeyFrame Cue="100%">
@@ -88,19 +83,17 @@
     </Style.Animations>
   </Style>
 
-  <Style Selector="NotificationCard /template/ Panel#PART_HeaderBar">
-    <Setter Property="Background" Value="{DynamicResource NotificationCardProgressBackgroundBrush}"/>
-  </Style>
-  <Style Selector="NotificationCard:information /template/ Panel#PART_HeaderBar">
+  <Style Selector="^:information /template/ Panel#PART_HeaderBar">
     <Setter Property="Background" Value="{DynamicResource NotificationCardInformationBackgroundBrush}"/>
   </Style>
-  <Style Selector="NotificationCard:success /template/ Panel#PART_HeaderBar">
+  <Style Selector="^:success /template/ Panel#PART_HeaderBar">
     <Setter Property="Background" Value="{DynamicResource NotificationCardSuccessBackgroundBrush}"/>
   </Style>
-  <Style Selector="NotificationCard:warning /template/ Panel#PART_HeaderBar">
+  <Style Selector="^:warning /template/ Panel#PART_HeaderBar">
     <Setter Property="Background" Value="{DynamicResource NotificationCardWarningBackgroundBrush}"/>
   </Style>
-  <Style Selector="NotificationCard:error /template/ Panel#PART_HeaderBar">
+  <Style Selector="^:error /template/ Panel#PART_HeaderBar">
     <Setter Property="Background" Value="{DynamicResource NotificationCardErrorBackgroundBrush}"/>
   </Style>
-</Styles>
+  </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/NumericUpDown.xaml b/src/Avalonia.Themes.Fluent/Controls/NumericUpDown.xaml
index 36ab07e3e3..74ffff0f5c 100644
--- a/src/Avalonia.Themes.Fluent/Controls/NumericUpDown.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/NumericUpDown.xaml
@@ -1,68 +1,67 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Design.PreviewWith>
-    <Border Padding="20">
-      <StackPanel Spacing="20">
-        <NumericUpDown Minimum="0"
-                       Maximum="10"
-                       Increment="0.5"
-                       Width="150"
-                       Watermark="Enter text" />
-        <NumericUpDown Minimum="0"
-                       Maximum="10"
-                       Increment="0.5"
-                       Width="150"
-                       VerticalContentAlignment="Center"
-                       HorizontalContentAlignment="Center"
-                       ButtonSpinnerLocation="Left"
-                       Watermark="Enter text" />
-      </StackPanel>
-    </Border>
-  </Design.PreviewWith>
-
-  <Style Selector="NumericUpDown">
-    <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
-    <Setter Property="Background" Value="{DynamicResource TextControlBackground}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThickness}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrush}" />
-    <Setter Property="MinHeight" Value="{DynamicResource TextControlThemeMinHeight}" />
-    <Setter Property="MinWidth" Value="{DynamicResource TextControlThemeMinWidth}" />    
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-    <Setter Property="Padding" Value="{DynamicResource TextControlThemePadding}" />
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <ButtonSpinner Name="PART_Spinner"
-                       Background="{TemplateBinding Background}"
-                       BorderThickness="{TemplateBinding BorderThickness}"
-                       BorderBrush="{TemplateBinding BorderBrush}"
-                       CornerRadius="{TemplateBinding CornerRadius}"
-                       Padding="0"
-                       MinWidth="0"
-                       HorizontalContentAlignment="Stretch"
-                       VerticalContentAlignment="Stretch"
-                       AllowSpin="{TemplateBinding AllowSpin}"
-                       ShowButtonSpinner="{TemplateBinding ShowButtonSpinner}"
-                       DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
-                       ButtonSpinnerLocation="{TemplateBinding ButtonSpinnerLocation}">
-          <TextBox Name="PART_TextBox"
-                   Background="Transparent"
-                   BorderBrush="Transparent"
-                   Margin="-1"
-                   Padding="{TemplateBinding Padding}"
-                   MinWidth="0"
-                   Foreground="{TemplateBinding Foreground}"
-                   FontSize="{TemplateBinding FontSize}"
-                   Watermark="{TemplateBinding Watermark}"
-                   IsReadOnly="{TemplateBinding IsReadOnly}"
-                   VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                   HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                   Text="{TemplateBinding Text}"
-                   AcceptsReturn="False"
-                   TextWrapping="NoWrap" />
-        </ButtonSpinner>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-
-</Styles>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <Design.PreviewWith>
+      <Border Padding="20">
+        <StackPanel Spacing="20">
+          <NumericUpDown Minimum="0"
+                         Maximum="10"
+                         Increment="0.5"
+                         Width="150"
+                         Watermark="Enter text" />
+          <NumericUpDown Minimum="0"
+                         Maximum="10"
+                         Increment="0.5"
+                         Width="150"
+                         VerticalContentAlignment="Center"
+                         HorizontalContentAlignment="Center"
+                         ButtonSpinnerLocation="Left"
+                         Watermark="Enter text" />
+        </StackPanel>
+      </Border>
+    </Design.PreviewWith>
+  
+    <ControlTheme x:Key="{x:Type NumericUpDown}" TargetType="NumericUpDown">
+      <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
+      <Setter Property="Background" Value="{DynamicResource TextControlBackground}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThickness}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrush}" />
+      <Setter Property="MinHeight" Value="{DynamicResource TextControlThemeMinHeight}" />
+      <Setter Property="MinWidth" Value="{DynamicResource TextControlThemeMinWidth}" />
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="Padding" Value="{DynamicResource TextControlThemePadding}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <ButtonSpinner Name="PART_Spinner" 
+                         Background="{TemplateBinding Background}" 
+                         BorderThickness="{TemplateBinding BorderThickness}" 
+                         BorderBrush="{TemplateBinding BorderBrush}"
+                         CornerRadius="{TemplateBinding CornerRadius}"
+                         Padding="0"
+                         MinWidth="0"
+                         HorizontalContentAlignment="Stretch"
+                         VerticalContentAlignment="Stretch"
+                         AllowSpin="{TemplateBinding AllowSpin}"
+                         ShowButtonSpinner="{TemplateBinding ShowButtonSpinner}" 
+                         DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
+                         ButtonSpinnerLocation="{TemplateBinding ButtonSpinnerLocation}">
+            <TextBox Name="PART_TextBox" 
+                     Background="Transparent"
+                     BorderBrush="Transparent"
+                     Margin="-1" 
+                     Padding="{TemplateBinding Padding}" 
+                     MinWidth="0" 
+                     Foreground="{TemplateBinding Foreground}"
+                     FontSize="{TemplateBinding FontSize}" 
+                     Watermark="{TemplateBinding Watermark}" 
+                     IsReadOnly="{TemplateBinding IsReadOnly}" 
+                     VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                     HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" 
+                     Text="{TemplateBinding Text}" 
+                     AcceptsReturn="False"
+                     TextWrapping="NoWrap" />
+          </ButtonSpinner>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/OverlayPopupHost.xaml b/src/Avalonia.Themes.Fluent/Controls/OverlayPopupHost.xaml
index 31b43c39cd..0b587e6037 100644
--- a/src/Avalonia.Themes.Fluent/Controls/OverlayPopupHost.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/OverlayPopupHost.xaml
@@ -1,20 +1,23 @@
-<Style xmlns="https://github.com/avaloniaui" Selector="OverlayPopupHost">
-  <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>
-  <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}"/>
-  <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
-  <Setter Property="FontWeight" Value="400" />
-  <Setter Property="FontStyle" Value="Normal" />
-  <Setter Property="Template">
-    <ControlTemplate>
-      <LayoutTransformControl LayoutTransform="{TemplateBinding Transform}">
-        <VisualLayerManager IsPopup="True">
-          <ContentPresenter Name="PART_ContentPresenter"
-                            Background="{TemplateBinding Background}"
-                            ContentTemplate="{TemplateBinding ContentTemplate}"
-                            Content="{TemplateBinding Content}"
-                            Padding="{TemplateBinding Padding}"/>
-        </VisualLayerManager>
-      </LayoutTransformControl>
-    </ControlTemplate>
-  </Setter>
-</Style>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <ControlTheme x:Key="{x:Type OverlayPopupHost}" TargetType="OverlayPopupHost">
+      <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}"/>
+      <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
+      <Setter Property="FontWeight" Value="400" />
+      <Setter Property="FontStyle" Value="Normal" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <LayoutTransformControl LayoutTransform="{TemplateBinding Transform}">
+            <VisualLayerManager IsPopup="True">
+              <ContentPresenter Name="PART_ContentPresenter"
+                                Background="{TemplateBinding Background}"
+                                ContentTemplate="{TemplateBinding ContentTemplate}"
+                                Content="{TemplateBinding Content}"
+                                Padding="{TemplateBinding Padding}"/>
+            </VisualLayerManager>
+          </LayoutTransformControl>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/PathIcon.xaml b/src/Avalonia.Themes.Fluent/Controls/PathIcon.xaml
index d4952b3571..966c6c2632 100644
--- a/src/Avalonia.Themes.Fluent/Controls/PathIcon.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/PathIcon.xaml
@@ -1,29 +1,26 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Design.PreviewWith>
-    <StackPanel>
-      <StackPanel.Resources>
-        <StreamGeometry x:Key="settings_regular">M14 9.50006C11.5147 9.50006 9.5 11.5148 9.5 14.0001C9.5 16.4853 11.5147 18.5001 14 18.5001C15.3488 18.5001 16.559 17.9066 17.3838 16.9666C18.0787 16.1746 18.5 15.1365 18.5 14.0001C18.5 13.5401 18.431 13.0963 18.3028 12.6784C17.7382 10.8381 16.0253 9.50006 14 9.50006ZM11 14.0001C11 12.3432 12.3431 11.0001 14 11.0001C15.6569 11.0001 17 12.3432 17 14.0001C17 15.6569 15.6569 17.0001 14 17.0001C12.3431 17.0001 11 15.6569 11 14.0001Z  M21.7093 22.3948L19.9818 21.6364C19.4876 21.4197 18.9071 21.4515 18.44 21.7219C17.9729 21.9924 17.675 22.4693 17.6157 23.0066L17.408 24.8855C17.3651 25.273 17.084 25.5917 16.7055 25.682C14.9263 26.1061 13.0725 26.1061 11.2933 25.682C10.9148 25.5917 10.6336 25.273 10.5908 24.8855L10.3834 23.0093C10.3225 22.4731 10.0112 21.9976 9.54452 21.7281C9.07783 21.4586 8.51117 21.4269 8.01859 21.6424L6.29071 22.4009C5.93281 22.558 5.51493 22.4718 5.24806 22.1859C4.00474 20.8536 3.07924 19.2561 2.54122 17.5137C2.42533 17.1384 2.55922 16.7307 2.8749 16.4977L4.40219 15.3703C4.83721 15.0501 5.09414 14.5415 5.09414 14.0007C5.09414 13.4598 4.83721 12.9512 4.40162 12.6306L2.87529 11.5051C2.55914 11.272 2.42513 10.8638 2.54142 10.4882C3.08038 8.74734 4.00637 7.15163 5.24971 5.82114C5.51684 5.53528 5.93492 5.44941 6.29276 5.60691L8.01296 6.36404C8.50793 6.58168 9.07696 6.54881 9.54617 6.27415C10.0133 6.00264 10.3244 5.52527 10.3844 4.98794L10.5933 3.11017C10.637 2.71803 10.9245 2.39704 11.3089 2.31138C12.19 2.11504 13.0891 2.01071 14.0131 2.00006C14.9147 2.01047 15.8128 2.11485 16.6928 2.31149C17.077 2.39734 17.3643 2.71823 17.4079 3.11017L17.617 4.98937C17.7116 5.85221 18.4387 6.50572 19.3055 6.50663C19.5385 6.507 19.769 6.45838 19.9843 6.36294L21.7048 5.60568C22.0626 5.44818 22.4807 5.53405 22.7478 5.81991C23.9912 7.1504 24.9172 8.74611 25.4561 10.487C25.5723 10.8623 25.4386 11.2703 25.1228 11.5035L23.5978 12.6297C23.1628 12.95 22.9 13.4586 22.9 13.9994C22.9 14.5403 23.1628 15.0489 23.5988 15.3698L25.1251 16.4965C25.441 16.7296 25.5748 17.1376 25.4586 17.5131C24.9198 19.2536 23.9944 20.8492 22.7517 22.1799C22.4849 22.4657 22.0671 22.5518 21.7093 22.3948ZM16.263 22.1966C16.4982 21.4685 16.9889 20.8288 17.6884 20.4238C18.5702 19.9132 19.6536 19.8547 20.5841 20.2627L21.9281 20.8526C22.791 19.8538 23.4593 18.7013 23.8981 17.4552L22.7095 16.5778L22.7086 16.5771C21.898 15.98 21.4 15.0277 21.4 13.9994C21.4 12.9719 21.8974 12.0195 22.7073 11.4227L22.7085 11.4218L23.8957 10.545C23.4567 9.2988 22.7881 8.14636 21.9248 7.1477L20.5922 7.73425L20.5899 7.73527C20.1844 7.91463 19.7472 8.00722 19.3039 8.00663C17.6715 8.00453 16.3046 6.77431 16.1261 5.15465L16.1259 5.15291L15.9635 3.69304C15.3202 3.57328 14.6677 3.50872 14.013 3.50017C13.3389 3.50891 12.6821 3.57367 12.0377 3.69328L11.8751 5.15452C11.7625 6.16272 11.1793 7.05909 10.3019 7.56986C9.41937 8.0856 8.34453 8.14844 7.40869 7.73694L6.07273 7.14893C5.20949 8.14751 4.54092 9.29983 4.10196 10.5459L5.29181 11.4233C6.11115 12.0269 6.59414 12.9837 6.59414 14.0007C6.59414 15.0173 6.11142 15.9742 5.29237 16.5776L4.10161 17.4566C4.54002 18.7044 5.2085 19.8585 6.07205 20.8587L7.41742 20.2682C8.34745 19.8613 9.41573 19.9215 10.2947 20.4292C11.174 20.937 11.7593 21.832 11.8738 22.84L11.8744 22.8445L12.0362 24.3088C13.3326 24.5638 14.6662 24.5638 15.9626 24.3088L16.1247 22.8418C16.1491 22.6217 16.1955 22.4055 16.263 22.1966Z</StreamGeometry>
-      </StackPanel.Resources>
-      <PathIcon Data="{StaticResource settings_regular}" />
-    </StackPanel>
-  </Design.PreviewWith>
-  <Style Selector="PathIcon">
-    <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
-    <Setter Property="Background" Value="Transparent" />
-    <Setter Property="Height" Value="{DynamicResource IconElementThemeHeight}" />
-    <Setter Property="Width" Value="{DynamicResource IconElementThemeWidth}" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border Background="{TemplateBinding Background}">
-          <Viewbox Height="{TemplateBinding Height}"
-                   Width="{TemplateBinding Width}">
-            <Path Fill="{TemplateBinding Foreground}"
-                  Data="{TemplateBinding Data}"
-                  Stretch="Uniform" />
-          </Viewbox>
-        </Border>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-</Styles>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <Design.PreviewWith>
+      <StackPanel>
+        <StackPanel.Resources>
+          <StreamGeometry x:Key="settings_regular">M14 9.50006C11.5147 9.50006 9.5 11.5148 9.5 14.0001C9.5 16.4853 11.5147 18.5001 14 18.5001C15.3488 18.5001 16.559 17.9066 17.3838 16.9666C18.0787 16.1746 18.5 15.1365 18.5 14.0001C18.5 13.5401 18.431 13.0963 18.3028 12.6784C17.7382 10.8381 16.0253 9.50006 14 9.50006ZM11 14.0001C11 12.3432 12.3431 11.0001 14 11.0001C15.6569 11.0001 17 12.3432 17 14.0001C17 15.6569 15.6569 17.0001 14 17.0001C12.3431 17.0001 11 15.6569 11 14.0001Z  M21.7093 22.3948L19.9818 21.6364C19.4876 21.4197 18.9071 21.4515 18.44 21.7219C17.9729 21.9924 17.675 22.4693 17.6157 23.0066L17.408 24.8855C17.3651 25.273 17.084 25.5917 16.7055 25.682C14.9263 26.1061 13.0725 26.1061 11.2933 25.682C10.9148 25.5917 10.6336 25.273 10.5908 24.8855L10.3834 23.0093C10.3225 22.4731 10.0112 21.9976 9.54452 21.7281C9.07783 21.4586 8.51117 21.4269 8.01859 21.6424L6.29071 22.4009C5.93281 22.558 5.51493 22.4718 5.24806 22.1859C4.00474 20.8536 3.07924 19.2561 2.54122 17.5137C2.42533 17.1384 2.55922 16.7307 2.8749 16.4977L4.40219 15.3703C4.83721 15.0501 5.09414 14.5415 5.09414 14.0007C5.09414 13.4598 4.83721 12.9512 4.40162 12.6306L2.87529 11.5051C2.55914 11.272 2.42513 10.8638 2.54142 10.4882C3.08038 8.74734 4.00637 7.15163 5.24971 5.82114C5.51684 5.53528 5.93492 5.44941 6.29276 5.60691L8.01296 6.36404C8.50793 6.58168 9.07696 6.54881 9.54617 6.27415C10.0133 6.00264 10.3244 5.52527 10.3844 4.98794L10.5933 3.11017C10.637 2.71803 10.9245 2.39704 11.3089 2.31138C12.19 2.11504 13.0891 2.01071 14.0131 2.00006C14.9147 2.01047 15.8128 2.11485 16.6928 2.31149C17.077 2.39734 17.3643 2.71823 17.4079 3.11017L17.617 4.98937C17.7116 5.85221 18.4387 6.50572 19.3055 6.50663C19.5385 6.507 19.769 6.45838 19.9843 6.36294L21.7048 5.60568C22.0626 5.44818 22.4807 5.53405 22.7478 5.81991C23.9912 7.1504 24.9172 8.74611 25.4561 10.487C25.5723 10.8623 25.4386 11.2703 25.1228 11.5035L23.5978 12.6297C23.1628 12.95 22.9 13.4586 22.9 13.9994C22.9 14.5403 23.1628 15.0489 23.5988 15.3698L25.1251 16.4965C25.441 16.7296 25.5748 17.1376 25.4586 17.5131C24.9198 19.2536 23.9944 20.8492 22.7517 22.1799C22.4849 22.4657 22.0671 22.5518 21.7093 22.3948ZM16.263 22.1966C16.4982 21.4685 16.9889 20.8288 17.6884 20.4238C18.5702 19.9132 19.6536 19.8547 20.5841 20.2627L21.9281 20.8526C22.791 19.8538 23.4593 18.7013 23.8981 17.4552L22.7095 16.5778L22.7086 16.5771C21.898 15.98 21.4 15.0277 21.4 13.9994C21.4 12.9719 21.8974 12.0195 22.7073 11.4227L22.7085 11.4218L23.8957 10.545C23.4567 9.2988 22.7881 8.14636 21.9248 7.1477L20.5922 7.73425L20.5899 7.73527C20.1844 7.91463 19.7472 8.00722 19.3039 8.00663C17.6715 8.00453 16.3046 6.77431 16.1261 5.15465L16.1259 5.15291L15.9635 3.69304C15.3202 3.57328 14.6677 3.50872 14.013 3.50017C13.3389 3.50891 12.6821 3.57367 12.0377 3.69328L11.8751 5.15452C11.7625 6.16272 11.1793 7.05909 10.3019 7.56986C9.41937 8.0856 8.34453 8.14844 7.40869 7.73694L6.07273 7.14893C5.20949 8.14751 4.54092 9.29983 4.10196 10.5459L5.29181 11.4233C6.11115 12.0269 6.59414 12.9837 6.59414 14.0007C6.59414 15.0173 6.11142 15.9742 5.29237 16.5776L4.10161 17.4566C4.54002 18.7044 5.2085 19.8585 6.07205 20.8587L7.41742 20.2682C8.34745 19.8613 9.41573 19.9215 10.2947 20.4292C11.174 20.937 11.7593 21.832 11.8738 22.84L11.8744 22.8445L12.0362 24.3088C13.3326 24.5638 14.6662 24.5638 15.9626 24.3088L16.1247 22.8418C16.1491 22.6217 16.1955 22.4055 16.263 22.1966Z</StreamGeometry>
+        </StackPanel.Resources>
+        <PathIcon Data="{StaticResource settings_regular}" />
+      </StackPanel>
+    </Design.PreviewWith>
+    <ControlTheme x:Key="{x:Type PathIcon}" TargetType="PathIcon">
+      <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
+      <Setter Property="Background" Value="Transparent" />
+      <Setter Property="Height" Value="{DynamicResource IconElementThemeHeight}" />
+      <Setter Property="Width" Value="{DynamicResource IconElementThemeWidth}" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Border Background="{TemplateBinding Background}">
+            <Viewbox Height="{TemplateBinding Height}" Width="{TemplateBinding Width}">
+              <Path Fill="{TemplateBinding Foreground}" Data="{TemplateBinding Data}" Stretch="Uniform" />
+            </Viewbox>
+          </Border>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/PopupRoot.xaml b/src/Avalonia.Themes.Fluent/Controls/PopupRoot.xaml
index f608cf55f5..f57ecd2013 100644
--- a/src/Avalonia.Themes.Fluent/Controls/PopupRoot.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/PopupRoot.xaml
@@ -1,28 +1,28 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Style Selector="PopupRoot">
-    <Setter Property="Background" Value="{x:Null}"/>
-    <Setter Property="TransparencyLevelHint" Value="Transparent" />
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}"/>
-    <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
-    <Setter Property="FontWeight" Value="400" />
-    <Setter Property="FontStyle" Value="Normal" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <LayoutTransformControl LayoutTransform="{TemplateBinding Transform}">
-          <Panel>
-            <Border Name="PART_TransparencyFallback" IsHitTestVisible="False" />
-            <VisualLayerManager IsPopup="True">
-              <ContentPresenter Name="PART_ContentPresenter"
-                              Background="{TemplateBinding Background}"
-                              ContentTemplate="{TemplateBinding ContentTemplate}"
-                              Content="{TemplateBinding Content}"
-                              Padding="{TemplateBinding Padding}"/>
-            </VisualLayerManager>
-          </Panel>
-        </LayoutTransformControl>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-</Styles>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <ControlTheme x:Key="{x:Type PopupRoot}" TargetType="PopupRoot">
+      <Setter Property="Background" Value="{x:Null}" />
+      <Setter Property="TransparencyLevelHint" Value="Transparent" />
+      <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}" />
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
+      <Setter Property="FontWeight" Value="400" />
+      <Setter Property="FontStyle" Value="Normal" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <LayoutTransformControl LayoutTransform="{TemplateBinding Transform}">
+            <Panel>
+              <Border Name="PART_TransparencyFallback" IsHitTestVisible="False" />
+              <VisualLayerManager IsPopup="True">
+                <ContentPresenter Name="PART_ContentPresenter"
+                                  Background="{TemplateBinding Background}"
+                                  ContentTemplate="{TemplateBinding ContentTemplate}"
+                                  Content="{TemplateBinding Content}"
+                                  Padding="{TemplateBinding Padding}" />
+              </VisualLayerManager>
+            </Panel>
+          </LayoutTransformControl>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ProgressBar.xaml b/src/Avalonia.Themes.Fluent/Controls/ProgressBar.xaml
index a463334a76..3c7d22e13f 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ProgressBar.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ProgressBar.xaml
@@ -1,164 +1,179 @@
-<Styles xmlns="https://github.com/avaloniaui" 
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        x:CompileBindings="True">
-  <Design.PreviewWith>
-    <Border Padding="20">
-      <StackPanel Spacing="10">
-        <ProgressBar VerticalAlignment="Center" IsIndeterminate="True" />
-        <ProgressBar VerticalAlignment="Center" Value="5" Maximum="10" />
-        <ProgressBar VerticalAlignment="Center" Value="50" />
-        <ProgressBar VerticalAlignment="Center" Value="50" Minimum="25" Maximum="75" />
-        <ProgressBar HorizontalAlignment="Left" IsIndeterminate="True" Orientation="Vertical" />
-      </StackPanel>
-    </Border>
-  </Design.PreviewWith>
-  <Style Selector="ProgressBar">
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAccentBrush}" />
-    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundBaseLowBrush}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource ProgressBarBorderThemeThickness}" />
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource SystemControlHighlightTransparentBrush}" />
-    <Setter Property="MinHeight" Value="{DynamicResource ProgressBarThemeMinHeight}" />
-    <Setter Property="VerticalAlignment" Value="Center" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border x:Name="ProgressBarRoot" ClipToBounds="True" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}">          
-            <Panel>
-              <Panel x:Name="DeterminateRoot">
-                <Border CornerRadius="{TemplateBinding CornerRadius}" x:Name="PART_Indicator" Margin="{TemplateBinding Padding}" Background="{TemplateBinding Foreground}" />
-              </Panel>
-              <Panel x:Name="IndeterminateRoot">
-                <Border x:Name="IndeterminateProgressBarIndicator" CornerRadius="{TemplateBinding CornerRadius}" Margin="{TemplateBinding Padding}" Background="{TemplateBinding Foreground}" />
-                <Border x:Name="IndeterminateProgressBarIndicator2" CornerRadius="{TemplateBinding CornerRadius}" Margin="{TemplateBinding Padding}" Background="{TemplateBinding Foreground}" />
-              </Panel>
-              <LayoutTransformControl x:Name="PART_LayoutTransformControl" HorizontalAlignment="Center" VerticalAlignment="Center" IsVisible="{TemplateBinding ShowProgressText}">
-                <TextBlock Foreground="{DynamicResource SystemControlForegroundBaseHighBrush}" Text="{ReflectionBinding Value, RelativeSource={RelativeSource TemplatedParent}, StringFormat={}{0:0}%}" />
-              </LayoutTransformControl>
-            </Panel>
-        </Border>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-  <Style Selector="ProgressBar:horizontal /template/ Border#PART_Indicator">
-    <Setter Property="HorizontalAlignment" Value="Left" />
-    <Setter Property="VerticalAlignment" Value="Stretch" />
-  </Style>
-  <Style Selector="ProgressBar:vertical /template/ Border#PART_Indicator">
-    <Setter Property="HorizontalAlignment" Value="Stretch" />
-    <Setter Property="VerticalAlignment" Value="Bottom" />
-  </Style>
-  <Style Selector="ProgressBar:horizontal">
-    <Setter Property="MinWidth" Value="200" />
-    <Setter Property="MinHeight" Value="4" />
-  </Style>
-  <Style Selector="ProgressBar:vertical">
-    <Setter Property="MinWidth" Value="4" />
-    <Setter Property="MinHeight" Value="200" />
-  </Style>
-  <Style Selector="ProgressBar:vertical /template/ LayoutTransformControl#PART_LayoutTransformControl">
-    <Setter Property="LayoutTransform">
-      <Setter.Value>
-        <RotateTransform Angle="90" />
-      </Setter.Value>
-    </Setter>
-  </Style>
-  <!-- FadeInAnimation mockup-->
-  <Style Selector="ProgressBar /template/ Panel#DeterminateRoot">
-    <Setter Property="Transitions">
-      <Transitions>
-        <DoubleTransition Property="Opacity" Duration="0:0:0.197" />
-      </Transitions>
-    </Setter>
-  </Style>
-  <Style Selector="ProgressBar /template/ Panel#IndeterminateRoot">
-    <Setter Property="Transitions">
-      <Transitions>
-        <DoubleTransition Property="Opacity" Duration="0:0:0.197" />
-      </Transitions>
-    </Setter>
-  </Style>
-  <Style Selector="ProgressBar /template/ Panel#DeterminateRoot">
-    <Setter Property="Opacity" Value="1" />
-  </Style>
-  <Style Selector="ProgressBar /template/ Panel#IndeterminateRoot">
-    <Setter Property="Opacity" Value="0" />
-  </Style>
-  <Style Selector="ProgressBar:indeterminate /template/ Panel#DeterminateRoot">
-    <Setter Property="Opacity" Value="0" />
-  </Style>
-  <Style Selector="ProgressBar:indeterminate /template/ Panel#IndeterminateRoot">
-    <Setter Property="Opacity" Value="1" />
-  </Style>
-  <Style Selector="ProgressBar:horizontal:indeterminate /template/ Border#IndeterminateProgressBarIndicator">
-    <Style.Animations>
-      <Animation Duration="0:0:2" IterationCount="Infinite">
-        <KeyFrame KeyTime="0:0:0" KeySpline="0.4,0,0.6,1">
-          <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationStartPosition}" />
-        </KeyFrame>
-        <KeyFrame KeyTime="0:0:1.5" KeySpline="0.4,0,0.6,1">
-          <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationEndPosition}" />
-        </KeyFrame>
-        <KeyFrame KeyTime="0:0:2" KeySpline="0.4,0,0.6,1">
-          <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationEndPosition}" />
-        </KeyFrame>
-      </Animation>
-    </Style.Animations>
-  </Style>
-  <Style Selector="ProgressBar:horizontal:indeterminate /template/ Border#IndeterminateProgressBarIndicator2">
-    <Style.Animations>
-      <Animation Duration="0:0:2" IterationCount="Infinite">
-        <KeyFrame KeyTime="0:0:0" KeySpline="0.4,0,0.6,1">
-          <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationStartPosition}" />
-        </KeyFrame>
-        <KeyFrame KeyTime="0:0:0.75" KeySpline="0.4,0,0.6,1">
-          <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationStartPosition}" />
-        </KeyFrame>
-        <KeyFrame KeyTime="0:0:2" KeySpline="0.4,0,0.6,1">
-          <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationEndPosition}" />
-        </KeyFrame>
-      </Animation>
-    </Style.Animations>
-  </Style>
-  <Style Selector="ProgressBar:vertical:indeterminate /template/ Border#IndeterminateProgressBarIndicator">
-    <Style.Animations>
-      <Animation Duration="0:0:2" IterationCount="Infinite">
-        <KeyFrame KeyTime="0:0:0" KeySpline="0.4,0,0.6,1">
-          <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationStartPosition}" />
-        </KeyFrame>
-        <KeyFrame KeyTime="0:0:1.5" KeySpline="0.4,0,0.6,1">
-          <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationEndPosition}" />
-        </KeyFrame>
-        <KeyFrame KeyTime="0:0:2" KeySpline="0.4,0,0.6,1">
-          <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationEndPosition}" />
-        </KeyFrame>
-      </Animation>
-    </Style.Animations>
-  </Style>
-  <Style Selector="ProgressBar:vertical:indeterminate /template/ Border#IndeterminateProgressBarIndicator2">
-    <Style.Animations>
-      <Animation Duration="0:0:2" IterationCount="Infinite">
-        <KeyFrame KeyTime="0:0:0" KeySpline="0.4,0,0.6,1">
-          <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationStartPosition}" />
-        </KeyFrame>
-        <KeyFrame KeyTime="0:0:0.75" KeySpline="0.4,0,0.6,1">
-          <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationStartPosition}" />
-        </KeyFrame>
-        <KeyFrame KeyTime="0:0:2" KeySpline="0.4,0,0.6,1">
-          <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationEndPosition}" />
-        </KeyFrame>
-      </Animation>
-    </Style.Animations>
-  </Style>
-  <Style Selector="ProgressBar:horizontal /template/ Border#IndeterminateProgressBarIndicator">
-    <Setter Property="Width" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerWidth}" />    
-  </Style>
-  <Style Selector="ProgressBar:horizontal /template/ Border#IndeterminateProgressBarIndicator2">
-    <Setter Property="Width" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2Width}" />    
-  </Style>
-  <Style Selector="ProgressBar:vertical /template/ Border#IndeterminateProgressBarIndicator">
-    <Setter Property="Height" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerWidth}" />    
-  </Style>
-  <Style Selector="ProgressBar:vertical /template/ Border#IndeterminateProgressBarIndicator2">
-    <Setter Property="Height" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2Width}" />    
-  </Style>
-</Styles>
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
+      <Design.PreviewWith>
+      <Border Padding="20">
+        <StackPanel Spacing="10">
+          <ProgressBar VerticalAlignment="Center" IsIndeterminate="True" />
+          <ProgressBar VerticalAlignment="Center" Value="5" Maximum="10" />
+          <ProgressBar VerticalAlignment="Center" Value="50" />
+          <ProgressBar VerticalAlignment="Center" Value="50" Minimum="25" Maximum="75" />
+          <ProgressBar HorizontalAlignment="Left" IsIndeterminate="True" Orientation="Vertical" />
+        </StackPanel>
+      </Border>
+    </Design.PreviewWith>
+  
+    <ControlTheme x:Key="{x:Type ProgressBar}" TargetType="ProgressBar">
+        <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAccentBrush}" />
+        <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundBaseLowBrush}" />
+        <Setter Property="BorderThickness" Value="{DynamicResource ProgressBarBorderThemeThickness}" />
+        <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource SystemControlHighlightTransparentBrush}" />
+        <Setter Property="MinHeight" Value="{DynamicResource ProgressBarThemeMinHeight}" />
+        <Setter Property="VerticalAlignment" Value="Center" />
+        <Setter Property="Template">
+            <ControlTemplate>
+                <Border
+                    x:Name="ProgressBarRoot"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    ClipToBounds="True"
+                    CornerRadius="{TemplateBinding CornerRadius}">
+                    <Panel>
+                        <Panel x:Name="DeterminateRoot" Opacity="1">
+                          <Panel.Transitions>
+                            <Transitions>
+                              <DoubleTransition Property="Opacity" Duration="0:0:0.197" />
+                            </Transitions>
+                          </Panel.Transitions>
+                            <Border
+                                x:Name="PART_Indicator"
+                                Margin="{TemplateBinding Padding}"
+                                Background="{TemplateBinding Foreground}"
+                                CornerRadius="{TemplateBinding CornerRadius}" />
+                        </Panel>
+                        <Panel x:Name="IndeterminateRoot" Opacity="0">
+                          <Panel.Transitions>
+                            <Transitions>
+                              <DoubleTransition Property="Opacity" Duration="0:0:0.197" />
+                            </Transitions>
+                          </Panel.Transitions>
+                            <Border
+                                x:Name="IndeterminateProgressBarIndicator"
+                                Margin="{TemplateBinding Padding}"
+                                Background="{TemplateBinding Foreground}"
+                                CornerRadius="{TemplateBinding CornerRadius}" />
+                            <Border
+                                x:Name="IndeterminateProgressBarIndicator2"
+                                Margin="{TemplateBinding Padding}"
+                                Background="{TemplateBinding Foreground}"
+                                CornerRadius="{TemplateBinding CornerRadius}" />
+                        </Panel>
+                        <LayoutTransformControl
+                            x:Name="PART_LayoutTransformControl"
+                            HorizontalAlignment="Center"
+                            VerticalAlignment="Center"
+                            IsVisible="{TemplateBinding ShowProgressText}">
+                            <TextBlock 
+                              Foreground="{DynamicResource SystemControlForegroundBaseHighBrush}" 
+                              Text="{ReflectionBinding Value, RelativeSource={RelativeSource TemplatedParent}, StringFormat={}{0:0}%}" />
+                        </LayoutTransformControl>
+                    </Panel>
+                </Border>
+            </ControlTemplate>
+        </Setter>
+        <Style Selector="^:horizontal /template/ Border#PART_Indicator">
+            <Setter Property="HorizontalAlignment" Value="Left" />
+            <Setter Property="VerticalAlignment" Value="Stretch" />
+        </Style>
+        <Style Selector="^:vertical /template/ Border#PART_Indicator">
+            <Setter Property="HorizontalAlignment" Value="Stretch" />
+            <Setter Property="VerticalAlignment" Value="Bottom" />
+        </Style>
+        <Style Selector="^:horizontal">
+            <Setter Property="MinWidth" Value="200" />
+            <Setter Property="MinHeight" Value="4" />
+        </Style>
+        <Style Selector="^:vertical">
+            <Setter Property="MinWidth" Value="4" />
+            <Setter Property="MinHeight" Value="200" />
+        </Style>
+        <Style Selector="^:vertical /template/ LayoutTransformControl#PART_LayoutTransformControl">
+            <Setter Property="LayoutTransform">
+                <Setter.Value>
+                    <RotateTransform Angle="90" />
+                </Setter.Value>
+            </Setter>
+        </Style>
+        <Style Selector="^:indeterminate /template/ Panel#DeterminateRoot">
+            <Setter Property="Opacity" Value="0" />
+        </Style>
+        <Style Selector="^:indeterminate /template/ Panel#IndeterminateRoot">
+            <Setter Property="Opacity" Value="1" />
+        </Style>
+        <Style Selector="^:horizontal:indeterminate /template/ Border#IndeterminateProgressBarIndicator">
+            <Style.Animations>
+                <Animation IterationCount="Infinite" Duration="0:0:2">
+                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0">
+                        <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationStartPosition}" />
+                    </KeyFrame>
+                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:1.5">
+                        <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationEndPosition}" />
+                    </KeyFrame>
+                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:2">
+                        <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationEndPosition}" />
+                    </KeyFrame>
+                </Animation>
+            </Style.Animations>
+        </Style>
+        <Style Selector="^:horizontal:indeterminate /template/ Border#IndeterminateProgressBarIndicator2">
+            <Style.Animations>
+                <Animation IterationCount="Infinite" Duration="0:0:2">
+                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0">
+                        <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationStartPosition}" />
+                    </KeyFrame>
+                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0.75">
+                        <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationStartPosition}" />
+                    </KeyFrame>
+                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:2">
+                        <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationEndPosition}" />
+                    </KeyFrame>
+                </Animation>
+            </Style.Animations>
+        </Style>
+        <Style Selector="^:vertical:indeterminate /template/ Border#IndeterminateProgressBarIndicator">
+            <Style.Animations>
+                <Animation IterationCount="Infinite" Duration="0:0:2">
+                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0">
+                        <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationStartPosition}" />
+                    </KeyFrame>
+                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:1.5">
+                        <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationEndPosition}" />
+                    </KeyFrame>
+                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:2">
+                        <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationEndPosition}" />
+                    </KeyFrame>
+                </Animation>
+            </Style.Animations>
+        </Style>
+        <Style Selector="^:vertical:indeterminate /template/ Border#IndeterminateProgressBarIndicator2">
+            <Style.Animations>
+                <Animation IterationCount="Infinite" Duration="0:0:2">
+                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0">
+                        <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationStartPosition}" />
+                    </KeyFrame>
+                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0.75">
+                        <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationStartPosition}" />
+                    </KeyFrame>
+                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:2">
+                        <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationEndPosition}" />
+                    </KeyFrame>
+                </Animation>
+            </Style.Animations>
+        </Style>
+        <Style Selector="^:horizontal /template/ Border#IndeterminateProgressBarIndicator">
+            <Setter Property="Width" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerWidth}" />
+        </Style>
+        <Style Selector="^:horizontal /template/ Border#IndeterminateProgressBarIndicator2">
+            <Setter Property="Width" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2Width}" />
+        </Style>
+        <Style Selector="^:vertical /template/ Border#IndeterminateProgressBarIndicator">
+            <Setter Property="Height" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerWidth}" />
+        </Style>
+        <Style Selector="^:vertical /template/ Border#IndeterminateProgressBarIndicator2">
+            <Setter Property="Height" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2Width}" />
+        </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/RadioButton.xaml b/src/Avalonia.Themes.Fluent/Controls/RadioButton.xaml
index e967dc8807..a1c4ba4f2d 100644
--- a/src/Avalonia.Themes.Fluent/Controls/RadioButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/RadioButton.xaml
@@ -1,4 +1,4 @@
-<Styles xmlns="https://github.com/avaloniaui">
+<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
   <Design.PreviewWith>
     <Border Padding="20">
       <StackPanel Spacing="10">
@@ -9,7 +9,8 @@
       </StackPanel>
     </Border>
   </Design.PreviewWith>
-  <Style Selector="RadioButton">
+  
+  <ControlTheme x:Key="{x:Type RadioButton}" TargetType="RadioButton">
     <Setter Property="Background" Value="{DynamicResource RadioButtonBackground}" />
     <Setter Property="Foreground" Value="{DynamicResource RadioButtonForeground}" />
     <Setter Property="BorderBrush" Value="{DynamicResource RadioButtonBorderBrush}" />
@@ -18,155 +19,152 @@
     <Setter Property="HorizontalAlignment" Value="Left" />
     <Setter Property="VerticalAlignment" Value="Center" />
     <Setter Property="HorizontalContentAlignment" Value="Left" />
-    <Setter Property="VerticalContentAlignment" Value="Center" />    
+    <Setter Property="VerticalContentAlignment" Value="Center" />
     <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
     <Setter Property="Template">
       <ControlTemplate TargetType="RadioButton">
-        <Border Name="RootBorder"
-                Background="{TemplateBinding Background}"
-                BorderBrush="{TemplateBinding BorderBrush}"
-                BorderThickness="{TemplateBinding BorderThickness}"
-                CornerRadius="{TemplateBinding CornerRadius}">
+        <Border
+            Name="RootBorder"
+            Background="{TemplateBinding Background}"
+            BorderBrush="{TemplateBinding BorderBrush}"
+            BorderThickness="{TemplateBinding BorderThickness}"
+            CornerRadius="{TemplateBinding CornerRadius}">
           <Grid ColumnDefinitions="20,*">
-            <Grid VerticalAlignment="Top"
-              Height="32">
-
-              <Ellipse Name="OuterEllipse"
-                       Width="20" Height="20"
-                       UseLayoutRounding="False"
-                       StrokeThickness="{DynamicResource RadioButtonBorderThemeThickness}" />
-
-              <Ellipse Name="CheckOuterEllipse"
-                       Width="20" Height="20"
-                       UseLayoutRounding="False"
-                       StrokeThickness="{DynamicResource RadioButtonBorderThemeThickness}" />
-
-              <Ellipse Name="CheckGlyph"
-                       Width="8" Height="8"
-                       UseLayoutRounding="False" />
+            <Grid Height="32" VerticalAlignment="Top">
+
+              <Ellipse
+                  Name="OuterEllipse"
+                  Width="20"
+                  Height="20"
+                  Fill="{DynamicResource RadioButtonOuterEllipseFill}"
+                  Stroke="{DynamicResource RadioButtonOuterEllipseStroke}"
+                  StrokeThickness="{DynamicResource RadioButtonBorderThemeThickness}"
+                  UseLayoutRounding="False" />
+
+              <Ellipse
+                  Name="CheckOuterEllipse"
+                  Width="20"
+                  Height="20"
+                  Fill="{DynamicResource RadioButtonOuterEllipseCheckedFill}"
+                  Opacity="0"
+                  Stroke="{DynamicResource RadioButtonOuterEllipseCheckedStroke}"
+                  StrokeThickness="{DynamicResource RadioButtonBorderThemeThickness}"
+                  UseLayoutRounding="False" />
+
+              <Ellipse
+                  Name="CheckGlyph"
+                  Width="8"
+                  Height="8"
+                  Fill="{DynamicResource RadioButtonCheckGlyphFill}"
+                  Opacity="0"
+                  Stroke="{DynamicResource RadioButtonCheckGlyphStroke}"
+                  UseLayoutRounding="False" />
             </Grid>
 
-            <ContentPresenter Name="PART_ContentPresenter"
-                              Content="{TemplateBinding Content}"
-                              ContentTemplate="{TemplateBinding ContentTemplate}"
-                              Foreground="{TemplateBinding Foreground}"
-                              Margin="{TemplateBinding Padding}"
-                              RecognizesAccessKey="True"
-                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                              Grid.Column="1" />
+            <ContentPresenter
+                Name="PART_ContentPresenter"
+                Grid.Column="1"
+                Margin="{TemplateBinding Padding}"
+                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                Content="{TemplateBinding Content}"
+                ContentTemplate="{TemplateBinding ContentTemplate}"
+                Foreground="{TemplateBinding Foreground}"
+                RecognizesAccessKey="True" />
           </Grid>
         </Border>
       </ControlTemplate>
     </Setter>
-  </Style>
-
-  <!-- Normal State -->
-  <Style Selector="RadioButton /template/ Ellipse#OuterEllipse">
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseStroke}" />
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFill}" />
-  </Style>
-
-  <Style Selector="RadioButton /template/ Ellipse#CheckOuterEllipse">
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseCheckedStroke}" />
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseCheckedFill}" />
-    <Setter Property="Opacity" Value="0" />
-  </Style>
-
-  <Style Selector="RadioButton /template/ Ellipse#CheckGlyph">
-    <Setter Property="Opacity" Value="0" />
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckGlyphStroke}" />
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckGlyphFill}" />
-  </Style>
-
-  <!-- PointerOver State -->
-  <Style Selector="RadioButton:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource RadioButtonForegroundPointerOver}" />
-  </Style>
-
-  <Style Selector="RadioButton:pointerover /template/ Border#RootBorder">
-    <Setter Property="Background" Value="{DynamicResource RadioButtonBackgroundPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource RadioButtonBorderBrushPointerOver}" />
-  </Style>
-
-  <Style Selector="RadioButton:pointerover /template/ Ellipse#OuterEllipse">
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseStrokePointerOver}" />
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFillPointerOver}" />
-  </Style>
-
-  <Style Selector="RadioButton:pointerover /template/ Ellipse#CheckOuterEllipse">
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseCheckedStrokePointerOver}" />
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseCheckedFillPointerOver}" />
-  </Style>
-
-  <Style Selector="RadioButton:pointerover /template/ Ellipse#CheckGlyph">
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckGlyphStrokePointerOver}" />
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckGlyphFillPointerOver}" />
-  </Style>
-
-
-  <!-- Pressed State -->
-  <Style Selector="RadioButton:pressed /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource RadioButtonForegroundPressed}" />
-  </Style>
-
-  <Style Selector="RadioButton:pressed /template/ Border#RootBorder">
-    <Setter Property="Background" Value="{DynamicResource RadioButtonBackgroundPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource RadioButtonBorderBrushPressed}" />
-  </Style>
-
-  <Style Selector="RadioButton:pressed /template/ Ellipse#OuterEllipse">
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseStrokePressed}" />
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFillPressed}" />
-  </Style>
-
-  <Style Selector="RadioButton:pressed /template/ Ellipse#CheckOuterEllipse">
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseCheckedStrokePressed}" />
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseCheckedFillPressed}" />
-  </Style>
-
-  <Style Selector="RadioButton:pressed /template/ Ellipse#CheckGlyph">
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckGlyphStrokePressed}" />
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckGlyphFillPressed}" />
-  </Style>
-
-
-  <!-- Disabled State -->
-  <Style Selector="RadioButton:disabled /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource RadioButtonForegroundDisabled}" />
-  </Style>
-
-  <Style Selector="RadioButton:disabled /template/ Border#RootBorder">
-    <Setter Property="Background" Value="{DynamicResource RadioButtonBackgroundDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource RadioButtonBorderBrushDisabled}" />
-  </Style>
-
-  <Style Selector="RadioButton:disabled /template/ Ellipse#OuterEllipse">
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseStrokeDisabled}" />
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFillDisabled}" />
-  </Style>
-
-  <Style Selector="RadioButton:disabled /template/ Ellipse#CheckOuterEllipse">
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseCheckedStrokeDisabled}" />
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseCheckedFillDisabled}" />
-  </Style>
-
-  <Style Selector="RadioButton:disabled /template/ Ellipse#CheckGlyph">
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckGlyphFillDisabled}" />
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckGlyphStrokeDisabled}" />
-  </Style>
-
-
-  <!-- Checked State -->
-  <Style Selector="RadioButton:checked /template/ Ellipse#CheckGlyph">
-    <Setter Property="Opacity" Value="1" />
-  </Style>
-
-  <Style Selector="RadioButton:checked /template/ Ellipse#OuterEllipse">
-    <Setter Property="Opacity" Value="0" />
-  </Style>
-
-  <Style Selector="RadioButton:checked /template/ Ellipse#CheckOuterEllipse">
-    <Setter Property="Opacity" Value="1" />
-  </Style>
-</Styles>
+
+    <!--  PointerOver State  -->
+    <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="Foreground" Value="{DynamicResource RadioButtonForegroundPointerOver}" />
+    </Style>
+
+    <Style Selector="^:pointerover /template/ Border#RootBorder">
+      <Setter Property="Background" Value="{DynamicResource RadioButtonBackgroundPointerOver}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource RadioButtonBorderBrushPointerOver}" />
+    </Style>
+
+    <Style Selector="^:pointerover /template/ Ellipse#OuterEllipse">
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseStrokePointerOver}" />
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFillPointerOver}" />
+    </Style>
+
+    <Style Selector="^:pointerover /template/ Ellipse#CheckOuterEllipse">
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseCheckedStrokePointerOver}" />
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseCheckedFillPointerOver}" />
+    </Style>
+
+    <Style Selector="^:pointerover /template/ Ellipse#CheckGlyph">
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckGlyphStrokePointerOver}" />
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckGlyphFillPointerOver}" />
+    </Style>
+
+
+    <!--  Pressed State  -->
+    <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="Foreground" Value="{DynamicResource RadioButtonForegroundPressed}" />
+    </Style>
+
+    <Style Selector="^:pressed /template/ Border#RootBorder">
+      <Setter Property="Background" Value="{DynamicResource RadioButtonBackgroundPressed}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource RadioButtonBorderBrushPressed}" />
+    </Style>
+
+    <Style Selector="^:pressed /template/ Ellipse#OuterEllipse">
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseStrokePressed}" />
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFillPressed}" />
+    </Style>
+
+    <Style Selector="^:pressed /template/ Ellipse#CheckOuterEllipse">
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseCheckedStrokePressed}" />
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseCheckedFillPressed}" />
+    </Style>
+
+    <Style Selector="^:pressed /template/ Ellipse#CheckGlyph">
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckGlyphStrokePressed}" />
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckGlyphFillPressed}" />
+    </Style>
+
+
+    <!--  Disabled State  -->
+    <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="Foreground" Value="{DynamicResource RadioButtonForegroundDisabled}" />
+    </Style>
+
+    <Style Selector="^:disabled /template/ Border#RootBorder">
+      <Setter Property="Background" Value="{DynamicResource RadioButtonBackgroundDisabled}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource RadioButtonBorderBrushDisabled}" />
+    </Style>
+
+    <Style Selector="^:disabled /template/ Ellipse#OuterEllipse">
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseStrokeDisabled}" />
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFillDisabled}" />
+    </Style>
+
+    <Style Selector="^:disabled /template/ Ellipse#CheckOuterEllipse">
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseCheckedStrokeDisabled}" />
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseCheckedFillDisabled}" />
+    </Style>
+
+    <Style Selector="^:disabled /template/ Ellipse#CheckGlyph">
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckGlyphFillDisabled}" />
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckGlyphStrokeDisabled}" />
+    </Style>
+
+
+    <!--  Checked State  -->
+    <Style Selector="^:checked /template/ Ellipse#CheckGlyph">
+      <Setter Property="Opacity" Value="1" />
+    </Style>
+
+    <Style Selector="^:checked /template/ Ellipse#OuterEllipse">
+      <Setter Property="Opacity" Value="0" />
+    </Style>
+
+    <Style Selector="^:checked /template/ Ellipse#CheckOuterEllipse">
+      <Setter Property="Opacity" Value="1" />
+    </Style>
+  </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/RepeatButton.xaml b/src/Avalonia.Themes.Fluent/Controls/RepeatButton.xaml
index 7fa515d3f7..670212c4b1 100644
--- a/src/Avalonia.Themes.Fluent/Controls/RepeatButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/RepeatButton.xaml
@@ -1,63 +1,65 @@
-<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Design.PreviewWith>
-    <Border Padding="20">
-      <StackPanel Spacing="20">
-        <RepeatButton Content="Click Me!" />
-      </StackPanel>
-    </Border>
-  </Design.PreviewWith>
-  <Styles.Resources>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <Design.PreviewWith>
+      <Border Padding="20">
+        <StackPanel Spacing="20">
+          <RepeatButton Content="Click Me!" />
+        </StackPanel>
+      </Border>
+    </Design.PreviewWith>
+  
     <Thickness x:Key="ButtonPadding">8,5,8,6</Thickness>
-  </Styles.Resources>
-  <Style Selector="RepeatButton">
-    <Setter Property="Background" Value="{DynamicResource RepeatButtonBackground}" />
-    <!--<Setter Property="BackgroundSizing" Value="OuterBorderEdge" />-->
-    <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForeground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrush}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThemeThickness}" />
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="Padding" Value="{StaticResource ButtonPadding}" />
-    <Setter Property="HorizontalAlignment" Value="Left" />
-    <Setter Property="VerticalAlignment" Value="Center" />    
-    <Setter Property="FontWeight" Value="Normal" />
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-    <!--<Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
-    <Setter Property="FocusVisualMargin" Value="-3" />-->
-    <Setter Property="Template">
-      <ControlTemplate>
-        <ContentPresenter x:Name="PART_ContentPresenter"
-                          Background="{TemplateBinding Background}"
-                          BorderBrush="{TemplateBinding BorderBrush}"
-                          BorderThickness="{TemplateBinding BorderThickness}"
-                          CornerRadius="{TemplateBinding CornerRadius}"
-                          Content="{TemplateBinding Content}"
-                          ContentTemplate="{TemplateBinding ContentTemplate}"
-                          Padding="{TemplateBinding Padding}"
-                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
-      </ControlTemplate>
-    </Setter>
-  </Style>
 
-  <Style Selector="RepeatButton /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-  </Style>
+    <ControlTheme x:Key="{x:Type RepeatButton}" TargetType="RepeatButton">
+      <Setter Property="Background" Value="{DynamicResource RepeatButtonBackground}" />
+      <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForeground}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrush}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThemeThickness}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="Padding" Value="{StaticResource ButtonPadding}" />
+      <Setter Property="HorizontalAlignment" Value="Left" />
+      <Setter Property="VerticalAlignment" Value="Center" />
+      <Setter Property="FontWeight" Value="Normal" />
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <ContentPresenter x:Name="PART_ContentPresenter"
+                            Background="{TemplateBinding Background}"
+                            BorderBrush="{TemplateBinding BorderBrush}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
+                            CornerRadius="{TemplateBinding CornerRadius}"
+                            Content="{TemplateBinding Content}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
+                            Padding="{TemplateBinding Padding}"
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
+        </ControlTemplate>
+      </Setter>
 
-  <Style Selector="RepeatButton:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource RepeatButtonBackgroundPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrushPointerOver}" />
-    <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundPointerOver}" />
-  </Style>
+      <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      </Style>
 
-  <Style Selector="RepeatButton:pressed  /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource RepeatButtonBackgroundPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrushPressed}" />
-    <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundPressed}" />
-  </Style>
+      <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource RepeatButtonBackgroundPointerOver}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrushPointerOver}" />
+        <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundPointerOver}" />
+      </Style>
 
-  <Style Selector="RepeatButton:disabled /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource RepeatButtonBackgroundDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrushDisabled}" />
-    <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundDisabled}" />
-  </Style>
-</Styles>
+      <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource RepeatButtonBackgroundPressed}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrushPressed}" />
+        <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundPressed}" />
+      </Style>
+
+      <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource RepeatButtonBackgroundDisabled}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrushDisabled}" />
+        <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundDisabled}" />
+      </Style>
+
+      <Style Selector="^:pressed">
+        <Setter Property="RenderTransform" Value="scale(0.98)" />
+      </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ScrollBar.xaml b/src/Avalonia.Themes.Fluent/Controls/ScrollBar.xaml
index 4727ff72b9..7d87a3e35a 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ScrollBar.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ScrollBar.xaml
@@ -1,4 +1,4 @@
-<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
 
   <Style Selector="ScrollBar">
     <Setter Property="MinWidth" Value="{DynamicResource ScrollBarSize}" />
diff --git a/src/Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml b/src/Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml
index b7addcb61e..a6e02d2769 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml
@@ -1,160 +1,87 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        xmlns:converters="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls">
-
-  <Design.PreviewWith>
-    <Grid ColumnDefinitions="*,20,*"
-          Height="300"
-          Width="200"
-          Margin="20">
-      <ScrollViewer>
-        <Border Height="1000" Background="#ccc"/>
-      </ScrollViewer>
-      <ScrollViewer Grid.Column="2" Classes="menuscroller">
-        <Border Height="1000" Background="#ccc"/>
-      </ScrollViewer>
-    </Grid>
-  </Design.PreviewWith>
+<ResourceDictionary 
+  xmlns="https://github.com/avaloniaui"
+  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+  xmlns:converters="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls">
+    <Design.PreviewWith>
+      <Grid ColumnDefinitions="*,20,*" Height="300" Width="200" Margin="20">
+        <ScrollViewer>
+          <Border Height="1000" Background="#ccc" />
+        </ScrollViewer>
+        <ScrollViewer Grid.Column="2" Classes="menuscroller">
+          <Border Height="1000" Background="#ccc" />
+        </ScrollViewer>
+      </Grid>
+    </Design.PreviewWith>
   
-  <Style Selector="ScrollViewer">
-    <Setter Property="Background"
-            Value="Transparent" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Grid ColumnDefinitions="*,Auto" RowDefinitions="*,Auto">
-          <ScrollContentPresenter Name="PART_ContentPresenter"
-                                  Grid.Row="0"
-                                  Grid.Column="0"
-                                  Grid.RowSpan="2"
-                                  Grid.ColumnSpan="2"
-                                  Background="{TemplateBinding Background}"
-                                  CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}"
-                                  CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}"
-                                  Content="{TemplateBinding Content}"
-                                  Extent="{TemplateBinding Extent, Mode=TwoWay}"
-                                  Padding="{TemplateBinding Padding}"
-                                  Offset="{TemplateBinding Offset, Mode=TwoWay}"
-                                  Viewport="{TemplateBinding Viewport, Mode=TwoWay}"
-                                  IsScrollChainingEnabled="{TemplateBinding IsScrollChainingEnabled}">
-            <ScrollContentPresenter.GestureRecognizers>
-              <ScrollGestureRecognizer
-                CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}"
-                CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}" />
-            </ScrollContentPresenter.GestureRecognizers>
-          </ScrollContentPresenter>
-          <ScrollBar Name="PART_HorizontalScrollBar"
-                     AllowAutoHide="{TemplateBinding AllowAutoHide}"
-                     Orientation="Horizontal"
-                     LargeChange="{Binding LargeChange.Width, RelativeSource={RelativeSource TemplatedParent}}"
-                     SmallChange="{Binding SmallChange.Width, RelativeSource={RelativeSource TemplatedParent}}"
-                     Maximum="{TemplateBinding HorizontalScrollBarMaximum}"
-                     Value="{TemplateBinding HorizontalScrollBarValue, Mode=TwoWay}"
-                     ViewportSize="{TemplateBinding HorizontalScrollBarViewportSize}"
-                     Visibility="{TemplateBinding HorizontalScrollBarVisibility}"
-                     Grid.Row="1"
-                     Focusable="False" />
-          <ScrollBar Name="PART_VerticalScrollBar"
-                     AllowAutoHide="{TemplateBinding AllowAutoHide}"
-                     Orientation="Vertical"
-                     LargeChange="{Binding LargeChange.Height, RelativeSource={RelativeSource TemplatedParent}}"
-                     SmallChange="{Binding SmallChange.Height, RelativeSource={RelativeSource TemplatedParent}}"
-                     Maximum="{TemplateBinding VerticalScrollBarMaximum}"
-                     Value="{TemplateBinding VerticalScrollBarValue, Mode=TwoWay}"
-                     ViewportSize="{TemplateBinding VerticalScrollBarViewportSize}"
-                     Visibility="{TemplateBinding VerticalScrollBarVisibility}"
-                     Grid.Column="1"
-                     Focusable="False" />
-          <Panel x:Name="PART_ScrollBarsSeparator" Grid.Row="1" Grid.Column="1" Background="{DynamicResource ScrollViewerScrollBarsSeparatorBackground}" />
-        </Grid>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-
-  <Style Selector="ScrollViewer /template/ Panel#PART_ScrollBarsSeparator">
-    <Setter Property="Opacity" Value="0" />
-    <Setter Property="Transitions">
-      <Transitions>
-        <DoubleTransition Property="Opacity" Duration="0:0:0.1" />
-      </Transitions>
-    </Setter>
-  </Style>
-
-  <Style Selector="ScrollViewer[IsExpanded=true] /template/ Panel#PART_ScrollBarsSeparator">
-    <Setter Property="Opacity" Value="1" />
-  </Style>
-
-  <Style Selector="ScrollViewer.menuscroller">
-    <Setter Property="Template">
-      <ControlTemplate>
-        <DockPanel>
-          <RepeatButton DockPanel.Dock="Top"
-                        BorderThickness="0"
-                        Background="Transparent"
-                        HorizontalAlignment="Stretch"
-                        HorizontalContentAlignment="Center"
-                        RenderTransform="{x:Null}"
-                        Command="{Binding LineUp, RelativeSource={RelativeSource TemplatedParent}}">
-            <RepeatButton.IsVisible>
-              <MultiBinding Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}"
-                            ConverterParameter="0">
-                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="VerticalScrollBarVisibility"/>
-                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Offset.Y"/>
-                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Extent.Height"/>
-                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Viewport.Height"/>
-              </MultiBinding>
-            </RepeatButton.IsVisible>
-            <Viewbox Width="{DynamicResource ScrollBarButtonArrowIconFontSize}"
-                     Height="{DynamicResource ScrollBarButtonArrowIconFontSize}">
-              <Path VerticalAlignment="Center"
-                    HorizontalAlignment="Center"
-                    Data="M 19.091797 14.970703 L 10 5.888672 L 0.908203 14.970703 L 0.029297 14.091797 L 10 4.111328 L 19.970703 14.091797 Z"
-                    Width="20"
-                    Height="20" />
-            </Viewbox>
-          </RepeatButton>
-          <RepeatButton DockPanel.Dock="Bottom"
-                        BorderThickness="0"
-                        Background="Transparent"
-                        HorizontalAlignment="Stretch"
-                        HorizontalContentAlignment="Center"
-                        RenderTransform="{x:Null}"
-                        Command="{Binding LineDown, RelativeSource={RelativeSource TemplatedParent}}">
-            <RepeatButton.IsVisible>
-              <MultiBinding Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}"
-                            ConverterParameter="100">
-                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="VerticalScrollBarVisibility"/>
-                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Offset.Y"/>
-                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Extent.Height"/>
-                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Viewport.Height"/>
-              </MultiBinding>
-            </RepeatButton.IsVisible>
-            <Viewbox Width="{DynamicResource ScrollBarButtonArrowIconFontSize}"
-                     Height="{DynamicResource ScrollBarButtonArrowIconFontSize}">
-              <Path VerticalAlignment="Center"
-                    HorizontalAlignment="Center"
-                    Data="M 18.935547 4.560547 L 19.814453 5.439453 L 10 15.253906 L 0.185547 5.439453 L 1.064453 4.560547 L 10 13.496094 Z"
-                    Width="20"
-                    Height="20" />
-            </Viewbox>
-          </RepeatButton>
-          <ScrollContentPresenter Name="PART_ContentPresenter"
-                                  CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}"
-                                  CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}"
-                                  Content="{TemplateBinding Content}"
-                                  Extent="{TemplateBinding Extent, Mode=TwoWay}"
-                                  Margin="{TemplateBinding Padding}"
-                                  Offset="{TemplateBinding Offset, Mode=TwoWay}"
-                                  Viewport="{TemplateBinding Viewport, Mode=TwoWay}"/>
-        </DockPanel>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-  <Style Selector="ScrollViewer.menuscroller /template/ RepeatButton > Viewbox > Path">
-    <Setter Property="Fill" Value="{DynamicResource ScrollBarButtonArrowForeground}" />
-  </Style>
-
-  <Style Selector="ScrollViewer.menuscroller /template/ RepeatButton:pointerover > Viewbox > Path">
-    <Setter Property="Fill" Value="{DynamicResource ScrollBarButtonArrowForegroundPointerOver}" />
-  </Style>
-
-</Styles>
+    <ControlTheme x:Key="{x:Type ScrollViewer}" TargetType="ScrollViewer">
+      <Setter Property="Background" Value="Transparent" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Grid ColumnDefinitions="*,Auto" RowDefinitions="*,Auto">
+            <ScrollContentPresenter Name="PART_ContentPresenter" Grid.Row="0" Grid.Column="0" Grid.RowSpan="2" Grid.ColumnSpan="2" Background="{TemplateBinding Background}" CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}" CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}" Content="{TemplateBinding Content}" Extent="{TemplateBinding Extent, Mode=TwoWay}" Padding="{TemplateBinding Padding}" Offset="{TemplateBinding Offset, Mode=TwoWay}" Viewport="{TemplateBinding Viewport, Mode=TwoWay}" IsScrollChainingEnabled="{TemplateBinding IsScrollChainingEnabled}">
+              <ScrollContentPresenter.GestureRecognizers>
+                <ScrollGestureRecognizer CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}" CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}" />
+              </ScrollContentPresenter.GestureRecognizers>
+            </ScrollContentPresenter>
+            <ScrollBar Name="PART_HorizontalScrollBar" AllowAutoHide="{TemplateBinding AllowAutoHide}" Orientation="Horizontal" LargeChange="{Binding LargeChange.Width, RelativeSource={RelativeSource TemplatedParent}}" SmallChange="{Binding SmallChange.Width, RelativeSource={RelativeSource TemplatedParent}}" Maximum="{TemplateBinding HorizontalScrollBarMaximum}" Value="{TemplateBinding HorizontalScrollBarValue, Mode=TwoWay}" ViewportSize="{TemplateBinding HorizontalScrollBarViewportSize}" Visibility="{TemplateBinding HorizontalScrollBarVisibility}" Grid.Row="1" Focusable="False" />
+            <ScrollBar Name="PART_VerticalScrollBar" AllowAutoHide="{TemplateBinding AllowAutoHide}" Orientation="Vertical" LargeChange="{Binding LargeChange.Height, RelativeSource={RelativeSource TemplatedParent}}" SmallChange="{Binding SmallChange.Height, RelativeSource={RelativeSource TemplatedParent}}" Maximum="{TemplateBinding VerticalScrollBarMaximum}" Value="{TemplateBinding VerticalScrollBarValue, Mode=TwoWay}" ViewportSize="{TemplateBinding VerticalScrollBarViewportSize}" Visibility="{TemplateBinding VerticalScrollBarVisibility}" Grid.Column="1" Focusable="False" />
+            <Panel x:Name="PART_ScrollBarsSeparator" Grid.Row="1" Grid.Column="1" Background="{DynamicResource ScrollViewerScrollBarsSeparatorBackground}" />
+          </Grid>
+        </ControlTemplate>
+      </Setter>
+      <Style Selector="^ /template/ Panel#PART_ScrollBarsSeparator">
+        <Setter Property="Opacity" Value="0" />
+        <Setter Property="Transitions">
+          <Transitions>
+            <DoubleTransition Property="Opacity" Duration="0:0:0.1" />
+          </Transitions>
+        </Setter>
+      </Style>
+      <Style Selector="^[IsExpanded=true] /template/ Panel#PART_ScrollBarsSeparator">
+        <Setter Property="Opacity" Value="1" />
+      </Style>
+      <Style Selector="^.menuscroller">
+        <Setter Property="Template">
+          <ControlTemplate>
+            <DockPanel>
+              <RepeatButton DockPanel.Dock="Top" BorderThickness="0" Background="Transparent" HorizontalAlignment="Stretch" HorizontalContentAlignment="Center" RenderTransform="{x:Null}" Command="{Binding LineUp, RelativeSource={RelativeSource TemplatedParent}}">
+                <RepeatButton.IsVisible>
+                  <MultiBinding Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}" ConverterParameter="0">
+                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="VerticalScrollBarVisibility" />
+                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Offset.Y" />
+                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Extent.Height" />
+                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Viewport.Height" />
+                  </MultiBinding>
+                </RepeatButton.IsVisible>
+                <Viewbox Width="{DynamicResource ScrollBarButtonArrowIconFontSize}" Height="{DynamicResource ScrollBarButtonArrowIconFontSize}">
+                  <Path VerticalAlignment="Center" HorizontalAlignment="Center" Data="M 19.091797 14.970703 L 10 5.888672 L 0.908203 14.970703 L 0.029297 14.091797 L 10 4.111328 L 19.970703 14.091797 Z" Width="20" Height="20" />
+                </Viewbox>
+              </RepeatButton>
+              <RepeatButton DockPanel.Dock="Bottom" BorderThickness="0" Background="Transparent" HorizontalAlignment="Stretch" HorizontalContentAlignment="Center" RenderTransform="{x:Null}" Command="{Binding LineDown, RelativeSource={RelativeSource TemplatedParent}}">
+                <RepeatButton.IsVisible>
+                  <MultiBinding Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}" ConverterParameter="100">
+                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="VerticalScrollBarVisibility" />
+                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Offset.Y" />
+                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Extent.Height" />
+                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Viewport.Height" />
+                  </MultiBinding>
+                </RepeatButton.IsVisible>
+                <Viewbox Width="{DynamicResource ScrollBarButtonArrowIconFontSize}" Height="{DynamicResource ScrollBarButtonArrowIconFontSize}">
+                  <Path VerticalAlignment="Center" HorizontalAlignment="Center" Data="M 18.935547 4.560547 L 19.814453 5.439453 L 10 15.253906 L 0.185547 5.439453 L 1.064453 4.560547 L 10 13.496094 Z" Width="20" Height="20" />
+                </Viewbox>
+              </RepeatButton>
+              <ScrollContentPresenter Name="PART_ContentPresenter" CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}" CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}" Content="{TemplateBinding Content}" Extent="{TemplateBinding Extent, Mode=TwoWay}" Margin="{TemplateBinding Padding}" Offset="{TemplateBinding Offset, Mode=TwoWay}" Viewport="{TemplateBinding Viewport, Mode=TwoWay}" />
+            </DockPanel>
+          </ControlTemplate>
+        </Setter>
+        <Style Selector="^ /template/ RepeatButton">
+          <Style Selector="^ > Viewbox > Path">
+            <Setter Property="Fill" Value="{DynamicResource ScrollBarButtonArrowForeground}" />
+          </Style>
+          <Style Selector="^:pointerover > Viewbox > Path">
+            <Setter Property="Fill" Value="{DynamicResource ScrollBarButtonArrowForegroundPointerOver}" />
+          </Style>
+        </Style>
+      </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/Separator.xaml b/src/Avalonia.Themes.Fluent/Controls/Separator.xaml
index 5d95ccc404..afbc3770c1 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Separator.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Separator.xaml
@@ -1,7 +1,7 @@
-<Styles xmlns="https://github.com/avaloniaui">
-
-  <Style Selector="Separator">
-    <Setter Property="Focusable" Value="False"/>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+  <ControlTheme x:Key="{x:Type Separator}" TargetType="Separator">
+    <Setter Property="Focusable" Value="False" />
     <Setter Property="Template">
       <ControlTemplate>
         <Border Padding="{TemplateBinding Margin}"
@@ -11,9 +11,8 @@
                 BorderBrush="{TemplateBinding BorderBrush}"
                 BorderThickness="{TemplateBinding BorderThickness}"
                 CornerRadius="{TemplateBinding CornerRadius}"
-                Background="{TemplateBinding Background}"/>
+                Background="{TemplateBinding Background}" />
       </ControlTemplate>
     </Setter>
-  </Style>
-
-</Styles>
+  </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/Slider.xaml b/src/Avalonia.Themes.Fluent/Controls/Slider.xaml
index cd2c02c567..b468f7f4ad 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Slider.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Slider.xaml
@@ -1,19 +1,20 @@
-<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Design.PreviewWith>
-    <Border Margin="20" Width="200" Height="200">
-      <DockPanel LastChildFill="True">
-        <StackPanel Spacing="10" DockPanel.Dock="Top">
-          <Slider Value="50" />
-          <Slider IsEnabled="False" Value="50" />
-        </StackPanel>
-        <StackPanel Spacing="10" Orientation="Horizontal">
-          <Slider Value="50" Orientation="Vertical" />
-          <Slider IsEnabled="False" Orientation="Vertical" Value="50" />
-        </StackPanel>
-      </DockPanel>
-    </Border>
-  </Design.PreviewWith>
-  <Styles.Resources>
+<ResourceDictionary 
+  xmlns="https://github.com/avaloniaui" 
+  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+     <Design.PreviewWith>
+      <Border Margin="20" Width="200" Height="200">
+        <DockPanel LastChildFill="True">
+          <StackPanel Spacing="10" DockPanel.Dock="Top">
+            <Slider Value="50" />
+            <Slider IsEnabled="False" Value="50" />
+          </StackPanel>
+          <StackPanel Spacing="10" Orientation="Horizontal">
+            <Slider Value="50" Orientation="Vertical" />
+            <Slider IsEnabled="False" Orientation="Vertical" Value="50" />
+          </StackPanel>
+        </DockPanel>
+      </Border>
+    </Design.PreviewWith>
     <Thickness x:Key="SliderTopHeaderMargin">0,0,0,4</Thickness>
     <GridLength x:Key="SliderPreContentMargin">15</GridLength>
     <GridLength x:Key="SliderPostContentMargin">15</GridLength>
@@ -24,252 +25,364 @@
     <x:Double x:Key="SliderHorizontalThumbHeight">20</x:Double>
     <x:Double x:Key="SliderVerticalThumbWidth">20</x:Double>
     <x:Double x:Key="SliderVerticalThumbHeight">20</x:Double>
-  </Styles.Resources>
-  <Style Selector="Thumb.SliderThumbStyle">
-    <Setter Property="BorderThickness" Value="0" />
+
+
+  <ControlTheme x:Key="FluentBaseSliderDecreaseIncreaseRepeatButtonTheme" TargetType="RepeatButton" BasedOn="{StaticResource {x:Type RepeatButton}}">
     <Setter Property="Template">
-      <Setter.Value>
-        <ControlTemplate>
-          <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{DynamicResource SliderThumbCornerRadius}" />
-        </ControlTemplate>
-      </Setter.Value>
+      <ControlTemplate>
+        <Grid>
+          <Border
+              Name="FocusTarget"
+              Margin="0,-10"
+              Background="Transparent" />
+          <Border
+              Name="TrackBackground"
+              Background="{TemplateBinding Background}"
+              CornerRadius="{DynamicResource ControlCornerRadius}" />
+        </Grid>
+      </ControlTemplate>
     </Setter>
-  </Style>
-  <Style Selector="Slider:horizontal">
-    <Setter Property="Background" Value="{DynamicResource SliderTrackFill}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource SliderBorderThemeThickness}" />
-    <Setter Property="Foreground" Value="{DynamicResource SliderTrackValueFill}" />    
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+  </ControlTheme>
+  
+  <ControlTheme x:Key="FluentHorizontalSliderDecreaseIncreaseRepeatButtonTheme" TargetType="RepeatButton" BasedOn="{StaticResource FluentBaseSliderDecreaseIncreaseRepeatButtonTheme}">
+    <Setter Property="Height" Value="{DynamicResource SliderTrackThemeHeight}"/>
+    <Setter Property="VerticalAlignment" Value="Center"/>
+  </ControlTheme>
+  
+  <ControlTheme x:Key="FluentVerticalSliderDecreaseIncreaseRepeatButtonTheme" TargetType="RepeatButton" BasedOn="{StaticResource FluentBaseSliderDecreaseIncreaseRepeatButtonTheme}">
+    <Setter Property="Width" Value="{DynamicResource SliderTrackThemeHeight}"/>
+    <Setter Property="HorizontalAlignment" Value="Center"/>
+  </ControlTheme>
+
+  <ControlTheme x:Key="FluentSliderThumbTheme" TargetType="Thumb">
     <Setter Property="Template">
       <ControlTemplate>
-        <DataValidationErrors>
-          <Border BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="{TemplateBinding CornerRadius}">
-            <Grid Name="grid" Margin="{TemplateBinding Padding}" RowDefinitions="Auto, *">
-              <ContentPresenter x:Name="HeaderContentPresenter" Grid.Row="0" TextElement.FontWeight="{DynamicResource SliderHeaderThemeFontWeight}" TextElement.Foreground="{DynamicResource SliderHeaderForeground}"
-              Margin="{DynamicResource SliderTopHeaderMargin}" />
-              <Grid x:Name="SliderContainer" Grid.Row="1">
-                <Grid.Styles>
-                  <Style Selector="TickBar">
-                    <Setter Property="ReservedSpace" Value="{Binding #PART_Track.Thumb.Bounds}" />
-                  </Style>
-                </Grid.Styles>
-                <Grid x:Name="HorizontalTemplate" ColumnDefinitions="Auto,Auto,*" MinHeight="{DynamicResource SliderHorizontalHeight}">
-                  <Grid.RowDefinitions>
-                    <RowDefinition Height="{DynamicResource SliderPreContentMargin}" />
-                    <RowDefinition Height="Auto" />
-                    <RowDefinition Height="{DynamicResource SliderPostContentMargin}" />
-                  </Grid.RowDefinitions>
-                  <TickBar Name="TopTickBar" Placement="Top" Height="{DynamicResource SliderOutsideTickBarThemeHeight}" VerticalAlignment="Bottom" Margin="0,0,0,4" Grid.ColumnSpan="3" />
-                  <!-- <TickBar Name="HorizontalInlineTickBar" Placement="Top" Fill="{DynamicResource SliderInlineTickBarFill}" Height="{DynamicResource SliderTrackThemeHeight}" Grid.Row="1" Grid.ColumnSpan="3" /> -->
-                  <TickBar Name="BottomTickBar" Placement="Bottom" Height="{DynamicResource SliderOutsideTickBarThemeHeight}" VerticalAlignment="Top" Margin="0,4,0,0" Grid.Row="2" Grid.ColumnSpan="3" />
-                  <Track Name="PART_Track" Grid.Row="1" Grid.ColumnSpan="3" IsDirectionReversed="{TemplateBinding IsDirectionReversed}" Orientation="Horizontal">
-                    <Track.DecreaseButton>
-                      <RepeatButton Name="PART_DecreaseButton" Background="{TemplateBinding Foreground}" Focusable="False" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                        <RepeatButton.Template>
-                          <ControlTemplate>
-                            <Grid>
-                              <Border Name="FocusTarget" Background="Transparent" Margin="0,-10" />
-                              <Border Name="TrackBackground" Background="{TemplateBinding Background}" CornerRadius="{DynamicResource ControlCornerRadius}" Height="{DynamicResource SliderTrackThemeHeight}" VerticalAlignment="Center" />
-                            </Grid>
-                          </ControlTemplate>
-                        </RepeatButton.Template>
-                      </RepeatButton>
-                    </Track.DecreaseButton>
-                    <Track.IncreaseButton>
-                      <RepeatButton Name="PART_IncreaseButton" Background="{TemplateBinding Background}" Focusable="False" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                        <RepeatButton.Template>
-                          <ControlTemplate>
-                            <Grid>
-                              <Border Name="FocusTarget" Background="Transparent" Margin="0,-10" />
-                              <Border Name="TrackBackground" Background="{TemplateBinding Background}" CornerRadius="{DynamicResource ControlCornerRadius}" Height="{DynamicResource SliderTrackThemeHeight}" VerticalAlignment="Center" />
-                            </Grid>
-                          </ControlTemplate>
-                        </RepeatButton.Template>
-                      </RepeatButton>
-                    </Track.IncreaseButton>
-                    <Thumb Classes="SliderThumbStyle" Name="thumb" Margin="0" Padding="0" DataContext="{TemplateBinding Value}" Height="{DynamicResource SliderHorizontalThumbHeight}" Width="{DynamicResource SliderHorizontalThumbWidth}" />
-                  </Track>
-                </Grid>
-              </Grid>
-            </Grid>
-          </Border>
-        </DataValidationErrors>
+        <Border
+            Background="{TemplateBinding Background}"
+            BorderBrush="{TemplateBinding BorderBrush}"
+            BorderThickness="{TemplateBinding BorderThickness}"
+            CornerRadius="{DynamicResource SliderThumbCornerRadius}" />
       </ControlTemplate>
     </Setter>
-  </Style>
-  <Style Selector="Slider:vertical">
+  </ControlTheme>
+  
+  <ControlTheme x:Key="{x:Type Slider}" TargetType="Slider">
     <Setter Property="Background" Value="{DynamicResource SliderTrackFill}" />
     <Setter Property="BorderThickness" Value="{DynamicResource SliderBorderThemeThickness}" />
-    <Setter Property="Foreground" Value="{DynamicResource SliderTrackValueFill}" />    
+    <Setter Property="Foreground" Value="{DynamicResource SliderTrackValueFill}" />
     <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <DataValidationErrors>
-          <Border BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="{TemplateBinding CornerRadius}">
-            <Grid Name="grid" Margin="{TemplateBinding Padding}" RowDefinitions="Auto, *">
-              <ContentPresenter x:Name="HeaderContentPresenter" Grid.Row="0" TextElement.FontWeight="{DynamicResource SliderHeaderThemeFontWeight}" TextElement.Foreground="{DynamicResource SliderHeaderForeground}"
-              Margin="{DynamicResource SliderTopHeaderMargin}" />
-              <Grid x:Name="SliderContainer" Grid.Row="1">
-                <Grid.Styles>
-                  <Style Selector="TickBar">
-                    <Setter Property="ReservedSpace" Value="{Binding #PART_Track.Thumb.Bounds}" />
-                  </Style>
-                </Grid.Styles>
-                <Grid x:Name="VerticalTemplate" RowDefinitions="*,Auto,Auto" MinWidth="{DynamicResource SliderVerticalWidth}">
-                  <Grid.ColumnDefinitions>
-                    <ColumnDefinition Width="{DynamicResource SliderPreContentMargin}" />
-                    <ColumnDefinition Width="Auto" />
-                    <ColumnDefinition Width="{DynamicResource SliderPostContentMargin}" />
-                  </Grid.ColumnDefinitions>
-                  <TickBar Name="LeftTickBar" Placement="Left" Width="{DynamicResource SliderOutsideTickBarThemeHeight}" HorizontalAlignment="Right" Margin="0,0,4,0" Grid.RowSpan="3" />
-                  <!-- <TickBar Name="VerticalInlineTickBar" Placement="Inline" Fill="{DynamicResource SliderInlineTickBarFill}" Width="{DynamicResource SliderTrackThemeHeight}" Grid.Column="1" Grid.RowSpan="3" /> -->
-                  <TickBar Name="RightTickBar" Placement="Right" Width="{DynamicResource SliderOutsideTickBarThemeHeight}" HorizontalAlignment="Left" Margin="4,0,0,0" Grid.Column="2" Grid.RowSpan="3" />
-                  <Track Name="PART_Track" Grid.Column="1" Grid.ColumnSpan="1" Grid.RowSpan="3" IsDirectionReversed="{TemplateBinding IsDirectionReversed}" Orientation="Vertical">
-                    <Track.DecreaseButton>
-                      <RepeatButton Name="PART_DecreaseButton" Background="{TemplateBinding Foreground}" Focusable="False" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
-                        <RepeatButton.Template>
-                          <ControlTemplate>
-                            <Grid>
-                              <Border Name="FocusTarget" Background="Transparent" Margin="0,-10" />
-                              <Border Name="TrackBackground" Background="{TemplateBinding Background}" CornerRadius="{DynamicResource ControlCornerRadius}" Width="{DynamicResource SliderTrackThemeHeight}" HorizontalAlignment="Center" />
+    <Style Selector="^:horizontal">
+        <Setter Property="Template">
+            <ControlTemplate>
+                <DataValidationErrors>
+                    <Border
+                        BorderBrush="{TemplateBinding BorderBrush}"
+                        BorderThickness="{TemplateBinding BorderThickness}"
+                        CornerRadius="{TemplateBinding CornerRadius}">
+                        <Grid
+                            Name="grid"
+                            Margin="{TemplateBinding Padding}"
+                            RowDefinitions="Auto, *">
+                            <ContentPresenter
+                                x:Name="HeaderContentPresenter"
+                                Grid.Row="0"
+                                Margin="{DynamicResource SliderTopHeaderMargin}"
+                                TextElement.FontWeight="{DynamicResource SliderHeaderThemeFontWeight}"
+                                TextElement.Foreground="{DynamicResource SliderHeaderForeground}" />
+                            <Grid x:Name="SliderContainer" Grid.Row="1">
+                                <Grid.Styles>
+                                    <Style Selector="TickBar">
+                                        <Setter Property="ReservedSpace" Value="{Binding #PART_Track.Thumb.Bounds}" />
+                                    </Style>
+                                </Grid.Styles>
+                                <Grid
+                                    x:Name="HorizontalTemplate"
+                                    MinHeight="{DynamicResource SliderHorizontalHeight}"
+                                    ColumnDefinitions="Auto,Auto,*">
+                                    <Grid.RowDefinitions>
+                                        <RowDefinition Height="{DynamicResource SliderPreContentMargin}" />
+                                        <RowDefinition Height="Auto" />
+                                        <RowDefinition Height="{DynamicResource SliderPostContentMargin}" />
+                                    </Grid.RowDefinitions>
+                                    <TickBar
+                                        Name="TopTickBar"
+                                        Grid.ColumnSpan="3"
+                                        Ticks="{TemplateBinding Ticks}"
+                                        TickFrequency="{TemplateBinding Slider.TickFrequency}"
+                                        Orientation="{TemplateBinding Slider.Orientation}"
+                                        Minimum="{TemplateBinding Slider.Minimum}"
+                                        Maximum="{TemplateBinding Slider.Maximum}"
+                                        Height="{DynamicResource SliderOutsideTickBarThemeHeight}"
+                                        Margin="0,0,0,4"
+                                        VerticalAlignment="Bottom"
+                                        Placement="Top" />
+                                    <TickBar
+                                        Name="BottomTickBar"
+                                        Grid.Row="2"
+                                        Grid.ColumnSpan="3"
+                                        Ticks="{TemplateBinding Ticks}"
+                                        TickFrequency="{TemplateBinding Slider.TickFrequency}"
+                                        Orientation="{TemplateBinding Slider.Orientation}"
+                                        Minimum="{TemplateBinding Slider.Minimum}"
+                                        Maximum="{TemplateBinding Slider.Maximum}"
+                                        Height="{DynamicResource SliderOutsideTickBarThemeHeight}"
+                                        Margin="0,4,0,0"
+                                        VerticalAlignment="Top"
+                                        Placement="Bottom" />
+                                    <Track
+                                        Name="PART_Track"
+                                        Grid.Row="1"
+                                        Grid.ColumnSpan="3"
+                                        Minimum="{TemplateBinding Minimum}"
+                                        Maximum="{TemplateBinding Maximum}"
+                                        Value="{TemplateBinding Value, Mode=TwoWay}"
+                                        IsDirectionReversed="{TemplateBinding IsDirectionReversed}"
+                                        Orientation="Horizontal">
+                                        <Track.DecreaseButton>
+                                            <RepeatButton
+                                                Name="PART_DecreaseButton"
+                                                HorizontalAlignment="Stretch"
+                                                VerticalAlignment="Stretch"
+                                                Theme="{StaticResource FluentHorizontalSliderDecreaseIncreaseRepeatButtonTheme}"
+                                                Background="{TemplateBinding Foreground}"
+                                                Focusable="False"/>
+                                        </Track.DecreaseButton>
+                                        <Track.IncreaseButton>
+                                            <RepeatButton
+                                                Name="PART_IncreaseButton"
+                                                HorizontalAlignment="Stretch"
+                                                VerticalAlignment="Stretch"
+                                                Theme="{StaticResource FluentHorizontalSliderDecreaseIncreaseRepeatButtonTheme}"
+                                                Background="{TemplateBinding Background}"
+                                                Focusable="False"/>
+                                        </Track.IncreaseButton>
+                                      <Thumb
+                                          Name="thumb"
+                                          Width="{DynamicResource SliderHorizontalThumbWidth}"
+                                          Height="{DynamicResource SliderHorizontalThumbHeight}"
+                                          Margin="0"
+                                          Padding="0"
+                                          BorderThickness="0"
+                                          Classes="SliderThumbStyle"
+                                          Theme="{StaticResource FluentSliderThumbTheme}"
+                                          DataContext="{TemplateBinding Value}"/>
+                                    </Track>
+                                </Grid>
                             </Grid>
-                          </ControlTemplate>
-                        </RepeatButton.Template>
-                      </RepeatButton>
-                    </Track.DecreaseButton>
-                    <Track.IncreaseButton>
-                      <RepeatButton Name="PART_IncreaseButton" Background="{TemplateBinding Background}" Focusable="False" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
-                        <RepeatButton.Template>
-                          <ControlTemplate>
-                            <Grid>
-                              <Border Name="FocusTarget" Background="Transparent" Margin="0,-10" />
-                              <Border Name="TrackBackground" Background="{TemplateBinding Background}" CornerRadius="{DynamicResource ControlCornerRadius}" Width="{DynamicResource SliderTrackThemeHeight}" HorizontalAlignment="Center" />
+                        </Grid>
+                    </Border>
+                </DataValidationErrors>
+            </ControlTemplate>
+        </Setter>
+    </Style>
+    <Style Selector="^:vertical">
+        <Setter Property="Template">
+            <ControlTemplate>
+                <DataValidationErrors>
+                    <Border
+                        BorderBrush="{TemplateBinding BorderBrush}"
+                        BorderThickness="{TemplateBinding BorderThickness}"
+                        CornerRadius="{TemplateBinding CornerRadius}">
+                        <Grid
+                            Name="grid"
+                            Margin="{TemplateBinding Padding}"
+                            RowDefinitions="Auto, *">
+                            <ContentPresenter
+                                x:Name="HeaderContentPresenter"
+                                Grid.Row="0"
+                                Margin="{DynamicResource SliderTopHeaderMargin}"
+                                TextElement.FontWeight="{DynamicResource SliderHeaderThemeFontWeight}"
+                                TextElement.Foreground="{DynamicResource SliderHeaderForeground}" />
+                            <Grid x:Name="SliderContainer" Grid.Row="1">
+                                <Grid.Styles>
+                                    <Style Selector="TickBar">
+                                        <Setter Property="ReservedSpace" Value="{Binding #PART_Track.Thumb.Bounds}" />
+                                    </Style>
+                                </Grid.Styles>
+                                <Grid
+                                    x:Name="VerticalTemplate"
+                                    MinWidth="{DynamicResource SliderVerticalWidth}"
+                                    RowDefinitions="*,Auto,Auto">
+                                    <Grid.ColumnDefinitions>
+                                        <ColumnDefinition Width="{DynamicResource SliderPreContentMargin}" />
+                                        <ColumnDefinition Width="Auto" />
+                                        <ColumnDefinition Width="{DynamicResource SliderPostContentMargin}" />
+                                    </Grid.ColumnDefinitions>
+                                    <TickBar
+                                        Name="LeftTickBar"
+                                        Grid.RowSpan="3"
+                                        Ticks="{TemplateBinding Ticks}"
+                                        TickFrequency="{TemplateBinding Slider.TickFrequency}"
+                                        Orientation="{TemplateBinding Slider.Orientation}"
+                                        Minimum="{TemplateBinding Slider.Minimum}"
+                                        Maximum="{TemplateBinding Slider.Maximum}"
+                                        Width="{DynamicResource SliderOutsideTickBarThemeHeight}"
+                                        Margin="0,0,4,0"
+                                        HorizontalAlignment="Right"
+                                        Placement="Left" />
+                                    <TickBar
+                                        Name="RightTickBar"
+                                        Grid.RowSpan="3"
+                                        Grid.Column="2"
+                                        Ticks="{TemplateBinding Ticks}"
+                                        TickFrequency="{TemplateBinding Slider.TickFrequency}"
+                                        Orientation="{TemplateBinding Slider.Orientation}"
+                                        Minimum="{TemplateBinding Slider.Minimum}"
+                                        Maximum="{TemplateBinding Slider.Maximum}"
+                                        Width="{DynamicResource SliderOutsideTickBarThemeHeight}"
+                                        Margin="4,0,0,0"
+                                        HorizontalAlignment="Left"
+                                        Placement="Right" />
+                                    <Track
+                                        Name="PART_Track"
+                                        Grid.RowSpan="3"
+                                        Grid.Column="1"
+                                        Grid.ColumnSpan="1"
+                                        Minimum="{TemplateBinding Minimum}"
+                                        Maximum="{TemplateBinding Maximum}"
+                                        Value="{TemplateBinding Value, Mode=TwoWay}"
+                                        IsDirectionReversed="{TemplateBinding IsDirectionReversed}"
+                                        Orientation="Vertical">
+                                        <Track.DecreaseButton>
+                                            <RepeatButton
+                                                Name="PART_DecreaseButton"
+                                                HorizontalAlignment="Stretch"
+                                                VerticalAlignment="Stretch"
+                                                Theme="{StaticResource FluentVerticalSliderDecreaseIncreaseRepeatButtonTheme}"
+                                                Background="{TemplateBinding Foreground}"
+                                                Focusable="False"/>
+                                        </Track.DecreaseButton>
+                                        <Track.IncreaseButton>
+                                            <RepeatButton
+                                                Name="PART_IncreaseButton"
+                                                HorizontalAlignment="Stretch"
+                                                VerticalAlignment="Stretch"
+                                                Background="{TemplateBinding Background}"
+                                                Theme="{StaticResource FluentVerticalSliderDecreaseIncreaseRepeatButtonTheme}"
+                                                Focusable="False"/>
+                                        </Track.IncreaseButton>
+                                        <Thumb
+                                            Name="SliderThumb"
+                                            Width="{DynamicResource SliderVerticalThumbWidth}"
+                                            Height="{DynamicResource SliderVerticalThumbHeight}"
+                                            Margin="0"
+                                            Padding="0"
+                                            BorderThickness="0"
+                                            Classes="SliderThumbStyle"
+                                            Theme="{StaticResource FluentSliderThumbTheme}"
+                                            DataContext="{TemplateBinding Value}" />
+                                    </Track>
+                                </Grid>
                             </Grid>
-                          </ControlTemplate>
-                        </RepeatButton.Template>
-                      </RepeatButton>
-                    </Track.IncreaseButton>
-                    <Thumb Classes="SliderThumbStyle" Name="SliderThumb" Margin="0" Padding="0" DataContext="{TemplateBinding Value}" Height="{DynamicResource SliderVerticalThumbHeight}" Width="{DynamicResource SliderVerticalThumbWidth}" />
-                  </Track>
-                </Grid>
-              </Grid>
-            </Grid>
-          </Border>
-        </DataValidationErrors>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-  <Style Selector="Slider /template/ Track#PART_Track">
-    <Setter Property="Minimum" Value="{TemplateBinding Minimum}" />
-    <Setter Property="Maximum" Value="{TemplateBinding Maximum}" />
-    <Setter Property="Value" Value="{TemplateBinding Value, Mode=TwoWay}" />
-  </Style>
-  <Style Selector="Slider /template/ TickBar">
-    <Setter Property="Fill" Value="{DynamicResource SliderTickBarFill}" />
-    <Setter Property="TickFrequency" Value="{TemplateBinding Slider.TickFrequency}" />
-    <Setter Property="Orientation" Value="{TemplateBinding Slider.Orientation}" />
-    <Setter Property="Minimum" Value="{TemplateBinding Slider.Minimum}" />
-    <Setter Property="Maximum" Value="{TemplateBinding Slider.Maximum}" />
-  </Style>
-  
-  <!-- Normal State -->
-  
-  <Style Selector="Slider /template/ Thumb.SliderThumbStyle">
-    <Setter Property="Background" Value="{DynamicResource SliderThumbBackground}" />
-  </Style>
+                        </Grid>
+                    </Border>
+                </DataValidationErrors>
+            </ControlTemplate>
+        </Setter>
+    </Style>
 
-  <Style Selector="Slider /template/ Grid#SliderContainer">
-    <Setter Property="Background" Value="{DynamicResource SliderContainerBackground}" />
-  </Style>
+    <!--  Normal State  -->
 
-  <Style Selector="Slider /template/ TickBar">
-    <Setter Property="IsVisible" Value="False" />
-    <Setter Property="Ticks" Value="{TemplateBinding Ticks}" />
-  </Style>
+    <Style Selector="^ /template/">
+      <Style Selector="^Thumb.SliderThumbStyle">
+        <Setter Property="Background" Value="{DynamicResource SliderThumbBackground}" />
+      </Style>
+      <Style Selector="^Grid#SliderContainer">
+        <Setter Property="Background" Value="{DynamicResource SliderContainerBackground}" />
+      </Style>
+      <Style Selector="^TickBar">
+        <Setter Property="IsVisible" Value="False" />
+        <Setter Property="Fill" Value="{DynamicResource SliderTickBarFill}" />
+      </Style>
+    </Style>
 
-  <!-- TickBar Placement States -->
+    <!--  TickBar Placement States  -->
 
-  <Style Selector="Slider[TickPlacement=TopLeft] /template/ TickBar#LeftTickBar, Slider[TickPlacement=Outside] /template/ TickBar#LeftTickBar">
-    <Setter Property="IsVisible" Value="True" />
-  </Style>
- 
-  <Style Selector="Slider[TickPlacement=TopLeft] /template/ TickBar#TopTickBar, Slider[TickPlacement=Outside] /template/ TickBar#TopTickBar">
-    <Setter Property="IsVisible" Value="True" />
-  </Style>
- 
-  <Style Selector="Slider[TickPlacement=BottomRight] /template/ TickBar#BottomTickBar, Slider[TickPlacement=Outside] /template/ TickBar#BottomTickBar">
-    <Setter Property="IsVisible" Value="True" />
-  </Style>
- 
-  <Style Selector="Slider[TickPlacement=BottomRight] /template/ TickBar#RightTickBar, Slider[TickPlacement=Outside] /template/ TickBar#RightTickBar">
-    <Setter Property="IsVisible" Value="True" />
-  </Style>
- 
-  <!-- Disabled State -->
+    <Style Selector="^[TickPlacement=TopLeft] /template/ TickBar#LeftTickBar, ^[TickPlacement=Outside] /template/ TickBar#LeftTickBar">
+        <Setter Property="IsVisible" Value="True" />
+    </Style>
 
-  <Style Selector="Slider:disabled /template/ ContentPresenter#HeaderContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource SliderHeaderForegroundDisabled}" />
-  </Style>
-  
-  <Style Selector="Slider:disabled /template/ RepeatButton#PART_DecreaseButton">
-    <Setter Property="Background" Value="{DynamicResource SliderTrackValueFillDisabled}" />
-  </Style>
-  
-  <Style Selector="Slider:disabled /template/ RepeatButton#PART_IncreaseButton">
-    <Setter Property="Background" Value="{DynamicResource SliderTrackFillDisabled}" />
-  </Style>
-  
-  <Style Selector="Slider:disabled /template/ Thumb.SliderThumbStyle">
-    <Setter Property="Background" Value="{DynamicResource SliderThumbBackgroundDisabled}" />
-  </Style>
-  
-  <Style Selector="Slider:disabled /template/ TickBar">
-    <Setter Property="Fill" Value="{DynamicResource SliderTickBarFillDisabled}" />
-  </Style>
-  
-  <Style Selector="Slider:pointerover /template/ Grid#SliderContainer">
-    <Setter Property="Background" Value="{DynamicResource SliderContainerBackgroundDisabled}" />
-  </Style>
+    <Style Selector="^[TickPlacement=TopLeft] /template/ TickBar#TopTickBar, ^[TickPlacement=Outside] /template/ TickBar#TopTickBar">
+        <Setter Property="IsVisible" Value="True" />
+    </Style>
 
-  <!-- PointerOver State -->
-  <Style Selector="Slider:pointerover /template/ RepeatButton#PART_IncreaseButton">
-    <Setter Property="Background" Value="{DynamicResource SliderTrackFillPointerOver}" />
-  </Style>
-  
-  <Style Selector="Slider:pointerover /template/ Thumb.SliderThumbStyle">
-    <Setter Property="Background" Value="{DynamicResource SliderThumbBackgroundPointerOver}" />
-  </Style>
-  
-  <Style Selector="Slider:pointerover /template/ Grid#SliderContainer">
-    <Setter Property="Background" Value="{DynamicResource SliderContainerBackgroundPointerOver}" />
-  </Style>
-  
-  <Style Selector="Slider:pointerover /template/ RepeatButton#PART_DecreaseButton">
-    <Setter Property="Background" Value="{DynamicResource SliderTrackValueFillPointerOver}" />
-  </Style>
+    <Style Selector="^[TickPlacement=BottomRight] /template/ TickBar#BottomTickBar, ^[TickPlacement=Outside] /template/ TickBar#BottomTickBar">
+        <Setter Property="IsVisible" Value="True" />
+    </Style>
 
-  <!-- Pressed State -->
-  <Style Selector="Slider:pressed /template/ RepeatButton#PART_IncreaseButton">
-    <Setter Property="Background" Value="{DynamicResource SliderTrackFillPressed}" />
-  </Style>
+    <Style Selector="^[TickPlacement=BottomRight] /template/ TickBar#RightTickBar, ^[TickPlacement=Outside] /template/ TickBar#RightTickBar">
+        <Setter Property="IsVisible" Value="True" />
+    </Style>
 
-  <Style Selector="Slider:pressed /template/ Thumb.SliderThumbStyle">
-    <Setter Property="Background" Value="{DynamicResource SliderThumbBackgroundPressed}" />
-  </Style>
-  
-  <Style Selector="Slider:pointerover /template/ Grid#SliderContainer">
-    <Setter Property="Background" Value="{DynamicResource SliderContainerBackgroundPressed}" />
-  </Style>
-  
-  <Style Selector="Slider:pointerover /template/ RepeatButton#PART_DecreaseButton">
-    <Setter Property="Background" Value="{DynamicResource SliderTrackValueFillPressed}" />
-  </Style>
-  
-  <Style Selector="Slider:error /template/ Thumb.SliderThumbStyle">
-    <Setter Property="Background" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
-  </Style>
-  
-  <Style Selector="Slider:error">
+    <!--  Disabled State  -->
+
+    <Style Selector="^:disabled /template/">
+      <Style Selector="^ContentPresenter#HeaderContentPresenter">
+        <Setter Property="Foreground" Value="{DynamicResource SliderHeaderForegroundDisabled}" />
+      </Style>
+      <Style Selector="^RepeatButton#PART_DecreaseButton">
+        <Setter Property="Background" Value="{DynamicResource SliderTrackValueFillDisabled}" />
+      </Style>
+
+      <Style Selector="^RepeatButton#PART_IncreaseButton">
+        <Setter Property="Background" Value="{DynamicResource SliderTrackFillDisabled}" />
+      </Style>
+
+      <Style Selector="^Thumb.SliderThumbStyle">
+        <Setter Property="Background" Value="{DynamicResource SliderThumbBackgroundDisabled}" />
+      </Style>
+
+      <Style Selector="^TickBar">
+        <Setter Property="Fill" Value="{DynamicResource SliderTickBarFillDisabled}" />
+      </Style>
+    </Style>
+
+    <!--  PointerOver State  -->
+    <Style Selector="^:pointerover /template/">
+      <Style Selector="^Grid#SliderContainer">
+        <Setter Property="Background" Value="{DynamicResource SliderContainerBackgroundDisabled}" />
+      </Style>
+      <Style Selector="^RepeatButton#PART_IncreaseButton">
+        <Setter Property="Background" Value="{DynamicResource SliderTrackFillPointerOver}" />
+      </Style>
+
+      <Style Selector="^Thumb.SliderThumbStyle">
+          <Setter Property="Background" Value="{DynamicResource SliderThumbBackgroundPointerOver}" />
+      </Style>
+
+      <Style Selector="^Grid#SliderContainer">
+          <Setter Property="Background" Value="{DynamicResource SliderContainerBackgroundPointerOver}" />
+      </Style>
+
+      <Style Selector="^RepeatButton#PART_DecreaseButton">
+          <Setter Property="Background" Value="{DynamicResource SliderTrackValueFillPointerOver}" />
+      </Style>
+    
+    </Style>
+
+    <!--  Pressed State  -->
+    <Style Selector="^:pressed /template/">
+      <Style Selector="^Grid#SliderContainer">
+        <Setter Property="Background" Value="{DynamicResource SliderContainerBackgroundPressed}" />
+      </Style>
+      <Style Selector="^RepeatButton#PART_DecreaseButton">
+        <Setter Property="Background" Value="{DynamicResource SliderTrackValueFillPressed}" />
+      </Style>
+      <Style Selector="^RepeatButton#PART_IncreaseButton">
+        <Setter Property="Background" Value="{DynamicResource SliderTrackFillPressed}" />
+      </Style>
+
+      <Style Selector="^Thumb.SliderThumbStyle">
+        <Setter Property="Background" Value="{DynamicResource SliderThumbBackgroundPressed}" />
+      </Style>
+    </Style>
+
+    <Style Selector="^:error">
       <Setter Property="Foreground" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
-  </Style>
-</Styles>
+      <Style Selector="^/template/ Thumb.SliderThumbStyle">
+        <Setter Property="Background" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
+      </Style>
+    </Style>
+
+  </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml b/src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml
index 91c901f567..fb0460d9a1 100644
--- a/src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml
@@ -2,7 +2,6 @@
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         x:CompileBindings="True"
         xmlns:converters="using:Avalonia.Controls.Converters">
-
   <Design.PreviewWith>
     <Border Padding="60">
       <StackPanel>
diff --git a/src/Avalonia.Themes.Fluent/Controls/SplitView.xaml b/src/Avalonia.Themes.Fluent/Controls/SplitView.xaml
index 55d46e32a1..6b9b94852f 100644
--- a/src/Avalonia.Themes.Fluent/Controls/SplitView.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/SplitView.xaml
@@ -1,4 +1,4 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<Styles xmlns="https://github.com/avaloniaui"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:sys="using:System">
   <Design.PreviewWith>
diff --git a/src/Avalonia.Themes.Fluent/Controls/TabControl.xaml b/src/Avalonia.Themes.Fluent/Controls/TabControl.xaml
index 322f6ce89e..1cc31f8e15 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TabControl.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TabControl.xaml
@@ -1,65 +1,63 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Design.PreviewWith>
-    <Border Width="400">
-      <TabControl>
-        <TabItem Header="Arch">
-          <Border Background="AntiqueWhite"
-                  Height="100">
-            <TextBlock Text="Content" Foreground="Black" FontSize="20"/>
-          </Border>
-        </TabItem>
-        <TabItem Header="Leaf">
-          <Border Background="Green"
-                  Height="100" />
-        </TabItem>
-        <TabItem Header="Disabled"
-                 IsEnabled="False" />
-      </TabControl>
-    </Border>
-  </Design.PreviewWith>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <Design.PreviewWith>
+      <Border Width="400">
+        <TabControl>
+          <TabItem Header="Arch">
+            <Border Background="AntiqueWhite"
+                    Height="100">
+              <TextBlock Text="Content" Foreground="Black" FontSize="20"/>
+            </Border>
+          </TabItem>
+          <TabItem Header="Leaf">
+            <Border Background="Green"
+                    Height="100" />
+          </TabItem>
+          <TabItem Header="Disabled"
+                   IsEnabled="False" />
+        </TabControl>
+      </Border>
+    </Design.PreviewWith>
 
-  <Styles.Resources>
     <Thickness x:Key="TabControlTopPlacementItemMargin">0 0 0 2</Thickness>
-  </Styles.Resources>
-  
-  <Style Selector="TabControl">
-    <Setter Property="Margin" Value="0" />
-    <Setter Property="Padding" Value="{DynamicResource TabItemMargin}" />
-    <Setter Property="Background" Value="{DynamicResource TabControlBackground}" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border BorderBrush="{TemplateBinding BorderBrush}"
-                BorderThickness="{TemplateBinding BorderThickness}"
-                CornerRadius="{TemplateBinding CornerRadius}"
-                Background="{TemplateBinding Background}"
-                HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
-                VerticalAlignment="{TemplateBinding VerticalAlignment}">
-          <DockPanel>
-            <ItemsPresenter Name="PART_ItemsPresenter"
-                            Items="{TemplateBinding Items}"
-                            ItemsPanel="{TemplateBinding ItemsPanel}"
-                            ItemTemplate="{TemplateBinding ItemTemplate}"
-                            DockPanel.Dock="{TemplateBinding TabStripPlacement}"/>
-            <ContentPresenter Name="PART_SelectedContentHost"
-                              Margin="{TemplateBinding Padding}"
-                              HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                              VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                              Content="{TemplateBinding SelectedContent}"
-                              ContentTemplate="{TemplateBinding SelectedContentTemplate}" />
-          </DockPanel>
-        </Border>
-      </ControlTemplate>
-    </Setter>
-  </Style>
 
-  <Style Selector="TabControl[TabStripPlacement=Left] /template/ ItemsPresenter#PART_ItemsPresenter > WrapPanel">
-    <Setter Property="Orientation" Value="Vertical" />
-  </Style>
-  <Style Selector="TabControl[TabStripPlacement=Right] /template/ ItemsPresenter#PART_ItemsPresenter > WrapPanel">
-    <Setter Property="Orientation" Value="Vertical" />
-  </Style>
-  <Style Selector="TabControl[TabStripPlacement=Top] /template/ ItemsPresenter#PART_ItemsPresenter">
-    <Setter Property="Margin" Value="{DynamicResource TabControlTopPlacementItemMargin}" />
-  </Style>
-</Styles>
+    <ControlTheme x:Key="{x:Type TabControl}" TargetType="TabControl">
+      <Setter Property="Margin" Value="0" />
+      <Setter Property="Padding" Value="{DynamicResource TabItemMargin}" />
+      <Setter Property="Background" Value="{DynamicResource TabControlBackground}" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Border BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
+                  CornerRadius="{TemplateBinding CornerRadius}"
+                  Background="{TemplateBinding Background}"
+                  HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
+                  VerticalAlignment="{TemplateBinding VerticalAlignment}">
+            <DockPanel>
+              <ItemsPresenter Name="PART_ItemsPresenter"
+                              Items="{TemplateBinding Items}"
+                              ItemsPanel="{TemplateBinding ItemsPanel}"
+                              ItemTemplate="{TemplateBinding ItemTemplate}"
+                              DockPanel.Dock="{TemplateBinding TabStripPlacement}" />
+              <ContentPresenter Name="PART_SelectedContentHost"
+                                Margin="{TemplateBinding Padding}"
+                                HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                                Content="{TemplateBinding SelectedContent}"
+                                ContentTemplate="{TemplateBinding SelectedContentTemplate}" />
+            </DockPanel>
+          </Border>
+        </ControlTemplate>
+      </Setter>
+
+      <Style Selector="^[TabStripPlacement=Left] /template/ ItemsPresenter#PART_ItemsPresenter > WrapPanel">
+        <Setter Property="Orientation" Value="Vertical" />
+      </Style>
+      <Style Selector="^[TabStripPlacement=Right] /template/ ItemsPresenter#PART_ItemsPresenter > WrapPanel">
+        <Setter Property="Orientation" Value="Vertical" />
+      </Style>
+      <Style Selector="^[TabStripPlacement=Top] /template/ ItemsPresenter#PART_ItemsPresenter">
+        <Setter Property="Margin" Value="{DynamicResource TabControlTopPlacementItemMargin}" />
+      </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/TabItem.xaml b/src/Avalonia.Themes.Fluent/Controls/TabItem.xaml
index ebe6f82917..110ffc2f48 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TabItem.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TabItem.xaml
@@ -1,132 +1,133 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        x:CompileBindings="True">
-  <Design.PreviewWith>
-    <Border Padding="20">
-      <StackPanel Spacing="20">
-        <TabItem Header="Leaf" />
-        <TabItem Header="Arch" IsSelected="True" />
-      </StackPanel>
-    </Border>
-  </Design.PreviewWith>
-  <Styles.Resources>
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
+     <Design.PreviewWith>
+      <Border Padding="20">
+        <StackPanel Spacing="20">
+          <TabItem Header="Leaf" />
+          <TabItem Header="Arch" IsSelected="True" />
+        </StackPanel>
+      </Border>
+    </Design.PreviewWith>
+  
     <x:Double x:Key="TabItemMinHeight">48</x:Double>
     <x:Double x:Key="TabItemVerticalPipeHeight">24</x:Double>
     <x:Double x:Key="TabItemPipeThickness">2</x:Double>
-  </Styles.Resources>
 
-  <Style Selector="TabItem">
-    <Setter Property="FontSize" Value="{DynamicResource TabItemHeaderFontSize}" />
-    <Setter Property="FontWeight" Value="{DynamicResource TabItemHeaderThemeFontWeight}" />
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselected}" />
-    <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselected}" />
-    <Setter Property="Padding" Value="{DynamicResource TabItemHeaderMargin}" />
-    <Setter Property="Margin" Value="0" />
-    <Setter Property="MinHeight" Value="{DynamicResource TabItemMinHeight}" />
-    <Setter Property="VerticalContentAlignment" Value="Center" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border Name="PART_LayoutRoot"
-                BorderBrush="{TemplateBinding BorderBrush}"
-                BorderThickness="{TemplateBinding BorderThickness}"
-                CornerRadius="{TemplateBinding CornerRadius}"
-                Padding="{TemplateBinding Padding}">
-          <Panel>
-            <ContentPresenter Name="PART_ContentPresenter"
-                              ContentTemplate="{TemplateBinding HeaderTemplate}"
-                              Content="{TemplateBinding Header}"
-                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                              FontFamily="{TemplateBinding FontFamily}"
-                              FontSize="{TemplateBinding FontSize}"
-                              FontWeight="{TemplateBinding FontWeight}" />
-            <Border Name="PART_SelectedPipe"
-                    Background="{DynamicResource TabItemHeaderSelectedPipeFill}" />
-          </Panel>
-        </Border>
-      </ControlTemplate>
-    </Setter>
-  </Style>
+    <ControlTheme x:Key="{x:Type TabItem}" TargetType="TabItem">
+        <Setter Property="FontSize" Value="{DynamicResource TabItemHeaderFontSize}" />
+        <Setter Property="FontWeight" Value="{DynamicResource TabItemHeaderThemeFontWeight}" />
+        <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselected}" />
+        <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselected}" />
+        <Setter Property="Padding" Value="{DynamicResource TabItemHeaderMargin}" />
+        <Setter Property="Margin" Value="0" />
+        <Setter Property="MinHeight" Value="{DynamicResource TabItemMinHeight}" />
+        <Setter Property="VerticalContentAlignment" Value="Center" />
+        <Setter Property="Template">
+            <ControlTemplate>
+                <Border
+                    Name="PART_LayoutRoot"
+                    Padding="{TemplateBinding Padding}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    CornerRadius="{TemplateBinding CornerRadius}">
+                    <Panel>
+                        <ContentPresenter
+                            Name="PART_ContentPresenter"
+                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                            Content="{TemplateBinding Header}"
+                            ContentTemplate="{TemplateBinding HeaderTemplate}"
+                            FontFamily="{TemplateBinding FontFamily}"
+                            FontSize="{TemplateBinding FontSize}"
+                            FontWeight="{TemplateBinding FontWeight}" />
+                        <Border Name="PART_SelectedPipe" Background="{DynamicResource TabItemHeaderSelectedPipeFill}" />
+                    </Panel>
+                </Border>
+            </ControlTemplate>
+        </Setter>
 
-  <!-- Nornal state -->
-  <Style Selector="TabItem /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{Binding $parent[TabItem].Background}" />
-  </Style>
-  <Style Selector="TabItem /template/ Border#PART_SelectedPipe">
-    <Setter Property="IsVisible" Value="False" />
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-  </Style>
+        <!--  Nornal state  -->
+        <Style Selector="^ /template/ Border#PART_LayoutRoot">
+            <Setter Property="Background" Value="{Binding $parent[TabItem].Background}" />
+        </Style>
+        <Style Selector="^ /template/ Border#PART_SelectedPipe">
+            <Setter Property="IsVisible" Value="False" />
+            <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+        </Style>
 
-  <!-- Selected state -->
-  <!--  We don't use selector to PART_LayoutRoot, so developer can override selected item background with TabStripItem.Background  -->
-  <Style Selector="TabItem:selected">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelected}" />
-    <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundSelected}" />
-  </Style>
-  <Style Selector="TabItem:selected /template/ Border#PART_SelectedPipe">
-    <Setter Property="IsVisible" Value="True" />
-  </Style>
+        <!--  Selected state  -->
+        <!--  We don't use selector to PART_LayoutRoot, so developer can override selected item background with TabStripItem.Background  -->
+        <Style Selector="^:selected">
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelected}" />
+            <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundSelected}" />
+        </Style>
+        <Style Selector="^:selected /template/ Border#PART_SelectedPipe">
+            <Setter Property="IsVisible" Value="True" />
+        </Style>
 
-  <!-- PointerOver state -->
-  <Style Selector="TabItem:pointerover /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPointerOver}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPointerOver}" />
-  </Style>
+        <!--  PointerOver state  -->
+        <Style Selector="^:pointerover /template/ Border#PART_LayoutRoot">
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPointerOver}" />
+            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPointerOver}" />
+        </Style>
 
-  <!-- Selected PointerOver state -->
-  <Style Selector="TabItem:selected:pointerover /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPointerOver}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPointerOver}" />
-  </Style>
+        <!--  Selected PointerOver state  -->
+        <Style Selector="^:selected:pointerover /template/ Border#PART_LayoutRoot">
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPointerOver}" />
+            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPointerOver}" />
+        </Style>
 
-  <!-- Pressed state -->
-  <Style Selector="TabItem:pressed /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPressed}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPressed}" />
-  </Style>
+        <!--  Pressed state  -->
+        <Style Selector="^:pressed /template/ Border#PART_LayoutRoot">
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPressed}" />
+            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPressed}" />
+        </Style>
 
-  <!-- Selected Pressed state -->
-  <Style Selector="TabItem:selected:pressed /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPressed}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPressed}" />
-  </Style>
+        <!--  Selected Pressed state  -->
+        <Style Selector="^:selected:pressed /template/ Border#PART_LayoutRoot">
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPressed}" />
+            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPressed}" />
+        </Style>
 
-  <!-- Disabled state -->
-  <Style Selector="TabItem:disabled /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundDisabled}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundDisabled}" />
-  </Style>
+        <!--  Disabled state  -->
+        <Style Selector="^:disabled /template/ Border#PART_LayoutRoot">
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundDisabled}" />
+            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundDisabled}" />
+        </Style>
 
-  <!-- TabStripPlacement States Group -->
-  <Style Selector="TabItem[TabStripPlacement=Left] /template/ Border#PART_SelectedPipe">
-    <Setter Property="Width" Value="{DynamicResource TabItemPipeThickness}" />
-    <Setter Property="Height" Value="{DynamicResource TabItemVerticalPipeHeight}" />
-    <Setter Property="Margin" Value="0,0,2,0" />
-    <Setter Property="HorizontalAlignment" Value="Left" />
-    <Setter Property="VerticalAlignment" Value="Center" />
-  </Style>
-  <Style Selector="TabItem[TabStripPlacement=Left] /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Margin" Value="8,0,0,0" />
-  </Style>
+        <!--  TabStripPlacement States Group  -->
+        <Style Selector="^[TabStripPlacement=Left] /template/ Border#PART_SelectedPipe">
+            <Setter Property="Width" Value="{DynamicResource TabItemPipeThickness}" />
+            <Setter Property="Height" Value="{DynamicResource TabItemVerticalPipeHeight}" />
+            <Setter Property="Margin" Value="0,0,2,0" />
+            <Setter Property="HorizontalAlignment" Value="Left" />
+            <Setter Property="VerticalAlignment" Value="Center" />
+        </Style>
+        <Style Selector="^[TabStripPlacement=Left] /template/ ContentPresenter#PART_ContentPresenter">
+            <Setter Property="Margin" Value="8,0,0,0" />
+        </Style>
 
-  <Style Selector="TabItem[TabStripPlacement=Top] /template/ Border#PART_SelectedPipe, TabItem[TabStripPlacement=Bottom] /template/ Border#PART_SelectedPipe">
-    <Setter Property="Height" Value="{DynamicResource TabItemPipeThickness}" />
-    <Setter Property="Margin" Value="0,0,0,2" />
-    <Setter Property="HorizontalAlignment" Value="Stretch" />
-    <Setter Property="VerticalAlignment" Value="Bottom" />
-  </Style>
+        <Style Selector="^[TabStripPlacement=Top] /template/ Border#PART_SelectedPipe, ^[TabStripPlacement=Bottom] /template/ Border#PART_SelectedPipe">
+            <Setter Property="Height" Value="{DynamicResource TabItemPipeThickness}" />
+            <Setter Property="Margin" Value="0,0,0,2" />
+            <Setter Property="HorizontalAlignment" Value="Stretch" />
+            <Setter Property="VerticalAlignment" Value="Bottom" />
+        </Style>
 
-  <Style Selector="TabItem[TabStripPlacement=Right] /template/ Border#PART_SelectedPipe">
-    <Setter Property="Width" Value="{DynamicResource TabItemPipeThickness}" />
-    <Setter Property="Height" Value="{DynamicResource TabItemVerticalPipeHeight}" />
-    <Setter Property="Margin" Value="2,0,0,0" />
-    <Setter Property="HorizontalAlignment" Value="Right" />
-    <Setter Property="VerticalAlignment" Value="Center" />
-  </Style>
-  <Style Selector="TabItem[TabStripPlacement=Right] /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Margin" Value="0,0,8,0" />
-  </Style>
-  <Style Selector="TabItem[TabStripPlacement=Right]">
-    <Setter Property="HorizontalContentAlignment" Value="Right" />
-  </Style>
-</Styles>
+        <Style Selector="^[TabStripPlacement=Right] /template/ Border#PART_SelectedPipe">
+            <Setter Property="Width" Value="{DynamicResource TabItemPipeThickness}" />
+            <Setter Property="Height" Value="{DynamicResource TabItemVerticalPipeHeight}" />
+            <Setter Property="Margin" Value="2,0,0,0" />
+            <Setter Property="HorizontalAlignment" Value="Right" />
+            <Setter Property="VerticalAlignment" Value="Center" />
+        </Style>
+        <Style Selector="^[TabStripPlacement=Right] /template/ ContentPresenter#PART_ContentPresenter">
+            <Setter Property="Margin" Value="0,0,8,0" />
+        </Style>
+        <Style Selector="^[TabStripPlacement=Right]">
+            <Setter Property="HorizontalContentAlignment" Value="Right" />
+        </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/TabStrip.xaml b/src/Avalonia.Themes.Fluent/Controls/TabStrip.xaml
index 681ac48850..15c3ba2f37 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TabStrip.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TabStrip.xaml
@@ -1,32 +1,34 @@
-<Styles xmlns="https://github.com/avaloniaui">
-  <Design.PreviewWith>
-    <Border Padding="20">
-      <TabStrip>
-        <TabStripItem>Item 1</TabStripItem>
-        <TabStripItem>Item 2</TabStripItem>
-        <TabStripItem IsEnabled="False">Disabled</TabStripItem>
-      </TabStrip>
-    </Border>
-  </Design.PreviewWith>
-  <Style Selector="TabStrip">
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border Background="{TemplateBinding Background}"
-                BorderBrush="{TemplateBinding BorderBrush}"
-                BorderThickness="{TemplateBinding BorderThickness}"
-                CornerRadius="{TemplateBinding CornerRadius}"
-                Padding="{TemplateBinding Padding}">
-          <ItemsPresenter Name="PART_ItemsPresenter"
-                          Items="{TemplateBinding Items}"
-                          ItemsPanel="{TemplateBinding ItemsPanel}"
-                          ItemTemplate="{TemplateBinding ItemTemplate}" />
-        </Border>
-      </ControlTemplate>
-    </Setter>
-    <Setter Property="ItemsPanel">
-      <ItemsPanelTemplate>
-        <WrapPanel />
-      </ItemsPanelTemplate>
-    </Setter>
-  </Style>
-</Styles>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <Design.PreviewWith>
+      <Border Padding="20">
+        <TabStrip>
+          <TabStripItem>Item 1</TabStripItem>
+          <TabStripItem>Item 2</TabStripItem>
+          <TabStripItem IsEnabled="False">Disabled</TabStripItem>
+        </TabStrip>
+      </Border>
+    </Design.PreviewWith>
+  
+    <ControlTheme x:Key="{x:Type TabStrip}" TargetType="TabStrip">
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Border Background="{TemplateBinding Background}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
+                  CornerRadius="{TemplateBinding CornerRadius}"
+                  Padding="{TemplateBinding Padding}">
+            <ItemsPresenter Name="PART_ItemsPresenter"
+                            Items="{TemplateBinding Items}"
+                            ItemsPanel="{TemplateBinding ItemsPanel}"
+                            ItemTemplate="{TemplateBinding ItemTemplate}" />
+          </Border>
+        </ControlTemplate>
+      </Setter>
+      <Setter Property="ItemsPanel">
+        <ItemsPanelTemplate>
+          <WrapPanel />
+        </ItemsPanelTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/TabStripItem.xaml b/src/Avalonia.Themes.Fluent/Controls/TabStripItem.xaml
index 59f68a1547..5ccd430d33 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TabStripItem.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TabStripItem.xaml
@@ -1,107 +1,108 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        x:CompileBindings="True">
-  <Design.PreviewWith>
-    <Border Padding="20">
-      <StackPanel Spacing="20">
-        <TabStripItem>Leaf</TabStripItem>
-        <TabStripItem IsSelected="True">Arch</TabStripItem>
-      </StackPanel>
-    </Border>
-  </Design.PreviewWith>
-  <Styles.Resources>
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
+     <Design.PreviewWith>
+      <Border Padding="20">
+        <StackPanel Spacing="20">
+          <TabStripItem>Leaf</TabStripItem>
+          <TabStripItem IsSelected="True">Arch</TabStripItem>
+        </StackPanel>
+      </Border>
+    </Design.PreviewWith>
+  
     <x:Double x:Key="TabStripItemMinHeight">48</x:Double>
     <x:Double x:Key="TabStripItemPipeThickness">2</x:Double>
-  </Styles.Resources>
 
-  <Style Selector="TabStripItem">
-    <Setter Property="FontSize" Value="{DynamicResource TabItemHeaderFontSize}" />
-    <Setter Property="FontWeight" Value="{DynamicResource TabItemHeaderThemeFontWeight}" />
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselected}" />
-    <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselected}" />
-    <Setter Property="Padding" Value="{DynamicResource TabItemHeaderMargin}" />
-    <Setter Property="Margin" Value="0" />
-    <Setter Property="MinHeight" Value="{DynamicResource TabStripItemMinHeight}" />
-    <Setter Property="VerticalContentAlignment" Value="Center" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border Name="PART_LayoutRoot"
-                BorderBrush="{TemplateBinding BorderBrush}"
-                BorderThickness="{TemplateBinding BorderThickness}"
-                CornerRadius="{TemplateBinding CornerRadius}"
-                Padding="{TemplateBinding Padding}">
-          <Panel>
-            <ContentPresenter Name="PART_ContentPresenter"
-                              ContentTemplate="{TemplateBinding ContentTemplate}"
-                              Content="{TemplateBinding Content}"
-                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                              FontFamily="{TemplateBinding FontFamily}"
-                              FontSize="{TemplateBinding FontSize}"
-                              FontWeight="{TemplateBinding FontWeight}" />
-            <Border Name="PART_SelectedPipe"
-                    Background="{DynamicResource TabItemHeaderSelectedPipeFill}" />
-          </Panel>
-        </Border>
-      </ControlTemplate>
-    </Setter>
-  </Style>
+    <ControlTheme x:Key="{x:Type TabStripItem}" TargetType="TabStripItem">
+        <Setter Property="FontSize" Value="{DynamicResource TabItemHeaderFontSize}" />
+        <Setter Property="FontWeight" Value="{DynamicResource TabItemHeaderThemeFontWeight}" />
+        <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselected}" />
+        <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselected}" />
+        <Setter Property="Padding" Value="{DynamicResource TabItemHeaderMargin}" />
+        <Setter Property="Margin" Value="0" />
+        <Setter Property="MinHeight" Value="{DynamicResource TabStripItemMinHeight}" />
+        <Setter Property="VerticalContentAlignment" Value="Center" />
+        <Setter Property="Template">
+            <ControlTemplate>
+                <Border
+                    Name="PART_LayoutRoot"
+                    Padding="{TemplateBinding Padding}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    CornerRadius="{TemplateBinding CornerRadius}">
+                    <Panel>
+                        <ContentPresenter
+                            Name="PART_ContentPresenter"
+                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                            Content="{TemplateBinding Content}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
+                            FontFamily="{TemplateBinding FontFamily}"
+                            FontSize="{TemplateBinding FontSize}"
+                            FontWeight="{TemplateBinding FontWeight}" />
+                        <Border Name="PART_SelectedPipe" Background="{DynamicResource TabItemHeaderSelectedPipeFill}" />
+                    </Panel>
+                </Border>
+            </ControlTemplate>
+        </Setter>
 
-  <Style Selector="TabStripItem /template/ Border#PART_SelectedPipe">
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-  </Style>
+        <Style Selector="^ /template/ Border#PART_SelectedPipe">
+            <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+        </Style>
 
-  <!--  Nornal state  -->
-  <Style Selector="TabStripItem /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{Binding $parent[TabStripItem].Background}" />
-  </Style>
-  <Style Selector="TabStripItem /template/ Border#PART_SelectedPipe">
-    <Setter Property="IsVisible" Value="False" />
-  </Style>
-  <Style Selector="TabStripItem /template/ Border#PART_SelectedPipe, TabItem[TabStripPlacement=Bottom] /template/ Border#PART_SelectedPipe">
-    <Setter Property="Height" Value="{DynamicResource TabStripItemPipeThickness}" />
-    <Setter Property="Margin" Value="0,0,0,2" />
-    <Setter Property="HorizontalAlignment" Value="Stretch" />
-    <Setter Property="VerticalAlignment" Value="Bottom" />
-  </Style>
+        <!--  Nornal state  -->
+        <Style Selector="^ /template/ Border#PART_LayoutRoot">
+            <Setter Property="Background" Value="{Binding $parent[TabStripItem].Background}" />
+        </Style>
+        <Style Selector="^ /template/ Border#PART_SelectedPipe">
+            <Setter Property="IsVisible" Value="False" />
+        </Style>
+        <Style Selector="^ /template/ Border#PART_SelectedPipe">
+            <Setter Property="Height" Value="{DynamicResource TabStripItemPipeThickness}" />
+            <Setter Property="Margin" Value="0,0,0,2" />
+            <Setter Property="HorizontalAlignment" Value="Stretch" />
+            <Setter Property="VerticalAlignment" Value="Bottom" />
+        </Style>
 
-  <!--  Selected state  -->
-  <!--  We don't use selector to PART_LayoutRoot, so developer can override selected item background with TabStripItem.Background  -->
-  <Style Selector="TabStripItem:selected">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelected}" />
-    <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundSelected}" />
-  </Style>
-  <Style Selector="TabStripItem:selected /template/ Border#PART_SelectedPipe">
-    <Setter Property="IsVisible" Value="True" />
-  </Style>
+        <!--  Selected state  -->
+        <!--  We don't use selector to PART_LayoutRoot, so developer can override selected item background with TabStripItem.Background  -->
+        <Style Selector="^:selected">
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelected}" />
+            <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundSelected}" />
+        </Style>
+        <Style Selector="^:selected /template/ Border#PART_SelectedPipe">
+            <Setter Property="IsVisible" Value="True" />
+        </Style>
 
-  <!--  PointerOver state  -->
-  <Style Selector="TabStripItem:pointerover /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPointerOver}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPointerOver}" />
-  </Style>
+        <!--  PointerOver state  -->
+        <Style Selector="^:pointerover /template/ Border#PART_LayoutRoot">
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPointerOver}" />
+            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPointerOver}" />
+        </Style>
 
-  <!--  Selected PointerOver state  -->
-  <Style Selector="TabStripItem:selected:pointerover /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPointerOver}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPointerOver}" />
-  </Style>
+        <!--  Selected PointerOver state  -->
+        <Style Selector="^:selected:pointerover /template/ Border#PART_LayoutRoot">
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPointerOver}" />
+            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPointerOver}" />
+        </Style>
 
-  <!--  Pressed state  -->
-  <Style Selector="TabStripItem:pressed /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPressed}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPressed}" />
-  </Style>
+        <!--  Pressed state  -->
+        <Style Selector="^:pressed /template/ Border#PART_LayoutRoot">
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPressed}" />
+            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPressed}" />
+        </Style>
 
-  <!--  Selected Pressed state  -->
-  <Style Selector="TabStripItem:selected:pressed /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPressed}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPressed}" />
-  </Style>
+        <!--  Selected Pressed state  -->
+        <Style Selector="^:selected:pressed /template/ Border#PART_LayoutRoot">
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPressed}" />
+            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPressed}" />
+        </Style>
 
-  <!--  Disabled state  -->
-  <Style Selector="TabStripItem:disabled /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundDisabled}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundDisabled}" />
-  </Style>
-</Styles>
+        <!--  Disabled state  -->
+        <Style Selector="^:disabled /template/ Border#PART_LayoutRoot">
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundDisabled}" />
+            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundDisabled}" />
+        </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/TextBox.xaml b/src/Avalonia.Themes.Fluent/Controls/TextBox.xaml
index 40d9b11f7c..0fd3758d77 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TextBox.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TextBox.xaml
@@ -1,4 +1,4 @@
-<Styles xmlns="https://github.com/avaloniaui" 
+<Styles xmlns="https://github.com/avaloniaui"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         x:CompileBindings="True">
   <Design.PreviewWith>
@@ -10,7 +10,7 @@
                TextAlignment="Center"/>
     </Border>
   </Design.PreviewWith>
-  
+
   <Styles.Resources>
     <Thickness x:Key="TextBoxTopHeaderMargin">0,0,0,4</Thickness>
     <StreamGeometry x:Key="TextBoxClearButtonData">M 11.416016,10 20,1.4160156 18.583984,0 10,8.5839846 1.4160156,0 0,1.4160156 8.5839844,10 0,18.583985 1.4160156,20 10,11.416015 18.583984,20 20,18.583985 Z</StreamGeometry>
@@ -36,7 +36,7 @@
     <Setter Property="CaretBrush" Value="{DynamicResource TextControlForeground}" />
     <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrush}" />
     <Setter Property="SelectionBrush" Value="{DynamicResource TextControlSelectionHighlightColor}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThickness}" />    
+    <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThickness}" />
     <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
     <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
     <Setter Property="MinHeight" Value="{DynamicResource TextControlThemeMinHeight}" />
@@ -73,32 +73,32 @@
                                 VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}"
                                 IsScrollChainingEnabled="{TemplateBinding (ScrollViewer.IsScrollChainingEnabled)}"
                                 AllowAutoHide="{TemplateBinding (ScrollViewer.AllowAutoHide)}">
-                      <Panel>
-                        <TextBlock Name="PART_Watermark"
-                                Opacity="0.5"
-                                Text="{TemplateBinding Watermark}"
-                                TextAlignment="{TemplateBinding TextAlignment}"
-                                TextWrapping="{TemplateBinding TextWrapping}"
-                                IsVisible="{TemplateBinding Text, Converter={x:Static StringConverters.IsNullOrEmpty}}"
-                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
-                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
-                        <TextPresenter Name="PART_TextPresenter"
-                                      Text="{TemplateBinding Text, Mode=TwoWay}"
-                                      CaretIndex="{TemplateBinding CaretIndex}"
-                                      SelectionStart="{TemplateBinding SelectionStart}"
-                                      SelectionEnd="{TemplateBinding SelectionEnd}"
-                                      TextAlignment="{TemplateBinding TextAlignment}"
-                                      TextWrapping="{TemplateBinding TextWrapping}"
-                                      LineHeight="{TemplateBinding LineHeight}"
-                                      PasswordChar="{TemplateBinding PasswordChar}"
-                                      RevealPassword="{TemplateBinding RevealPassword}"
-                                      SelectionBrush="{TemplateBinding SelectionBrush}"
-                                      SelectionForegroundBrush="{TemplateBinding SelectionForegroundBrush}"
-                                      CaretBrush="{TemplateBinding CaretBrush}"
-                                      HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
-                                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
-                      </Panel>
-                    </ScrollViewer>
+                    <Panel>
+                      <TextBlock Name="PART_Watermark"
+                              Opacity="0.5"
+                              Text="{TemplateBinding Watermark}"
+                              TextAlignment="{TemplateBinding TextAlignment}"
+                              TextWrapping="{TemplateBinding TextWrapping}"
+                              IsVisible="{TemplateBinding Text, Converter={x:Static StringConverters.IsNullOrEmpty}}"
+                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
+                      <TextPresenter Name="PART_TextPresenter"
+                                    Text="{TemplateBinding Text, Mode=TwoWay}"
+                                    CaretIndex="{TemplateBinding CaretIndex}"
+                                    SelectionStart="{TemplateBinding SelectionStart}"
+                                    SelectionEnd="{TemplateBinding SelectionEnd}"
+                                    TextAlignment="{TemplateBinding TextAlignment}"
+                                    TextWrapping="{TemplateBinding TextWrapping}"
+                                    LineHeight="{TemplateBinding LineHeight}"
+                                    PasswordChar="{TemplateBinding PasswordChar}"
+                                    RevealPassword="{TemplateBinding RevealPassword}"
+                                    SelectionBrush="{TemplateBinding SelectionBrush}"
+                                    SelectionForegroundBrush="{TemplateBinding SelectionForegroundBrush}"
+                                    CaretBrush="{TemplateBinding CaretBrush}"
+                                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
+                    </Panel>
+                  </ScrollViewer>
                 </DockPanel>
                 <ContentPresenter Grid.Column="2" Grid.ColumnSpan="1" Content="{TemplateBinding InnerRightContent}"/>
               </Grid>
@@ -159,7 +159,7 @@
   <Style Selector="TextBox /template/ DockPanel#PART_InnerDockPanel">
     <Setter Property="Cursor" Value="IBeam" />
   </Style>
-  
+
   <Style Selector="TextBox /template/ TextBlock#PART_FloatingWatermark">
     <Setter Property="IsVisible" Value="False" />
   </Style>
@@ -237,7 +237,7 @@
     <Setter Property="MinWidth" Value="34" />
     <Setter Property="Width" Value="{Binding $self.Bounds.Height}"/>
     <Setter Property="Focusable" Value="False" />
-    <Setter Property="VerticalAlignment" Value="Stretch" />    
+    <Setter Property="VerticalAlignment" Value="Stretch" />
   </Style>
   <Style Selector="Button.textBoxClearButton /template/ Border#PART_ButtonLayoutBorder,
                    ToggleButton.passwordBoxRevealButton /template/ Border#PART_ButtonLayoutBorder">
diff --git a/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml b/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml
index e03dc76f16..69b2d32dda 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml
@@ -1,14 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?>
 <!--
 // (c) Copyright Microsoft Corporation.
 // This source is subject to the Microsoft Public License (Ms-PL).
 // Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
 // All other rights reserved.
 -->
-
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        xmlns:sys="clr-namespace:System;assembly=netstandard"
-        x:CompileBindings="True">
+<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:sys="clr-namespace:System;assembly=netstandard" x:CompileBindings="True">
   <Styles.Resources>
     <x:Double x:Key="TimePickerFlyoutPresenterItemHeight">40</x:Double>
     <x:Double x:Key="TimePickerSpacerThemeWidth">1</x:Double>
@@ -20,273 +17,147 @@
     <x:Double x:Key="TimePickerThemeMaxWidth">456</x:Double>
     <Thickness x:Key="TimePickerFlyoutPresenterItemPadding">0,3,0,6</Thickness>
     <Thickness x:Key="TimePickerHostPadding">0,3,0,6</Thickness>
-  </Styles.Resources>
-
-  <Style Selector="ListBoxItem.DateTimePickerItem.HourItem">
-    <Setter Property="Padding" Value="{DynamicResource TimePickerFlyoutPresenterItemPadding}" />
-  </Style>
-  <Style Selector="ListBoxItem.DateTimePickerItem.MinuteItem">
-    <Setter Property="Padding" Value="{DynamicResource TimePickerFlyoutPresenterItemPadding}" />
-  </Style>
-  <Style Selector="ListBoxItem.DateTimePickerItem.TimePeriodItem">
-    <Setter Property="Padding" Value="{DynamicResource TimePickerFlyoutPresenterItemPadding}" />
-  </Style>
-
-  <Style Selector="TimePicker">    
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-    <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForeground}" />
-    <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackground}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrush}"/>
-    <Setter Property="BorderThickness" Value="{DynamicResource TimePickerBorderThemeThickness}"/>
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="HorizontalAlignment" Value="Left" />
-    <Setter Property="VerticalAlignment" Value="Center" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <DataValidationErrors>
-          <Grid Name="LayoutRoot" Margin="{TemplateBinding Padding}" RowDefinitions="Auto,*">
-            <ContentPresenter x:Name="HeaderContentPresenter"
-                   Grid.Row="0"
-                   Content="{TemplateBinding Header}"
-                   ContentTemplate="{TemplateBinding HeaderTemplate}"
-                   Margin="{DynamicResource TimePickerTopHeaderMargin}"
-                   MaxWidth="{DynamicResource TimePickerThemeMaxWidth}"
-                   Foreground="{DynamicResource TimePickerHeaderForeground}"
-                   HorizontalAlignment="Stretch"
-                   VerticalAlignment="Top" />
-
-            <Button x:Name="FlyoutButton"
-                    Grid.Row="1"
-                    Foreground="{TemplateBinding Foreground}"
-                    Background="{TemplateBinding Background}"
-                    BorderBrush="{TemplateBinding BorderBrush}"
-                    BorderThickness="{TemplateBinding BorderThickness}"
-                    CornerRadius="{TemplateBinding CornerRadius}"
-                    IsEnabled="{TemplateBinding IsEnabled}"
-                    MinWidth="{DynamicResource TimePickerThemeMinWidth}"
-                    MaxWidth="{DynamicResource TimePickerThemeMaxWidth}"
-                    HorizontalAlignment="Stretch"
-                    HorizontalContentAlignment="Stretch"
-                    VerticalAlignment="Top"
-                    VerticalContentAlignment="Stretch">
-              <Button.Template>
-                <ControlTemplate>
-                  <ContentPresenter Name="ContentPresenter"
-                                  BorderBrush="{TemplateBinding BorderBrush}"
-                                  Background="{TemplateBinding Background}"
-                                  BorderThickness="{TemplateBinding BorderThickness}"
-                                  CornerRadius="{TemplateBinding CornerRadius}"
-                                  Content="{TemplateBinding Content}"
-                                  Foreground="{TemplateBinding Foreground}"
-                                  HorizontalContentAlignment="Stretch"
-                                  VerticalContentAlignment="Stretch" />
-                </ControlTemplate>
-              </Button.Template>
-
-              <Grid Name="FlyoutButtonContentGrid">
+    <ControlTheme x:Key="FluentTimePicker" TargetType="TimePicker">
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForeground}" />
+      <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackground}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrush}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource TimePickerBorderThemeThickness}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="HorizontalAlignment" Value="Left" />
+      <Setter Property="VerticalAlignment" Value="Center" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <DataValidationErrors>
+            <Grid Name="LayoutRoot" Margin="{TemplateBinding Padding}" RowDefinitions="Auto,*">
+              <ContentPresenter x:Name="HeaderContentPresenter" Grid.Row="0" Content="{TemplateBinding Header}" ContentTemplate="{TemplateBinding HeaderTemplate}" Margin="{DynamicResource TimePickerTopHeaderMargin}" MaxWidth="{DynamicResource TimePickerThemeMaxWidth}" Foreground="{DynamicResource TimePickerHeaderForeground}" HorizontalAlignment="Stretch" VerticalAlignment="Top" />
+              <Button x:Name="FlyoutButton" Grid.Row="1" Foreground="{TemplateBinding Foreground}" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}" IsEnabled="{TemplateBinding IsEnabled}" MinWidth="{DynamicResource TimePickerThemeMinWidth}" MaxWidth="{DynamicResource TimePickerThemeMaxWidth}" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" VerticalAlignment="Top" VerticalContentAlignment="Stretch">
+                <Button.Template>
+                  <ControlTemplate>
+                    <ContentPresenter Name="ContentPresenter" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" />
+                  </ControlTemplate>
+                </Button.Template>
+                <Grid Name="FlyoutButtonContentGrid">
+                  <!--Ignore col defs here, set in code-->
+                  <Border x:Name="FirstPickerHost" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                    <TextBlock x:Name="HourTextBlock" HorizontalAlignment="Center" Padding="{DynamicResource TimePickerHostPadding}" FontFamily="{TemplateBinding FontFamily}" FontWeight="{TemplateBinding FontWeight}" FontSize="{TemplateBinding FontSize}" />
+                  </Border>
+                  <Rectangle Name="FirstColumnDivider" Fill="{DynamicResource TimePickerSpacerFill}" HorizontalAlignment="Center" Width="{DynamicResource TimePickerSpacerThemeWidth}" Grid.Column="1" />
+                  <Border x:Name="SecondPickerHost" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                    <TextBlock x:Name="MinuteTextBlock" HorizontalAlignment="Center" Padding="{DynamicResource TimePickerHostPadding}" FontFamily="{TemplateBinding FontFamily}" FontWeight="{TemplateBinding FontWeight}" FontSize="{TemplateBinding FontSize}" />
+                  </Border>
+                  <Rectangle Name="SecondColumnDivider" Fill="{DynamicResource TimePickerSpacerFill}" HorizontalAlignment="Center" Width="{DynamicResource TimePickerSpacerThemeWidth}" Grid.Column="3" />
+                  <Border x:Name="ThirdPickerHost" Grid.Column="4" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                    <TextBlock x:Name="PeriodTextBlock" HorizontalAlignment="Center" Padding="{DynamicResource TimePickerHostPadding}" FontFamily="{TemplateBinding FontFamily}" FontWeight="{TemplateBinding FontWeight}" FontSize="{TemplateBinding FontSize}" />
+                  </Border>
+                </Grid>
+              </Button>
+              <Popup Name="Popup" WindowManagerAddShadowHint="False" IsLightDismissEnabled="True" PlacementTarget="{TemplateBinding}" PlacementMode="Bottom">
+                <TimePickerPresenter Name="PickerPresenter" />
+              </Popup>
+            </Grid>
+          </DataValidationErrors>
+        </ControlTemplate>
+      </Setter>
+      <Style Selector="^:hasnotime /template/ Button#FlyoutButton TextBlock">
+        <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForeground}" />
+      </Style>
+      <!--<Style Selector="^:error /template/ Button#FlyoutButton /template/ ContentPresenter">
+        <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
+      </Style>
+      <Style Selector="^ /template/ Button">
+        <Style Selector="^#FlyoutButton:pointerover /template/ ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackgroundPointerOver}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrushPointerOver}" />
+          <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForegroundPointerOver}" />
+        </Style>
+        <Style Selector="^:pressed /template/ ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackgroundPressed}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrushPressed}" />
+          <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForegroundPressed}" />
+        </Style>
+        <Style Selector="^:disabled /template/ ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackgroundDisabled}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrushDisabled}" />
+          <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForegroundDisabled}" />
+        </Style>
+      </Style>-->
+      <Style Selector="^:disabled /template/">
+        <Style Selector="^ ContentPresenter#HeaderContentPresenter">
+          <Setter Property="Foreground" Value="{DynamicResource TimePickerHeaderForegroundDisabled}" />
+        </Style>
+        <Style Selector="^ Rectangle">
+          <Setter Property="Fill" Value="{DynamicResource TimePickerSpacerFillDisabled}" />
+        </Style>
+      </Style>
+    </ControlTheme>
+    <ControlTheme x:Key="FluentTimePickerPresenter" TargetType="TimePickerPresenter">
+      <Setter Property="Width" Value="242" />
+      <Setter Property="MinWidth" Value="242" />
+      <Setter Property="MaxHeight" Value="398" />
+      <Setter Property="FontWeight" Value="Normal" />
+      <Setter Property="Background" Value="{DynamicResource TimePickerFlyoutPresenterBackground}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource TimePickerFlyoutPresenterBorderBrush}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource DateTimeFlyoutBorderThickness}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Border Name="Background" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}" Padding="{DynamicResource DateTimeFlyoutBorderPadding}" MaxHeight="398">
+            <Grid Name="ContentPanel" RowDefinitions="*,Auto">
+              <Grid Name="PickerContainer">
                 <!--Ignore col defs here, set in code-->
-                <Border x:Name="FirstPickerHost" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                  <TextBlock x:Name="HourTextBlock"
-                      HorizontalAlignment="Center"
-                      Padding="{DynamicResource TimePickerHostPadding}"
-                      FontFamily="{TemplateBinding FontFamily}"
-                      FontWeight="{TemplateBinding FontWeight}"
-                      FontSize="{TemplateBinding FontSize}" />
-                </Border>
-
-                <Rectangle Name="FirstColumnDivider"
-                    Fill="{DynamicResource TimePickerSpacerFill}"
-                    HorizontalAlignment="Center"
-                    Width="{DynamicResource TimePickerSpacerThemeWidth}"
-                    Grid.Column="1" />
-
-                <Border x:Name="SecondPickerHost" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                  <TextBlock x:Name="MinuteTextBlock"
-                      HorizontalAlignment="Center"
-                      Padding="{DynamicResource TimePickerHostPadding}"
-                      FontFamily="{TemplateBinding FontFamily}"
-                      FontWeight="{TemplateBinding FontWeight}"
-                      FontSize="{TemplateBinding FontSize}"/>
-                </Border>
-
-                <Rectangle Name="SecondColumnDivider"
-                    Fill="{DynamicResource TimePickerSpacerFill}"
-                    HorizontalAlignment="Center"
-                    Width="{DynamicResource TimePickerSpacerThemeWidth}"
-                    Grid.Column="3" />
-
-                <Border x:Name="ThirdPickerHost" Grid.Column="4" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                  <TextBlock x:Name="PeriodTextBlock"
-                      HorizontalAlignment="Center"
-                      Padding="{DynamicResource TimePickerHostPadding}"
-                      FontFamily="{TemplateBinding FontFamily}"
-                      FontWeight="{TemplateBinding FontWeight}"
-                      FontSize="{TemplateBinding FontSize}" />
-                </Border>
+                <Panel Name="HourHost" Grid.Column="0">
+                  <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Hidden">
+                    <DateTimePickerPanel Name="HourSelector" PanelType="Hour" ShouldLoop="True" ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}" />
+                  </ScrollViewer>
+                  <RepeatButton Name="HourUpButton" Classes="DateTimeFlyoutButtonStyle UpButton" />
+                  <RepeatButton Name="HourDownButton" Classes="DateTimeFlyoutButtonStyle DownButton" />
+                </Panel>
+                <Panel Name="MinuteHost" Grid.Column="2">
+                  <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Hidden">
+                    <DateTimePickerPanel Name="MinuteSelector" PanelType="Minute" ShouldLoop="True" ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}" />
+                  </ScrollViewer>
+                  <RepeatButton Name="MinuteUpButton" Classes="DateTimeFlyoutButtonStyle UpButton" />
+                  <RepeatButton Name="MinuteDownButton" Classes="DateTimeFlyoutButtonStyle DownButton" />
+                </Panel>
+                <Panel Name="PeriodHost" Grid.Column="4">
+                  <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Hidden">
+                    <DateTimePickerPanel Name="PeriodSelector" PanelType="TimePeriod" ShouldLoop="False" ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}" />
+                  </ScrollViewer>
+                  <RepeatButton Name="PeriodUpButton" Classes="DateTimeFlyoutButtonStyle UpButton" />
+                  <RepeatButton Name="PeriodDownButton" Classes="DateTimeFlyoutButtonStyle DownButton" />
+                </Panel>
+                <Rectangle x:Name="HighlightRect" ZIndex="-1" Fill="{DynamicResource TimePickerFlyoutPresenterHighlightFill}" Grid.Column="0" Grid.ColumnSpan="5" VerticalAlignment="Center" Height="{DynamicResource TimePickerFlyoutPresenterHighlightHeight}" />
+                <Rectangle Name="FirstSpacer" Fill="{DynamicResource TimePickerFlyoutPresenterSpacerFill}" HorizontalAlignment="Center" Width="{DynamicResource TimePickerSpacerThemeWidth}" Grid.Column="1" />
+                <Rectangle Name="SecondSpacer" Fill="{DynamicResource TimePickerFlyoutPresenterSpacerFill}" HorizontalAlignment="Center" Width="{DynamicResource TimePickerSpacerThemeWidth}" Grid.Column="3" />
+              </Grid>
+              <Grid Grid.Row="1" Height="{DynamicResource TimePickerFlyoutPresenterAcceptDismissHostGridHeight}" Name="AcceptDismissHostGrid" ColumnDefinitions="*,*">
+                <Rectangle Height="{DynamicResource TimePickerSpacerThemeWidth}" VerticalAlignment="Top" Fill="{DynamicResource TimePickerFlyoutPresenterSpacerFill}" Grid.ColumnSpan="2" />
+                <Button Name="AcceptButton" Grid.Column="0" Classes="DateTimeFlyoutButtonStyle" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                  <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round" StrokeThickness="0.75" Data="M0.5,8.5 5,13.5 15.5,3" />
+                </Button>
+                <Button Name="DismissButton" Grid.Column="1" Classes="DateTimeFlyoutButtonStyle" FontSize="16" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                  <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round" StrokeThickness="0.75" Data="M2,2 14,14 M2,14 14 2" />
+                </Button>
               </Grid>
-            </Button>
-
-            <Popup Name="Popup" WindowManagerAddShadowHint="False"
-                   IsLightDismissEnabled="True" PlacementTarget="{TemplateBinding}"
-                   PlacementMode="Bottom">
-              <TimePickerPresenter Name="PickerPresenter" />
-            </Popup>
-
-          </Grid>
-        </DataValidationErrors>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-
-  <Style Selector="TimePicker:disabled /template/ ContentPresenter#HeaderContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource TimePickerHeaderForegroundDisabled}"/>
-  </Style>
-  <Style Selector="TimePicker:disabled /template/ Rectangle">
-    <Setter Property="Fill" Value="{DynamicResource TimePickerSpacerFillDisabled}"/>
-  </Style>
-
-  <Style Selector="TimePicker /template/ Button#FlyoutButton:pointerover /template/ ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackgroundPointerOver}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrushPointerOver}"/>
-    <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForegroundPointerOver}"/>
-  </Style>
-
-  <Style Selector="TimePicker /template/ Button:pressed /template/ ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackgroundPressed}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrushPressed}"/>
-    <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForegroundPressed}"/>
-  </Style>
-
-  <Style Selector="TimePicker /template/ Button:disabled /template/ ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackgroundDisabled}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrushDisabled}"/>
-    <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForegroundDisabled}"/>
-  </Style>
-
-  <Style Selector="TimePicker:hasnotime /template/ Button#FlyoutButton TextBlock">
-    <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForeground}"/>
-  </Style>
-  
-  <Style Selector="TimePicker:error /template/ Button#FlyoutButton /template/ ContentPresenter">
-    <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
-  </Style>
-
-  <Style Selector="TimePickerPresenter">
-    <Setter Property="Width" Value="242" />
-    <Setter Property="MinWidth" Value="242" />
-    <Setter Property="MaxHeight" Value="398" />    
-    <Setter Property="FontWeight" Value="Normal" />
-    <Setter Property="Background" Value="{DynamicResource TimePickerFlyoutPresenterBackground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource TimePickerFlyoutPresenterBorderBrush}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource DateTimeFlyoutBorderThickness}" />
-    <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border Name="Background"
-                Background="{TemplateBinding Background}"
-                BorderBrush="{TemplateBinding BorderBrush}"
-                BorderThickness="{TemplateBinding BorderThickness}"
-                CornerRadius="{TemplateBinding CornerRadius}"
-                Padding="{DynamicResource DateTimeFlyoutBorderPadding}"
-                MaxHeight="398">
-          <Grid Name="ContentPanel" RowDefinitions="*,Auto">
-            <Grid Name="PickerContainer">
-              <!--Ignore col defs here, set in code-->
-              <Panel Name="HourHost" Grid.Column="0">
-                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
-                              VerticalScrollBarVisibility="Hidden">
-                  <DateTimePickerPanel Name="HourSelector"
-                                          PanelType="Hour"
-                                          ShouldLoop="True"
-                                          ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}"/>
-                </ScrollViewer>
-                <RepeatButton Name="HourUpButton"
-                              Classes="DateTimeFlyoutButtonStyle UpButton"/>
-                <RepeatButton Name="HourDownButton"
-                              Classes="DateTimeFlyoutButtonStyle DownButton"/>
-
-              </Panel>
-
-              <Panel Name="MinuteHost" Grid.Column="2">
-                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
-                              VerticalScrollBarVisibility="Hidden">
-                  <DateTimePickerPanel Name="MinuteSelector"
-                                          PanelType="Minute"
-                                          ShouldLoop="True"
-                                          ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}"/>
-                </ScrollViewer>
-                <RepeatButton Name="MinuteUpButton"
-                              Classes="DateTimeFlyoutButtonStyle UpButton"/>
-                <RepeatButton Name="MinuteDownButton"
-                              Classes="DateTimeFlyoutButtonStyle DownButton"/>
-
-              </Panel>
-
-              <Panel Name="PeriodHost" Grid.Column="4">
-                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
-                              VerticalScrollBarVisibility="Hidden">
-                  <DateTimePickerPanel Name="PeriodSelector"
-                                          PanelType="TimePeriod"
-                                          ShouldLoop="False"
-                                          ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}"/>
-                </ScrollViewer>
-                <RepeatButton Name="PeriodUpButton"
-                              Classes="DateTimeFlyoutButtonStyle UpButton"/>
-                <RepeatButton Name="PeriodDownButton"
-                              Classes="DateTimeFlyoutButtonStyle DownButton"/>
-
-              </Panel>
-
-              <Rectangle x:Name="HighlightRect" ZIndex="-1"
-                      Fill="{DynamicResource TimePickerFlyoutPresenterHighlightFill}"
-                      Grid.Column="0"
-                      Grid.ColumnSpan="5"
-                      VerticalAlignment="Center"
-                      Height="{DynamicResource TimePickerFlyoutPresenterHighlightHeight}" />
-
-              <Rectangle Name="FirstSpacer"
-                  Fill="{DynamicResource TimePickerFlyoutPresenterSpacerFill}"
-                  HorizontalAlignment="Center"
-                  Width="{DynamicResource TimePickerSpacerThemeWidth}"
-                  Grid.Column="1" />
-
-              <Rectangle Name="SecondSpacer"
-                  Fill="{DynamicResource TimePickerFlyoutPresenterSpacerFill}"
-                  HorizontalAlignment="Center"
-                  Width="{DynamicResource TimePickerSpacerThemeWidth}"
-                  Grid.Column="3" />
-            </Grid>
-
-            <Grid Grid.Row="1" Height="{DynamicResource TimePickerFlyoutPresenterAcceptDismissHostGridHeight}"
-                  Name="AcceptDismissHostGrid" ColumnDefinitions="*,*">
-              <Rectangle Height="{DynamicResource TimePickerSpacerThemeWidth}"
-                      VerticalAlignment="Top"
-                      Fill="{DynamicResource TimePickerFlyoutPresenterSpacerFill}"
-                      Grid.ColumnSpan="2" />
-              <Button Name="AcceptButton" Grid.Column="0" Classes="DateTimeFlyoutButtonStyle"
-                          HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
-                      StrokeThickness="0.75" Data="M0.5,8.5 5,13.5 15.5,3" />
-              </Button>
-              <Button Name="DismissButton" Grid.Column="1" Classes="DateTimeFlyoutButtonStyle"
-                         FontSize="16" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
-                      StrokeThickness="0.75" Data="M2,2 14,14 M2,14 14 2" />
-              </Button>
             </Grid>
-
-          </Grid>
-        </Border>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-
-  <Style Selector="TimePickerPresenter /template/ Panel RepeatButton">
-    <Setter Property="IsVisible" Value="False" />
+          </Border>
+        </ControlTemplate>
+      </Setter>
+      <Style Selector="^ /template/ Panel">
+        <Style Selector="^ RepeatButton">
+          <Setter Property="IsVisible" Value="False" />
+        </Style>
+        <Style Selector="^:pointerover RepeatButton">
+          <Setter Property="IsVisible" Value="True" />
+        </Style>
+      </Style>
+    </ControlTheme>
+  </Styles.Resources>
+  <Style Selector="TimePicker">
+    <Setter Property="Theme" Value="{StaticResource FluentTimePicker}" />
   </Style>
-
-  <Style Selector="TimePickerPresenter /template/ Panel:pointerover RepeatButton">
-    <Setter Property="IsVisible" Value="True" />
+  <Style Selector="TimePickerPresenter">
+    <Setter Property="Theme" Value="{StaticResource FluentTimePickerPresenter}" />
   </Style>
-  
 </Styles>
diff --git a/src/Avalonia.Themes.Fluent/Controls/TitleBar.xaml b/src/Avalonia.Themes.Fluent/Controls/TitleBar.xaml
index 4dba5b4ba4..2b97df020f 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TitleBar.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TitleBar.xaml
@@ -1,53 +1,55 @@
-<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Design.PreviewWith>
-    <Border>
-      <TitleBar Background="SkyBlue" Height="30" Width="300" Foreground="Black" />
-    </Border>
-  </Design.PreviewWith>
-  <Style Selector="TitleBar">
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>    
-    <Setter Property="VerticalAlignment" Value="Top" />
-    <Setter Property="HorizontalAlignment" Value="Stretch" />
-    <Setter Property="Background" Value="Transparent" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Panel HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="Stretch">
-          <Panel x:Name="PART_MouseTracker" Height="1" VerticalAlignment="Top" />
-          <Panel x:Name="PART_Container">
-            <Border x:Name="PART_Background" Background="{TemplateBinding Background}" />
-            <CaptionButtons x:Name="PART_CaptionButtons" VerticalAlignment="Top" HorizontalAlignment="Right" Foreground="{TemplateBinding Foreground}" />
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <Design.PreviewWith>
+      <Border>
+        <TitleBar Background="SkyBlue" Height="30" Width="300" Foreground="Black" />
+      </Border>
+    </Design.PreviewWith>
+
+    <ControlTheme x:Key="{x:Type TitleBar}" TargetType="TitleBar">
+      <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}" />
+      <Setter Property="VerticalAlignment" Value="Top" />
+      <Setter Property="HorizontalAlignment" Value="Stretch" />
+      <Setter Property="Background" Value="Transparent" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Panel HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="Stretch">
+            <Panel x:Name="PART_MouseTracker" Height="1" VerticalAlignment="Top" />
+            <Panel x:Name="PART_Container">
+              <Border x:Name="PART_Background" Background="{TemplateBinding Background}" />
+              <CaptionButtons x:Name="PART_CaptionButtons" VerticalAlignment="Top" HorizontalAlignment="Right" Foreground="{TemplateBinding Foreground}" />
+            </Panel>
           </Panel>
-        </Panel>
-      </ControlTemplate>
-    </Setter>
-  </Style>
+        </ControlTemplate>
+      </Setter>
 
-  <Style Selector="TitleBar:fullscreen">
-    <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
-  </Style>
+      <Style Selector="^:fullscreen">
+        <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
+      </Style>
 
-  <Style Selector="TitleBar /template/ Border#PART_Background">
-    <Setter Property="IsHitTestVisible" Value="False" />
-  </Style>
+      <Style Selector="^ /template/ Border#PART_Background">
+        <Setter Property="IsHitTestVisible" Value="False" />
+      </Style>
 
-  <Style Selector="TitleBar:fullscreen /template/ Border#PART_Background">
-    <Setter Property="IsHitTestVisible" Value="True" />
-  </Style>
+      <Style Selector="^:fullscreen /template/ Border#PART_Background">
+        <Setter Property="IsHitTestVisible" Value="True" />
+      </Style>
 
-  <Style Selector="TitleBar:fullscreen /template/ Panel#PART_MouseTracker">
-    <Setter Property="Background" Value="Transparent" />
-  </Style>
+      <Style Selector="^:fullscreen /template/ Panel#PART_MouseTracker">
+        <Setter Property="Background" Value="Transparent" />
+      </Style>
 
-  <Style Selector="TitleBar:fullscreen /template/ Panel#PART_Container">
-    <Setter Property="RenderTransform" Value="translateY(-30px)" />
-    <Setter Property="Transitions">
-      <Transitions>
-        <TransformOperationsTransition Property="RenderTransform" Duration="0:0:.25" />
-      </Transitions>
-    </Setter>
-  </Style>
+      <Style Selector="^:fullscreen /template/ Panel#PART_Container">
+        <Setter Property="RenderTransform" Value="translateY(-30px)" />
+        <Setter Property="Transitions">
+          <Transitions>
+            <TransformOperationsTransition Property="RenderTransform" Duration="0:0:.25" />
+          </Transitions>
+        </Setter>
+      </Style>
 
-  <Style Selector="TitleBar:fullscreen:pointerover /template/ Panel#PART_Container">
-    <Setter Property="RenderTransform" Value="none" />
-  </Style>
-</Styles>
+      <Style Selector="^:fullscreen:pointerover /template/ Panel#PART_Container">
+        <Setter Property="RenderTransform" Value="none" />
+      </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml b/src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml
index e0d54d7232..b53980b792 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml
@@ -1,5 +1,5 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
   <Design.PreviewWith>
     <Border Padding="20">
       <StackPanel Spacing="20">
@@ -10,104 +10,111 @@
     </Border>
   </Design.PreviewWith>
 
-  <Styles.Resources>
     <Thickness x:Key="ButtonPadding">8,5,8,6</Thickness>
-  </Styles.Resources>
-  <Style Selector="ToggleButton">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackground}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForeground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrush}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource ToggleButtonBorderThemeThickness}" />
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="Padding" Value="{DynamicResource ButtonPadding}" />
-    <Setter Property="HorizontalAlignment" Value="Left" />
-    <Setter Property="VerticalAlignment" Value="Center" />    
-    <Setter Property="FontWeight" Value="Normal" />
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <ContentPresenter x:Name="PART_ContentPresenter"
-                          Background="{TemplateBinding Background}"
-                          BorderBrush="{TemplateBinding BorderBrush}"
-                          BorderThickness="{TemplateBinding BorderThickness}"
-                          CornerRadius="{TemplateBinding CornerRadius}"
-                          Content="{TemplateBinding Content}"
-                          ContentTemplate="{TemplateBinding ContentTemplate}"
-                          Padding="{TemplateBinding Padding}"
-                          RecognizesAccessKey="True"
-                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
-      </ControlTemplate>
-    </Setter>
-  </Style>
-  
-  <Style Selector="ToggleButton /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-  </Style>
 
-  <Style Selector="ToggleButton:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushPointerOver}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundPointerOver}" />
-  </Style>
+    <ControlTheme x:Key="{x:Type ToggleButton}" TargetType="ToggleButton">
+      <Setter Property="Background" Value="{DynamicResource ToggleButtonBackground}" />
+      <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForeground}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrush}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource ToggleButtonBorderThemeThickness}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="Padding" Value="{DynamicResource ButtonPadding}" />
+      <Setter Property="HorizontalAlignment" Value="Left" />
+      <Setter Property="VerticalAlignment" Value="Center" />
+      <Setter Property="FontWeight" Value="Normal" />
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <ContentPresenter x:Name="PART_ContentPresenter"
+                            Background="{TemplateBinding Background}"
+                            BorderBrush="{TemplateBinding BorderBrush}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
+                            CornerRadius="{TemplateBinding CornerRadius}"
+                            Content="{TemplateBinding Content}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
+                            Padding="{TemplateBinding Padding}"
+                            RecognizesAccessKey="True"
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
+        </ControlTemplate>
+      </Setter>
 
-  <Style Selector="ToggleButton:pressed  /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushPressed}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundPressed}" />
-  </Style>
+      <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      </Style>
 
-  <Style Selector="ToggleButton:disabled /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushDisabled}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundDisabled}" />
-  </Style>
+      <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundPointerOver}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushPointerOver}" />
+        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundPointerOver}" />
+      </Style>
 
-  <Style Selector="ToggleButton:checked /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundChecked}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushChecked}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundChecked}" />
-  </Style>
+      <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundPressed}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushPressed}" />
+        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundPressed}" />
+      </Style>
 
-  <Style Selector="ToggleButton:checked:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundCheckedPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushCheckedPointerOver}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundCheckedPointerOver}" />
-  </Style>
+      <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundDisabled}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushDisabled}" />
+        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundDisabled}" />
+      </Style>
 
-  <Style Selector="ToggleButton:checked:pressed /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundCheckedPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushCheckedPressed}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundCheckedPressed}" />
-  </Style>
+      <Style Selector="^:indeterminate">
+        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminate}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminate}" />
+          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminate}" />
+        </Style>
 
-  <Style Selector="ToggleButton:checked:disabled /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundCheckedDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushCheckedDisabled}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundCheckedDisabled}" />
-  </Style>
+        <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminatePointerOver}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminatePointerOver}" />
+          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminatePointerOver}" />
+        </Style>
 
-  <Style Selector="ToggleButton:indeterminate /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminate}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminate}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminate}" />
-  </Style>
+        <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminatePressed}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminatePressed}" />
+          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminatePressed}" />
+        </Style>
 
-  <Style Selector="ToggleButton:indeterminate:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminatePointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminatePointerOver}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminatePointerOver}" />
-  </Style>
+        <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminateDisabled}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminateDisabled}" />
+          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminateDisabled}" />
+        </Style>
+      </Style>
 
-  <Style Selector="ToggleButton:indeterminate:pressed /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminatePressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminatePressed}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminatePressed}" />
-  </Style>
+      <Style Selector="^:checked">
+        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundChecked}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushChecked}" />
+          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundChecked}" />
+        </Style>
 
-  <Style Selector="ToggleButton:indeterminate:disabled /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminateDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminateDisabled}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminateDisabled}" />
-  </Style>
-</Styles>
+        <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundCheckedPointerOver}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushCheckedPointerOver}" />
+          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundCheckedPointerOver}" />
+        </Style>
+
+        <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundCheckedPressed}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushCheckedPressed}" />
+          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundCheckedPressed}" />
+        </Style>
+
+        <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundCheckedDisabled}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushCheckedDisabled}" />
+          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundCheckedDisabled}" />
+        </Style>
+
+        <Style Selector="^:pressed">
+          <Setter Property="RenderTransform" Value="scale(0.98)" />
+        </Style>
+      </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ToggleSwitch.xaml b/src/Avalonia.Themes.Fluent/Controls/ToggleSwitch.xaml
index a2b50a859d..533903bec7 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ToggleSwitch.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ToggleSwitch.xaml
@@ -1,288 +1,307 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        xmlns:sys="clr-namespace:System;assembly=netstandard">
-  <Styles.Resources>
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:sys="clr-namespace:System;assembly=netstandard">
+     <Design.PreviewWith>
+      <StackPanel Margin="20" Width="250" Spacing="24" >
+        <StackPanel Spacing="12" >
+          <TextBlock
+            Text="Automatic updates"
+            Classes="h1"/>
+          <TextBlock
+            Text="Updates will be automaticly Downloaded and installed shile the computer is shutting down or restarting"
+            TextWrapping="Wrap"/>
+          <ToggleSwitch HorizontalContentAlignment="Left"
+            Content="Enable automatic Updates?"
+            OffContent="Uit"
+            OnContent="Aan"
+            VerticalAlignment="Bottom"/>
+        </StackPanel>
+
+        <StackPanel Spacing="12">
+          <TextBlock
+            Text="Previewer"
+            Classes="h1"/>
+          <TextBlock
+            Text="The previewer Shows a preview off your code, this could slow down your system"
+            TextWrapping="Wrap"/>
+          <ToggleSwitch
+            Background="Green"
+            IsChecked="True" />
+        </StackPanel>
+      </StackPanel>
+    </Design.PreviewWith>
+  
     <Thickness x:Key="ToggleSwitchTopHeaderMargin">0,0,0,6</Thickness>
     <GridLength x:Key="ToggleSwitchPreContentMargin">6</GridLength>
     <GridLength x:Key="ToggleSwitchPostContentMargin">6</GridLength>
     <x:Double x:Key="ToggleSwitchThemeMinWidth">0</x:Double>
-  </Styles.Resources>
-  <Design.PreviewWith>
-    <StackPanel Margin="20" Width="250" Spacing="24" >
-      <StackPanel Spacing="12" >
-        <TextBlock
-          Text="Automatic updates"
-          Classes="h1"/>
-        <TextBlock
-          Text="Updates will be automaticly Downloaded and installed shile the computer is shutting down or restarting"
-          TextWrapping="Wrap"/>
-        <ToggleSwitch HorizontalContentAlignment="Left"
-          Content="Enable automatic Updates?"
-          OffContent="Uit"
-          OnContent="Aan"
-          VerticalAlignment="Bottom"/>
-      </StackPanel>
 
-      <StackPanel Spacing="12">
-        <TextBlock
-          Text="Previewer"
-          Classes="h1"/>
-        <TextBlock
-          Text="The previewer Shows a preview off your code, this could slow down your system"
-          TextWrapping="Wrap"/>
-        <ToggleSwitch
-          Background="Green"
-          IsChecked="True" />
-      </StackPanel>
-    </StackPanel>
-  </Design.PreviewWith>
-
-  <Style Selector="ToggleSwitch">
-    <Setter Property="Foreground" Value="{DynamicResource ToggleSwitchContentForeground}" />
-    <Setter Property="HorizontalAlignment" Value="Left" />
-    <Setter Property="VerticalAlignment" Value="Center" />
-    <Setter Property="HorizontalContentAlignment" Value="Left" />
-    <Setter Property="VerticalContentAlignment" Value="Center" />
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Grid Background="{TemplateBinding Background}"
-          RowDefinitions="Auto,*">
-
-          <ContentPresenter x:Name="PART_ContentPresenter"
-            Grid.Row="0"
-            Content="{TemplateBinding Content}"
-            ContentTemplate="{TemplateBinding ContentTemplate}"
-            RecognizesAccessKey="True"
-            VerticalAlignment="Top"/>
-
-          <Grid Grid.Row="1"
-            MinWidth="{DynamicResource ToggleSwitchThemeMinWidth}"
-            HorizontalAlignment="Left"
-            VerticalAlignment="Top">
-
-            <Grid.RowDefinitions>
-              <RowDefinition Height="{DynamicResource ToggleSwitchPreContentMargin}" />
-              <RowDefinition Height="Auto" />
-              <RowDefinition Height="{DynamicResource ToggleSwitchPostContentMargin}" />
-            </Grid.RowDefinitions>
-
-            <Grid.ColumnDefinitions>
-              <ColumnDefinition Width="Auto" />
-              <ColumnDefinition Width="12" MaxWidth="12" />
-              <ColumnDefinition Width="Auto" />
-            </Grid.ColumnDefinitions>
-
-            <Grid x:Name="SwitchAreaGrid"
-              Grid.RowSpan="3"
-              Grid.ColumnSpan="3"
-              TemplatedControl.IsTemplateFocusTarget="True"
-              Margin="0,5" />
-
-            <ContentPresenter x:Name="PART_OffContentPresenter"
-              Grid.RowSpan="3"
-              Grid.Column="2"
-              Content="{TemplateBinding OffContent}"
-              ContentTemplate="{TemplateBinding OffContentTemplate}"
-              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
-
-            <ContentPresenter x:Name="PART_OnContentPresenter"
-              Grid.RowSpan="3"
-              Grid.Column="2"
-              Content="{TemplateBinding OnContent}"
-              ContentTemplate="{TemplateBinding OnContentTemplate}"
-              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
-
-            <Border x:Name="OuterBorder"
-              Grid.Row="1"
-              Height="20"
-              Width="40"
-              CornerRadius="10"
-              BorderThickness="{DynamicResource ToggleSwitchOuterBorderStrokeThickness}" />
-
-            <Border x:Name="SwitchKnobBounds"
-              Grid.Row="1"
-              Height="20"
-              Width="40"
-              CornerRadius="10"
-              BorderThickness="{DynamicResource ToggleSwitchOnStrokeThickness}"/>
-
-            <Canvas x:Name="SwitchKnob" Grid.Row="1"
-               HorizontalAlignment="Left"
-               Width="20" Height="20">
-
-              <Grid x:Name="MovingKnobs"
-                Width="20" Height="20">
-
-                <Ellipse x:Name="SwitchKnobOn"
-                         Width="10" Height="10" />
-
-                <Ellipse x:Name="SwitchKnobOff"
-                         Width="10" Height="10" />
-              </Grid>
-            </Canvas>
-          </Grid>
-        </Grid>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-
-  <Style Selector="ToggleSwitch /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Margin" Value="{DynamicResource ToggleSwitchTopHeaderMargin}" />
-  </Style>
-  <Style Selector="ToggleSwitch /template/ ContentPresenter#PART_ContentPresenter:empty">
-    <Setter Property="Margin" Value="0" />
-  </Style>
-
-  <!-- NormalState -->
-  <Style Selector="ToggleSwitch /template/ Grid#SwitchAreaGrid">
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackground}"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch /template/ Border#OuterBorder">
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOff}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOff}"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch /template/ Border#SwitchKnobBounds">
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOn}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOn}"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch /template/ Ellipse#SwitchKnobOn">
-    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOn}"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch /template/ Ellipse#SwitchKnobOff">
-    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOff}"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:not(:dragging) /template/ Grid#MovingKnobs">
-    <Setter Property="Transitions">
-      <Transitions>
-        <DoubleTransition Property="Canvas.Left" Duration="0:0:0.2" Easing="CubicEaseOut"/>
-      </Transitions>
-    </Setter>
-  </Style>
-
-  <!-- PointerOverState -->
-  <Style Selector="ToggleSwitch:pointerover /template/ Border#OuterBorder">
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffPointerOver}"/>
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffPointerOver}"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:pointerover /template/ Ellipse#SwitchKnobOff">
-    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffPointerOver}"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:pointerover /template/ Ellipse#SwitchKnobOn">
-    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnPointerOver}"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:pointerover /template/ Border#SwitchKnobBounds">
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnPointerOver}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnPointerOver}"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:pointerover /template/ Grid#SwitchAreaGrid">
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundPointerOver}"/>
-  </Style>
-
-  <!-- PressedState -->
-  <Style Selector="ToggleSwitch:pressed /template/ Border#OuterBorder">
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffPressed}"/>
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffPressed}"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:pressed /template/ Border#SwitchKnobBounds">
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnPressed}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnPressed}"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:pressed /template/ Ellipse#SwitchKnobOff">
-    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffPressed}"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:pressed /template/ Ellipse#SwitchKnobOn">
-    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnPressed}"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:pressed /template/ Grid#SwitchAreaGrid">
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundPressed}"/>
-  </Style>
-
-  <!-- DisabledState -->
-  <Style Selector="ToggleSwitch:disabled">
-    <Setter Property="Foreground" Value="{DynamicResource ToggleSwitchHeaderForegroundDisabled}"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:disabled /template/ Border#OuterBorder">
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffDisabled}"/>
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffDisabled}"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:disabled /template/ Ellipse#SwitchKnobOff">
-    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffDisabled}"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:disabled /template/ Ellipse#SwitchKnobOn">
-    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnDisabled}"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:disabled /template/ Border#SwitchKnobBounds">
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnDisabled}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnDisabled}"/>
-  </Style>
-
-  <!-- CheckedState -->
-  <Style Selector="ToggleSwitch:checked /template/ Border#OuterBorder">
-    <Setter Property="Opacity" Value="0"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:checked  /template/ Ellipse#SwitchKnobOff">
-    <Setter Property="Opacity" Value="0"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:checked  /template/ Border#SwitchKnobBounds">
-    <Setter Property="Opacity" Value="1"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:checked /template/ Ellipse#SwitchKnobOn">
-    <Setter Property="Opacity" Value="1"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:checked /template/ ContentPresenter#PART_OffContentPresenter">
-    <Setter Property="Opacity" Value="0"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:checked /template/ ContentPresenter#PART_OnContentPresenter">
-    <Setter Property="Opacity" Value="1"/>
-  </Style>
-
-  <!--UncheckedState -->
-  <Style Selector="ToggleSwitch:unchecked /template/ Border#OuterBorder">
-    <Setter Property="Opacity" Value="1"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:unchecked /template/ Ellipse#SwitchKnobOff">
-    <Setter Property="Opacity" Value="1"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:unchecked /template/ Ellipse#SwitchKnobOn">
-    <Setter Property="Opacity" Value="0"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:unchecked  /template/ Border#SwitchKnobBounds">
-    <Setter Property="Opacity" Value="0"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:unchecked /template/ ContentPresenter#PART_OffContentPresenter">
-    <Setter Property="Opacity" Value="1"/>
-  </Style>
-
-  <Style Selector="ToggleSwitch:unchecked /template/ ContentPresenter#PART_OnContentPresenter">
-    <Setter Property="Opacity" Value="0"/>
-  </Style>
-</Styles>
+
+    <ControlTheme x:Key="{x:Type ToggleSwitch}" TargetType="ToggleSwitch">
+        <Setter Property="Foreground" Value="{DynamicResource ToggleSwitchContentForeground}" />
+        <Setter Property="HorizontalAlignment" Value="Left" />
+        <Setter Property="VerticalAlignment" Value="Center" />
+        <Setter Property="HorizontalContentAlignment" Value="Left" />
+        <Setter Property="VerticalContentAlignment" Value="Center" />
+        <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+        <Setter Property="Template">
+            <ControlTemplate>
+                <Grid Background="{TemplateBinding Background}" RowDefinitions="Auto,*">
+
+                    <ContentPresenter
+                        x:Name="PART_ContentPresenter"
+                        Grid.Row="0"
+                        VerticalAlignment="Top"
+                        Content="{TemplateBinding Content}"
+                        ContentTemplate="{TemplateBinding ContentTemplate}"
+                        RecognizesAccessKey="True" />
+
+                    <Grid
+                        Grid.Row="1"
+                        MinWidth="{DynamicResource ToggleSwitchThemeMinWidth}"
+                        HorizontalAlignment="Left"
+                        VerticalAlignment="Top">
+
+                        <Grid.RowDefinitions>
+                            <RowDefinition Height="{DynamicResource ToggleSwitchPreContentMargin}" />
+                            <RowDefinition Height="Auto" />
+                            <RowDefinition Height="{DynamicResource ToggleSwitchPostContentMargin}" />
+                        </Grid.RowDefinitions>
+
+                        <Grid.ColumnDefinitions>
+                            <ColumnDefinition Width="Auto" />
+                            <ColumnDefinition Width="12" MaxWidth="12" />
+                            <ColumnDefinition Width="Auto" />
+                        </Grid.ColumnDefinitions>
+
+                        <Grid
+                            x:Name="SwitchAreaGrid"
+                            Grid.RowSpan="3"
+                            Grid.ColumnSpan="3"
+                            Margin="0,5"
+                            TemplatedControl.IsTemplateFocusTarget="True" />
+
+                        <ContentPresenter
+                            x:Name="PART_OffContentPresenter"
+                            Grid.RowSpan="3"
+                            Grid.Column="2"
+                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                            Content="{TemplateBinding OffContent}"
+                            ContentTemplate="{TemplateBinding OffContentTemplate}" />
+
+                        <ContentPresenter
+                            x:Name="PART_OnContentPresenter"
+                            Grid.RowSpan="3"
+                            Grid.Column="2"
+                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                            Content="{TemplateBinding OnContent}"
+                            ContentTemplate="{TemplateBinding OnContentTemplate}" />
+
+                        <Border
+                            x:Name="OuterBorder"
+                            Grid.Row="1"
+                            Width="40"
+                            Height="20"
+                            BorderThickness="{DynamicResource ToggleSwitchOuterBorderStrokeThickness}"
+                            CornerRadius="10" />
+
+                        <Border
+                            x:Name="SwitchKnobBounds"
+                            Grid.Row="1"
+                            Width="40"
+                            Height="20"
+                            BorderThickness="{DynamicResource ToggleSwitchOnStrokeThickness}"
+                            CornerRadius="10" />
+
+                        <Canvas
+                            x:Name="SwitchKnob"
+                            Grid.Row="1"
+                            Width="20"
+                            Height="20"
+                            HorizontalAlignment="Left">
+
+                            <Grid
+                                x:Name="MovingKnobs"
+                                Width="20"
+                                Height="20">
+
+                                <Ellipse
+                                    x:Name="SwitchKnobOn"
+                                    Width="10"
+                                    Height="10" />
+
+                                <Ellipse
+                                    x:Name="SwitchKnobOff"
+                                    Width="10"
+                                    Height="10" />
+                            </Grid>
+                        </Canvas>
+                    </Grid>
+                </Grid>
+            </ControlTemplate>
+        </Setter>
+
+        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+            <Setter Property="Margin" Value="{DynamicResource ToggleSwitchTopHeaderMargin}" />
+        </Style>
+        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter:empty">
+            <Setter Property="Margin" Value="0" />
+        </Style>
+
+        <!--  NormalState  -->
+        <Style Selector="^ /template/ Grid#SwitchAreaGrid">
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackground}" />
+        </Style>
+
+        <Style Selector="^ /template/ Border#OuterBorder">
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOff}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOff}" />
+        </Style>
+
+        <Style Selector="^ /template/ Border#SwitchKnobBounds">
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOn}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOn}" />
+        </Style>
+
+        <Style Selector="^ /template/ Ellipse#SwitchKnobOn">
+            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOn}" />
+        </Style>
+
+        <Style Selector="^ /template/ Ellipse#SwitchKnobOff">
+            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOff}" />
+        </Style>
+
+        <Style Selector="^:not(:dragging) /template/ Grid#MovingKnobs">
+            <Setter Property="Transitions">
+                <Transitions>
+                    <DoubleTransition
+                        Easing="CubicEaseOut"
+                        Property="Canvas.Left"
+                        Duration="0:0:0.2" />
+                </Transitions>
+            </Setter>
+        </Style>
+
+        <!--  PointerOverState  -->
+        <Style Selector="^:pointerover /template/ Border#OuterBorder">
+            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffPointerOver}" />
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffPointerOver}" />
+        </Style>
+
+        <Style Selector="^:pointerover /template/ Ellipse#SwitchKnobOff">
+            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffPointerOver}" />
+        </Style>
+
+        <Style Selector="^:pointerover /template/ Ellipse#SwitchKnobOn">
+            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnPointerOver}" />
+        </Style>
+
+        <Style Selector="^:pointerover /template/ Border#SwitchKnobBounds">
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnPointerOver}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnPointerOver}" />
+        </Style>
+
+        <Style Selector="^:pointerover /template/ Grid#SwitchAreaGrid">
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundPointerOver}" />
+        </Style>
+
+        <!--  PressedState  -->
+        <Style Selector="^:pressed /template/ Border#OuterBorder">
+            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffPressed}" />
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffPressed}" />
+        </Style>
+
+        <Style Selector="^:pressed /template/ Border#SwitchKnobBounds">
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnPressed}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnPressed}" />
+        </Style>
+
+        <Style Selector="^:pressed /template/ Ellipse#SwitchKnobOff">
+            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffPressed}" />
+        </Style>
+
+        <Style Selector="^:pressed /template/ Ellipse#SwitchKnobOn">
+            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnPressed}" />
+        </Style>
+
+        <Style Selector="^:pressed /template/ Grid#SwitchAreaGrid">
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundPressed}" />
+        </Style>
+
+        <!--  DisabledState  -->
+        <Style Selector="^:disabled">
+            <Setter Property="Foreground" Value="{DynamicResource ToggleSwitchHeaderForegroundDisabled}" />
+        </Style>
+
+        <Style Selector="^:disabled /template/ Border#OuterBorder">
+            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffDisabled}" />
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffDisabled}" />
+        </Style>
+
+        <Style Selector="^:disabled /template/ Ellipse#SwitchKnobOff">
+            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffDisabled}" />
+        </Style>
+
+        <Style Selector="^:disabled /template/ Ellipse#SwitchKnobOn">
+            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnDisabled}" />
+        </Style>
+
+        <Style Selector="^:disabled /template/ Border#SwitchKnobBounds">
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnDisabled}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnDisabled}" />
+        </Style>
+
+        <!--  CheckedState  -->
+        <Style Selector="^:checked /template/ Border#OuterBorder">
+            <Setter Property="Opacity" Value="0" />
+        </Style>
+
+        <Style Selector="^:checked  /template/ Ellipse#SwitchKnobOff">
+            <Setter Property="Opacity" Value="0" />
+        </Style>
+
+        <Style Selector="^:checked  /template/ Border#SwitchKnobBounds">
+            <Setter Property="Opacity" Value="1" />
+        </Style>
+
+        <Style Selector="^:checked /template/ Ellipse#SwitchKnobOn">
+            <Setter Property="Opacity" Value="1" />
+        </Style>
+
+        <Style Selector="^:checked /template/ ContentPresenter#PART_OffContentPresenter">
+            <Setter Property="Opacity" Value="0" />
+        </Style>
+
+        <Style Selector="^:checked /template/ ContentPresenter#PART_OnContentPresenter">
+            <Setter Property="Opacity" Value="1" />
+        </Style>
+
+        <!--  UncheckedState  -->
+        <Style Selector="^:unchecked /template/ Border#OuterBorder">
+            <Setter Property="Opacity" Value="1" />
+        </Style>
+
+        <Style Selector="^:unchecked /template/ Ellipse#SwitchKnobOff">
+            <Setter Property="Opacity" Value="1" />
+        </Style>
+
+        <Style Selector="^:unchecked /template/ Ellipse#SwitchKnobOn">
+            <Setter Property="Opacity" Value="0" />
+        </Style>
+
+        <Style Selector="^:unchecked  /template/ Border#SwitchKnobBounds">
+            <Setter Property="Opacity" Value="0" />
+        </Style>
+
+        <Style Selector="^:unchecked /template/ ContentPresenter#PART_OffContentPresenter">
+            <Setter Property="Opacity" Value="1" />
+        </Style>
+
+        <Style Selector="^:unchecked /template/ ContentPresenter#PART_OnContentPresenter">
+            <Setter Property="Opacity" Value="0" />
+        </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ToolTip.xaml b/src/Avalonia.Themes.Fluent/Controls/ToolTip.xaml
index 2d18be91cb..1070f3b68c 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ToolTip.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ToolTip.xaml
@@ -1,87 +1,71 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"       
-        xmlns:sys="clr-namespace:System;assembly=netstandard"
-        x:CompileBindings="True">
-
-  <Design.PreviewWith>
-    <Grid RowDefinitions="Auto,Auto"
-          ColumnDefinitions="Auto,Auto"
-          HorizontalAlignment="Center">
-      <Border Grid.Column="0"
-              Grid.Row="1"
-              Background="{DynamicResource SystemControlBackgroundAccentBrush}"
-              Margin="5"
-              Padding="50"
-              ToolTip.Tip="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.">
-        <TextBlock>Hover Here</TextBlock>
-      </Border>
-      <CheckBox Grid.Column="1"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:sys="clr-namespace:System;assembly=netstandard"
+                    x:CompileBindings="True">
+    <Design.PreviewWith>
+      <Grid RowDefinitions="Auto,Auto"
+            ColumnDefinitions="Auto,Auto"
+            HorizontalAlignment="Center">
+        <Border Grid.Column="0"
+                Grid.Row="1"
+                Background="{DynamicResource SystemControlBackgroundAccentBrush}"
+                Margin="5" Padding="50" ToolTip.Tip="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.">
+          <TextBlock>Hover Here</TextBlock>
+        </Border>
+        <CheckBox Grid.Column="1"
+                  Margin="5"
+                  Grid.Row="0"
+                  IsChecked="{Binding ElementName=Border, Path=(ToolTip.IsOpen)}"
+                  Content="ToolTip Open" />
+        <Border Name="Border"
+                Grid.Column="1"
+                Grid.Row="1"
+                Background="{DynamicResource SystemControlBackgroundAccentBrush}"
                 Margin="5"
-                Grid.Row="0"
-                IsChecked="{Binding ElementName=Border, Path=(ToolTip.IsOpen)}"
-                Content="ToolTip Open" />
-      <Border Name="Border"
-              Grid.Column="1"
-              Grid.Row="1"
-              Background="{DynamicResource SystemControlBackgroundAccentBrush}"
-              Margin="5"
-              Padding="50"
-              ToolTip.Placement="Bottom">
-        <ToolTip.Tip>
-          <StackPanel>
-            <TextBlock Classes="h1">ToolTip</TextBlock>
-            <TextBlock Classes="h2">A control which pops up a hint when a control is hovered</TextBlock>
-          </StackPanel>
-        </ToolTip.Tip>
-        <TextBlock>ToolTip bottom placement</TextBlock>
-      </Border>
-    </Grid>
-  </Design.PreviewWith>
+                Padding="50"
+                ToolTip.Placement="Bottom">
+          <ToolTip.Tip>
+            <StackPanel>
+              <TextBlock Classes="h1">ToolTip</TextBlock>
+              <TextBlock Classes="h2">A control which pops up a hint when a control is hovered</TextBlock>
+            </StackPanel>
+          </ToolTip.Tip>
+          <TextBlock>ToolTip bottom placement</TextBlock>
+        </Border>
+      </Grid>
+    </Design.PreviewWith>
 
-  <Styles.Resources>
     <sys:Double x:Key="ToolTipContentMaxWidth">320</sys:Double>
-  </Styles.Resources>
-
-  <Style Selector="ToolTip">
-    <Setter Property="Foreground" Value="{DynamicResource ToolTipForeground}" />
-    <Setter Property="Background" Value="{DynamicResource ToolTipBackground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToolTipBorderBrush}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource ToolTipBorderThemeThickness}" />    
-    <Setter Property="FontSize" Value="{DynamicResource ToolTipContentThemeFontSize}" />
-    <Setter Property="Padding" Value="{DynamicResource ToolTipBorderThemePadding}" />
-    <Setter Property="MaxWidth" Value="{DynamicResource ToolTipContentMaxWidth}" />
-    <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
-    <Setter Property="Transitions">
-      <Transitions>
-        <DoubleTransition Property="Opacity" Duration="0:0:0.15" />
-      </Transitions>
-    </Setter>
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border Name="PART_LayoutRoot"
-                BorderThickness="{TemplateBinding BorderThickness}"
-                Background="{TemplateBinding Background}"
-                BorderBrush="{TemplateBinding BorderBrush}"
-                Padding="{TemplateBinding Padding}"
-                CornerRadius="{TemplateBinding CornerRadius}">
-          <ContentPresenter Name="PART_ContentPresenter"
-                            MaxWidth="{TemplateBinding MaxWidth}"
-                            Content="{TemplateBinding Content}"
-                            ContentTemplate="{TemplateBinding ContentTemplate}" />
-        </Border>
-      </ControlTemplate>
-    </Setter>
-  </Style>
 
-  <Style Selector="ToolTip > TextBlock">
-    <Setter Property="TextWrapping" Value="Wrap" />
-  </Style>
+    <ControlTheme x:Key="{x:Type ToolTip}" TargetType="ToolTip">
+      <Setter Property="Foreground" Value="{DynamicResource ToolTipForeground}" />
+      <Setter Property="Background" Value="{DynamicResource ToolTipBackground}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ToolTipBorderBrush}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource ToolTipBorderThemeThickness}" />
+      <Setter Property="FontSize" Value="{DynamicResource ToolTipContentThemeFontSize}" />
+      <Setter Property="Padding" Value="{DynamicResource ToolTipBorderThemePadding}" />
+      <Setter Property="MaxWidth" Value="{DynamicResource ToolTipContentMaxWidth}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
+      <Setter Property="Opacity" Value="0" />
+      <Setter Property="Transitions">
+        <Transitions>
+          <DoubleTransition Property="Opacity" Duration="0:0:0.15" />
+        </Transitions>
+      </Setter>
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Border Name="PART_LayoutRoot" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" Padding="{TemplateBinding Padding}" CornerRadius="{TemplateBinding CornerRadius}">
+            <ContentPresenter Name="PART_ContentPresenter" MaxWidth="{TemplateBinding MaxWidth}" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" />
+          </Border>
+        </ControlTemplate>
+      </Setter>
 
-  <Style Selector="ToolTip">
-    <Setter Property="Opacity" Value="0" />
-  </Style>
+      <!--<Style Selector="^ > TextBlock">
+        <Setter Property="TextWrapping" Value="Wrap" />
+      </Style>-->
 
-  <Style Selector="ToolTip:open">
-    <Setter Property="Opacity" Value="1" />
-  </Style>
-</Styles>
+      <Style Selector="^:open">
+        <Setter Property="Opacity" Value="1" />
+      </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/TransitioningContentControl.xaml b/src/Avalonia.Themes.Fluent/Controls/TransitioningContentControl.xaml
index 6a4d56ccb7..f28dc66a5f 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TransitioningContentControl.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TransitioningContentControl.xaml
@@ -1,20 +1,19 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Style Selector="TransitioningContentControl">
-    <!-- Set Defaults -->
-    <Setter Property="Template">
-      <ControlTemplate>
-        <ContentPresenter Name="PART_ContentPresenter"
-                          Background="{TemplateBinding Background}"
-                          BorderBrush="{TemplateBinding BorderBrush}"
-                          BorderThickness="{TemplateBinding BorderThickness}"
-                          CornerRadius="{TemplateBinding CornerRadius}"
-                          ContentTemplate="{TemplateBinding ContentTemplate}"
-                          Content="{TemplateBinding CurrentContent}"
-                          Padding="{TemplateBinding Padding}"
-                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-</Styles>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <ControlTheme x:Key="{x:Type TransitioningContentControl}" TargetType="TransitioningContentControl">
+      <Setter Property="Template">
+        <ControlTemplate>
+          <ContentPresenter Name="PART_ContentPresenter"
+                            Background="{TemplateBinding Background}" 
+                            BorderBrush="{TemplateBinding BorderBrush}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
+                            CornerRadius="{TemplateBinding CornerRadius}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
+                            Content="{TemplateBinding CurrentContent}"
+                            Padding="{TemplateBinding Padding}"
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" />
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/TreeView.xaml b/src/Avalonia.Themes.Fluent/Controls/TreeView.xaml
index 656b72e07b..4fcec79f25 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TreeView.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TreeView.xaml
@@ -1,28 +1,31 @@
-<Style xmlns="https://github.com/avaloniaui"
-       Selector="TreeView">
-  <Setter Property="Background" Value="Transparent" />
-  <Setter Property="BorderBrush" Value="Transparent" />
-  <Setter Property="BorderThickness" Value="0" />
-  <Setter Property="Padding" Value="0" />
-  <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
-  <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
-  <Setter Property="ScrollViewer.IsScrollChainingEnabled" Value="True" />
-  <Setter Property="Template">
-    <ControlTemplate>
-      <Border BorderBrush="{TemplateBinding BorderBrush}"
-              BorderThickness="{TemplateBinding BorderThickness}"
-              CornerRadius="{TemplateBinding CornerRadius}">
-        <ScrollViewer Background="{TemplateBinding Background}"
-                      HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}"
-                      VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}"
-                      IsScrollChainingEnabled="{TemplateBinding (ScrollViewer.IsScrollChainingEnabled)}"
-                      AllowAutoHide="{TemplateBinding (ScrollViewer.AllowAutoHide)}">
-          <ItemsPresenter Name="PART_ItemsPresenter"
-                          Items="{TemplateBinding Items}"
-                          ItemsPanel="{TemplateBinding ItemsPanel}"
-                          Margin="{TemplateBinding Padding}" />
-        </ScrollViewer>
-      </Border>
-    </ControlTemplate>
-  </Setter>
-</Style>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+
+    <ControlTheme x:Key="{x:Type TreeView}" TargetType="TreeView">
+      <Setter Property="Background" Value="Transparent" />
+      <Setter Property="BorderBrush" Value="Transparent" />
+      <Setter Property="BorderThickness" Value="0" />
+      <Setter Property="Padding" Value="0" />
+      <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
+      <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
+      <Setter Property="ScrollViewer.IsScrollChainingEnabled" Value="True" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Border BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
+                  CornerRadius="{TemplateBinding CornerRadius}">
+            <ScrollViewer Background="{TemplateBinding Background}"
+                          HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}"
+                          VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}"
+                          IsScrollChainingEnabled="{TemplateBinding (ScrollViewer.IsScrollChainingEnabled)}"
+                          AllowAutoHide="{TemplateBinding (ScrollViewer.AllowAutoHide)}">
+              <ItemsPresenter Name="PART_ItemsPresenter"
+                              Items="{TemplateBinding Items}"
+                              ItemsPanel="{TemplateBinding ItemsPanel}"
+                              Margin="{TemplateBinding Padding}" />
+            </ScrollViewer>
+          </Border>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/TreeViewItem.xaml b/src/Avalonia.Themes.Fluent/Controls/TreeViewItem.xaml
index f86b67bb6c..6510832eb3 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TreeViewItem.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TreeViewItem.xaml
@@ -1,4 +1,4 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<Styles xmlns="https://github.com/avaloniaui"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:converters="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls">
 
@@ -53,7 +53,6 @@
   </Style>
 
   <Style Selector="TreeViewItem">
-    <Style.Resources />
     <Setter Property="Padding" Value="0" />
     <Setter Property="Background" Value="{DynamicResource TreeViewItemBackground}" />
     <Setter Property="BorderBrush" Value="{DynamicResource TreeViewItemBorderBrush}" />
diff --git a/src/Avalonia.Themes.Fluent/Controls/UserControl.xaml b/src/Avalonia.Themes.Fluent/Controls/UserControl.xaml
index d6028daff8..7dc23f652a 100644
--- a/src/Avalonia.Themes.Fluent/Controls/UserControl.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/UserControl.xaml
@@ -1,16 +1,24 @@
-<Style xmlns="https://github.com/avaloniaui" Selector=":is(UserControl)">
-  <Setter Property="Template">
-    <ControlTemplate>
-      <ContentPresenter Name="PART_ContentPresenter"
-                        Background="{TemplateBinding Background}"
-                        BorderBrush="{TemplateBinding BorderBrush}"
-                        BorderThickness="{TemplateBinding BorderThickness}"
-                        CornerRadius="{TemplateBinding CornerRadius}"
-                        ContentTemplate="{TemplateBinding ContentTemplate}"
-                        Content="{TemplateBinding Content}"
-                        Padding="{TemplateBinding Padding}"
-                        VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                        HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
-    </ControlTemplate>
-  </Setter>
+<Style xmlns="https://github.com/avaloniaui"
+       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+       Selector=":is(UserControl)">
+  <Style.Resources>
+    <ControlTheme x:Key="FluentUserControl" TargetType="UserControl">
+      <Setter Property="Template">
+        <ControlTemplate>
+          <ContentPresenter Name="PART_ContentPresenter"
+                            Background="{TemplateBinding Background}"
+                            BorderBrush="{TemplateBinding BorderBrush}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
+                            CornerRadius="{TemplateBinding CornerRadius}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
+                            Content="{TemplateBinding Content}"
+                            Padding="{TemplateBinding Padding}"
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+  </Style.Resources>
+  
+  <Setter Property="Theme" Value="{StaticResource FluentUserControl}" />
 </Style>
diff --git a/src/Avalonia.Themes.Fluent/Controls/Window.xaml b/src/Avalonia.Themes.Fluent/Controls/Window.xaml
index 90963c606c..d78fd76a37 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Window.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Window.xaml
@@ -1,27 +1,30 @@
-<Style xmlns="https://github.com/avaloniaui" Selector="Window">
-  <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltHighBrush}"/>  
-  <Setter Property="TransparencyBackgroundFallback" Value="{DynamicResource SystemControlBackgroundAltHighBrush}" />
-  <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>
-  <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}"/>  
-  <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
-  <Setter Property="Template">
-    <ControlTemplate>
-      <Panel>
-        <Border Name="PART_TransparencyFallback" IsHitTestVisible="False" />
-        <Border Background="{TemplateBinding Background}" IsHitTestVisible="False" />
-        <Panel Background="Transparent" Margin="{TemplateBinding WindowDecorationMargin}" />
-        <VisualLayerManager>
-          <VisualLayerManager.ChromeOverlayLayer>
-            <TitleBar />
-          </VisualLayerManager.ChromeOverlayLayer>
-          <ContentPresenter Name="PART_ContentPresenter"
-                            ContentTemplate="{TemplateBinding ContentTemplate}"
-                            Content="{TemplateBinding Content}"
-                            Margin="{TemplateBinding Padding}"
-                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
-        </VisualLayerManager>
-      </Panel>
-    </ControlTemplate>
-  </Setter>
-</Style>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <ControlTheme x:Key="{x:Type Window}" TargetType="Window">
+      <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltHighBrush}"/>
+      <Setter Property="TransparencyBackgroundFallback" Value="{DynamicResource SystemControlBackgroundAltHighBrush}" />
+      <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}"/>
+      <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Panel>
+            <Border Name="PART_TransparencyFallback" IsHitTestVisible="False" />
+            <Border Background="{TemplateBinding Background}" IsHitTestVisible="False" />
+            <Panel Background="Transparent" Margin="{TemplateBinding WindowDecorationMargin}" />
+            <VisualLayerManager>
+              <VisualLayerManager.ChromeOverlayLayer>
+                <TitleBar />
+              </VisualLayerManager.ChromeOverlayLayer>
+              <ContentPresenter Name="PART_ContentPresenter"
+                                ContentTemplate="{TemplateBinding ContentTemplate}"
+                                Content="{TemplateBinding Content}"
+                                Margin="{TemplateBinding Padding}"
+                                HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
+            </VisualLayerManager>
+          </Panel>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/WindowNotificationManager.xaml b/src/Avalonia.Themes.Fluent/Controls/WindowNotificationManager.xaml
index 8d14c2d972..d5d5114c1b 100644
--- a/src/Avalonia.Themes.Fluent/Controls/WindowNotificationManager.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/WindowNotificationManager.xaml
@@ -1,47 +1,58 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        x:DataType="WindowNotificationManager"
-        x:CompileBindings="True">
-  <Style Selector="WindowNotificationManager">
-    <Setter Property="Margin" Value="0 0"/>    
-    <Setter Property="Template">
-      <ControlTemplate>
-        <ReversibleStackPanel Name="PART_Items">
-          <ReversibleStackPanel.DataTemplates>
-            <DataTemplate DataType="INotification">
-              <StackPanel Spacing="8" Margin="12" TextElement.Foreground="{DynamicResource SystemControlForegroundBaseHighBrush}">
-                <TextBlock Text="{Binding Title}" FontWeight="Medium" />
-                <TextBlock MaxHeight="80" Text="{Binding Message}" TextWrapping="Wrap" Margin="0,0,12,0"/>
-              </StackPanel>
-            </DataTemplate>
-            <DataTemplate DataType="x:String">
-              <TextBlock Text="{Binding }" Margin="12" Foreground="{DynamicResource SystemControlForegroundBaseHighBrush}" />
-            </DataTemplate>
-          </ReversibleStackPanel.DataTemplates>
-        </ReversibleStackPanel>
-      </ControlTemplate>
-    </Setter>
-  </Style>
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True"
+    x:DataType="WindowNotificationManager">
+    <ControlTheme x:Key="{x:Type WindowNotificationManager}" TargetType="WindowNotificationManager">
+        <Setter Property="Margin" Value="0 0" />
+        <Setter Property="Template">
+            <ControlTemplate>
+                <ReversibleStackPanel Name="PART_Items">
+                    <ReversibleStackPanel.DataTemplates>
+                        <DataTemplate DataType="INotification">
+                            <StackPanel
+                                Margin="12"
+                                Spacing="8"
+                                TextElement.Foreground="{DynamicResource SystemControlForegroundBaseHighBrush}">
+                                <TextBlock FontWeight="Medium" Text="{Binding Title}" />
+                                <TextBlock
+                                    MaxHeight="80"
+                                    Margin="0,0,12,0"
+                                    Text="{Binding Message}"
+                                    TextWrapping="Wrap" />
+                            </StackPanel>
+                        </DataTemplate>
+                        <DataTemplate DataType="x:String">
+                            <TextBlock
+                                Margin="12"
+                                Foreground="{DynamicResource SystemControlForegroundBaseHighBrush}"
+                                Text="{Binding}" />
+                        </DataTemplate>
+                    </ReversibleStackPanel.DataTemplates>
+                </ReversibleStackPanel>
+            </ControlTemplate>
+        </Setter>
 
-  <Style Selector="WindowNotificationManager:topleft /template/ ReversibleStackPanel#PART_Items">
-    <Setter Property="VerticalAlignment" Value="Top"/>
-    <Setter Property="HorizontalAlignment" Value="Left"/>
-  </Style>
+        <Style Selector="^:topleft /template/ ReversibleStackPanel#PART_Items">
+            <Setter Property="VerticalAlignment" Value="Top" />
+            <Setter Property="HorizontalAlignment" Value="Left" />
+        </Style>
 
-  <Style Selector="WindowNotificationManager:topright /template/ ReversibleStackPanel#PART_Items">
-    <Setter Property="VerticalAlignment" Value="Top"/>
-    <Setter Property="HorizontalAlignment" Value="Right"/>
-  </Style>
+        <Style Selector="^:topright /template/ ReversibleStackPanel#PART_Items">
+            <Setter Property="VerticalAlignment" Value="Top" />
+            <Setter Property="HorizontalAlignment" Value="Right" />
+        </Style>
 
-  <Style Selector="WindowNotificationManager:bottomleft /template/ ReversibleStackPanel#PART_Items">
-    <Setter Property="ReverseOrder" Value="True"/>
-    <Setter Property="VerticalAlignment" Value="Bottom"/>
-    <Setter Property="HorizontalAlignment" Value="Left"/>
-  </Style>
+        <Style Selector="^:bottomleft /template/ ReversibleStackPanel#PART_Items">
+            <Setter Property="ReverseOrder" Value="True" />
+            <Setter Property="VerticalAlignment" Value="Bottom" />
+            <Setter Property="HorizontalAlignment" Value="Left" />
+        </Style>
 
-  <Style Selector="WindowNotificationManager:bottomright /template/ ReversibleStackPanel#PART_Items">
-    <Setter Property="ReverseOrder" Value="True"/>
-    <Setter Property="VerticalAlignment" Value="Bottom"/>
-    <Setter Property="HorizontalAlignment" Value="Right"/>
-  </Style>
-</Styles>
+        <Style Selector="^:bottomright /template/ ReversibleStackPanel#PART_Items">
+            <Setter Property="ReverseOrder" Value="True" />
+            <Setter Property="VerticalAlignment" Value="Bottom" />
+            <Setter Property="HorizontalAlignment" Value="Right" />
+        </Style>
+    </ControlTheme>
+</ResourceDictionary>

From afe3486e9f3ea7a493c7e66ca3e5b59682357dcb Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Thu, 7 Jul 2022 11:15:41 +0200
Subject: [PATCH 02/70] Remove trailing /template/ selectors.

---
 .../Controls/ButtonSpinner.xaml               | 12 +--
 .../Controls/CalendarDatePicker.xaml          | 12 +--
 .../Controls/CalendarDayButton.xaml           |  6 +-
 .../Controls/CheckBox.xaml                    | 88 +++++++++----------
 .../Controls/ComboBox.xaml                    | 50 +++++------
 .../Controls/Slider.xaml                      | 56 ++++++------
 .../Controls/TimePicker.xaml                  |  6 +-
 7 files changed, 113 insertions(+), 117 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml b/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml
index a5234f5771..f99f1040e5 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml
@@ -87,20 +87,20 @@
         <Setter Property="BorderBrush" Value="{DynamicResource SystemErrorTextColor}" />
       </Style>
 
-      <Style Selector="^:left /template/">
-        <Style Selector="^ StackPanel#PART_SpinnerPanel">
+      <Style Selector="^:left">
+        <Style Selector="^ /template/ StackPanel#PART_SpinnerPanel">
           <Setter Property="Grid.Column" Value="0" />
         </Style>
-        <Style Selector="^ RepeatButton.ButtonSpinnerRepeatButton">
+        <Style Selector="^ /template/ RepeatButton.ButtonSpinnerRepeatButton">
           <Setter Property="BorderThickness" Value="{Binding $parent[ButtonSpinner].BorderThickness, Converter={StaticResource ButtonSpinner_OnlyRightThinknessConverter}}" />
         </Style>
       </Style>
 
-      <Style Selector="^:right /template/">
-        <Style Selector="^ StackPanel#PART_SpinnerPanel">
+      <Style Selector="^:right">
+        <Style Selector="^ /template/ StackPanel#PART_SpinnerPanel">
           <Setter Property="Grid.Column" Value="2" />
         </Style>
-        <Style Selector="^ RepeatButton.ButtonSpinnerRepeatButton">
+        <Style Selector="^ /template/ RepeatButton.ButtonSpinnerRepeatButton">
           <Setter Property="BorderThickness" Value="{Binding $parent[ButtonSpinner].BorderThickness, Converter={StaticResource ButtonSpinner_OnlyLeftThinknessConverter}}" />
         </Style>
       </Style>
diff --git a/src/Avalonia.Themes.Fluent/Controls/CalendarDatePicker.xaml b/src/Avalonia.Themes.Fluent/Controls/CalendarDatePicker.xaml
index 83a254be56..eefd9e9b51 100644
--- a/src/Avalonia.Themes.Fluent/Controls/CalendarDatePicker.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/CalendarDatePicker.xaml
@@ -106,13 +106,13 @@
                       <Setter Property="BorderBrush" Value="Transparent"/>
                       <Setter Property="BorderThickness" Value="0" />
                     </Style>
-                    <Style Selector="TextBox#PART_TextBox:disabled /template/">
-                      <Style Selector="^ Border#PART_BorderElement">
+                    <Style Selector="TextBox#PART_TextBox:disabled">
+                      <Style Selector="^ /template/ Border#PART_BorderElement">
                         <!-- By default the TextBox has its own disabled state, override this to make the border background show through -->
                         <Setter Property="Background" Value="Transparent" />
                         <Setter Property="BorderBrush" Value="Transparent" />
                       </Style>
-                      <Style Selector="^ TextBlock#PART_Watermark, ^ TextBlock#PART_FloatingWatermark">
+                      <Style Selector="^ /template/ TextBlock#PART_Watermark, ^ TextBlock#PART_FloatingWatermark">
                         <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerTextForegroundDisabled}" />
                       </Style>
                     </Style>
@@ -152,13 +152,13 @@
       </Style>
 
       <!-- Disabled State -->
-      <Style Selector="^:disabled /template/">
-        <Style Selector="^ Border#Background">
+      <Style Selector="^:disabled">
+        <Style Selector="^ /template/ Border#Background">
           <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackgroundDisabled}" />
           <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrushDisabled}" />
         </Style>
         
-        <Style Selector="^ Button#PART_Button">
+        <Style Selector="^ /template/ Button#PART_Button">
           <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerCalendarGlyphForegroundDisabled}" />
         </Style>
 
diff --git a/src/Avalonia.Themes.Fluent/Controls/CalendarDayButton.xaml b/src/Avalonia.Themes.Fluent/Controls/CalendarDayButton.xaml
index b119dd1355..9f476d51bc 100644
--- a/src/Avalonia.Themes.Fluent/Controls/CalendarDayButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/CalendarDayButton.xaml
@@ -84,11 +84,11 @@
       </Style>
 
       <!-- WinUI calls this OutOfFocus -->
-      <Style Selector="^:inactive /template/">
-        <Style Selector="^ Border#Root">
+      <Style Selector="^:inactive">
+        <Style Selector="^ /template/ Border#Root">
           <Setter Property="Background" Value="{DynamicResource CalendarViewOutOfScopeBackground}" />
         </Style>
-        <Style Selector="^ ContentControl#Content">
+        <Style Selector="^ /template/ ContentControl#Content">
           <Setter Property="Foreground" Value="{DynamicResource CalendarViewOutOfScopeForeground}" />
         </Style>
       </Style>
diff --git a/src/Avalonia.Themes.Fluent/Controls/CheckBox.xaml b/src/Avalonia.Themes.Fluent/Controls/CheckBox.xaml
index 2eee425cb0..44e1afefa4 100644
--- a/src/Avalonia.Themes.Fluent/Controls/CheckBox.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/CheckBox.xaml
@@ -63,64 +63,64 @@
       </Setter>
 
       <!-- Unchecked PointerOver State -->
-      <Style Selector="^:pointerover /template/">
-        <Style Selector="^ ContentPresenter#ContentPresenter">
+      <Style Selector="^:pointerover">
+        <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
           <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUncheckedPointerOver}" />
         </Style>
 
-        <Style Selector="^ Border#PART_Border">
+        <Style Selector="^ /template/ Border#PART_Border">
           <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUncheckedPointerOver}" />
           <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUncheckedPointerOver}" />
         </Style>
 
-        <Style Selector="^ Border#NormalRectangle">
+        <Style Selector="^ /template/ Border#NormalRectangle">
           <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUncheckedPointerOver}" />
           <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUncheckedPointerOver}" />
         </Style>
 
-        <Style Selector="^ Path#CheckGlyph">
+        <Style Selector="^ /template/ Path#CheckGlyph">
           <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUncheckedPointerOver}" />
         </Style>
       </Style>
 
       <!-- Unchecked Pressed State -->
-      <Style Selector="^:pressed /template/">
-        <Style Selector="^ ContentPresenter#ContentPresenter">
+      <Style Selector="^:pressed">
+        <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
           <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUncheckedPressed}" />
         </Style>
 
-        <Style Selector="^ Border#PART_Border">
+        <Style Selector="^ /template/ Border#PART_Border">
           <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUncheckedPressed}" />
           <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUncheckedPressed}" />
         </Style>
 
-        <Style Selector="^ Border#NormalRectangle">
+        <Style Selector="^ /template/ Border#NormalRectangle">
           <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUncheckedPressed}" />
           <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUncheckedPressed}" />
         </Style>
 
-        <Style Selector="^ Path#CheckGlyph">
+        <Style Selector="^ /template/ Path#CheckGlyph">
           <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUncheckedPressed}" />
         </Style>
       </Style>
 
       <!-- Unchecked Disabled state -->
-      <Style Selector="^:disabled /template/">
-        <Style Selector="^ ContentPresenter#ContentPresenter">
+      <Style Selector="^:disabled">
+        <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
           <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUncheckedDisabled}" />
         </Style>
 
-        <Style Selector="^ Border#PART_Border">
+        <Style Selector="^ /template/ Border#PART_Border">
           <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUncheckedDisabled}" />
           <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUncheckedDisabled}" />
         </Style>
 
-        <Style Selector="^ Border#NormalRectangle">
+        <Style Selector="^ /template/ Border#NormalRectangle">
           <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUncheckedDisabled}" />
           <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUncheckedDisabled}" />
         </Style>
 
-        <Style Selector="^ Path#CheckGlyph">
+        <Style Selector="^ /template/ Path#CheckGlyph">
           <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUncheckedDisabled}" />
         </Style>
       </Style>
@@ -145,64 +145,64 @@
         </Style>
 
         <!-- Checked PointerOver State -->
-        <Style Selector="^:pointerover /template/">
-          <Style Selector="^ ContentPresenter#ContentPresenter">
+        <Style Selector="^:pointerover">
+          <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
             <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundCheckedPointerOver}" />
           </Style>
 
-          <Style Selector="^ Border#PART_Border">
+          <Style Selector="^ /template/ Border#PART_Border">
             <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundCheckedPointerOver}" />
             <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushCheckedPointerOver}" />
           </Style>
 
-          <Style Selector="^ Border#NormalRectangle">
+          <Style Selector="^ /template/ Border#NormalRectangle">
             <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeCheckedPointerOver}" />
             <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillCheckedPointerOver}" />
           </Style>
 
-          <Style Selector="^ Path#CheckGlyph">
+          <Style Selector="^ /template/ Path#CheckGlyph">
             <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundCheckedPointerOver}" />
           </Style>
         </Style>
 
         <!-- Checked Pressed State -->
-        <Style Selector="^:pressed /template/">
-          <Style Selector="^ ContentPresenter#ContentPresenter">
+        <Style Selector="^:pressed">
+          <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
             <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundCheckedPressed}" />
           </Style>
 
-          <Style Selector="^ Border#PART_Border">
+          <Style Selector="^ /template/ Border#PART_Border">
             <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundCheckedPressed}" />
             <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushCheckedPressed}" />
           </Style>
 
-          <Style Selector="^ Border#NormalRectangle">
+          <Style Selector="^ /template/ Border#NormalRectangle">
             <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeCheckedPressed}" />
             <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillCheckedPressed}" />
           </Style>
 
-          <Style Selector="^ Path#CheckGlyph">
+          <Style Selector="^ /template/ Path#CheckGlyph">
             <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundCheckedPressed}" />
           </Style>
         </Style>
 
         <!-- Checked Disabled State -->
-        <Style Selector="^:disabled /template/">
+        <Style Selector="^:disabled">
           <Style Selector="^ ContentPresenter#ContentPresenter">
             <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundCheckedDisabled}" />
           </Style>
 
-          <Style Selector="^ Border#PART_Border">
+          <Style Selector="^ /template/ Border#PART_Border">
             <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundCheckedDisabled}" />
             <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushCheckedDisabled}" />
           </Style>
 
-          <Style Selector="^ Border#NormalRectangle">
+          <Style Selector="^ /template/ Border#NormalRectangle">
             <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeCheckedDisabled}" />
             <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillCheckedDisabled}" />
           </Style>
 
-          <Style Selector="^ Path#CheckGlyph">
+          <Style Selector="^ /template/ Path#CheckGlyph">
             <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundCheckedDisabled}" />
           </Style>
         </Style>
@@ -227,64 +227,64 @@
         </Style>
 
         <!-- Indeterminate PointerOver State -->
-        <Style Selector="^:pointerover /template/">
-          <Style Selector="^ ContentPresenter#ContentPresenter">
+        <Style Selector="^:pointerover">
+          <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
             <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminatePointerOver}" />
           </Style>
 
-          <Style Selector="^ Border#PART_Border">
+          <Style Selector="^ /template/ Border#PART_Border">
             <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminatePointerOver}" />
             <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminatePointerOver}" />
           </Style>
 
-          <Style Selector="^ Border#NormalRectangle">
+          <Style Selector="^ /template/ Border#NormalRectangle">
             <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminatePointerOver}" />
             <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminatePointerOver}" />
           </Style>
 
-          <Style Selector="^ Path#CheckGlyph">
+          <Style Selector="^ /template/ Path#CheckGlyph">
             <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminatePointerOver}" />
           </Style>
         </Style>
 
         <!-- Indeterminate Pressed State -->
-        <Style Selector="^:pressed /template/">
-          <Style Selector="^ ContentPresenter#ContentPresenter">
+        <Style Selector="^:pressed">
+          <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
             <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminatePressed}" />
           </Style>
 
-          <Style Selector="^ Border#PART_Border">
+          <Style Selector="^ /template/ Border#PART_Border">
             <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminatePressed}" />
             <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminatePressed}" />
           </Style>
 
-          <Style Selector="^ Border#NormalRectangle">
+          <Style Selector="^ /template/ Border#NormalRectangle">
             <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminatePressed}" />
             <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminatePressed}" />
           </Style>
 
-          <Style Selector="^ Path#CheckGlyph">
+          <Style Selector="^ /template/ Path#CheckGlyph">
             <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminatePressed}" />
           </Style>
         </Style>
 
         <!-- Indeterminate Disabled State -->
-        <Style Selector="^:disabled /template/">
-          <Style Selector="^ ContentPresenter#ContentPresenter">
+        <Style Selector="^:disabled">
+          <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
             <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminateDisabled}" />
           </Style>
 
-          <Style Selector="^ Border#PART_Border">
+          <Style Selector="^ /template/ Border#PART_Border">
             <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminateDisabled}" />
             <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminateDisabled}" />
           </Style>
 
-          <Style Selector="^ Border#NormalRectangle">
+          <Style Selector="^ /template/ Border#NormalRectangle">
             <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminateDisabled}" />
             <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminateDisabled}" />
           </Style>
 
-          <Style Selector="^ Path#CheckGlyph">
+          <Style Selector="^ /template/ Path#CheckGlyph">
             <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminateDisabled}" />
           </Style>
         </Style>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml b/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
index 2dc7439001..8ef8388cf1 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
@@ -144,17 +144,15 @@
       </Setter>
 
       <!--  Normal State  -->
-      <Style Selector="^ /template/">
-        <Style Selector="^ TextBlock#PlaceholderTextBlock">
-          <Setter Property="Foreground" Value="{DynamicResource ComboBoxPlaceHolderForeground}" />
-        </Style>
-        <Style Selector="^ Border#HighlightBackground">
-          <Setter Property="IsVisible" Value="False" />
-        </Style>
-        <Style Selector="^ PathIcon#DropDownGlyph">
-          <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForeground}" />
-          <Setter Property="Data" Value="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" />
-        </Style>
+      <Style Selector="^ /template/ TextBlock#PlaceholderTextBlock">
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxPlaceHolderForeground}" />
+      </Style>
+      <Style Selector="^ /template/ Border#HighlightBackground">
+        <Setter Property="IsVisible" Value="False" />
+      </Style>
+      <Style Selector="^ /template/ PathIcon#DropDownGlyph">
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForeground}" />
+        <Setter Property="Data" Value="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" />
       </Style>
 
       <!--  PointerOver State  -->
@@ -175,51 +173,51 @@
       </Style>
 
       <!--  Focus Pressed State  -->
-      <Style Selector="^:focused:pressed /template/">
-        <Style Selector="^ ContentControl#ContentPresenter">
+      <Style Selector="^:focused:pressed">
+        <Style Selector="^ /template/ ContentControl#ContentPresenter">
           <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocusedPressed}" />
         </Style>
-        <Style Selector="^ TextBlock#PlaceholderTextBlock">
+        <Style Selector="^ /template/ TextBlock#PlaceholderTextBlock">
           <Setter Property="Foreground" Value="{DynamicResource ComboBoxPlaceHolderForegroundFocusedPressed}" />
         </Style>
-        <Style Selector="^ PathIcon#DropDownGlyph">
+        <Style Selector="^ /template/ PathIcon#DropDownGlyph">
           <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundFocusedPressed}" />
         </Style>
       </Style>
 
       <!--  Focused State  -->
-      <Style Selector="^:focus-visible /template/">
-        <Style Selector="^ Border#HighlightBackground">
+      <Style Selector="^:focus-visible">
+        <Style Selector="^ /template/ Border#HighlightBackground">
           <Setter Property="IsVisible" Value="True" />
           <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBackgroundBorderBrushFocused}" />
         </Style>
-        <Style Selector="^ ContentControl#ContentPresenter">
+        <Style Selector="^ /template/ ContentControl#ContentPresenter">
           <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocused}" />
         </Style>
-        <Style Selector="^ TextBlock#PlaceholderTextBlock">
+        <Style Selector="^ /template/ TextBlock#PlaceholderTextBlock">
           <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocused}" />
         </Style>
-        <Style Selector="^ PathIcon#DropDownGlyph">
+        <Style Selector="^ /template/ PathIcon#DropDownGlyph">
           <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundFocused}" />
         </Style>
       </Style>
 
       <!--  Disabled State  -->
-      <Style Selector="^:disabled /template/">
-        <Style Selector="^ Border#Background">
+      <Style Selector="^:disabled">
+        <Style Selector="^ /template/ Border#Background">
           <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundDisabled}" />
           <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushDisabled}" />
         </Style>
-        <Style Selector="^ ContentPresenter#HeaderContentPresenter">
+        <Style Selector="^ /template/ ContentPresenter#HeaderContentPresenter">
           <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
         </Style>
-        <Style Selector="^ ContentControl#ContentPresenter">
+        <Style Selector="^ /template/ ContentControl#ContentPresenter">
           <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
         </Style>
-        <Style Selector="^ TextBlock#PlaceholderTextBlock">
+        <Style Selector="^ /template/ TextBlock#PlaceholderTextBlock">
           <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
         </Style>
-        <Style Selector="^ PathIcon#DropDownGlyph">
+        <Style Selector="^ /template/ PathIcon#DropDownGlyph">
           <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundDisabled}" />
         </Style>
       </Style>
diff --git a/src/Avalonia.Themes.Fluent/Controls/Slider.xaml b/src/Avalonia.Themes.Fluent/Controls/Slider.xaml
index b468f7f4ad..c74878e8be 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Slider.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Slider.xaml
@@ -283,17 +283,15 @@
 
     <!--  Normal State  -->
 
-    <Style Selector="^ /template/">
-      <Style Selector="^Thumb.SliderThumbStyle">
-        <Setter Property="Background" Value="{DynamicResource SliderThumbBackground}" />
-      </Style>
-      <Style Selector="^Grid#SliderContainer">
-        <Setter Property="Background" Value="{DynamicResource SliderContainerBackground}" />
-      </Style>
-      <Style Selector="^TickBar">
-        <Setter Property="IsVisible" Value="False" />
-        <Setter Property="Fill" Value="{DynamicResource SliderTickBarFill}" />
-      </Style>
+    <Style Selector="^ /template/ Thumb.SliderThumbStyle">
+      <Setter Property="Background" Value="{DynamicResource SliderThumbBackground}" />
+    </Style>
+    <Style Selector="^ /template/ Grid#SliderContainer">
+      <Setter Property="Background" Value="{DynamicResource SliderContainerBackground}" />
+    </Style>
+    <Style Selector="^/template/ TickBar">
+      <Setter Property="IsVisible" Value="False" />
+      <Setter Property="Fill" Value="{DynamicResource SliderTickBarFill}" />
     </Style>
 
     <!--  TickBar Placement States  -->
@@ -316,70 +314,70 @@
 
     <!--  Disabled State  -->
 
-    <Style Selector="^:disabled /template/">
-      <Style Selector="^ContentPresenter#HeaderContentPresenter">
+    <Style Selector="^:disabled">
+      <Style Selector="^ /template/ ContentPresenter#HeaderContentPresenter">
         <Setter Property="Foreground" Value="{DynamicResource SliderHeaderForegroundDisabled}" />
       </Style>
-      <Style Selector="^RepeatButton#PART_DecreaseButton">
+      <Style Selector="^ /template/ RepeatButton#PART_DecreaseButton">
         <Setter Property="Background" Value="{DynamicResource SliderTrackValueFillDisabled}" />
       </Style>
 
-      <Style Selector="^RepeatButton#PART_IncreaseButton">
+      <Style Selector="^ /template/ RepeatButton#PART_IncreaseButton">
         <Setter Property="Background" Value="{DynamicResource SliderTrackFillDisabled}" />
       </Style>
 
-      <Style Selector="^Thumb.SliderThumbStyle">
+      <Style Selector="^ /template/ Thumb.SliderThumbStyle">
         <Setter Property="Background" Value="{DynamicResource SliderThumbBackgroundDisabled}" />
       </Style>
 
-      <Style Selector="^TickBar">
+      <Style Selector="^ /template/ TickBar">
         <Setter Property="Fill" Value="{DynamicResource SliderTickBarFillDisabled}" />
       </Style>
     </Style>
 
     <!--  PointerOver State  -->
-    <Style Selector="^:pointerover /template/">
-      <Style Selector="^Grid#SliderContainer">
+    <Style Selector="^:pointerover">
+      <Style Selector="^ /template/ Grid#SliderContainer">
         <Setter Property="Background" Value="{DynamicResource SliderContainerBackgroundDisabled}" />
       </Style>
-      <Style Selector="^RepeatButton#PART_IncreaseButton">
+      <Style Selector="^ /template/ RepeatButton#PART_IncreaseButton">
         <Setter Property="Background" Value="{DynamicResource SliderTrackFillPointerOver}" />
       </Style>
 
-      <Style Selector="^Thumb.SliderThumbStyle">
+      <Style Selector="^ /template/ Thumb.SliderThumbStyle">
           <Setter Property="Background" Value="{DynamicResource SliderThumbBackgroundPointerOver}" />
       </Style>
 
-      <Style Selector="^Grid#SliderContainer">
+      <Style Selector="^ /template/ Grid#SliderContainer">
           <Setter Property="Background" Value="{DynamicResource SliderContainerBackgroundPointerOver}" />
       </Style>
 
-      <Style Selector="^RepeatButton#PART_DecreaseButton">
+      <Style Selector="^ /template/ RepeatButton#PART_DecreaseButton">
           <Setter Property="Background" Value="{DynamicResource SliderTrackValueFillPointerOver}" />
       </Style>
     
     </Style>
 
     <!--  Pressed State  -->
-    <Style Selector="^:pressed /template/">
-      <Style Selector="^Grid#SliderContainer">
+    <Style Selector="^:pressed">
+      <Style Selector="^ /template/ Grid#SliderContainer">
         <Setter Property="Background" Value="{DynamicResource SliderContainerBackgroundPressed}" />
       </Style>
-      <Style Selector="^RepeatButton#PART_DecreaseButton">
+      <Style Selector="^ /template/ RepeatButton#PART_DecreaseButton">
         <Setter Property="Background" Value="{DynamicResource SliderTrackValueFillPressed}" />
       </Style>
-      <Style Selector="^RepeatButton#PART_IncreaseButton">
+      <Style Selector="^ /template/ RepeatButton#PART_IncreaseButton">
         <Setter Property="Background" Value="{DynamicResource SliderTrackFillPressed}" />
       </Style>
 
-      <Style Selector="^Thumb.SliderThumbStyle">
+      <Style Selector="^ /template/ Thumb.SliderThumbStyle">
         <Setter Property="Background" Value="{DynamicResource SliderThumbBackgroundPressed}" />
       </Style>
     </Style>
 
     <Style Selector="^:error">
       <Setter Property="Foreground" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
-      <Style Selector="^/template/ Thumb.SliderThumbStyle">
+      <Style Selector="^ /template/ Thumb.SliderThumbStyle">
         <Setter Property="Background" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
       </Style>
     </Style>
diff --git a/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml b/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml
index 69b2d32dda..dc09032a36 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml
@@ -82,11 +82,11 @@
           <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForegroundDisabled}" />
         </Style>
       </Style>-->
-      <Style Selector="^:disabled /template/">
-        <Style Selector="^ ContentPresenter#HeaderContentPresenter">
+      <Style Selector="^:disabled">
+        <Style Selector="^ /template/ ContentPresenter#HeaderContentPresenter">
           <Setter Property="Foreground" Value="{DynamicResource TimePickerHeaderForegroundDisabled}" />
         </Style>
-        <Style Selector="^ Rectangle">
+        <Style Selector="^ /template/ Rectangle">
           <Setter Property="Fill" Value="{DynamicResource TimePickerSpacerFillDisabled}" />
         </Style>
       </Style>

From 671b7ea83e75a2b442a4ee0d5877c0e269dfbc48 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Thu, 7 Jul 2022 11:50:33 +0200
Subject: [PATCH 03/70] WIP: HamburgerMenu.

---
 samples/ControlCatalog/App.xaml               |   8 +-
 .../HamburgerMenu/HamburgerMenu.xaml          | 260 +++++++++---------
 2 files changed, 139 insertions(+), 129 deletions(-)

diff --git a/samples/ControlCatalog/App.xaml b/samples/ControlCatalog/App.xaml
index d0e1bd885e..c7ad72d2c5 100644
--- a/samples/ControlCatalog/App.xaml
+++ b/samples/ControlCatalog/App.xaml
@@ -5,6 +5,13 @@
              x:CompileBindings="True"
              Name="Avalonia ControlCatalog"
              x:Class="ControlCatalog.App">
+  <Application.Resources>
+    <ResourceDictionary>
+      <ResourceDictionary.MergedDictionaries>
+        <ResourceInclude Source="avares://ControlSamples/HamburgerMenu/HamburgerMenu.xaml" />
+      </ResourceDictionary.MergedDictionaries>
+    </ResourceDictionary>
+  </Application.Resources>
   <Application.Styles>
     <Style Selector="TextBlock.h1, TextBlock.h2, TextBlock.h3">
       <Setter Property="TextWrapping" Value="Wrap" />
@@ -29,7 +36,6 @@
     <Style Selector="Label.h3">
       <Setter Property="FontSize" Value="12" />
     </Style>
-    <StyleInclude Source="avares://ControlSamples/HamburgerMenu/HamburgerMenu.xaml" />
   </Application.Styles>
   <TrayIcon.Icons>
     <TrayIcons>
diff --git a/samples/SampleControls/HamburgerMenu/HamburgerMenu.xaml b/samples/SampleControls/HamburgerMenu/HamburgerMenu.xaml
index 1d58c465a0..5f8bfe4fb5 100644
--- a/samples/SampleControls/HamburgerMenu/HamburgerMenu.xaml
+++ b/samples/SampleControls/HamburgerMenu/HamburgerMenu.xaml
@@ -1,6 +1,6 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        xmlns:catalog="using:ControlSamples">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:catalog="using:ControlSamples">
   <Design.PreviewWith>
     <Border Width="400"
             Height="150">
@@ -20,21 +20,84 @@
     </Border>
   </Design.PreviewWith>
 
-  <Styles.Resources>
-    <x:Double x:Key="PaneCompactWidth">40</x:Double>
-    <x:Double x:Key="PaneExpandWidth">220</x:Double>
-    <x:Double x:Key="HeaderHeight">36</x:Double>
-    <x:Double x:Key="NavigationItemHeight">36</x:Double>
-    <x:Double x:Key="HamburgerMenuButtonHeight">32</x:Double>
-    <Thickness x:Key="HeaderMarginCollapsedPane">12,0,0,0</Thickness>
-    <Thickness x:Key="HeaderMarginExpandedPane">52,0,0,0</Thickness>
-    <Thickness x:Key="HeaderMarginExpandedOverlayPane">212,0,0,0</Thickness>
-    <BoxShadows x:Key="NavigationItemShadow">1 1 1 1 #2000, 0 0 1 1 #2fff</BoxShadows>
-    <BoxShadows x:Key="NavigationContentShadow">0 0 1 1 #2000</BoxShadows>
-  </Styles.Resources>
+  <x:Double x:Key="PaneCompactWidth">40</x:Double>
+  <x:Double x:Key="PaneExpandWidth">220</x:Double>
+  <x:Double x:Key="HeaderHeight">36</x:Double>
+  <x:Double x:Key="NavigationItemHeight">36</x:Double>
+  <x:Double x:Key="HamburgerMenuButtonHeight">32</x:Double>
+  <Thickness x:Key="HeaderMarginCollapsedPane">12,0,0,0</Thickness>
+  <Thickness x:Key="HeaderMarginExpandedPane">52,0,0,0</Thickness>
+  <Thickness x:Key="HeaderMarginExpandedOverlayPane">212,0,0,0</Thickness>
+  <BoxShadows x:Key="NavigationItemShadow">1 1 1 1 #2000, 0 0 1 1 #2fff</BoxShadows>
+  <BoxShadows x:Key="NavigationContentShadow">0 0 1 1 #2000</BoxShadows>
 
+  <ControlTheme x:Key="NavigationButton" TargetType="Button" BasedOn="{StaticResource {x:Type Button}}">
+    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
+    <Setter Property="VerticalContentAlignment" Value="Center" />
+    <Setter Property="HorizontalAlignment" Value="Stretch" />
+    <Setter Property="VerticalAlignment" Value="Stretch" />
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="FontWeight" Value="Normal" />
+    <Setter Property="MinHeight" Value="0" />
+    <Setter Property="Height" Value="{StaticResource NavigationItemHeight}" />
+    <Setter Property="Background" Value="Transparent" />
+    <Setter Property="Padding" Value="12,0,4,0" />
+    <Setter Property="Margin" Value="4,0,8,0" />
+    <Setter Property="CornerRadius" Value="8" />
+    <Setter Property="ClipToBounds" Value="False" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <ContentPresenter Name="PART_ContentPresenter"
+                          Padding="{TemplateBinding Padding}"
+                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                          Background="{TemplateBinding Background}"
+                          BorderBrush="{TemplateBinding BorderBrush}"
+                          BorderThickness="{TemplateBinding BorderThickness}"
+                          Content="{TemplateBinding Content}"
+                          ContentTemplate="{TemplateBinding ContentTemplate}"
+                          CornerRadius="{TemplateBinding CornerRadius}"
+                          TextElement.FontFamily="{TemplateBinding FontFamily}"
+                          TextElement.FontSize="{TemplateBinding FontSize}"
+                          TextElement.FontWeight="{TemplateBinding FontWeight}" />
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
+
+  <ControlTheme x:Key="HamburgerMenuTabItem" TargetType="TabItem">
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Name="PART_LayoutRoot"
+                HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
+                Background="{TemplateBinding Background}"
+                BorderBrush="{TemplateBinding BorderBrush}"
+                BorderThickness="{TemplateBinding BorderThickness}"
+                CornerRadius="{TemplateBinding CornerRadius}">
+          <Panel>
+            <Border Name="PART_SelectedPipe"
+                    Width="{DynamicResource TabItemPipeThickness}"
+                    Height="{DynamicResource TabItemVerticalPipeHeight}"
+                    Margin="6,0,0,0"
+                    HorizontalAlignment="Left"
+                    VerticalAlignment="Center"
+                    Background="{DynamicResource TabItemHeaderSelectedPipeFill}" />
+            <ContentPresenter Name="PART_ContentPresenter"
+                              Padding="{TemplateBinding Padding}"
+                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                              Content="{TemplateBinding Header}"
+                              ContentTemplate="{TemplateBinding HeaderTemplate}"
+                              TextElement.FontFamily="{TemplateBinding FontFamily}"
+                              TextElement.FontSize="{TemplateBinding FontSize}"
+                              TextElement.FontWeight="{TemplateBinding FontWeight}" />
+          </Panel>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
+  
   <!--  HamburgerMenu  -->
-  <Style Selector="catalog|HamburgerMenu">
+  <ControlTheme x:Key="{x:Type catalog:HamburgerMenu}" TargetType="catalog:HamburgerMenu">
     <Setter Property="Padding" Value="12 8 4 0" />
     <Setter Property="PaneBackground" Value="{DynamicResource SystemChromeMediumColor}" />
     <Setter Property="Background" Value="{DynamicResource SystemChromeMediumColor}" />
@@ -60,6 +123,11 @@
                                   ItemTemplate="{TemplateBinding ItemTemplate}"
                                   Items="{TemplateBinding Items}"
                                   ItemsPanel="{TemplateBinding ItemsPanel}">
+                    <ItemsPresenter.Styles>
+                      <Style Selector="catalog|HamburgerMenu > TabItem">
+                        <Setter Property="Theme" Value="{StaticResource HamburgerMenuTabItem}"/>
+                      </Style>
+                    </ItemsPresenter.Styles>
                     <ItemsPresenter.ItemsPanel>
                       <ItemsPanelTemplate>
                         <StackPanel x:Name="HamburgerItemsPanel"
@@ -70,7 +138,7 @@
                 </ScrollViewer>
                 <Button x:Name="SettingsButton"
                         Grid.Row="2"
-                        Classes="NavigationButton"
+                        Theme="{StaticResource NavigationButton}"
                         Content="Settings"
                         Flyout="{TemplateBinding (FlyoutBase.AttachedFlyout)}"
                         IsVisible="{Binding $parent[TabControl].(FlyoutBase.AttachedFlyout), Converter={x:Static ObjectConverters.IsNotNull}}" />
@@ -127,116 +195,52 @@
         </Panel>
       </ControlTemplate>
     </Setter>
-  </Style>
 
-  <Style Selector="catalog|HamburgerMenu /template/ SplitView TextBlock#HeaderHolder">
-    <Setter Property="Margin" Value="{StaticResource HeaderMarginExpandedPane}" />
-  </Style>
-  <Style Selector="catalog|HamburgerMenu /template/ SplitView[IsPaneOpen=True] TextBlock#HeaderHolder">
-    <Setter Property="Margin" Value="{StaticResource HeaderMarginCollapsedPane}" />
-  </Style>
-  <Style Selector="catalog|HamburgerMenu /template/ SplitView[DisplayMode=Overlay][IsPaneOpen=True] TextBlock#HeaderHolder">
-    <Setter Property="Margin" Value="{StaticResource HeaderMarginExpandedOverlayPane}" />
-  </Style>
-  <Style Selector="catalog|HamburgerMenu /template/ SplitView">
-    <Setter Property="PaneBackground" Value="Transparent" />
-  </Style>
-  <Style Selector="catalog|HamburgerMenu /template/ SplitView[DisplayMode=Overlay]">
-    <Setter Property="PaneBackground" Value="{TemplateBinding PaneBackground}" />
-  </Style>
-  <Style Selector="catalog|HamburgerMenu /template/ SplitView[DisplayMode=Overlay]">
-    <Setter Property="Background" Value="{Binding $parent[TabControl].ContentBackground}" />
-  </Style>
-  <Style Selector="catalog|HamburgerMenu /template/ SplitView[DisplayMode=Inline] Border#BackgroundBorder">
-    <Setter Property="Background" Value="{Binding $parent[TabControl].ContentBackground}" />
-    <Setter Property="BoxShadow" Value="{StaticResource NavigationContentShadow}" />
-  </Style>
-  <Style Selector="catalog|HamburgerMenu /template/ SplitView[DisplayMode=Inline][IsPaneOpen=True] Border#BackgroundBorder">
-    <Setter Property="CornerRadius" Value="8 0 0 0" />
-  </Style>
+    <Style Selector="^ /template/ SplitView TextBlock#HeaderHolder">
+      <Setter Property="Margin" Value="{StaticResource HeaderMarginExpandedPane}" />
+    </Style>
+    <Style Selector="^ /template/ SplitView[IsPaneOpen=True] TextBlock#HeaderHolder">
+      <Setter Property="Margin" Value="{StaticResource HeaderMarginCollapsedPane}" />
+    </Style>
+    <Style Selector="^ /template/ SplitView[DisplayMode=Overlay][IsPaneOpen=True] TextBlock#HeaderHolder">
+      <Setter Property="Margin" Value="{StaticResource HeaderMarginExpandedOverlayPane}" />
+    </Style>
+    <Style Selector="^ /template/ SplitView">
+      <Setter Property="PaneBackground" Value="Transparent" />
+    </Style>
+    <Style Selector="^ /template/ SplitView[DisplayMode=Overlay]">
+      <Setter Property="PaneBackground" Value="{TemplateBinding PaneBackground}" />
+    </Style>
+    <Style Selector="^ /template/ SplitView[DisplayMode=Overlay]">
+      <Setter Property="Background" Value="{Binding $parent[TabControl].ContentBackground}" />
+    </Style>
+    <Style Selector="^ /template/ SplitView[DisplayMode=Inline] Border#BackgroundBorder">
+      <Setter Property="Background" Value="{Binding $parent[TabControl].ContentBackground}" />
+      <Setter Property="BoxShadow" Value="{StaticResource NavigationContentShadow}" />
+    </Style>
+    <Style Selector="^ /template/ SplitView[DisplayMode=Inline][IsPaneOpen=True] Border#BackgroundBorder">
+      <Setter Property="CornerRadius" Value="8 0 0 0" />
+    </Style>
+    <!--<Style Selector="^ > TabItem">
+      
+    </Style>-->
+    <!--<Style Selector="^ > TabItem /template/ Border#PART_LayoutRoot, :is(Button).NavigationButton /template/ ContentPresenter">
+      <Setter Property="Border.Background" Value="Transparent" />
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource SystemBaseHighColor}" />
+    </Style>
+    <Style Selector="^ > TabItem:pointerover /template/ Border#PART_LayoutRoot, :is(Button).NavigationButton:pointerover /template/ ContentPresenter">
+      <Setter Property="Border.Background" Value="{DynamicResource SystemChromeLowColor}" />
+      <Setter Property="Border.BoxShadow" Value="{StaticResource NavigationItemShadow}" />
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPointerOver}" />
+    </Style>
+    <Style Selector="^ > TabItem:pressed /template/ Border#PART_LayoutRoot, :is(Button).NavigationButton:pressed /template/ ContentPresenter">
+      <Setter Property="Border.Background" Value="{DynamicResource SystemChromeLowColor}" />
+      <Setter Property="Border.BoxShadow" Value="{StaticResource NavigationItemShadow}" />
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPressed}" />
+    </Style>
+    <Style Selector=":is(Button).NavigationButton:pressed">
+      <Setter Property="RenderTransform" Value="none" />
+    </Style>-->
+  </ControlTheme>
 
-
-  <!--  HamburgerMenu TabItem  -->
-  <Style Selector="catalog|HamburgerMenu > TabItem, :is(Button).NavigationButton">
-    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
-    <Setter Property="VerticalContentAlignment" Value="Center" />
-    <Setter Property="HorizontalAlignment" Value="Stretch" />
-    <Setter Property="VerticalAlignment" Value="Stretch" />
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-    <Setter Property="FontWeight" Value="Normal" />
-    <Setter Property="MinHeight" Value="0" />
-    <Setter Property="Height" Value="{StaticResource NavigationItemHeight}" />
-    <Setter Property="Background" Value="Transparent" />
-    <Setter Property="Padding" Value="12,0,4,0" />
-    <Setter Property="Margin" Value="4,0,8,0" />
-    <Setter Property="CornerRadius" Value="8" />
-    <Setter Property="ClipToBounds" Value="False" />
-  </Style>
-  <Style Selector="catalog|HamburgerMenu > TabItem">
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border Name="PART_LayoutRoot"
-                HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
-                Background="{TemplateBinding Background}"
-                BorderBrush="{TemplateBinding BorderBrush}"
-                BorderThickness="{TemplateBinding BorderThickness}"
-                CornerRadius="{TemplateBinding CornerRadius}">
-          <Panel>
-            <Border Name="PART_SelectedPipe"
-                    Width="{DynamicResource TabItemPipeThickness}"
-                    Height="{DynamicResource TabItemVerticalPipeHeight}"
-                    Margin="6,0,0,0"
-                    HorizontalAlignment="Left"
-                    VerticalAlignment="Center"
-                    Background="{DynamicResource TabItemHeaderSelectedPipeFill}" />
-            <ContentPresenter Name="PART_ContentPresenter"
-                              Padding="{TemplateBinding Padding}"
-                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                              Content="{TemplateBinding Header}"
-                              ContentTemplate="{TemplateBinding HeaderTemplate}"
-                              TextElement.FontFamily="{TemplateBinding FontFamily}"
-                              TextElement.FontSize="{TemplateBinding FontSize}"
-                              TextElement.FontWeight="{TemplateBinding FontWeight}" />
-          </Panel>
-        </Border>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-  <Style Selector=":is(Button).NavigationButton">
-    <Setter Property="Template">
-      <ControlTemplate>
-        <ContentPresenter Name="PART_ContentPresenter"
-                          Padding="{TemplateBinding Padding}"
-                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                          Background="{TemplateBinding Background}"
-                          BorderBrush="{TemplateBinding BorderBrush}"
-                          BorderThickness="{TemplateBinding BorderThickness}"
-                          Content="{TemplateBinding Content}"
-                          ContentTemplate="{TemplateBinding ContentTemplate}"
-                          CornerRadius="{TemplateBinding CornerRadius}"
-                          TextElement.FontFamily="{TemplateBinding FontFamily}"
-                          TextElement.FontSize="{TemplateBinding FontSize}"
-                          TextElement.FontWeight="{TemplateBinding FontWeight}" />
-      </ControlTemplate>
-    </Setter>
-  </Style>
-  <Style Selector="catalog|HamburgerMenu > TabItem /template/ Border#PART_LayoutRoot, :is(Button).NavigationButton /template/ ContentPresenter">
-    <Setter Property="Border.Background" Value="Transparent" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource SystemBaseHighColor}" />
-  </Style>
-  <Style Selector="catalog|HamburgerMenu > TabItem:pointerover /template/ Border#PART_LayoutRoot, :is(Button).NavigationButton:pointerover /template/ ContentPresenter">
-    <Setter Property="Border.Background" Value="{DynamicResource SystemChromeLowColor}" />
-    <Setter Property="Border.BoxShadow" Value="{StaticResource NavigationItemShadow}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPointerOver}" />
-  </Style>
-  <Style Selector="catalog|HamburgerMenu > TabItem:pressed /template/ Border#PART_LayoutRoot, :is(Button).NavigationButton:pressed /template/ ContentPresenter">
-    <Setter Property="Border.Background" Value="{DynamicResource SystemChromeLowColor}" />
-    <Setter Property="Border.BoxShadow" Value="{StaticResource NavigationItemShadow}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPressed}" />
-  </Style>
-  <Style Selector=":is(Button).NavigationButton:pressed">
-    <Setter Property="RenderTransform" Value="none" />
-  </Style>
-</Styles>
+</ResourceDictionary>

From f57c0ffbecafab9cc3b2b7996676694150b7b1af Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Thu, 7 Jul 2022 17:06:44 +0200
Subject: [PATCH 04/70] Added ItemContainerTheme property.

Otherwise there's no easy way to apply themes to item containers.
---
 .../Generators/IItemContainerGenerator.cs     |  6 +++
 .../Generators/ItemContainerGenerator.cs      | 16 ++++++-
 .../Generators/ItemContainerGenerator`1.cs    | 21 ++++-----
 .../Generators/TreeItemContainerGenerator.cs  |  5 +++
 src/Avalonia.Controls/ItemsControl.cs         | 21 +++++++++
 src/Avalonia.Controls/TreeViewItem.cs         |  5 +++
 .../ItemsControlTests.cs                      | 28 +++++++++---
 .../ListBoxTests.cs                           | 44 +++++++++++++++++++
 .../TreeViewTests.cs                          | 29 ++++++++++++
 9 files changed, 159 insertions(+), 16 deletions(-)

diff --git a/src/Avalonia.Controls/Generators/IItemContainerGenerator.cs b/src/Avalonia.Controls/Generators/IItemContainerGenerator.cs
index 70d9dbec08..f9772cb399 100644
--- a/src/Avalonia.Controls/Generators/IItemContainerGenerator.cs
+++ b/src/Avalonia.Controls/Generators/IItemContainerGenerator.cs
@@ -1,6 +1,7 @@
 using System;
 using System.Collections.Generic;
 using Avalonia.Controls.Templates;
+using Avalonia.Styling;
 
 namespace Avalonia.Controls.Generators
 {
@@ -14,6 +15,11 @@ namespace Avalonia.Controls.Generators
         /// </summary>
         IEnumerable<ItemContainerInfo> Containers { get; }
 
+        /// <summary>
+        /// Gets or sets the theme to be applied to the items in the control.
+        /// </summary>
+        ControlTheme? ItemContainerTheme { get; set; }
+
         /// <summary>
         /// Gets or sets the data template used to display the items in the control.
         /// </summary>
diff --git a/src/Avalonia.Controls/Generators/ItemContainerGenerator.cs b/src/Avalonia.Controls/Generators/ItemContainerGenerator.cs
index a76dcbe9c8..8b36b07cec 100644
--- a/src/Avalonia.Controls/Generators/ItemContainerGenerator.cs
+++ b/src/Avalonia.Controls/Generators/ItemContainerGenerator.cs
@@ -4,6 +4,7 @@ using System.Linq;
 using Avalonia.Controls.Presenters;
 using Avalonia.Controls.Templates;
 using Avalonia.Data;
+using Avalonia.Styling;
 
 namespace Avalonia.Controls.Generators
 {
@@ -35,6 +36,11 @@ namespace Avalonia.Controls.Generators
         /// <inheritdoc/>
         public event EventHandler<ItemContainerEventArgs>? Recycled;
 
+        /// <summary>
+        /// Gets or sets the theme to be applied to the items in the control.
+        /// </summary>
+        public ControlTheme? ItemContainerTheme { get; set; }
+
         /// <summary>
         /// Gets or sets the data template used to display the items in the control.
         /// </summary>
@@ -190,10 +196,18 @@ namespace Avalonia.Controls.Generators
                     result.SetValue(
                         ContentPresenter.ContentTemplateProperty,
                         ItemTemplate,
-                        BindingPriority.TemplatedParent);
+                        BindingPriority.Style);
                 }
             }
 
+            if (ItemContainerTheme != null)
+            {
+                result.SetValue(
+                    StyledElement.ThemeProperty,
+                    ItemContainerTheme,
+                    BindingPriority.TemplatedParent);
+            }
+
             return result;
         }
 
diff --git a/src/Avalonia.Controls/Generators/ItemContainerGenerator`1.cs b/src/Avalonia.Controls/Generators/ItemContainerGenerator`1.cs
index 635f3a7d37..3ff1b0702d 100644
--- a/src/Avalonia.Controls/Generators/ItemContainerGenerator`1.cs
+++ b/src/Avalonia.Controls/Generators/ItemContainerGenerator`1.cs
@@ -44,28 +44,29 @@ namespace Avalonia.Controls.Generators
         {
             var container = item as T;
 
-            if (container != null)
+            if (container is null)
             {
-                return container;
-            }
-            else
-            {
-                var result = new T();
+                container = new T();
 
                 if (ContentTemplateProperty != null)
                 {
-                    result.SetValue(ContentTemplateProperty, ItemTemplate, BindingPriority.Style);
+                    container.SetValue(ContentTemplateProperty, ItemTemplate, BindingPriority.Style);
                 }
 
-                result.SetValue(ContentProperty, item, BindingPriority.Style);
+                container.SetValue(ContentProperty, item, BindingPriority.Style);
 
                 if (!(item is IControl))
                 {
-                    result.DataContext = item;
+                    container.DataContext = item;
                 }
+            }
 
-                return result;
+            if (ItemContainerTheme != null)
+            {
+                container.SetValue(StyledElement.ThemeProperty, ItemContainerTheme, BindingPriority.Style);
             }
+
+            return container;
         }
 
         /// <inheritdoc/>
diff --git a/src/Avalonia.Controls/Generators/TreeItemContainerGenerator.cs b/src/Avalonia.Controls/Generators/TreeItemContainerGenerator.cs
index 536a5fdd06..4e3deb5552 100644
--- a/src/Avalonia.Controls/Generators/TreeItemContainerGenerator.cs
+++ b/src/Avalonia.Controls/Generators/TreeItemContainerGenerator.cs
@@ -71,6 +71,11 @@ namespace Avalonia.Controls.Generators
                 var template = GetTreeDataTemplate(item, ItemTemplate);
                 var result = new T();
 
+                if (ItemContainerTheme != null)
+                {
+                    result.SetValue(Control.ThemeProperty, ItemContainerTheme, BindingPriority.Style);
+                }
+
                 result.SetValue(ContentProperty, template.Build(item), BindingPriority.Style);
 
                 var itemsSelector = template.ItemsSelector(item);
diff --git a/src/Avalonia.Controls/ItemsControl.cs b/src/Avalonia.Controls/ItemsControl.cs
index 56b0014c05..427f5c8a9b 100644
--- a/src/Avalonia.Controls/ItemsControl.cs
+++ b/src/Avalonia.Controls/ItemsControl.cs
@@ -15,6 +15,7 @@ using Avalonia.Input;
 using Avalonia.LogicalTree;
 using Avalonia.Metadata;
 using Avalonia.VisualTree;
+using Avalonia.Styling;
 
 namespace Avalonia.Controls
 {
@@ -36,6 +37,12 @@ namespace Avalonia.Controls
         public static readonly DirectProperty<ItemsControl, IEnumerable?> ItemsProperty =
             AvaloniaProperty.RegisterDirect<ItemsControl, IEnumerable?>(nameof(Items), o => o.Items, (o, v) => o.Items = v);
 
+        /// <summary>
+        /// Defines the <see cref="ItemContainerTheme"/> property.
+        /// </summary>
+        public static readonly StyledProperty<ControlTheme?> ItemContainerThemeProperty =
+            AvaloniaProperty.Register<ItemsControl, ControlTheme?>(nameof(ItemContainerTheme));
+
         /// <summary>
         /// Defines the <see cref="ItemCount"/> property.
         /// </summary>
@@ -88,6 +95,7 @@ namespace Avalonia.Controls
                 {
                     _itemContainerGenerator = CreateItemContainerGenerator();
 
+                    _itemContainerGenerator.ItemContainerTheme = ItemContainerTheme;
                     _itemContainerGenerator.ItemTemplate = ItemTemplate;
                     _itemContainerGenerator.Materialized += (_, e) => OnContainersMaterialized(e);
                     _itemContainerGenerator.Dematerialized += (_, e) => OnContainersDematerialized(e);
@@ -108,6 +116,15 @@ namespace Avalonia.Controls
             set { SetAndRaise(ItemsProperty, ref _items, value); }
         }
 
+        /// <summary>
+        /// Gets or sets the <see cref="ControlTheme"/> that is applied to the container element generated for each item.
+        /// </summary>
+        public ControlTheme? ItemContainerTheme
+        {
+            get { return GetValue(ItemContainerThemeProperty); }
+            set { SetValue(ItemContainerThemeProperty, value); }
+        }
+
         /// <summary>
         /// Gets the number of items in <see cref="Items"/>.
         /// </summary>
@@ -349,6 +366,10 @@ namespace Avalonia.Controls
             {
                 UpdatePseudoClasses(change.GetNewValue<int>());
             }
+            else if (change.Property == ItemContainerThemeProperty && _itemContainerGenerator is not null)
+            {
+                _itemContainerGenerator.ItemContainerTheme = change.GetNewValue<ControlTheme?>();
+            }
         }
 
         /// <summary>
diff --git a/src/Avalonia.Controls/TreeViewItem.cs b/src/Avalonia.Controls/TreeViewItem.cs
index 490b0b3ce3..2e3aa037c2 100644
--- a/src/Avalonia.Controls/TreeViewItem.cs
+++ b/src/Avalonia.Controls/TreeViewItem.cs
@@ -121,6 +121,11 @@ namespace Avalonia.Controls
             {
                 ItemTemplate = _treeView.ItemTemplate;
             }
+
+            if (ItemContainerTheme == null && _treeView?.ItemContainerTheme != null)
+            {
+                ItemContainerTheme = _treeView.ItemContainerTheme;
+            }
         }
 
         protected override void OnDetachedFromLogicalTree(LogicalTreeAttachmentEventArgs e)
diff --git a/tests/Avalonia.Controls.UnitTests/ItemsControlTests.cs b/tests/Avalonia.Controls.UnitTests/ItemsControlTests.cs
index bfece7871c..f08653a4f8 100644
--- a/tests/Avalonia.Controls.UnitTests/ItemsControlTests.cs
+++ b/tests/Avalonia.Controls.UnitTests/ItemsControlTests.cs
@@ -1,15 +1,14 @@
+using System.Collections.ObjectModel;
 using System.Collections.Specialized;
 using System.Linq;
 using Avalonia.Collections;
 using Avalonia.Controls.Presenters;
 using Avalonia.Controls.Templates;
+using Avalonia.Input;
 using Avalonia.LogicalTree;
-using Avalonia.VisualTree;
-using Xunit;
-using System.Collections.ObjectModel;
+using Avalonia.Styling;
 using Avalonia.UnitTests;
-using Avalonia.Input;
-using System.Collections.Generic;
+using Xunit;
 
 namespace Avalonia.Controls.UnitTests
 {
@@ -62,6 +61,25 @@ namespace Avalonia.Controls.UnitTests
             Assert.Null(container.TemplatedParent);
         }
 
+        [Fact]
+        public void Container_Should_Have_Theme_Set_To_ItemContainerTheme()
+        {
+            var theme = new ControlTheme();
+            var target = new ItemsControl
+            {
+                ItemContainerTheme = theme,
+            };
+
+            target.Template = GetTemplate();
+            target.Items = new[] { "Foo" };
+            target.ApplyTemplate();
+            target.Presenter.ApplyTemplate();
+
+            var container = (ContentPresenter)target.Presenter.Panel.Children[0];
+
+            Assert.Same(container.Theme, theme);
+        }
+
         [Fact]
         public void Container_Should_Have_LogicalParent_Set_To_ItemsControl()
         {
diff --git a/tests/Avalonia.Controls.UnitTests/ListBoxTests.cs b/tests/Avalonia.Controls.UnitTests/ListBoxTests.cs
index e87990ebb1..afa153a593 100644
--- a/tests/Avalonia.Controls.UnitTests/ListBoxTests.cs
+++ b/tests/Avalonia.Controls.UnitTests/ListBoxTests.cs
@@ -94,6 +94,50 @@ namespace Avalonia.Controls.UnitTests
             }
         }
 
+        [Fact]
+        public void Container_Should_Have_Theme_Set_To_ItemContainerTheme()
+        {
+            using (UnitTestApplication.Start(TestServices.MockPlatformRenderInterface))
+            {
+                var items = new[] { "Foo", "Bar", "Baz " };
+                var theme = new ControlTheme();
+                var target = new ListBox
+                {
+                    Template = ListBoxTemplate(),
+                    Items = items,
+                    ItemContainerTheme = theme,
+                };
+
+                Prepare(target);
+
+                var container = (ListBoxItem)target.Presenter.Panel.Children[0];
+
+                Assert.Same(container.Theme, theme);
+            }
+        }
+
+        [Fact]
+        public void Inline_Item_Should_Have_Theme_Set_To_ItemContainerTheme()
+        {
+            using (UnitTestApplication.Start(TestServices.MockPlatformRenderInterface))
+            {
+                var items = new[] { "Foo", "Bar", "Baz " };
+                var theme = new ControlTheme();
+                var target = new ListBox
+                {
+                    Template = ListBoxTemplate(),
+                    Items = new[] { new ListBoxItem() },
+                    ItemContainerTheme = theme,
+                };
+
+                Prepare(target);
+
+                var container = (ListBoxItem)target.Presenter.Panel.Children[0];
+
+                Assert.Same(container.Theme, theme);
+            }
+        }
+
         [Fact]
         public void LogicalChildren_Should_Be_Set_For_DataTemplate_Generated_Items()
         {
diff --git a/tests/Avalonia.Controls.UnitTests/TreeViewTests.cs b/tests/Avalonia.Controls.UnitTests/TreeViewTests.cs
index 2169b15cad..d784caf2db 100644
--- a/tests/Avalonia.Controls.UnitTests/TreeViewTests.cs
+++ b/tests/Avalonia.Controls.UnitTests/TreeViewTests.cs
@@ -72,6 +72,35 @@ namespace Avalonia.Controls.UnitTests
             Assert.All(items, x => Assert.IsType<Canvas>(x.HeaderPresenter.Child));
         }
 
+        [Fact]
+        public void Items_Should_Be_Created_Using_ItemConatinerTheme_If_Present()
+        {
+            TreeView target;
+            var theme = new ControlTheme();
+
+            var root = new TestRoot
+            {
+                Child = target = new TreeView
+                {
+                    Template = CreateTreeViewTemplate(),
+                    Items = CreateTestTreeData(),
+                    ItemContainerTheme = theme,
+                    ItemTemplate = new FuncTreeDataTemplate<Node>(
+                        (_, __) => new Canvas(),
+                        x => x.Children),
+                }
+            };
+
+            ApplyTemplates(target);
+
+            var items = target.ItemContainerGenerator.Index.Containers
+                .OfType<TreeViewItem>()
+                .ToList();
+
+            Assert.Equal(5, items.Count);
+            Assert.All(items, x => Assert.Same(theme, x.ItemContainerTheme));
+        }
+
         [Fact]
         public void Root_ItemContainerGenerator_Containers_Should_Be_Root_Containers()
         {

From 209797e5e1375c2c20a335d3bc2cf66810d9b129 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Thu, 7 Jul 2022 23:32:23 +0200
Subject: [PATCH 05/70] Ported HamburgerMenu to ControlTheme.

---
 .../HamburgerMenu/HamburgerMenu.xaml          | 89 +++++++++++--------
 1 file changed, 54 insertions(+), 35 deletions(-)

diff --git a/samples/SampleControls/HamburgerMenu/HamburgerMenu.xaml b/samples/SampleControls/HamburgerMenu/HamburgerMenu.xaml
index 5f8bfe4fb5..73f8e480f5 100644
--- a/samples/SampleControls/HamburgerMenu/HamburgerMenu.xaml
+++ b/samples/SampleControls/HamburgerMenu/HamburgerMenu.xaml
@@ -62,9 +62,28 @@
                           TextElement.FontWeight="{TemplateBinding FontWeight}" />
       </ControlTemplate>
     </Setter>
+
+    <Style Selector="^:pointerover /template/ ContentPresenter">
+      <Setter Property="Border.Background" Value="{DynamicResource SystemChromeLowColor}" />
+      <Setter Property="Border.BoxShadow" Value="{StaticResource NavigationItemShadow}" />
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPointerOver}" />
+    </Style>
   </ControlTheme>
 
   <ControlTheme x:Key="HamburgerMenuTabItem" TargetType="TabItem">
+    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
+    <Setter Property="VerticalContentAlignment" Value="Center" />
+    <Setter Property="HorizontalAlignment" Value="Stretch" />
+    <Setter Property="VerticalAlignment" Value="Stretch" />
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="FontWeight" Value="Normal" />
+    <Setter Property="MinHeight" Value="0" />
+    <Setter Property="Height" Value="{StaticResource NavigationItemHeight}" />
+    <Setter Property="Background" Value="Transparent" />
+    <Setter Property="Padding" Value="12,0,4,0" />
+    <Setter Property="Margin" Value="4,0,8,0" />
+    <Setter Property="CornerRadius" Value="8" />
+    <Setter Property="ClipToBounds" Value="False" />
     <Setter Property="Template">
       <ControlTemplate>
         <Border Name="PART_LayoutRoot"
@@ -80,9 +99,12 @@
                     Margin="6,0,0,0"
                     HorizontalAlignment="Left"
                     VerticalAlignment="Center"
-                    Background="{DynamicResource TabItemHeaderSelectedPipeFill}" />
+                    Background="{DynamicResource TabItemHeaderSelectedPipeFill}"
+                    IsVisible="False"
+                    CornerRadius="{DynamicResource ControlCornerRadius}"/>
             <ContentPresenter Name="PART_ContentPresenter"
                               Padding="{TemplateBinding Padding}"
+                              Margin="0"
                               HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                               VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                               Content="{TemplateBinding Header}"
@@ -94,14 +116,40 @@
         </Border>
       </ControlTemplate>
     </Setter>
+
+    <Style Selector="^:pointerover">
+      <Setter Property="Background" Value="{DynamicResource ThemeControlHighlightMidBrush}"/>
+      
+      <Style Selector="^ /template/ Border#PART_LayoutRoot">
+        <Setter Property="Background" Value="{DynamicResource SystemChromeLowColor}" />
+        <Setter Property="BoxShadow" Value="{StaticResource NavigationItemShadow}" />
+        <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPointerOver}" />
+      </Style>
+    </Style>
+    
+    <Style Selector="^:selected">
+      <Setter Property="Background" Value="{DynamicResource ThemeAccentBrush4}"/>
+
+      <Style Selector="^ /template/ Border#PART_SelectedPipe">
+        <Setter Property="IsVisible" Value="True" />
+      </Style>
+    </Style>
+
+    <Style Selector="^:pressed /template/ Border#PART_LayoutRoot">
+      <Setter Property="Border.Background" Value="{DynamicResource SystemChromeLowColor}" />
+      <Setter Property="Border.BoxShadow" Value="{StaticResource NavigationItemShadow}" />
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPressed}" />
+    </Style>
   </ControlTheme>
-  
+
   <!--  HamburgerMenu  -->
   <ControlTheme x:Key="{x:Type catalog:HamburgerMenu}" TargetType="catalog:HamburgerMenu">
     <Setter Property="Padding" Value="12 8 4 0" />
     <Setter Property="PaneBackground" Value="{DynamicResource SystemChromeMediumColor}" />
     <Setter Property="Background" Value="{DynamicResource SystemChromeMediumColor}" />
     <Setter Property="ContentBackground" Value="{DynamicResource SystemAltHighColor}" />
+    <Setter Property="ItemContainerTheme" Value="{StaticResource HamburgerMenuTabItem}"/>
+    <Setter Property="TabStripPlacement" Value="Left" />
     <Setter Property="Template">
       <ControlTemplate>
         <Panel Background="{TemplateBinding PaneBackground}">
@@ -109,7 +157,8 @@
                      CompactPaneLength="{StaticResource PaneCompactWidth}"
                      DisplayMode="Inline"
                      IsPaneOpen="True"
-                     OpenPaneLength="{StaticResource PaneExpandWidth}">
+                     OpenPaneLength="{StaticResource PaneExpandWidth}"
+                     PaneBackground="Transparent">
             <SplitView.Pane>
               <Grid Margin="0,0,1,5" RowDefinitions="Auto, *, Auto">
                 <Panel Height="{StaticResource HeaderHeight}" />
@@ -123,11 +172,6 @@
                                   ItemTemplate="{TemplateBinding ItemTemplate}"
                                   Items="{TemplateBinding Items}"
                                   ItemsPanel="{TemplateBinding ItemsPanel}">
-                    <ItemsPresenter.Styles>
-                      <Style Selector="catalog|HamburgerMenu > TabItem">
-                        <Setter Property="Theme" Value="{StaticResource HamburgerMenuTabItem}"/>
-                      </Style>
-                    </ItemsPresenter.Styles>
                     <ItemsPresenter.ItemsPanel>
                       <ItemsPanelTemplate>
                         <StackPanel x:Name="HamburgerItemsPanel"
@@ -150,6 +194,7 @@
                   <TextBlock x:Name="HeaderHolder"
                              VerticalAlignment="Center"
                              Classes="h1"
+                             Margin="{StaticResource HeaderMarginExpandedPane}"
                              Text="{Binding $parent[TabControl].SelectedItem.Header, FallbackValue=''}">
                     <TextBlock.Transitions>
                       <Transitions>
@@ -187,7 +232,7 @@
                         HorizontalAlignment="Left"
                         VerticalAlignment="Top"
                         HorizontalContentAlignment="Center"
-                        Classes="NavigationButton"
+                        Theme="{StaticResource NavigationButton}"
                         CornerRadius="4"
                         IsChecked="{Binding #PART_NavigationPane.IsPaneOpen, Mode=TwoWay}">
             <PathIcon Data="M3 17h18a1 1 0 0 1 .117 1.993L21 19H3a1 1 0 0 1-.117-1.993L3 17h18H3Zm0-6 18-.002a1 1 0 0 1 .117 1.993l-.117.007L3 13a1 1 0 0 1-.117-1.993L3 11l18-.002L3 11Zm0-6h18a1 1 0 0 1 .117 1.993L21 7H3a1 1 0 0 1-.117-1.993L3 5h18H3Z" Foreground="{TemplateBinding Foreground}" />
@@ -196,18 +241,12 @@
       </ControlTemplate>
     </Setter>
 
-    <Style Selector="^ /template/ SplitView TextBlock#HeaderHolder">
-      <Setter Property="Margin" Value="{StaticResource HeaderMarginExpandedPane}" />
-    </Style>
     <Style Selector="^ /template/ SplitView[IsPaneOpen=True] TextBlock#HeaderHolder">
       <Setter Property="Margin" Value="{StaticResource HeaderMarginCollapsedPane}" />
     </Style>
     <Style Selector="^ /template/ SplitView[DisplayMode=Overlay][IsPaneOpen=True] TextBlock#HeaderHolder">
       <Setter Property="Margin" Value="{StaticResource HeaderMarginExpandedOverlayPane}" />
     </Style>
-    <Style Selector="^ /template/ SplitView">
-      <Setter Property="PaneBackground" Value="Transparent" />
-    </Style>
     <Style Selector="^ /template/ SplitView[DisplayMode=Overlay]">
       <Setter Property="PaneBackground" Value="{TemplateBinding PaneBackground}" />
     </Style>
@@ -221,26 +260,6 @@
     <Style Selector="^ /template/ SplitView[DisplayMode=Inline][IsPaneOpen=True] Border#BackgroundBorder">
       <Setter Property="CornerRadius" Value="8 0 0 0" />
     </Style>
-    <!--<Style Selector="^ > TabItem">
-      
-    </Style>-->
-    <!--<Style Selector="^ > TabItem /template/ Border#PART_LayoutRoot, :is(Button).NavigationButton /template/ ContentPresenter">
-      <Setter Property="Border.Background" Value="Transparent" />
-      <Setter Property="TextElement.Foreground" Value="{DynamicResource SystemBaseHighColor}" />
-    </Style>
-    <Style Selector="^ > TabItem:pointerover /template/ Border#PART_LayoutRoot, :is(Button).NavigationButton:pointerover /template/ ContentPresenter">
-      <Setter Property="Border.Background" Value="{DynamicResource SystemChromeLowColor}" />
-      <Setter Property="Border.BoxShadow" Value="{StaticResource NavigationItemShadow}" />
-      <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPointerOver}" />
-    </Style>
-    <Style Selector="^ > TabItem:pressed /template/ Border#PART_LayoutRoot, :is(Button).NavigationButton:pressed /template/ ContentPresenter">
-      <Setter Property="Border.Background" Value="{DynamicResource SystemChromeLowColor}" />
-      <Setter Property="Border.BoxShadow" Value="{StaticResource NavigationItemShadow}" />
-      <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPressed}" />
-    </Style>
-    <Style Selector=":is(Button).NavigationButton:pressed">
-      <Setter Property="RenderTransform" Value="none" />
-    </Style>-->
   </ControlTheme>
 
 </ResourceDictionary>

From 59c58e567242f9641759ef1f1d5dc8380792e03b Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 11:47:26 +0200
Subject: [PATCH 06/70] Don't set Foreground in PathIcon theme.

It is more useful if this property inherits by default.
---
 src/Avalonia.Themes.Fluent/Controls/PathIcon.xaml | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/PathIcon.xaml b/src/Avalonia.Themes.Fluent/Controls/PathIcon.xaml
index 966c6c2632..b9967a1b44 100644
--- a/src/Avalonia.Themes.Fluent/Controls/PathIcon.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/PathIcon.xaml
@@ -9,7 +9,6 @@
       </StackPanel>
     </Design.PreviewWith>
     <ControlTheme x:Key="{x:Type PathIcon}" TargetType="PathIcon">
-      <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
       <Setter Property="Background" Value="Transparent" />
       <Setter Property="Height" Value="{DynamicResource IconElementThemeHeight}" />
       <Setter Property="Width" Value="{DynamicResource IconElementThemeWidth}" />

From 052cf699d00e30a51347845789bf20f1cd18965d Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 11:47:44 +0200
Subject: [PATCH 07/70] Ported ScrollBar to ControlTheme.

---
 .../Controls/FluentControls.xaml              |   2 +-
 .../Controls/ScrollBar.xaml                   | 521 +++++++++---------
 2 files changed, 252 insertions(+), 271 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
index 286b3e3fcd..d344fedf0a 100644
--- a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
@@ -34,6 +34,7 @@
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/PopupRoot.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/PathIcon.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/RepeatButton.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ScrollBar.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Separator.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabControl.xaml" />
@@ -64,7 +65,6 @@
     <!--  Define ToolTip first so its styles can be overriden by other controls (e.g. TextBox)  -->
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/FocusAdorner.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/MenuItem.xaml" />
-    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ScrollBar.xaml" />
     <!--  TabControl needs to come after TabStrip as it redefines the inner TabStrip.ItemsPanel  -->
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TextBox.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TreeViewItem.xaml" />
diff --git a/src/Avalonia.Themes.Fluent/Controls/ScrollBar.xaml b/src/Avalonia.Themes.Fluent/Controls/ScrollBar.xaml
index 7d87a3e35a..4544fbe339 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ScrollBar.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ScrollBar.xaml
@@ -1,302 +1,283 @@
-<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-
-  <Style Selector="ScrollBar">
-    <Setter Property="MinWidth" Value="{DynamicResource ScrollBarSize}" />
-    <Setter Property="MinHeight" Value="{DynamicResource ScrollBarSize}" />
-    <Setter Property="Background" Value="{DynamicResource ScrollBarBackground}" />
-    <Setter Property="Foreground" Value="{DynamicResource ScrollBarForeground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ScrollBarBorderBrush}" />
-  </Style>
-
-  <Style Selector="ScrollBar:vertical">
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Grid x:Name="Root">
-
-          <Border x:Name="VerticalRoot"
-                  Background="{TemplateBinding Background}"
-                  BorderBrush="{TemplateBinding BorderBrush}">
-            <Grid RowDefinitions="Auto,*,Auto">
-
-              <Rectangle x:Name="TrackRect" Grid.RowSpan="3" Margin="0" />
-
-              <RepeatButton Name="PART_LineUpButton"
-                            HorizontalAlignment="Center"
-                            Classes="line up"
-                            Grid.Row="0"
-                            Focusable="False"
-                            MinWidth="{DynamicResource ScrollBarSize}"
-                            Height="{DynamicResource ScrollBarSize}" />
-
-              <Track Grid.Row="1"
-                     Minimum="{TemplateBinding Minimum}"
-                     Maximum="{TemplateBinding Maximum}"
-                     Value="{TemplateBinding Value, Mode=TwoWay}"
-                     ViewportSize="{TemplateBinding ViewportSize}"
-                     Orientation="{TemplateBinding Orientation}"
-                     IsDirectionReversed="True">
-                <Track.DecreaseButton>
-                  <RepeatButton Name="PART_PageUpButton"
-                                Classes="largeIncrease"
-                                Focusable="False" />
-                </Track.DecreaseButton>
-                <Track.IncreaseButton>
-                  <RepeatButton Name="PART_PageDownButton"
-                                Classes="largeIncrease"
-                                Focusable="False" />
-                </Track.IncreaseButton>
-                <Thumb Classes="thumb"
-                       Opacity="1"
-                       Width="{DynamicResource ScrollBarSize}"
-                       MinHeight="{DynamicResource ScrollBarSize}"
-                       RenderTransformOrigin="100%,50%" />
-              </Track>
-
-              <RepeatButton Name="PART_LineDownButton"
-                            HorizontalAlignment="Center"
-                            Classes="line down"
-                            Grid.Row="2"
-                            Focusable="False"
-                            MinWidth="{DynamicResource ScrollBarSize}"
-                            Height="{DynamicResource ScrollBarSize}" />
-
-            </Grid>
-          </Border>
-
-        </Grid>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-
-  <Style Selector="ScrollBar:horizontal">
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Grid x:Name="Root">
-
-          <Border x:Name="HorizontalRoot"
-                  Background="{TemplateBinding Background}"
-                  BorderBrush="{TemplateBinding BorderBrush}">
-            <Grid ColumnDefinitions="Auto,*,Auto">
-
-              <Rectangle x:Name="TrackRect" Grid.ColumnSpan="3" Margin="0" />
-
-              <RepeatButton Name="PART_LineUpButton"
-                            VerticalAlignment="Center"
-                            Classes="line up"
-                            Grid.Column="0"
-                            Focusable="False"
-                            MinHeight="{DynamicResource ScrollBarSize}"
-                            Width="{DynamicResource ScrollBarSize}" />
-
-              <Track Grid.Column="1"
-                     Minimum="{TemplateBinding Minimum}"
-                     Maximum="{TemplateBinding Maximum}"
-                     Value="{TemplateBinding Value, Mode=TwoWay}"
-                     ViewportSize="{TemplateBinding ViewportSize}"
-                     Orientation="{TemplateBinding Orientation}">
-                <Track.DecreaseButton>
-                  <RepeatButton Name="PART_PageUpButton"
-                                Classes="largeIncrease"
-                                Focusable="False" />
-                </Track.DecreaseButton>
-                <Track.IncreaseButton>
-                  <RepeatButton Name="PART_PageDownButton"
-                                Classes="largeIncrease"
-                                Focusable="False" />
-                </Track.IncreaseButton>
-                <Thumb Classes="thumb"
-                       Opacity="1"
-                       Height="{DynamicResource ScrollBarSize}"
-                       MinWidth="{DynamicResource ScrollBarSize}"
-                       RenderTransformOrigin="50%,100%" />
-              </Track>
-
-              <RepeatButton Name="PART_LineDownButton"
-                            VerticalAlignment="Center"
-                            Classes="line down"
-                            Grid.Column="2"
-                            Focusable="False"
-                            MinHeight="{DynamicResource ScrollBarSize}"
-                            Width="{DynamicResource ScrollBarSize}" />
-
-            </Grid>
-          </Border>
-
-        </Grid>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-
-  <Style Selector="ScrollBar[IsExpanded=true] /template/ Grid#Root">
-    <Setter Property="Background" Value="{DynamicResource ScrollBarBackgroundPointerOver}" />
-  </Style>
-
-  <Style Selector="ScrollBar /template/ Thumb.thumb">
-    <Setter Property="Background" Value="{DynamicResource ScrollBarPanningThumbBackground}" />
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <StackPanel Orientation="Horizontal" Spacing="20">
+        <StackPanel Spacing="20">
+          <ScrollBar Orientation="Horizontal" AllowAutoHide="False" VerticalAlignment="Center" Width="100"/>
+          <ScrollBar Orientation="Horizontal" AllowAutoHide="False" VerticalAlignment="Center" Width="100" IsEnabled="False"/>
+          <ScrollBar Orientation="Horizontal" AllowAutoHide="True" VerticalAlignment="Center" Width="100"/>
+          <ScrollBar Orientation="Horizontal" AllowAutoHide="True" VerticalAlignment="Center" Width="100" IsEnabled="False"/>
+        </StackPanel>
+        <ScrollBar Orientation="Vertical" AllowAutoHide="False" HorizontalAlignment="Center" Height="100"/>
+        <ScrollBar Orientation="Vertical" AllowAutoHide="False" HorizontalAlignment="Center" Height="100" IsEnabled="False"/>
+        <ScrollBar Orientation="Vertical" AllowAutoHide="True" HorizontalAlignment="Center" Height="100"/>
+        <ScrollBar Orientation="Vertical" AllowAutoHide="True" HorizontalAlignment="Center" Height="100" IsEnabled="False"/>
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
+
+  <ControlTheme x:Key="FluentScrollBarThumb" TargetType="Thumb">
+    <Setter Property="Background" Value="{DynamicResource ScrollBarPanningThumbBackground}"/>
     <Setter Property="Template">
       <Setter.Value>
         <ControlTemplate>
-          <Border x:Name="ThumbVisual" Background="{TemplateBinding Background}" />
+          <Border Background="{TemplateBinding Background}"
+                  CornerRadius="{TemplateBinding CornerRadius}"/>
         </ControlTemplate>
       </Setter.Value>
     </Setter>
     <Setter Property="Transitions">
       <Transitions>
+        <CornerRadiusTransition Property="CornerRadius" Duration="0:0:0.1" />
         <TransformOperationsTransition Property="RenderTransform" Duration="0:0:0.1" />
       </Transitions>
     </Setter>
-  </Style>
 
-  <Style Selector="ScrollBar:vertical /template/ Thumb.thumb">
-    <Setter Property="RenderTransform" Value="{DynamicResource VerticalSmallScrollThumbScaleTransform}" />
-  </Style>
-
-  <Style Selector="ScrollBar:horizontal /template/ Thumb.thumb">
-    <Setter Property="RenderTransform" Value="{DynamicResource HorizontalSmallScrollThumbScaleTransform}" />
-  </Style>
-
-  <Style Selector="ScrollBar[IsExpanded=true] /template/ Thumb.thumb">
-    <Setter Property="RenderTransform" Value="none" />
-    <Setter Property="Background" Value="{DynamicResource ScrollBarThumbBackgroundColor}" />
-  </Style>
-
-  <Style Selector="ScrollBar /template/ Thumb.thumb /template/ Border#ThumbVisual">
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="Transitions">
-      <Transitions>
-        <CornerRadiusTransition Property="CornerRadius" Duration="0:0:0.1" />
-      </Transitions>
+    <Style Selector="^:pointerover /template/ Border">
+      <Setter Property="Background" Value="{DynamicResource ScrollBarThumbFillPointerOver}" />
+    </Style>
+    <Style Selector="^:pressed  /template/ Border">
+      <Setter Property="Background" Value="{DynamicResource ScrollBarThumbFillPressed}" />
+    </Style>
+    <Style Selector="^:disabled  /template/ Border">
+      <Setter Property="Background" Value="{DynamicResource ScrollBarThumbFillDisabled}" />
+    </Style>
+  </ControlTheme>
+
+  <ControlTheme x:Key="FluentScrollBarPageButton" TargetType="RepeatButton">
+    <Setter Property="Background" Value="Transparent" />
+    <Setter Property="VerticalAlignment" Value="Stretch" />
+    <Setter Property="HorizontalAlignment" Value="Stretch" />
+    <Setter Property="Opacity" Value="0" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Background="{TemplateBinding Background}" />
+      </ControlTemplate>
     </Setter>
-  </Style>
-
-  <Style Selector="ScrollBar[IsExpanded=true] /template/ Thumb.thumb /template/ Border#ThumbVisual">
-    <Setter Property="CornerRadius" Value="0" />
-  </Style>
-
-  <Style Selector="ScrollBar /template/ Thumb.thumb:pointerover">
-    <Setter Property="Background" Value="{DynamicResource ScrollBarThumbFillPointerOver}" />
-  </Style>
+  </ControlTheme>
 
-  <Style Selector="ScrollBar /template/ Thumb.thumb:pressed">
-    <Setter Property="Background" Value="{DynamicResource ScrollBarThumbFillPressed}" />
-  </Style>
-
-  <Style Selector="ScrollBar /template/ Thumb.thumb:disabled">
-    <Setter Property="Background" Value="{DynamicResource ScrollBarThumbFillDisabled}" />
-  </Style>
-
-  <Style Selector="ScrollBar /template/ RepeatButton.line">
+  <ControlTheme x:Key="FluentScrollBarLineButton" TargetType="RepeatButton">
+    <Setter Property="Opacity" Value="0" />
+    <Setter Property="TextElement.Foreground" Value="{DynamicResource ScrollBarButtonArrowForeground}"/>
     <Setter Property="Template">
       <ControlTemplate>
-        <Border x:Name="Root">
-          <Viewbox Width="{DynamicResource ScrollBarButtonArrowIconFontSize}"
-                   Height="{DynamicResource ScrollBarButtonArrowIconFontSize}">
-            <Path x:Name="Arrow"
-              VerticalAlignment="Center"
-              HorizontalAlignment="Center"
-              Width="20" Height="20" />
-          </Viewbox>
-        </Border>
+        <ContentPresenter Background="{DynamicResource ScrollBarButtonBackground}"
+                          BorderBrush="{DynamicResource ScrollBarButtonBorderBrush}"
+                          Content="{TemplateBinding Content}"/>
       </ControlTemplate>
     </Setter>
-    <Setter Property="Opacity" Value="0" />
     <Setter Property="Transitions">
       <Transitions>
         <DoubleTransition Property="Opacity" Duration="0:0:0.1" />
       </Transitions>
     </Setter>
-  </Style>
-
-  <Style Selector="ScrollBar /template/ RepeatButton.line /template/ Border#Root" >
-    <Setter Property="Background" Value="{DynamicResource ScrollBarButtonBackground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ScrollBarButtonBorderBrush}" />
-  </Style>
 
-  <Style Selector="ScrollBar /template/ RepeatButton.line:pointerover /template/ Border#Root" >
-    <Setter Property="Background" Value="{DynamicResource ScrollBarButtonBackgroundPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ScrollBarButtonBorderBrushPointerOver}" />
-  </Style>
+    <Style Selector="^:pointerover">
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource ScrollBarButtonArrowForegroundPointerOver}"/>
 
-  <Style Selector="ScrollBar /template/ RepeatButton.line:pressed /template/ Border#Root" >
-    <Setter Property="Background" Value="{DynamicResource ScrollBarButtonBackgroundPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ScrollBarButtonBorderBrushPressed}" />
-  </Style>
+      <Style Selector="^ /template/ ContentPresenter" >
+        <Setter Property="Background" Value="{DynamicResource ScrollBarButtonBackgroundPointerOver}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ScrollBarButtonBorderBrushPointerOver}" />
+      </Style>
+    </Style>
 
-  <Style Selector="ScrollBar /template/ RepeatButton.line:disabled /template/ Border#Root" >
-    <Setter Property="Background" Value="{DynamicResource ScrollBarButtonBackgroundPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ScrollBarButtonBorderBrushDisabled}" />
-  </Style>
+    <Style Selector="^:pressed">
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource ScrollBarButtonArrowForegroundPressed}"/>
 
-  <Style Selector="ScrollBar /template/ RepeatButton.line /template/ Path#Arrow" >
-    <Setter Property="Fill" Value="{DynamicResource ScrollBarButtonArrowForeground}" />
-  </Style>
+      <Style Selector="^ /template/ ContentPresenter" >
+        <Setter Property="Background" Value="{DynamicResource ScrollBarButtonBackgroundPressed}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ScrollBarButtonBorderBrushPressed}" />
+      </Style>
+    </Style>
 
-  <Style Selector="ScrollBar /template/ RepeatButton.line:pointerover /template/ Path#Arrow" >
-    <Setter Property="Fill" Value="{DynamicResource ScrollBarButtonArrowForegroundPointerOver}" />
-  </Style>
+    <Style Selector="^:disabled">
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource ScrollBarButtonArrowForegroundDisabled}"/>
 
-  <Style Selector="ScrollBar /template/ RepeatButton.line:pressed /template/ Path#Arrow" >
-    <Setter Property="Fill" Value="{DynamicResource ScrollBarButtonArrowForegroundPressed}" />
-  </Style>
+      <Style Selector="^ /template/ ContentPresenter" >
+        <Setter Property="Background" Value="{DynamicResource ScrollBarButtonBackgroundDisabled}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ScrollBarButtonBorderBrushDisabled}" />
+      </Style>
+    </Style>
+  </ControlTheme>
 
-  <Style Selector="ScrollBar /template/ RepeatButton.line:disabled /template/ Path#Arrow" >
-    <Setter Property="Fill" Value="{DynamicResource ScrollBarButtonArrowForegroundDisabled}" />
-  </Style>
-
-  <Style Selector="ScrollBar[IsExpanded=true] /template/ RepeatButton.line">
-    <Setter Property="Opacity" Value="1" />
-  </Style>
-
-  <Style Selector="ScrollBar:vertical /template/ RepeatButton.line.up /template/ Path">
-    <Setter Property="Data"
-            Value="M 19.091797 14.970703 L 10 5.888672 L 0.908203 14.970703 L 0.029297 14.091797 L 10 4.111328 L 19.970703 14.091797 Z" />
-  </Style>
-
-  <Style Selector="ScrollBar:vertical /template/ RepeatButton.line.down /template/ Path">
-    <Setter Property="Data"
-            Value="M 18.935547 4.560547 L 19.814453 5.439453 L 10 15.253906 L 0.185547 5.439453 L 1.064453 4.560547 L 10 13.496094 Z" />
-  </Style>
-
-  <Style Selector="ScrollBar:horizontal /template/ RepeatButton.line.up /template/ Path">
-    <Setter Property="Data" Value="M 14.091797 19.970703 L 4.111328 10 L 14.091797 0.029297 L 14.970703 0.908203 L 5.888672 10 L 14.970703 19.091797 Z" />
-  </Style>
-
-  <Style Selector="ScrollBar:horizontal /template/ RepeatButton.line.down /template/ Path">
-    <Setter Property="Data" Value="M 5.029297 19.091797 L 14.111328 10 L 5.029297 0.908203 L 5.908203 0.029297 L 15.888672 10 L 5.908203 19.970703 Z" />
-  </Style>
-
-  <Style Selector="ScrollBar /template/ Rectangle#TrackRect">
-    <Setter Property="StrokeThickness" Value="{DynamicResource ScrollBarTrackBorderThemeThickness}" />
-    <Setter Property="Fill" Value="{DynamicResource ScrollBarTrackFill}" />
-    <Setter Property="Stroke" Value="{DynamicResource ScrollBarTrackStroke}" />
-    <Setter Property="Opacity" Value="0" />
-    <Setter Property="Transitions">
-      <Transitions>
-        <DoubleTransition Property="Opacity" Duration="0:0:0.1" />
-      </Transitions>
-    </Setter>
-  </Style>
-
-  <Style Selector="ScrollBar[IsExpanded=true] /template/ Rectangle#TrackRect">
-    <Setter Property="Fill" Value="{DynamicResource ScrollBarTrackFillPointerOver}" />
-    <Setter Property="Stroke" Value="{DynamicResource ScrollBarTrackStrokePointerOver}" />
-    <Setter Property="Opacity" Value="1" />
-  </Style>
-
-  <Style Selector="ScrollBar /template/ RepeatButton.largeIncrease">
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border Background="{TemplateBinding Background}" />
-      </ControlTemplate>
-    </Setter>
-    <Setter Property="Background" Value="Transparent" />
-    <Setter Property="VerticalAlignment" Value="Stretch" />
-    <Setter Property="HorizontalAlignment" Value="Stretch" />
-    <Setter Property="Opacity" Value="0" />
-  </Style>
+  <ControlTheme x:Key="{x:Type ScrollBar}" TargetType="ScrollBar">
+    <Setter Property="MinWidth" Value="{DynamicResource ScrollBarSize}" />
+    <Setter Property="MinHeight" Value="{DynamicResource ScrollBarSize}" />
+    <Setter Property="Background" Value="{DynamicResource ScrollBarBackground}" />
+    <Setter Property="Foreground" Value="{DynamicResource ScrollBarForeground}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource ScrollBarBorderBrush}" />
 
-  <Style Selector="ScrollBar[IsExpanded=true] /template/ RepeatButton.largeIncrease">
-    <Setter Property="Opacity" Value="1" />
-  </Style>
+    <Style Selector="^:vertical">
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Grid x:Name="Root">
+            <Border x:Name="VerticalRoot"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}">
+              <Grid RowDefinitions="Auto,*,Auto">
+                <Rectangle x:Name="TrackRect"
+                           Fill="{DynamicResource ScrollBarTrackFill}"
+                           Stroke="{DynamicResource ScrollBarTrackStroke}"
+                           StrokeThickness="{DynamicResource ScrollBarTrackBorderThemeThickness}"
+                           Opacity="0"
+                           Grid.RowSpan="3">
+                  <Rectangle.Transitions>
+                    <Transitions>
+                      <DoubleTransition Property="Opacity" Duration="0:0:0.1" />
+                    </Transitions>
+                  </Rectangle.Transitions>
+                </Rectangle>
+
+                <RepeatButton Name="PART_LineUpButton"
+                              HorizontalAlignment="Center"
+                              Theme="{StaticResource FluentScrollBarLineButton}"
+                              Grid.Row="0"
+                              Focusable="False"
+                              MinWidth="{DynamicResource ScrollBarSize}"
+                              Height="{DynamicResource ScrollBarSize}">
+                  <PathIcon Data="M 19.091797 14.970703 L 10 5.888672 L 0.908203 14.970703 L 0.029297 14.091797 L 10 4.111328 L 19.970703 14.091797 Z"
+                            Width="{DynamicResource ScrollBarButtonArrowIconFontSize}"
+                            Height="{DynamicResource ScrollBarButtonArrowIconFontSize}"/>
+                </RepeatButton>
+
+                <Track Grid.Row="1"
+                       Minimum="{TemplateBinding Minimum}"
+                       Maximum="{TemplateBinding Maximum}"
+                       Value="{TemplateBinding Value, Mode=TwoWay}"
+                       ViewportSize="{TemplateBinding ViewportSize}"
+                       Orientation="{TemplateBinding Orientation}"
+                       IsDirectionReversed="True">
+                  <Track.DecreaseButton>
+                    <RepeatButton Name="PART_PageUpButton"
+                                  Classes="largeIncrease"
+                                  Theme="{StaticResource FluentScrollBarPageButton}"
+                                  Focusable="False" />
+                  </Track.DecreaseButton>
+                  <Track.IncreaseButton>
+                    <RepeatButton Name="PART_PageDownButton"
+                                  Classes="largeIncrease"
+                                  Theme="{StaticResource FluentScrollBarPageButton}"
+                                  Focusable="False" />
+                  </Track.IncreaseButton>
+                  <Thumb Theme="{StaticResource FluentScrollBarThumb}"
+                         Width="{DynamicResource ScrollBarSize}"
+                         MinHeight="{DynamicResource ScrollBarSize}"
+                         RenderTransform="{DynamicResource VerticalSmallScrollThumbScaleTransform}"
+                         RenderTransformOrigin="100%,50%" />
+                </Track>
+
+                <RepeatButton Name="PART_LineDownButton"
+                              HorizontalAlignment="Center"
+                              Theme="{StaticResource FluentScrollBarLineButton}"
+                              Grid.Row="2"
+                              Focusable="False"
+                              MinWidth="{DynamicResource ScrollBarSize}"
+                              Height="{DynamicResource ScrollBarSize}">
+                  <PathIcon Data="M 18.935547 4.560547 L 19.814453 5.439453 L 10 15.253906 L 0.185547 5.439453 L 1.064453 4.560547 L 10 13.496094 Z"
+                            Width="{DynamicResource ScrollBarButtonArrowIconFontSize}"
+                            Height="{DynamicResource ScrollBarButtonArrowIconFontSize}"/>
+                </RepeatButton>
+              </Grid>
+            </Border>
+          </Grid>
+        </ControlTemplate>
+      </Setter>
+    </Style>
 
-</Styles>
+    <Style Selector="^:horizontal">
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Grid x:Name="Root">
+            <Border x:Name="HorizontalRoot"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}">
+              <Grid ColumnDefinitions="Auto,*,Auto">
+                <Rectangle x:Name="TrackRect"
+                           Fill="{DynamicResource ScrollBarTrackFill}"
+                           Stroke="{DynamicResource ScrollBarTrackStroke}"
+                           StrokeThickness="{DynamicResource ScrollBarTrackBorderThemeThickness}"
+                           Opacity="0"
+                           Grid.ColumnSpan="3">
+                  <Rectangle.Transitions>
+                    <Transitions>
+                      <DoubleTransition Property="Opacity" Duration="0:0:0.1" />
+                    </Transitions>
+                  </Rectangle.Transitions>
+                </Rectangle>
+
+                <RepeatButton Name="PART_LineUpButton"
+                              Theme="{StaticResource FluentScrollBarLineButton}"
+                              VerticalAlignment="Center"
+                              Grid.Column="0"
+                              Focusable="False"
+                              MinHeight="{DynamicResource ScrollBarSize}"
+                              Width="{DynamicResource ScrollBarSize}">
+                  <PathIcon Data="M 14.091797 19.970703 L 4.111328 10 L 14.091797 0.029297 L 14.970703 0.908203 L 5.888672 10 L 14.970703 19.091797 Z"
+                            Width="{DynamicResource ScrollBarButtonArrowIconFontSize}"
+                            Height="{DynamicResource ScrollBarButtonArrowIconFontSize}"/>
+                </RepeatButton>
+
+                <Track Grid.Column="1"
+                       Minimum="{TemplateBinding Minimum}"
+                       Maximum="{TemplateBinding Maximum}"
+                       Value="{TemplateBinding Value, Mode=TwoWay}"
+                       ViewportSize="{TemplateBinding ViewportSize}"
+                       Orientation="{TemplateBinding Orientation}">
+                  <Track.DecreaseButton>
+                    <RepeatButton Name="PART_PageUpButton"
+                                  Classes="largeIncrease"
+                                  Theme="{StaticResource FluentScrollBarPageButton}"
+                                  Focusable="False" />
+                  </Track.DecreaseButton>
+                  <Track.IncreaseButton>
+                    <RepeatButton Name="PART_PageDownButton"
+                                  Classes="largeIncrease"
+                                  Theme="{StaticResource FluentScrollBarPageButton}"
+                                  Focusable="False" />
+                  </Track.IncreaseButton>
+                  <Thumb Theme="{StaticResource FluentScrollBarThumb}"
+                         Height="{DynamicResource ScrollBarSize}"
+                         MinWidth="{DynamicResource ScrollBarSize}"
+                         RenderTransform="{DynamicResource HorizontalSmallScrollThumbScaleTransform}"
+                         RenderTransformOrigin="50%,100%" />
+                </Track>
+
+                <RepeatButton Name="PART_LineDownButton"
+                              Theme="{StaticResource FluentScrollBarLineButton}"
+                              VerticalAlignment="Center"
+                              Grid.Column="2"
+                              Focusable="False"
+                              MinHeight="{DynamicResource ScrollBarSize}"
+                              Width="{DynamicResource ScrollBarSize}">
+                  <PathIcon Data="M 5.029297 19.091797 L 14.111328 10 L 5.029297 0.908203 L 5.908203 0.029297 L 15.888672 10 L 5.908203 19.970703 Z"
+                            Width="{DynamicResource ScrollBarButtonArrowIconFontSize}"
+                            Height="{DynamicResource ScrollBarButtonArrowIconFontSize}"/>
+                </RepeatButton>
+              </Grid>
+            </Border>
+          </Grid>
+        </ControlTemplate>
+      </Setter>
+    </Style>
+
+    <Style Selector="^[IsExpanded=true]">
+      <Style Selector="^ /template/ Grid#Root">
+        <Setter Property="Background" Value="{DynamicResource ScrollBarBackgroundPointerOver}" />
+      </Style>
+      <Style Selector="^ /template/ Rectangle#TrackRect">
+        <Setter Property="Fill" Value="{DynamicResource ScrollBarTrackFillPointerOver}" />
+        <Setter Property="Stroke" Value="{DynamicResource ScrollBarTrackStrokePointerOver}" />
+        <Setter Property="Opacity" Value="1" />
+      </Style>
+      <Style Selector="^ /template/ Thumb">
+        <Setter Property="Background" Value="{DynamicResource ScrollBarThumbBackgroundColor}" />
+        <Setter Property="RenderTransform" Value="none" />
+      </Style>
+      <Style Selector="^ /template/ RepeatButton">
+        <Setter Property="Opacity" Value="1" />
+      </Style>
+    </Style>
+  </ControlTheme>
+
+</ResourceDictionary>

From 9d0132dc24535b89aed7e04fc8da2cfecad061f6 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 11:56:21 +0200
Subject: [PATCH 08/70] Remove unneeded normal state.

---
 .../Controls/ComboBox.xaml                    | 19 +++++--------------
 1 file changed, 5 insertions(+), 14 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml b/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
index 8ef8388cf1..b3da7735eb 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
@@ -72,7 +72,8 @@
                       Background="{DynamicResource ComboBoxBackgroundUnfocused}"
                       BorderBrush="{DynamicResource ComboBoxBackgroundBorderBrushUnfocused}"
                       BorderThickness="{TemplateBinding BorderThickness}"
-                      CornerRadius="{TemplateBinding CornerRadius}" />
+                      CornerRadius="{TemplateBinding CornerRadius}"
+                      IsVisible="False"/>
               <TextBlock x:Name="PlaceholderTextBlock"
                          Grid.Row="1"
                          Grid.Column="0"
@@ -109,7 +110,9 @@
                         Width="12"
                         Margin="0,0,10,0" 
                         HorizontalAlignment="Right"
-                        VerticalAlignment="Center" />
+                        VerticalAlignment="Center"
+                        Foreground="{DynamicResource ComboBoxDropDownGlyphForeground}"
+                        Data="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z"/>
               
               <Popup Name="PART_Popup" 
                      WindowManagerAddShadowHint="False"
@@ -143,18 +146,6 @@
         </ControlTemplate>
       </Setter>
 
-      <!--  Normal State  -->
-      <Style Selector="^ /template/ TextBlock#PlaceholderTextBlock">
-        <Setter Property="Foreground" Value="{DynamicResource ComboBoxPlaceHolderForeground}" />
-      </Style>
-      <Style Selector="^ /template/ Border#HighlightBackground">
-        <Setter Property="IsVisible" Value="False" />
-      </Style>
-      <Style Selector="^ /template/ PathIcon#DropDownGlyph">
-        <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForeground}" />
-        <Setter Property="Data" Value="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" />
-      </Style>
-
       <!--  PointerOver State  -->
       <Style Selector="^:pointerover /template/ Border#Background">
         <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundPointerOver}" />

From 576a8b897c965574ce8298421c9fe17636230dab Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 12:44:03 +0200
Subject: [PATCH 09/70] Fix Button/ToggleButton transitions.

---
 .../Controls/Button.xaml                      |   9 +-
 .../Controls/ToggleButton.xaml                | 184 +++++++++---------
 2 files changed, 99 insertions(+), 94 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/Button.xaml b/src/Avalonia.Themes.Fluent/Controls/Button.xaml
index b8fea84ae0..7ac5c4351a 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Button.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Button.xaml
@@ -20,7 +20,6 @@
     <Setter Property="Padding" Value="{DynamicResource ButtonPadding}" />
     <Setter Property="HorizontalAlignment" Value="Left" />
     <Setter Property="VerticalAlignment" Value="Center" />
-    <Setter Property="RenderTransform" Value="none" />
     <Setter Property="Transitions">
       <Transitions>
         <TransformOperationsTransition Property="RenderTransform" Duration="0:0:.075" />
@@ -49,6 +48,10 @@
       <Setter Property="Foreground" Value="{DynamicResource ButtonForegroundPointerOver}" />
     </Style>
 
+    <Style Selector="^:pressed">
+      <Setter Property="RenderTransform" Value="scale(0.98)" />
+    </Style>
+
     <Style Selector="^:pressed  /template/ ContentPresenter#PART_ContentPresenter">
       <Setter Property="Background" Value="{DynamicResource ButtonBackgroundPressed}" />
       <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushPressed}" />
@@ -86,9 +89,5 @@
         <Setter Property="Foreground" Value="{DynamicResource AccentButtonForegroundDisabled}" />
       </Style>
     </Style>
-
-    <Style Selector="^:pressed">
-      <Setter Property="RenderTransform" Value="scale(0.98)" />
-    </Style>
   </ControlTheme>
 </ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml b/src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml
index b53980b792..617f3e9c45 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml
@@ -10,111 +10,117 @@
     </Border>
   </Design.PreviewWith>
 
-    <Thickness x:Key="ButtonPadding">8,5,8,6</Thickness>
+  <Thickness x:Key="ButtonPadding">8,5,8,6</Thickness>
 
-    <ControlTheme x:Key="{x:Type ToggleButton}" TargetType="ToggleButton">
-      <Setter Property="Background" Value="{DynamicResource ToggleButtonBackground}" />
-      <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForeground}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrush}" />
-      <Setter Property="BorderThickness" Value="{DynamicResource ToggleButtonBorderThemeThickness}" />
+  <ControlTheme x:Key="{x:Type ToggleButton}" TargetType="ToggleButton">
+    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackground}" />
+    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForeground}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrush}" />
+    <Setter Property="BorderThickness" Value="{DynamicResource ToggleButtonBorderThemeThickness}" />
+    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+    <Setter Property="Padding" Value="{DynamicResource ButtonPadding}" />
+    <Setter Property="HorizontalAlignment" Value="Left" />
+    <Setter Property="VerticalAlignment" Value="Center" />
+    <Setter Property="FontWeight" Value="Normal" />
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="Transitions">
+      <Transitions>
+        <TransformOperationsTransition Property="RenderTransform" Duration="0:0:.075" />
+      </Transitions>
+    </Setter>
+
+    <Setter Property="Template">
+      <ControlTemplate>
+        <ContentPresenter x:Name="PART_ContentPresenter"
+                          Background="{TemplateBinding Background}"
+                          BorderBrush="{TemplateBinding BorderBrush}"
+                          BorderThickness="{TemplateBinding BorderThickness}"
+                          CornerRadius="{TemplateBinding CornerRadius}"
+                          Content="{TemplateBinding Content}"
+                          ContentTemplate="{TemplateBinding ContentTemplate}"
+                          Padding="{TemplateBinding Padding}"
+                          RecognizesAccessKey="True"
+                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
+      </ControlTemplate>
+    </Setter>
+
+    <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
       <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-      <Setter Property="Padding" Value="{DynamicResource ButtonPadding}" />
-      <Setter Property="HorizontalAlignment" Value="Left" />
-      <Setter Property="VerticalAlignment" Value="Center" />
-      <Setter Property="FontWeight" Value="Normal" />
-      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <ContentPresenter x:Name="PART_ContentPresenter"
-                            Background="{TemplateBinding Background}"
-                            BorderBrush="{TemplateBinding BorderBrush}"
-                            BorderThickness="{TemplateBinding BorderThickness}"
-                            CornerRadius="{TemplateBinding CornerRadius}"
-                            Content="{TemplateBinding Content}"
-                            ContentTemplate="{TemplateBinding ContentTemplate}"
-                            Padding="{TemplateBinding Padding}"
-                            RecognizesAccessKey="True"
-                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
-        </ControlTemplate>
-      </Setter>
+    </Style>
+
+    <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundPointerOver}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushPointerOver}" />
+      <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundPointerOver}" />
+    </Style>
+
+    <Style Selector="^:pressed">
+      <Setter Property="RenderTransform" Value="scale(0.98)" />
+    </Style>
 
+    <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundPressed}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushPressed}" />
+      <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundPressed}" />
+    </Style>
+
+    <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundDisabled}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushDisabled}" />
+      <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundDisabled}" />
+    </Style>
+
+    <Style Selector="^:indeterminate">
       <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
-        <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+        <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminate}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminate}" />
+        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminate}" />
       </Style>
 
       <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-        <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundPointerOver}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushPointerOver}" />
-        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundPointerOver}" />
+        <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminatePointerOver}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminatePointerOver}" />
+        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminatePointerOver}" />
       </Style>
 
       <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
-        <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundPressed}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushPressed}" />
-        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundPressed}" />
+        <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminatePressed}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminatePressed}" />
+        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminatePressed}" />
       </Style>
 
       <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
-        <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundDisabled}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushDisabled}" />
-        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundDisabled}" />
+        <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminateDisabled}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminateDisabled}" />
+        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminateDisabled}" />
+      </Style>
+    </Style>
+
+    <Style Selector="^:checked">
+      <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundChecked}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushChecked}" />
+        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundChecked}" />
       </Style>
 
-      <Style Selector="^:indeterminate">
-        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminate}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminate}" />
-          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminate}" />
-        </Style>
-
-        <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminatePointerOver}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminatePointerOver}" />
-          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminatePointerOver}" />
-        </Style>
-
-        <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminatePressed}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminatePressed}" />
-          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminatePressed}" />
-        </Style>
-
-        <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminateDisabled}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminateDisabled}" />
-          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminateDisabled}" />
-        </Style>
+      <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundCheckedPointerOver}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushCheckedPointerOver}" />
+        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundCheckedPointerOver}" />
       </Style>
 
-      <Style Selector="^:checked">
-        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundChecked}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushChecked}" />
-          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundChecked}" />
-        </Style>
-
-        <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundCheckedPointerOver}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushCheckedPointerOver}" />
-          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundCheckedPointerOver}" />
-        </Style>
-
-        <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundCheckedPressed}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushCheckedPressed}" />
-          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundCheckedPressed}" />
-        </Style>
-
-        <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundCheckedDisabled}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushCheckedDisabled}" />
-          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundCheckedDisabled}" />
-        </Style>
-
-        <Style Selector="^:pressed">
-          <Setter Property="RenderTransform" Value="scale(0.98)" />
-        </Style>
+      <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundCheckedPressed}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushCheckedPressed}" />
+        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundCheckedPressed}" />
+      </Style>
+
+      <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundCheckedDisabled}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushCheckedDisabled}" />
+        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundCheckedDisabled}" />
       </Style>
-    </ControlTheme>
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From c15837b743264282fa070eea4fbc63ebacd3d5c1 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 13:55:18 +0200
Subject: [PATCH 10/70] Ported ButtonSpinner to ControlTheme.

---
 .../Controls/ButtonSpinner.xaml               | 228 ++++++++++--------
 1 file changed, 133 insertions(+), 95 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml b/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml
index f99f1040e5..980ea02a73 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml
@@ -3,106 +3,144 @@
                     xmlns:sys="clr-namespace:System;assembly=netstandard"
                     xmlns:converters="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls"
                     x:CompileBindings="True">
-    <Design.PreviewWith>
-      <Border Padding="20" Background="Black">
-        <StackPanel Spacing="20">
-          <ButtonSpinner ButtonSpinnerLocation="Right"
-                         Content="Right disabled inline spinner"
-                         AllowSpin="False">
-            <DataValidationErrors.Error>
-              <sys:Exception />
-            </DataValidationErrors.Error>
-          </ButtonSpinner>
-          <ButtonSpinner ButtonSpinnerLocation="Left"
-                         Content="Left spinner" />
-          <ButtonSpinner ShowButtonSpinner="False"
-                         Content="Hide spinner" />
-        </StackPanel>
-      </Border>
-    </Design.PreviewWith>
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <StackPanel Spacing="20">
+        <ButtonSpinner Content="Right spinner" />
+        <ButtonSpinner ButtonSpinnerLocation="Left"
+                       Content="Left spinner" />
+        <ButtonSpinner BorderThickness="2"
+                       BorderBrush="Blue"
+                       Content="Right Border" />
+        <ButtonSpinner ButtonSpinnerLocation="Left"
+                       BorderThickness="2"
+                       BorderBrush="Blue"
+                       Content="Left Border" />
+        <ButtonSpinner Content="Right disabled"
+                       AllowSpin="False"/>
+        <ButtonSpinner ButtonSpinnerLocation="Left"
+                       Content="Left disabled"
+                       AllowSpin="False"/>
+        <ButtonSpinner ShowButtonSpinner="False"
+                       Content="Hide spinner" />
+        <ButtonSpinner Content="Error"
+                       AllowSpin="False">
+          <DataValidationErrors.Error>
+            <sys:Exception>
+              <x:Arguments>
+                <x:String>Error</x:String>
+              </x:Arguments>
+            </sys:Exception>
+          </DataValidationErrors.Error>
+        </ButtonSpinner>
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
 
-    <converters:MarginMultiplierConverter x:Key="ButtonSpinner_OnlyLeftThinknessConverter"
-                                          Indent="1"
-                                          Left="True" />
-    <converters:MarginMultiplierConverter x:Key="ButtonSpinner_OnlyRightThinknessConverter"
-                                          Indent="1"
-                                          Right="True" />
+  <converters:MarginMultiplierConverter x:Key="ButtonSpinnerLeftThickness" Indent="1" Left="True" />
+  <converters:MarginMultiplierConverter x:Key="ButtonSpinnerRightThickness" Indent="1" Right="True" />
+  <StreamGeometry x:Key="ButtonSpinnerIncreaseButtonIcon">M0,9 L10,0 20,9 19,10 10,2 1,10 z</StreamGeometry>
+  <StreamGeometry x:Key="ButtonSpinnerDecreaseButtonIcon">M0,1 L10,10 20,1 19,0 10,8 1,0 z</StreamGeometry>
 
-    <StreamGeometry x:Key="ButtonSpinnerIncreaseButtonIcon">M0,9 L10,0 20,9 19,10 10,2 1,10 z</StreamGeometry>
-    <StreamGeometry x:Key="ButtonSpinnerDecreaseButtonIcon">M0,1 L10,10 20,1 19,0 10,8 1,0 z</StreamGeometry>
+  <ControlTheme x:Key="FluentButtonSpinnerRepeatButton" TargetType="RepeatButton" BasedOn="{StaticResource {x:Type RepeatButton}}">
+    <Setter Property="CornerRadius" Value="0"/>
+    <Setter Property="MinWidth" Value="34" />
+    <Setter Property="VerticalAlignment" Value="Stretch" />
+  </ControlTheme>
 
-    <ControlTheme x:Key="{x:Type ButtonSpinner}" TargetType="ButtonSpinner">
-      <Setter Property="Background" Value="Transparent" />
-      <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
-      <Setter Property="Padding" Value="10, 0" />
-      <Setter Property="Background" Value="{DynamicResource TextControlBackground}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrush}" />
-      <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThickness}" />
-      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-      <Setter Property="MinHeight" Value="{DynamicResource TextControlThemeMinHeight}" />
-      <Setter Property="MinWidth" Value="{DynamicResource TextControlThemeMinWidth}" />
-      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-      <Setter Property="HorizontalContentAlignment" Value="Stretch" />
-      <Setter Property="VerticalContentAlignment" Value="Center" />
-      <Setter Property="Focusable" Value="True" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <DataValidationErrors>
-            <Border Background="{TemplateBinding Background}"
-                    BorderBrush="{TemplateBinding BorderBrush}"
-                    BorderThickness="{TemplateBinding BorderThickness}"
-                    CornerRadius="{TemplateBinding CornerRadius}"
-                    MinHeight="{TemplateBinding MinHeight}">
-              <Grid ColumnDefinitions="Auto,*,Auto">
-                <ContentPresenter Name="PART_ContentPresenter"
-                                  Grid.Column="1"
-                                  ContentTemplate="{TemplateBinding ContentTemplate}"
-                                  Content="{TemplateBinding Content}"
-                                  HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                  VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                                  Padding="{TemplateBinding Padding}" />
-                <StackPanel Name="PART_SpinnerPanel"
-                            Orientation="Horizontal"
-                            IsVisible="{TemplateBinding ShowButtonSpinner}">
-                  <RepeatButton Name="PART_IncreaseButton"
-                                Classes="ButtonSpinnerRepeatButton"
-                                VerticalContentAlignment="Center"
-                                Foreground="{TemplateBinding Foreground}"
-                                BorderBrush="{TemplateBinding BorderBrush}"
-                                Background="{TemplateBinding Background}"
-                                FontSize="{TemplateBinding FontSize}">
-                    <Path Fill="{TemplateBinding Foreground}" Width="16" Height="8" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" Data="{StaticResource ButtonSpinnerIncreaseButtonIcon}" />
-                  </RepeatButton>
-                  <RepeatButton Name="PART_DecreaseButton" Classes="ButtonSpinnerRepeatButton" Foreground="{TemplateBinding Foreground}" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" VerticalContentAlignment="Center" FontSize="{TemplateBinding FontSize}">
-                    <Path Fill="{TemplateBinding Foreground}" Width="16" Height="8" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" Data="{StaticResource ButtonSpinnerDecreaseButtonIcon}" />
-                  </RepeatButton>
-                </StackPanel>
-              </Grid>
-            </Border>
-          </DataValidationErrors>
-        </ControlTemplate>
-      </Setter>
+  <ControlTheme x:Key="{x:Type ButtonSpinner}" TargetType="ButtonSpinner">
+    <Setter Property="Background" Value="Transparent" />
+    <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
+    <Setter Property="Padding" Value="10, 0" />
+    <Setter Property="Background" Value="{DynamicResource TextControlBackground}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrush}" />
+    <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThickness}" />
+    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+    <Setter Property="MinHeight" Value="{DynamicResource TextControlThemeMinHeight}" />
+    <Setter Property="MinWidth" Value="{DynamicResource TextControlThemeMinWidth}" />
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
+    <Setter Property="VerticalContentAlignment" Value="Center" />
+    <Setter Property="Focusable" Value="True"/>
+    <Setter Property="Template">
+      <ControlTemplate>
+        <DataValidationErrors>
+          <Border Background="{TemplateBinding Background}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
+                  CornerRadius="{TemplateBinding CornerRadius}"
+                  MinHeight="{TemplateBinding MinHeight}">
+            <DockPanel>
+              <StackPanel Name="PART_SpinnerPanel"
+                          DockPanel.Dock="Right"
+                          Orientation="Horizontal"
+                          IsVisible="{TemplateBinding ShowButtonSpinner}">
+                <RepeatButton Name="PART_IncreaseButton"
+                              Background="{TemplateBinding Background}"
+                              BorderThickness="0"
+                              CornerRadius="0"
+                              VerticalAlignment="Stretch"
+                              VerticalContentAlignment="Center"
+                              Foreground="{TemplateBinding Foreground}"
+                              FontSize="{TemplateBinding FontSize}"
+                              MinWidth="34">
+                  <Path Fill="{TemplateBinding Foreground}"
+                        Width="16"
+                        Height="8"
+                        Stretch="Uniform"
+                        HorizontalAlignment="Center"
+                        VerticalAlignment="Center"
+                        Data="{StaticResource ButtonSpinnerIncreaseButtonIcon}" />
+                </RepeatButton>
 
-      <Style Selector="^:error">
-        <Setter Property="BorderBrush" Value="{DynamicResource SystemErrorTextColor}" />
-      </Style>
+                <Border BorderBrush="{TemplateBinding BorderBrush}"
+                        BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource ButtonSpinnerRightThickness}}"
+                        VerticalAlignment="Stretch"/>
 
-      <Style Selector="^:left">
-        <Style Selector="^ /template/ StackPanel#PART_SpinnerPanel">
-          <Setter Property="Grid.Column" Value="0" />
-        </Style>
-        <Style Selector="^ /template/ RepeatButton.ButtonSpinnerRepeatButton">
-          <Setter Property="BorderThickness" Value="{Binding $parent[ButtonSpinner].BorderThickness, Converter={StaticResource ButtonSpinner_OnlyRightThinknessConverter}}" />
-        </Style>
-      </Style>
+                <RepeatButton Name="PART_DecreaseButton"
+                              Background="{TemplateBinding Background}"
+                              BorderThickness="0"
+                              CornerRadius="0"
+                              VerticalAlignment="Stretch"
+                              VerticalContentAlignment="Center"
+                              Foreground="{TemplateBinding Foreground}"
+                              FontSize="{TemplateBinding FontSize}"
+                              MinWidth="34">
+                  <Path Fill="{TemplateBinding Foreground}"
+                        Width="16"
+                        Height="8"
+                        Stretch="Uniform"
+                        HorizontalAlignment="Center"
+                        VerticalAlignment="Center"
+                        Data="{StaticResource ButtonSpinnerDecreaseButtonIcon}" />
+                </RepeatButton>
+              </StackPanel>
 
-      <Style Selector="^:right">
-        <Style Selector="^ /template/ StackPanel#PART_SpinnerPanel">
-          <Setter Property="Grid.Column" Value="2" />
-        </Style>
-        <Style Selector="^ /template/ RepeatButton.ButtonSpinnerRepeatButton">
-          <Setter Property="BorderThickness" Value="{Binding $parent[ButtonSpinner].BorderThickness, Converter={StaticResource ButtonSpinner_OnlyLeftThinknessConverter}}" />
-        </Style>
+              <ContentPresenter Name="PART_ContentPresenter"
+                                Grid.Column="1"
+                                BorderBrush="{TemplateBinding BorderBrush}"
+                                BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource ButtonSpinnerRightThickness}}"
+                                ContentTemplate="{TemplateBinding ContentTemplate}"
+                                Content="{TemplateBinding Content}"
+                                HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                                Padding="{TemplateBinding Padding}" />
+            </DockPanel>
+          </Border>
+        </DataValidationErrors>
+      </ControlTemplate>
+    </Setter>
+    <Style Selector="^:left">
+      <Style Selector="^ /template/ StackPanel#PART_SpinnerPanel">
+        <Setter Property="DockPanel.Dock" Value="Left"/>
+      </Style>
+      <Style Selector="^ /template/ ContentPresenter">
+        <Setter Property="BorderThickness" Value="{TemplateBinding BorderThickness, Converter={StaticResource ButtonSpinnerLeftThickness}}" />
       </Style>
-    </ControlTheme>
+    </Style>
+    <Style Selector="^:error">
+      <Setter Property="BorderBrush" Value="{DynamicResource SystemErrorTextColor}" />
+    </Style>
+  </ControlTheme>
+
 </ResourceDictionary>

From ddbc9fbfcaf7524fcd7ed03a3f481dab7ecff1bf Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 14:01:56 +0200
Subject: [PATCH 11/70] Tweaked CheckBox ControlTheme.

---
 .../Controls/CheckBox.xaml                    | 451 +++++++++---------
 1 file changed, 228 insertions(+), 223 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/CheckBox.xaml b/src/Avalonia.Themes.Fluent/Controls/CheckBox.xaml
index 44e1afefa4..9abcf5d32b 100644
--- a/src/Avalonia.Themes.Fluent/Controls/CheckBox.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/CheckBox.xaml
@@ -1,293 +1,298 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Design.PreviewWith>
-      <Border Padding="20">
-        <CheckBox IsThreeState="True" IsChecked="True" Content="Content" Foreground="Gold" />
-      </Border>
-    </Design.PreviewWith>
-
-    <ControlTheme x:Key="{x:Type CheckBox}" TargetType="CheckBox">
-      <Setter Property="Padding" Value="8,0,0,0" />
-      <Setter Property="HorizontalAlignment" Value="Left" />
-      <Setter Property="VerticalAlignment" Value="Center" />
-      <Setter Property="HorizontalContentAlignment" Value="Left" />
-      <Setter Property="VerticalContentAlignment" Value="Center" />
-      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-      <Setter Property="MinHeight" Value="32" />
-      <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUnchecked}" />
-      <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUnchecked}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUnchecked}" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Grid x:Name="RootGrid" ColumnDefinitions="20,*">
-            <Border x:Name="PART_Border"
-                    Grid.ColumnSpan="2"
-                    Background="{TemplateBinding Background}"
-                    BorderBrush="{TemplateBinding BorderBrush}"
-                    BorderThickness="{TemplateBinding BorderThickness}"
-                    CornerRadius="{TemplateBinding CornerRadius}" />
-
-            <Grid VerticalAlignment="Top" Height="32">
-              <Border x:Name="NormalRectangle"
-                      BorderBrush="{DynamicResource CheckBoxCheckBackgroundStrokeUnchecked}"
-                      Background="{DynamicResource CheckBoxCheckBackgroundFillUnchecked}"
-                      BorderThickness="{DynamicResource CheckBoxBorderThemeThickness}"
-                      CornerRadius="{TemplateBinding CornerRadius}"
-                      UseLayoutRounding="False"
-                      Height="20"
-                      Width="20" />
-
-              <Viewbox UseLayoutRounding="False">
-                <Panel>
-                  <Panel Height="16" Width="16" />
-                  <Path x:Name="CheckGlyph" 
-                        Opacity="0" 
-                        Fill="{DynamicResource CheckBoxCheckGlyphForegroundUnchecked}" 
-                        Stretch="Uniform" 
-                        VerticalAlignment="Center" />
-                </Panel>
-              </Viewbox>
-            </Grid>
-            <ContentPresenter x:Name="ContentPresenter"
-                            ContentTemplate="{TemplateBinding ContentTemplate}"
-                            Content="{TemplateBinding Content}"
-                            Margin="{TemplateBinding Padding}"
-                            RecognizesAccessKey="True"
-                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                            Grid.Column="1" />
-            <!-- TODO: TextWrapping="Wrap" on contentpresenter -->
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <StackPanel Spacing="20">
+        <CheckBox>Unchecked</CheckBox>
+        <CheckBox IsChecked="True">Checked</CheckBox>
+        <CheckBox IsThreeState="True" IsChecked="{x:Null}">Indeterminate</CheckBox>
+        <CheckBox Width="120">Checkbox should wrap its text</CheckBox>
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
+
+  <ControlTheme x:Key="{x:Type CheckBox}" TargetType="CheckBox">
+    <Setter Property="Padding" Value="8,0,0,0" />
+    <Setter Property="HorizontalAlignment" Value="Left" />
+    <Setter Property="VerticalAlignment" Value="Center" />
+    <Setter Property="HorizontalContentAlignment" Value="Left" />
+    <Setter Property="VerticalContentAlignment" Value="Center" />
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+    <Setter Property="MinHeight" Value="32" />
+    <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUnchecked}" />
+    <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUnchecked}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUnchecked}" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Grid x:Name="RootGrid" ColumnDefinitions="20,*">
+          <Border x:Name="PART_Border"
+                  Grid.ColumnSpan="2"
+                  Background="{TemplateBinding Background}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
+                  CornerRadius="{TemplateBinding CornerRadius}" />
+
+          <Grid VerticalAlignment="Top" Height="32">
+            <Border x:Name="NormalRectangle"
+                    BorderBrush="{DynamicResource CheckBoxCheckBackgroundStrokeUnchecked}"
+                    Background="{DynamicResource CheckBoxCheckBackgroundFillUnchecked}"
+                    BorderThickness="{DynamicResource CheckBoxBorderThemeThickness}"
+                    CornerRadius="{TemplateBinding CornerRadius}"
+                    UseLayoutRounding="False"
+                    Height="20"
+                    Width="20" />
+
+            <Viewbox UseLayoutRounding="False">
+              <Panel>
+                <Panel Height="16" Width="16" />
+                <Path x:Name="CheckGlyph"
+                      Opacity="0"
+                      Fill="{DynamicResource CheckBoxCheckGlyphForegroundUnchecked}"
+                      Stretch="Uniform"
+                      VerticalAlignment="Center" />
+              </Panel>
+            </Viewbox>
           </Grid>
-        </ControlTemplate>
-      </Setter>
+          <ContentPresenter x:Name="ContentPresenter"
+                          ContentTemplate="{TemplateBinding ContentTemplate}"
+                          Content="{TemplateBinding Content}"
+                          Margin="{TemplateBinding Padding}"
+                          RecognizesAccessKey="True"
+                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                          TextWrapping="Wrap"
+                          Grid.Column="1" />
+        </Grid>
+      </ControlTemplate>
+    </Setter>
+
+    <!-- Unchecked PointerOver State -->
+    <Style Selector="^:pointerover">
+      <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
+        <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUncheckedPointerOver}" />
+      </Style>
+
+      <Style Selector="^ /template/ Border#PART_Border">
+        <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUncheckedPointerOver}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUncheckedPointerOver}" />
+      </Style>
+
+      <Style Selector="^ /template/ Border#NormalRectangle">
+        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUncheckedPointerOver}" />
+        <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUncheckedPointerOver}" />
+      </Style>
+
+      <Style Selector="^ /template/ Path#CheckGlyph">
+        <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUncheckedPointerOver}" />
+      </Style>
+    </Style>
+
+    <!-- Unchecked Pressed State -->
+    <Style Selector="^:pressed">
+      <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
+        <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUncheckedPressed}" />
+      </Style>
+
+      <Style Selector="^ /template/ Border#PART_Border">
+        <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUncheckedPressed}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUncheckedPressed}" />
+      </Style>
+
+      <Style Selector="^ /template/ Border#NormalRectangle">
+        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUncheckedPressed}" />
+        <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUncheckedPressed}" />
+      </Style>
+
+      <Style Selector="^ /template/ Path#CheckGlyph">
+        <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUncheckedPressed}" />
+      </Style>
+    </Style>
+
+    <!-- Unchecked Disabled state -->
+    <Style Selector="^:disabled">
+      <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
+        <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUncheckedDisabled}" />
+      </Style>
+
+      <Style Selector="^ /template/ Border#PART_Border">
+        <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUncheckedDisabled}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUncheckedDisabled}" />
+      </Style>
+
+      <Style Selector="^ /template/ Border#NormalRectangle">
+        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUncheckedDisabled}" />
+        <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUncheckedDisabled}" />
+      </Style>
+
+      <Style Selector="^ /template/ Path#CheckGlyph">
+        <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUncheckedDisabled}" />
+      </Style>
+    </Style>
+
+    <Style Selector="^:checked">
+      <!-- Checked Normal State -->
+      <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundChecked}" />
+      <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundChecked}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushChecked}" />
+
+      <Style Selector="^ /template/ Border#NormalRectangle">
+        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundFillChecked}" />
+        <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillChecked}" />
+      </Style>
+
+      <Style Selector="^ /template/ Path#CheckGlyph">
+        <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundChecked}" />
+        <Setter Property="Data" Value="M1507 31L438 1101L-119 543L-29 453L438 919L1417 -59L1507 31Z" />
+        <Setter Property="Width" Value="9" />
+        <Setter Property="Opacity" Value="1" />
+        <Setter Property="FlowDirection" Value="LeftToRight" />
+      </Style>
 
-      <!-- Unchecked PointerOver State -->
+      <!-- Checked PointerOver State -->
       <Style Selector="^:pointerover">
         <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-          <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUncheckedPointerOver}" />
+          <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundCheckedPointerOver}" />
         </Style>
 
         <Style Selector="^ /template/ Border#PART_Border">
-          <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUncheckedPointerOver}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUncheckedPointerOver}" />
+          <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundCheckedPointerOver}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushCheckedPointerOver}" />
         </Style>
 
         <Style Selector="^ /template/ Border#NormalRectangle">
-          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUncheckedPointerOver}" />
-          <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUncheckedPointerOver}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeCheckedPointerOver}" />
+          <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillCheckedPointerOver}" />
         </Style>
 
         <Style Selector="^ /template/ Path#CheckGlyph">
-          <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUncheckedPointerOver}" />
+          <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundCheckedPointerOver}" />
         </Style>
       </Style>
 
-      <!-- Unchecked Pressed State -->
+      <!-- Checked Pressed State -->
       <Style Selector="^:pressed">
         <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-          <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUncheckedPressed}" />
+          <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundCheckedPressed}" />
         </Style>
 
         <Style Selector="^ /template/ Border#PART_Border">
-          <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUncheckedPressed}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUncheckedPressed}" />
+          <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundCheckedPressed}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushCheckedPressed}" />
         </Style>
 
         <Style Selector="^ /template/ Border#NormalRectangle">
-          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUncheckedPressed}" />
-          <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUncheckedPressed}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeCheckedPressed}" />
+          <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillCheckedPressed}" />
         </Style>
 
         <Style Selector="^ /template/ Path#CheckGlyph">
-          <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUncheckedPressed}" />
+          <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundCheckedPressed}" />
         </Style>
       </Style>
 
-      <!-- Unchecked Disabled state -->
+      <!-- Checked Disabled State -->
       <Style Selector="^:disabled">
-        <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-          <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUncheckedDisabled}" />
+        <Style Selector="^ ContentPresenter#ContentPresenter">
+          <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundCheckedDisabled}" />
         </Style>
 
         <Style Selector="^ /template/ Border#PART_Border">
-          <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUncheckedDisabled}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUncheckedDisabled}" />
+          <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundCheckedDisabled}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushCheckedDisabled}" />
         </Style>
 
         <Style Selector="^ /template/ Border#NormalRectangle">
-          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUncheckedDisabled}" />
-          <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUncheckedDisabled}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeCheckedDisabled}" />
+          <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillCheckedDisabled}" />
         </Style>
 
         <Style Selector="^ /template/ Path#CheckGlyph">
-          <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUncheckedDisabled}" />
+          <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundCheckedDisabled}" />
         </Style>
       </Style>
+    </Style>
 
-      <Style Selector="^:checked">
-        <!-- Checked Normal State -->
-        <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundChecked}" />
-        <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundChecked}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushChecked}" />
+    <Style Selector="^:indeterminate">
+      <!-- Indeterminate Normal State -->
+      <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminate}" />
+      <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminate}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminate}" />
 
-        <Style Selector="^ /template/ Border#NormalRectangle">
-          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundFillChecked}" />
-          <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillChecked}" />
-        </Style>
+      <Style Selector="^ /template/ Border#NormalRectangle">
+        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminate}" />
+        <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminate}" />
+      </Style>
 
-        <Style Selector="^ /template/ Path#CheckGlyph">
-          <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundChecked}" />
-          <Setter Property="Data" Value="M1507 31L438 1101L-119 543L-29 453L438 919L1417 -59L1507 31Z" />
-          <Setter Property="Width" Value="9" />
-          <Setter Property="Opacity" Value="1" />
-          <Setter Property="FlowDirection" Value="LeftToRight" />
+      <Style Selector="^ /template/ Path#CheckGlyph">
+        <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminate}" />
+        <Setter Property="Data" Value="M1536 1536v-1024h-1024v1024h1024z" />
+        <Setter Property="Width" Value="7" />
+        <Setter Property="Opacity" Value="1" />
+      </Style>
+
+      <!-- Indeterminate PointerOver State -->
+      <Style Selector="^:pointerover">
+        <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
+          <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminatePointerOver}" />
         </Style>
 
-        <!-- Checked PointerOver State -->
-        <Style Selector="^:pointerover">
-          <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-            <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundCheckedPointerOver}" />
-          </Style>
-
-          <Style Selector="^ /template/ Border#PART_Border">
-            <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundCheckedPointerOver}" />
-            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushCheckedPointerOver}" />
-          </Style>
-
-          <Style Selector="^ /template/ Border#NormalRectangle">
-            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeCheckedPointerOver}" />
-            <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillCheckedPointerOver}" />
-          </Style>
-
-          <Style Selector="^ /template/ Path#CheckGlyph">
-            <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundCheckedPointerOver}" />
-          </Style>
+        <Style Selector="^ /template/ Border#PART_Border">
+          <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminatePointerOver}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminatePointerOver}" />
         </Style>
 
-        <!-- Checked Pressed State -->
-        <Style Selector="^:pressed">
-          <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-            <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundCheckedPressed}" />
-          </Style>
-
-          <Style Selector="^ /template/ Border#PART_Border">
-            <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundCheckedPressed}" />
-            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushCheckedPressed}" />
-          </Style>
-
-          <Style Selector="^ /template/ Border#NormalRectangle">
-            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeCheckedPressed}" />
-            <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillCheckedPressed}" />
-          </Style>
-
-          <Style Selector="^ /template/ Path#CheckGlyph">
-            <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundCheckedPressed}" />
-          </Style>
+        <Style Selector="^ /template/ Border#NormalRectangle">
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminatePointerOver}" />
+          <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminatePointerOver}" />
         </Style>
 
-        <!-- Checked Disabled State -->
-        <Style Selector="^:disabled">
-          <Style Selector="^ ContentPresenter#ContentPresenter">
-            <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundCheckedDisabled}" />
-          </Style>
-
-          <Style Selector="^ /template/ Border#PART_Border">
-            <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundCheckedDisabled}" />
-            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushCheckedDisabled}" />
-          </Style>
-
-          <Style Selector="^ /template/ Border#NormalRectangle">
-            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeCheckedDisabled}" />
-            <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillCheckedDisabled}" />
-          </Style>
-
-          <Style Selector="^ /template/ Path#CheckGlyph">
-            <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundCheckedDisabled}" />
-          </Style>
+        <Style Selector="^ /template/ Path#CheckGlyph">
+          <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminatePointerOver}" />
         </Style>
       </Style>
 
-      <Style Selector="^:indeterminate">
-        <!-- Indeterminate Normal State -->
-        <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminate}" />
-        <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminate}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminate}" />
+      <!-- Indeterminate Pressed State -->
+      <Style Selector="^:pressed">
+        <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
+          <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminatePressed}" />
+        </Style>
+
+        <Style Selector="^ /template/ Border#PART_Border">
+          <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminatePressed}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminatePressed}" />
+        </Style>
 
         <Style Selector="^ /template/ Border#NormalRectangle">
-          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminate}" />
-          <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminate}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminatePressed}" />
+          <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminatePressed}" />
         </Style>
 
         <Style Selector="^ /template/ Path#CheckGlyph">
-          <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminate}" />
-          <Setter Property="Data" Value="M1536 1536v-1024h-1024v1024h1024z" />
-          <Setter Property="Width" Value="7" />
-          <Setter Property="Opacity" Value="1" />
+          <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminatePressed}" />
         </Style>
+      </Style>
 
-        <!-- Indeterminate PointerOver State -->
-        <Style Selector="^:pointerover">
-          <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-            <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminatePointerOver}" />
-          </Style>
-
-          <Style Selector="^ /template/ Border#PART_Border">
-            <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminatePointerOver}" />
-            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminatePointerOver}" />
-          </Style>
-
-          <Style Selector="^ /template/ Border#NormalRectangle">
-            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminatePointerOver}" />
-            <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminatePointerOver}" />
-          </Style>
-
-          <Style Selector="^ /template/ Path#CheckGlyph">
-            <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminatePointerOver}" />
-          </Style>
+      <!-- Indeterminate Disabled State -->
+      <Style Selector="^:disabled">
+        <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
+          <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminateDisabled}" />
+        </Style>
+
+        <Style Selector="^ /template/ Border#PART_Border">
+          <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminateDisabled}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminateDisabled}" />
         </Style>
 
-        <!-- Indeterminate Pressed State -->
-        <Style Selector="^:pressed">
-          <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-            <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminatePressed}" />
-          </Style>
-
-          <Style Selector="^ /template/ Border#PART_Border">
-            <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminatePressed}" />
-            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminatePressed}" />
-          </Style>
-
-          <Style Selector="^ /template/ Border#NormalRectangle">
-            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminatePressed}" />
-            <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminatePressed}" />
-          </Style>
-
-          <Style Selector="^ /template/ Path#CheckGlyph">
-            <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminatePressed}" />
-          </Style>
+        <Style Selector="^ /template/ Border#NormalRectangle">
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminateDisabled}" />
+          <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminateDisabled}" />
         </Style>
 
-        <!-- Indeterminate Disabled State -->
-        <Style Selector="^:disabled">
-          <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-            <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminateDisabled}" />
-          </Style>
-
-          <Style Selector="^ /template/ Border#PART_Border">
-            <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundIndeterminateDisabled}" />
-            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushIndeterminateDisabled}" />
-          </Style>
-
-          <Style Selector="^ /template/ Border#NormalRectangle">
-            <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeIndeterminateDisabled}" />
-            <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillIndeterminateDisabled}" />
-          </Style>
-
-          <Style Selector="^ /template/ Path#CheckGlyph">
-            <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminateDisabled}" />
-          </Style>
+        <Style Selector="^ /template/ Path#CheckGlyph">
+          <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundIndeterminateDisabled}" />
         </Style>
       </Style>
-    </ControlTheme>
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From 47215816a22a68fd5c7ba863e78843127ba6e603 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 14:08:03 +0200
Subject: [PATCH 12/70] Validated ComboBox/Item ControlTheme.

---
 .../Controls/ComboBox.xaml                    | 416 +++++++++---------
 .../Controls/ComboBoxItem.xaml                | 153 +++----
 2 files changed, 290 insertions(+), 279 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml b/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
index b3da7735eb..ec78bf6ab4 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
@@ -1,217 +1,227 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
-                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Design.PreviewWith>
-      <Border Padding="20">
-        <StackPanel Spacing="10">
-          <ComboBox PlaceholderText="Select an item">
-            <ComboBoxItem>Item 1</ComboBoxItem>
-            <ComboBoxItem>Item 2</ComboBoxItem>
-          </ComboBox>
-          <ComboBox IsEnabled="False" 
-                    Width="200" 
-                    SelectedIndex="1" 
-                    HorizontalContentAlignment="Center">
-            <ComboBoxItem>Item 1</ComboBoxItem>
-            <ComboBoxItem>Item 2</ComboBoxItem>
-          </ComboBox>
-        </StackPanel>
-      </Border>
-    </Design.PreviewWith>
-  
-    <Thickness x:Key="ComboBoxTopHeaderMargin">0,0,0,4</Thickness>
-    <x:Int32 x:Key="ComboBoxPopupMaxNumberOfItems">15</x:Int32>
-    <x:Int32 x:Key="ComboBoxPopupMaxNumberOfItemsThatCanBeShownOnOneSide">7</x:Int32>
-    
-    <Thickness x:Key="ComboBoxPadding">12,5,0,7</Thickness>
-    <Thickness x:Key="ComboBoxEditableTextPadding">11,5,32,6</Thickness>
-    <x:Double x:Key="ComboBoxMinHeight">32</x:Double>
-    
-    <ControlTheme x:Key="{x:Type ComboBox}" TargetType="ComboBox">
-      <Setter Property="Padding" Value="{DynamicResource ComboBoxPadding}" />
-      <Setter Property="FocusAdorner" Value="{x:Null}" />
-      <Setter Property="MaxDropDownHeight" Value="504" />
-      <Setter Property="Foreground" Value="{DynamicResource ComboBoxForeground}" />
-      <Setter Property="Background" Value="{DynamicResource ComboBoxBackground}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrush}" />
-      <Setter Property="BorderThickness" Value="{DynamicResource ComboBoxBorderThemeThickness}" />
-      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-      <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
-      <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
-      <Setter Property="MinHeight" Value="{DynamicResource ComboBoxMinHeight}" />
-      <Setter Property="HorizontalContentAlignment" Value="Stretch" />
-      <Setter Property="VerticalContentAlignment" Value="Center" />
-      <Setter Property="HorizontalAlignment" Value="Left" />
-      <Setter Property="VerticalAlignment" Value="Top" />
-      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-      <Setter Property="PlaceholderForeground" Value="{DynamicResource ComboBoxPlaceHolderForeground}" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <DataValidationErrors>
-            <Grid RowDefinitions="Auto, *, Auto" ColumnDefinitions="*,32">
-              <ContentPresenter x:Name="HeaderContentPresenter"
-                                Grid.Row="0"
-                                Grid.Column="0" 
-                                Grid.ColumnSpan="2"
-                                IsVisible="False"
-                                FontWeight="{DynamicResource ComboBoxHeaderThemeFontWeight}" 
-                                Margin="{DynamicResource ComboBoxTopHeaderMargin}"
-                                VerticalAlignment="Top" />
-              <Border x:Name="Background"
-                      Grid.Row="1"
-                      Grid.Column="0"
-                      Grid.ColumnSpan="2"
-                      Background="{TemplateBinding Background}"
-                      BorderBrush="{TemplateBinding BorderBrush}"
-                      BorderThickness="{TemplateBinding BorderThickness}"
-                      CornerRadius="{TemplateBinding CornerRadius}"
-                      MinWidth="{DynamicResource ComboBoxThemeMinWidth}" />
-              <Border x:Name="HighlightBackground"
-                      Grid.Row="1"
-                      Grid.Column="0"
-                      Grid.ColumnSpan="2"
-                      Background="{DynamicResource ComboBoxBackgroundUnfocused}"
-                      BorderBrush="{DynamicResource ComboBoxBackgroundBorderBrushUnfocused}"
-                      BorderThickness="{TemplateBinding BorderThickness}"
-                      CornerRadius="{TemplateBinding CornerRadius}"
-                      IsVisible="False"/>
-              <TextBlock x:Name="PlaceholderTextBlock"
-                         Grid.Row="1"
-                         Grid.Column="0"
-                         HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                         VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                         Margin="{TemplateBinding Padding}"
-                         Text="{TemplateBinding PlaceholderText}"
-                         Foreground="{TemplateBinding PlaceholderForeground}"
-                         IsVisible="{TemplateBinding SelectionBoxItem, Converter={x:Static ObjectConverters.IsNull}}" />
-              <ContentControl x:Name="ContentPresenter"
-                              Content="{TemplateBinding SelectionBoxItem}"
-                              ContentTemplate="{TemplateBinding ItemTemplate}"
-                              Grid.Row="1"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:sys="clr-namespace:System;assembly=netstandard">
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <StackPanel Spacing="10">
+        <ComboBox PlaceholderText="Select an item">
+          <ComboBoxItem>Item 1</ComboBoxItem>
+          <ComboBoxItem>Item 2</ComboBoxItem>
+        </ComboBox>
+        <ComboBox IsEnabled="False"
+                  Width="200"
+                  SelectedIndex="1"
+                  HorizontalContentAlignment="Center">
+          <ComboBoxItem>Item 1</ComboBoxItem>
+          <ComboBoxItem>Item 2</ComboBoxItem>
+        </ComboBox>
+        <ComboBox PlaceholderText="Error">
+          <DataValidationErrors.Error>
+            <sys:Exception>
+              <x:Arguments>
+                <x:String>Error</x:String>
+              </x:Arguments>
+            </sys:Exception>
+          </DataValidationErrors.Error>
+        </ComboBox>
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
+
+  <Thickness x:Key="ComboBoxTopHeaderMargin">0,0,0,4</Thickness>
+  <x:Int32 x:Key="ComboBoxPopupMaxNumberOfItems">15</x:Int32>
+  <x:Int32 x:Key="ComboBoxPopupMaxNumberOfItemsThatCanBeShownOnOneSide">7</x:Int32>
+
+  <Thickness x:Key="ComboBoxPadding">12,5,0,7</Thickness>
+  <Thickness x:Key="ComboBoxEditableTextPadding">11,5,32,6</Thickness>
+  <x:Double x:Key="ComboBoxMinHeight">32</x:Double>
+
+  <ControlTheme x:Key="{x:Type ComboBox}" TargetType="ComboBox">
+    <Setter Property="Padding" Value="{DynamicResource ComboBoxPadding}" />
+    <Setter Property="FocusAdorner" Value="{x:Null}" />
+    <Setter Property="MaxDropDownHeight" Value="504" />
+    <Setter Property="Foreground" Value="{DynamicResource ComboBoxForeground}" />
+    <Setter Property="Background" Value="{DynamicResource ComboBoxBackground}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrush}" />
+    <Setter Property="BorderThickness" Value="{DynamicResource ComboBoxBorderThemeThickness}" />
+    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
+    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
+    <Setter Property="MinHeight" Value="{DynamicResource ComboBoxMinHeight}" />
+    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
+    <Setter Property="VerticalContentAlignment" Value="Center" />
+    <Setter Property="HorizontalAlignment" Value="Left" />
+    <Setter Property="VerticalAlignment" Value="Top" />
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="PlaceholderForeground" Value="{DynamicResource ComboBoxPlaceHolderForeground}" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <DataValidationErrors>
+          <Grid RowDefinitions="Auto, *, Auto" ColumnDefinitions="*,32">
+            <ContentPresenter x:Name="HeaderContentPresenter"
+                              Grid.Row="0"
                               Grid.Column="0"
-                              Margin="{TemplateBinding Padding}"
-                              HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                              VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
-              
-              <Border x:Name="DropDownOverlay"
+                              Grid.ColumnSpan="2"
+                              IsVisible="False"
+                              FontWeight="{DynamicResource ComboBoxHeaderThemeFontWeight}"
+                              Margin="{DynamicResource ComboBoxTopHeaderMargin}"
+                              VerticalAlignment="Top" />
+            <Border x:Name="Background"
+                    Grid.Row="1"
+                    Grid.Column="0"
+                    Grid.ColumnSpan="2"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    CornerRadius="{TemplateBinding CornerRadius}"
+                    MinWidth="{DynamicResource ComboBoxThemeMinWidth}" />
+            <Border x:Name="HighlightBackground"
+                    Grid.Row="1"
+                    Grid.Column="0"
+                    Grid.ColumnSpan="2"
+                    Background="{DynamicResource ComboBoxBackgroundUnfocused}"
+                    BorderBrush="{DynamicResource ComboBoxBackgroundBorderBrushUnfocused}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    CornerRadius="{TemplateBinding CornerRadius}"
+                    IsVisible="False"/>
+            <TextBlock x:Name="PlaceholderTextBlock"
+                       Grid.Row="1"
+                       Grid.Column="0"
+                       HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                       VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                       Margin="{TemplateBinding Padding}"
+                       Text="{TemplateBinding PlaceholderText}"
+                       Foreground="{TemplateBinding PlaceholderForeground}"
+                       IsVisible="{TemplateBinding SelectionBoxItem, Converter={x:Static ObjectConverters.IsNull}}" />
+            <ContentControl x:Name="ContentPresenter"
+                            Content="{TemplateBinding SelectionBoxItem}"
+                            ContentTemplate="{TemplateBinding ItemTemplate}"
+                            Grid.Row="1"
+                            Grid.Column="0"
+                            Margin="{TemplateBinding Padding}"
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
+
+            <Border x:Name="DropDownOverlay"
+                    Grid.Row="1"
+                    Grid.Column="1"
+                    Background="Transparent"
+                    Margin="0,1,1,1"
+                    Width="30"
+                    IsVisible="False"
+                    HorizontalAlignment="Right" />
+
+            <PathIcon x:Name="DropDownGlyph"
                       Grid.Row="1"
                       Grid.Column="1"
-                      Background="Transparent"
-                      Margin="0,1,1,1" 
-                      Width="30" 
-                      IsVisible="False" 
-                      HorizontalAlignment="Right" />
-              
-              <PathIcon x:Name="DropDownGlyph"
-                        Grid.Row="1"
-                        Grid.Column="1"
-                        UseLayoutRounding="False"
-                        IsHitTestVisible="False"
-                        Height="12"
-                        Width="12"
-                        Margin="0,0,10,0" 
-                        HorizontalAlignment="Right"
-                        VerticalAlignment="Center"
-                        Foreground="{DynamicResource ComboBoxDropDownGlyphForeground}"
-                        Data="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z"/>
-              
-              <Popup Name="PART_Popup" 
-                     WindowManagerAddShadowHint="False"
-                     IsOpen="{TemplateBinding IsDropDownOpen, Mode=TwoWay}" 
-                     MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}" 
-                     MaxHeight="{TemplateBinding MaxDropDownHeight}"
-                     PlacementTarget="Background" 
-                     IsLightDismissEnabled="True" 
-                     InheritsTransform="True">
-                <Border x:Name="PopupBorder"
-                        Background="{DynamicResource ComboBoxDropDownBackground}"
-                        BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}" 
-                        BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}"
-                        Margin="0,-1,0,-1"
-                        Padding="{DynamicResource ComboBoxDropdownBorderPadding}"
-                        HorizontalAlignment="Stretch"
-                        CornerRadius="{DynamicResource OverlayCornerRadius}">
-                  <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
-                                VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
-                    <ItemsPresenter Name="PART_ItemsPresenter"
-                                    Items="{TemplateBinding Items}" 
-                                    Margin="{DynamicResource ComboBoxDropdownContentMargin}" 
-                                    ItemsPanel="{TemplateBinding ItemsPanel}"
-                                    ItemTemplate="{TemplateBinding ItemTemplate}" 
-                                    VirtualizationMode="{TemplateBinding VirtualizationMode}" />
-                  </ScrollViewer>
-                </Border>
-              </Popup>
-            </Grid>
-          </DataValidationErrors>
-        </ControlTemplate>
-      </Setter>
+                      UseLayoutRounding="False"
+                      IsHitTestVisible="False"
+                      Height="12"
+                      Width="12"
+                      Margin="0,0,10,0"
+                      HorizontalAlignment="Right"
+                      VerticalAlignment="Center"
+                      Foreground="{DynamicResource ComboBoxDropDownGlyphForeground}"
+                      Data="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z"/>
+
+            <Popup Name="PART_Popup"
+                   WindowManagerAddShadowHint="False"
+                   IsOpen="{TemplateBinding IsDropDownOpen, Mode=TwoWay}"
+                   MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
+                   MaxHeight="{TemplateBinding MaxDropDownHeight}"
+                   PlacementTarget="Background"
+                   IsLightDismissEnabled="True"
+                   InheritsTransform="True">
+              <Border x:Name="PopupBorder"
+                      Background="{DynamicResource ComboBoxDropDownBackground}"
+                      BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}"
+                      BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}"
+                      Margin="0,-1,0,-1"
+                      Padding="{DynamicResource ComboBoxDropdownBorderPadding}"
+                      HorizontalAlignment="Stretch"
+                      CornerRadius="{DynamicResource OverlayCornerRadius}">
+                <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
+                              VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
+                  <ItemsPresenter Name="PART_ItemsPresenter"
+                                  Items="{TemplateBinding Items}"
+                                  Margin="{DynamicResource ComboBoxDropdownContentMargin}"
+                                  ItemsPanel="{TemplateBinding ItemsPanel}"
+                                  ItemTemplate="{TemplateBinding ItemTemplate}"
+                                  VirtualizationMode="{TemplateBinding VirtualizationMode}" />
+                </ScrollViewer>
+              </Border>
+            </Popup>
+          </Grid>
+        </DataValidationErrors>
+      </ControlTemplate>
+    </Setter>
+
+    <!--  PointerOver State  -->
+    <Style Selector="^:pointerover /template/ Border#Background">
+      <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundPointerOver}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushPointerOver}" />
+    </Style>
+
+    <!--  Pressed State  -->
+    <Style Selector="^:pressed /template/ Border#Background">
+      <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundPressed}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushPressed}" />
+    </Style>
 
-      <!--  PointerOver State  -->
-      <Style Selector="^:pointerover /template/ Border#Background">
-        <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundPointerOver}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushPointerOver}" />
+    <!-- Error State -->
+    <Style Selector="^:error /template/ Border#Background">
+      <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
+    </Style>
+
+    <!--  Focus Pressed State  -->
+    <Style Selector="^:focused:pressed">
+      <Style Selector="^ /template/ ContentControl#ContentPresenter">
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocusedPressed}" />
       </Style>
-      
-      <!--  Pressed State  -->
-      <Style Selector="^:pressed /template/ Border#Background">
-        <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundPressed}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushPressed}" />
+      <Style Selector="^ /template/ TextBlock#PlaceholderTextBlock">
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxPlaceHolderForegroundFocusedPressed}" />
       </Style>
-      
-      <!-- Error State -->
-      <Style Selector="^:error /template/ Border#Background">
-        <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
+      <Style Selector="^ /template/ PathIcon#DropDownGlyph">
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundFocusedPressed}" />
       </Style>
+    </Style>
 
-      <!--  Focus Pressed State  -->
-      <Style Selector="^:focused:pressed">
-        <Style Selector="^ /template/ ContentControl#ContentPresenter">
-          <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocusedPressed}" />
-        </Style>
-        <Style Selector="^ /template/ TextBlock#PlaceholderTextBlock">
-          <Setter Property="Foreground" Value="{DynamicResource ComboBoxPlaceHolderForegroundFocusedPressed}" />
-        </Style>
-        <Style Selector="^ /template/ PathIcon#DropDownGlyph">
-          <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundFocusedPressed}" />
-        </Style>
+    <!--  Focused State  -->
+    <Style Selector="^:focus-visible">
+      <Style Selector="^ /template/ Border#HighlightBackground">
+        <Setter Property="IsVisible" Value="True" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBackgroundBorderBrushFocused}" />
       </Style>
-
-      <!--  Focused State  -->
-      <Style Selector="^:focus-visible">
-        <Style Selector="^ /template/ Border#HighlightBackground">
-          <Setter Property="IsVisible" Value="True" />
-          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBackgroundBorderBrushFocused}" />
-        </Style>
-        <Style Selector="^ /template/ ContentControl#ContentPresenter">
-          <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocused}" />
-        </Style>
-        <Style Selector="^ /template/ TextBlock#PlaceholderTextBlock">
-          <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocused}" />
-        </Style>
-        <Style Selector="^ /template/ PathIcon#DropDownGlyph">
-          <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundFocused}" />
-        </Style>
+      <Style Selector="^ /template/ ContentControl#ContentPresenter">
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocused}" />
+      </Style>
+      <Style Selector="^ /template/ TextBlock#PlaceholderTextBlock">
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocused}" />
       </Style>
+      <Style Selector="^ /template/ PathIcon#DropDownGlyph">
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundFocused}" />
+      </Style>
+    </Style>
 
-      <!--  Disabled State  -->
-      <Style Selector="^:disabled">
-        <Style Selector="^ /template/ Border#Background">
-          <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundDisabled}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushDisabled}" />
-        </Style>
-        <Style Selector="^ /template/ ContentPresenter#HeaderContentPresenter">
-          <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
-        </Style>
-        <Style Selector="^ /template/ ContentControl#ContentPresenter">
-          <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
-        </Style>
-        <Style Selector="^ /template/ TextBlock#PlaceholderTextBlock">
-          <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
-        </Style>
-        <Style Selector="^ /template/ PathIcon#DropDownGlyph">
-          <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundDisabled}" />
-        </Style>
+    <!--  Disabled State  -->
+    <Style Selector="^:disabled">
+      <Style Selector="^ /template/ Border#Background">
+        <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundDisabled}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushDisabled}" />
+      </Style>
+      <Style Selector="^ /template/ ContentPresenter#HeaderContentPresenter">
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
       </Style>
-    </ControlTheme>
-  
+      <Style Selector="^ /template/ ContentControl#ContentPresenter">
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
+      </Style>
+      <Style Selector="^ /template/ TextBlock#PlaceholderTextBlock">
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
+      </Style>
+      <Style Selector="^ /template/ PathIcon#DropDownGlyph">
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundDisabled}" />
+      </Style>
+    </Style>
+  </ControlTheme>
+
 </ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ComboBoxItem.xaml b/src/Avalonia.Themes.Fluent/Controls/ComboBoxItem.xaml
index 88f9c0ea15..581cbaf80a 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ComboBoxItem.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ComboBoxItem.xaml
@@ -1,85 +1,86 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Design.PreviewWith>
-      <Border Padding="20">
-        <Border Background="{DynamicResource ComboBoxDropDownBackground}" BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}" BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}" Margin="0,-1,0,-1" Padding="{DynamicResource ComboBoxDropdownBorderPadding}" CornerRadius="{DynamicResource OverlayCornerRadius}">
-          <StackPanel HorizontalAlignment="Stretch">
-            <ComboBoxItem>Item 1</ComboBoxItem>
-            <ComboBoxItem>Item 2 long</ComboBoxItem>
-            <ComboBoxItem IsSelected="True">Item 3</ComboBoxItem>
-            <ComboBoxItem IsEnabled="False">Item 4</ComboBoxItem>
-          </StackPanel>
-        </Border>
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <Border Background="{DynamicResource ComboBoxDropDownBackground}" BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}" BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}" Margin="0,-1,0,-1" Padding="{DynamicResource ComboBoxDropdownBorderPadding}" CornerRadius="{DynamicResource OverlayCornerRadius}">
+        <StackPanel HorizontalAlignment="Stretch">
+          <ComboBoxItem>Item 1</ComboBoxItem>
+          <ComboBoxItem>Item 2 long</ComboBoxItem>
+          <ComboBoxItem IsSelected="True">Item 3</ComboBoxItem>
+          <ComboBoxItem IsEnabled="False">Item 4</ComboBoxItem>
+          <ComboBoxItem IsSelected="True" IsEnabled="False">Item 5</ComboBoxItem>
+        </StackPanel>
       </Border>
-    </Design.PreviewWith>
-  
-    <ControlTheme x:Key="{x:Type ComboBoxItem}" TargetType="ComboBoxItem">
-      <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForeground}" />
-      <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackground}" />
-      <Setter Property="Padding" Value="{DynamicResource ComboBoxItemThemePadding}" />
-      <Setter Property="HorizontalContentAlignment" Value="Stretch" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <ContentPresenter Name="PART_ContentPresenter"
-                            Foreground="{TemplateBinding Foreground}"
-                            Background="{TemplateBinding Background}" 
-                            BorderBrush="{TemplateBinding BorderBrush}"
-                            BorderThickness="{TemplateBinding BorderThickness}"
-                            CornerRadius="{TemplateBinding CornerRadius}"
-                            ContentTemplate="{TemplateBinding ContentTemplate}"
-                            Content="{TemplateBinding Content}" 
-                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                            Padding="{TemplateBinding Padding}" />
-        </ControlTemplate>
-      </Setter>
-      
-      <!--  PointerOver state  -->
-      <Style Selector="^:pointerover /template/ ContentPresenter">
-        <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundPointerOver}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushPointerOver}" />
-        <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundPointerOver}" />
+    </Border>
+  </Design.PreviewWith>
+
+  <ControlTheme x:Key="{x:Type ComboBoxItem}" TargetType="ComboBoxItem">
+    <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForeground}" />
+    <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackground}" />
+    <Setter Property="Padding" Value="{DynamicResource ComboBoxItemThemePadding}" />
+    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <ContentPresenter Name="PART_ContentPresenter"
+                          Foreground="{TemplateBinding Foreground}"
+                          Background="{TemplateBinding Background}"
+                          BorderBrush="{TemplateBinding BorderBrush}"
+                          BorderThickness="{TemplateBinding BorderThickness}"
+                          CornerRadius="{TemplateBinding CornerRadius}"
+                          ContentTemplate="{TemplateBinding ContentTemplate}"
+                          Content="{TemplateBinding Content}"
+                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                          Padding="{TemplateBinding Padding}" />
+      </ControlTemplate>
+    </Setter>
+
+    <!--  PointerOver state  -->
+    <Style Selector="^:pointerover /template/ ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundPointerOver}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushPointerOver}" />
+      <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundPointerOver}" />
+    </Style>
+
+    <!--  Disabled state  -->
+    <Style Selector="^:disabled /template/ ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundDisabled}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushDisabled}" />
+      <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundDisabled}" />
+    </Style>
+
+    <!--  Pressed state  -->
+    <Style Selector="^:pressed /template/ ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundPressed}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushPressed}" />
+      <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundPressed}" />
+    </Style>
+
+    <!--  Selected state  -->
+    <Style Selector="^:selected">
+      <Style Selector="^ /template/ ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelected}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelected}" />
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelected}" />
       </Style>
-      
-      <!--  Disabled state  -->
+      <!--  Selected Disabled state  -->
       <Style Selector="^:disabled /template/ ContentPresenter">
-        <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundDisabled}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushDisabled}" />
-        <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundDisabled}" />
+        <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedDisabled}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedDisabled}" />
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedDisabled}" />
       </Style>
-      
-      <!--  Pressed state  -->
-      <Style Selector="^:pressed /template/ ContentPresenter">
-        <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundPressed}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushPressed}" />
-        <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundPressed}" />
+      <!--  Selected PointerOver state  -->
+      <Style Selector="^:pointerover /template/ ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedPointerOver}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedPointerOver}" />
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedPointerOver}" />
       </Style>
-
-      <!--  Selected state  -->
-      <Style Selector="^:selected">
-        <Style Selector="^ /template/ ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelected}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelected}" />
-          <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelected}" />
-        </Style>
-        <!--  Selected Disabled state  -->
-        <Style Selector="^:disabled /template/ ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedDisabled}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedDisabled}" />
-          <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedDisabled}" />
-        </Style>
-        <!--  Selected PointerOver state  -->
-        <Style Selector="^:pointerover /template/ ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedPointerOver}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedPointerOver}" />
-          <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedPointerOver}" />
-        </Style>
-        <!--  Selected Pressed state  -->
-        <Style Selector="^:pressed /template/ ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedPressed}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedPressed}" />
-          <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedPressed}" />
-        </Style>
+      <!--  Selected Pressed state  -->
+      <Style Selector="^:pressed /template/ ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedPressed}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedPressed}" />
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedPressed}" />
       </Style>
-    </ControlTheme>
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From 100978a5bf491b75d89fa0669fcce52a212d021d Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 14:09:41 +0200
Subject: [PATCH 13/70] Formatted ContentControl ControlTheme.

---
 .../Controls/ContentControl.xaml              | 32 +++++++++----------
 1 file changed, 16 insertions(+), 16 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/ContentControl.xaml b/src/Avalonia.Themes.Fluent/Controls/ContentControl.xaml
index 5777603074..4caf156366 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ContentControl.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ContentControl.xaml
@@ -1,19 +1,19 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTheme x:Key="{x:Type ContentControl}" TargetType="ContentControl">
-      <Setter Property="Template">
-        <ControlTemplate>
-          <ContentPresenter Name="PART_ContentPresenter"
-                            Background="{TemplateBinding Background}"
-                            BorderBrush="{TemplateBinding BorderBrush}"
-                            BorderThickness="{TemplateBinding BorderThickness}"
-                            CornerRadius="{TemplateBinding CornerRadius}"
-                            ContentTemplate="{TemplateBinding ContentTemplate}"
-                            Content="{TemplateBinding Content}"
-                            Padding="{TemplateBinding Padding}"
-                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
-        </ControlTemplate>
-      </Setter>
-    </ControlTheme>
+  <ControlTheme x:Key="{x:Type ContentControl}" TargetType="ContentControl">
+    <Setter Property="Template">
+      <ControlTemplate>
+        <ContentPresenter Name="PART_ContentPresenter"
+                          Background="{TemplateBinding Background}"
+                          BorderBrush="{TemplateBinding BorderBrush}"
+                          BorderThickness="{TemplateBinding BorderThickness}"
+                          CornerRadius="{TemplateBinding CornerRadius}"
+                          ContentTemplate="{TemplateBinding ContentTemplate}"
+                          Content="{TemplateBinding Content}"
+                          Padding="{TemplateBinding Padding}"
+                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>

From e89060fbc3c655340fc254ca26744ab9ddcd3ab9 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 14:18:48 +0200
Subject: [PATCH 14/70] Formatted DataValidationErrors ControlTheme.

---
 .../Controls/DataValidationErrors.xaml        | 198 +++++++++---------
 1 file changed, 99 insertions(+), 99 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/DataValidationErrors.xaml b/src/Avalonia.Themes.Fluent/Controls/DataValidationErrors.xaml
index 6ed73148a7..cc55f84d80 100644
--- a/src/Avalonia.Themes.Fluent/Controls/DataValidationErrors.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/DataValidationErrors.xaml
@@ -1,103 +1,103 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" 
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-                    xmlns:sys="using:System" 
+                    xmlns:sys="using:System"
                     x:CompileBindings="True"
                     x:DataType="DataValidationErrors">
-    <Design.PreviewWith>
-      <Border Padding="20">
-        <StackPanel Spacing="20">
-          <TextBox Text="Sample">
-            <DataValidationErrors.Error>
-              <sys:Exception />
-            </DataValidationErrors.Error>
-          </TextBox>
-          <TextBox Text="Sample">
-            <TextBox.Styles>
-              <Style Selector="DataValidationErrors">
-                <Setter Property="Template" Value="{DynamicResource TooltipDataValidationContentTemplate}" />
-                <Setter Property="ErrorTemplate" Value="{DynamicResource TooltipDataValidationErrorTemplate}" />
-              </Style>
-            </TextBox.Styles>
-            <DataValidationErrors.Error>
-              <sys:Exception />
-            </DataValidationErrors.Error>
-          </TextBox>
-        </StackPanel>
-      </Border>
-    </Design.PreviewWith>
-  
-    <ControlTheme x:Key="{x:Type DataValidationErrors}" TargetType="DataValidationErrors">
-      <ControlTheme.Resources>
-        <DataTemplate x:Key="InlineDataValidationErrorTemplate">
-          <ItemsControl Items="{Binding}" x:DataType="DataValidationErrors" Foreground="{DynamicResource SystemControlErrorTextForegroundBrush}">
-            <ItemsControl.Styles>
-              <Style Selector="TextBlock">
-                <Setter Property="TextWrapping" Value="Wrap" />
-              </Style>
-            </ItemsControl.Styles>
-          </ItemsControl>
-        </DataTemplate>
-        <ControlTemplate x:Key="InlineDataValidationContentTemplate" TargetType="DataValidationErrors">
-          <DockPanel LastChildFill="True">
-            <ContentControl x:Name="InlineDataValidationContentControl"
-                            Margin="0,4,0,0" 
-                            Content="{Binding (DataValidationErrors.Errors)}" 
-                            ContentTemplate="{TemplateBinding ErrorTemplate}" 
-                            DataContext="{TemplateBinding Owner}" 
-                            DockPanel.Dock="Bottom"
-                            IsVisible="{Binding (DataValidationErrors.HasErrors)}" />
-            <ContentPresenter Name="PART_ContentPresenter"
-                              Padding="{TemplateBinding Padding}" 
-                              Background="{TemplateBinding Background}"
-                              BorderThickness="{TemplateBinding BorderThickness}" 
-                              CornerRadius="{TemplateBinding CornerRadius}"
-                              Content="{TemplateBinding Content}" 
-                              ContentTemplate="{TemplateBinding ContentTemplate}" />
-          </DockPanel>
-        </ControlTemplate>
-        
-        <DataTemplate x:DataType="DataValidationErrors" x:Key="TooltipDataValidationErrorTemplate">
-          <Panel Name="PART_InlineErrorTemplatePanel" Background="Transparent">
-            <Panel.Styles>
-              <Style Selector="Panel#PART_InlineErrorTemplatePanel">
-                <Setter Property="Margin" Value="8,0" />
-              </Style>
-              <Style Selector="Panel#PART_InlineErrorTemplatePanel ToolTip">
-                <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
-              </Style>
-              <Style Selector="Panel#PART_InlineErrorTemplatePanel ToolTip TextBlock">
-                <Setter Property="TextWrapping" Value="Wrap" />
-              </Style>
-            </Panel.Styles>
-            <ToolTip.Tip>
-              <ItemsControl Items="{Binding}" />
-            </ToolTip.Tip>
-            <Path Width="14"
-                  Height="14"
-                  Data="M14,7 A7,7 0 0,0 0,7 M0,7 A7,7 0 1,0 14,7 M7,3l0,5 M7,9l0,2"
-                  Stroke="{DynamicResource SystemControlErrorTextForegroundBrush}"
-                  StrokeThickness="2" />
-          </Panel>
-        </DataTemplate>
-        <ControlTemplate x:Key="TooltipDataValidationContentTemplate" TargetType="DataValidationErrors">
-          <DockPanel LastChildFill="True">
-            <ContentControl Content="{Binding (DataValidationErrors.Errors)}"
-                            ContentTemplate="{TemplateBinding ErrorTemplate}" 
-                            DataContext="{TemplateBinding Owner}" 
-                            DockPanel.Dock="Right" 
-                            IsVisible="{Binding (DataValidationErrors.HasErrors)}" />
-            <ContentPresenter Name="PART_ContentPresenter"
-                              Padding="{TemplateBinding Padding}"
-                              Background="{TemplateBinding Background}"
-                              BorderBrush="{TemplateBinding BorderBrush}" 
-                              BorderThickness="{TemplateBinding BorderThickness}" 
-                              CornerRadius="{TemplateBinding CornerRadius}" 
-                              Content="{TemplateBinding Content}"
-                              ContentTemplate="{TemplateBinding ContentTemplate}" />
-          </DockPanel>
-        </ControlTemplate>
-      </ControlTheme.Resources>
-      <Setter Property="Template" Value="{StaticResource InlineDataValidationContentTemplate}" />
-      <Setter Property="ErrorTemplate" Value="{StaticResource InlineDataValidationErrorTemplate}" />
-    </ControlTheme>
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <StackPanel Spacing="20">
+        <TextBox Text="Sample">
+          <DataValidationErrors.Error>
+            <sys:Exception />
+          </DataValidationErrors.Error>
+        </TextBox>
+        <TextBox Text="Sample">
+          <TextBox.Styles>
+            <Style Selector="DataValidationErrors">
+              <Setter Property="Template" Value="{DynamicResource TooltipDataValidationContentTemplate}" />
+              <Setter Property="ErrorTemplate" Value="{DynamicResource TooltipDataValidationErrorTemplate}" />
+            </Style>
+          </TextBox.Styles>
+          <DataValidationErrors.Error>
+            <sys:Exception />
+          </DataValidationErrors.Error>
+        </TextBox>
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
+
+  <ControlTheme x:Key="{x:Type DataValidationErrors}" TargetType="DataValidationErrors">
+    <ControlTheme.Resources>
+      <DataTemplate x:Key="InlineDataValidationErrorTemplate">
+        <ItemsControl Items="{Binding}" x:DataType="DataValidationErrors" Foreground="{DynamicResource SystemControlErrorTextForegroundBrush}">
+          <ItemsControl.Styles>
+            <Style Selector="TextBlock">
+              <Setter Property="TextWrapping" Value="Wrap" />
+            </Style>
+          </ItemsControl.Styles>
+        </ItemsControl>
+      </DataTemplate>
+      <ControlTemplate x:Key="InlineDataValidationContentTemplate" TargetType="DataValidationErrors">
+        <DockPanel LastChildFill="True">
+          <ContentControl x:Name="InlineDataValidationContentControl"
+                          Margin="0,4,0,0"
+                          Content="{Binding (DataValidationErrors.Errors)}"
+                          ContentTemplate="{TemplateBinding ErrorTemplate}"
+                          DataContext="{TemplateBinding Owner}"
+                          DockPanel.Dock="Bottom"
+                          IsVisible="{Binding (DataValidationErrors.HasErrors)}" />
+          <ContentPresenter Name="PART_ContentPresenter"
+                            Padding="{TemplateBinding Padding}"
+                            Background="{TemplateBinding Background}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
+                            CornerRadius="{TemplateBinding CornerRadius}"
+                            Content="{TemplateBinding Content}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}" />
+        </DockPanel>
+      </ControlTemplate>
+
+      <DataTemplate x:DataType="DataValidationErrors" x:Key="TooltipDataValidationErrorTemplate">
+        <Panel Name="PART_InlineErrorTemplatePanel" Background="Transparent">
+          <Panel.Styles>
+            <Style Selector="Panel#PART_InlineErrorTemplatePanel">
+              <Setter Property="Margin" Value="8,0" />
+            </Style>
+            <Style Selector="Panel#PART_InlineErrorTemplatePanel ToolTip">
+              <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
+            </Style>
+            <Style Selector="Panel#PART_InlineErrorTemplatePanel ToolTip TextBlock">
+              <Setter Property="TextWrapping" Value="Wrap" />
+            </Style>
+          </Panel.Styles>
+          <ToolTip.Tip>
+            <ItemsControl Items="{Binding}" />
+          </ToolTip.Tip>
+          <Path Width="14"
+                Height="14"
+                Data="M14,7 A7,7 0 0,0 0,7 M0,7 A7,7 0 1,0 14,7 M7,3l0,5 M7,9l0,2"
+                Stroke="{DynamicResource SystemControlErrorTextForegroundBrush}"
+                StrokeThickness="2" />
+        </Panel>
+      </DataTemplate>
+      <ControlTemplate x:Key="TooltipDataValidationContentTemplate" TargetType="DataValidationErrors">
+        <DockPanel LastChildFill="True">
+          <ContentControl Content="{Binding (DataValidationErrors.Errors)}"
+                          ContentTemplate="{TemplateBinding ErrorTemplate}"
+                          DataContext="{TemplateBinding Owner}"
+                          DockPanel.Dock="Right"
+                          IsVisible="{Binding (DataValidationErrors.HasErrors)}" />
+          <ContentPresenter Name="PART_ContentPresenter"
+                            Padding="{TemplateBinding Padding}"
+                            Background="{TemplateBinding Background}"
+                            BorderBrush="{TemplateBinding BorderBrush}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
+                            CornerRadius="{TemplateBinding CornerRadius}"
+                            Content="{TemplateBinding Content}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}" />
+        </DockPanel>
+      </ControlTemplate>
+    </ControlTheme.Resources>
+    <Setter Property="Template" Value="{StaticResource InlineDataValidationContentTemplate}" />
+    <Setter Property="ErrorTemplate" Value="{StaticResource InlineDataValidationErrorTemplate}" />
+  </ControlTheme>
 </ResourceDictionary>

From ebe9d6b086c3da15678aea2408412df18ce520e7 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 14:29:30 +0200
Subject: [PATCH 15/70] Tidied up DropDownButton ControlTheme.

---
 .../Controls/DropDownButton.xaml               | 18 +++++++-----------
 1 file changed, 7 insertions(+), 11 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml b/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml
index 3206cb8cb1..96fd575f4f 100644
--- a/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml
@@ -57,26 +57,26 @@
                           Margin="0,0,10,0"
                           Data="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z"
                           HorizontalAlignment="Right"
-                          VerticalAlignment="Center" />
+                          VerticalAlignment="Center"
+                          Foreground="{DynamicResource ComboBoxDropDownGlyphForeground}"/>
               </Grid>
             </Border>
           </ControlTemplate>
         </Setter.Value>
       </Setter>
       
-      <!--  Normal State  -->
-      <Style Selector="^ /template/ PathIcon#DropDownGlyph">
-        <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForeground}" />
-      </Style>
-      
       <!--  PointerOver State  -->
       <Style Selector="^:pointerover /template/ Border#RootBorder">
         <Setter Property="Background" Value="{DynamicResource ButtonBackgroundPointerOver}" />
         <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushPointerOver}" />
         <Setter Property="TextElement.Foreground" Value="{DynamicResource ButtonForegroundPointerOver}" />
       </Style>
-      
+
       <!--  Pressed State  -->
+      <Style Selector="^:pressed">
+        <Setter Property="RenderTransform" Value="scale(0.98)" />
+      </Style>
+
       <Style Selector="^:pressed /template/ Border#RootBorder">
         <Setter Property="Background" Value="{DynamicResource ButtonBackgroundPressed}" />
         <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushPressed}" />
@@ -92,10 +92,6 @@
       <Style Selector="^:disabled /template/ PathIcon#DropDownGlyph">
         <Setter Property="Foreground" Value="{DynamicResource ButtonForegroundDisabled}" />
       </Style>
-
-      <Style Selector="^:pressed">
-        <Setter Property="RenderTransform" Value="scale(0.98)" />
-      </Style>
     </ControlTheme>
   
 </ResourceDictionary>

From 6f797a9c56f643cc724521e75d5ba9ba9a3882bf Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 14:30:04 +0200
Subject: [PATCH 16/70] Tidied up EmbeddableControlRoot ControlTheme.

---
 .../Controls/EmbeddableControlRoot.xaml       | 39 +++++++++----------
 1 file changed, 19 insertions(+), 20 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/EmbeddableControlRoot.xaml b/src/Avalonia.Themes.Fluent/Controls/EmbeddableControlRoot.xaml
index 89eaec70ad..f8b4854553 100644
--- a/src/Avalonia.Themes.Fluent/Controls/EmbeddableControlRoot.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/EmbeddableControlRoot.xaml
@@ -1,23 +1,22 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTheme x:Key="{x:Type EmbeddableControlRoot}" TargetType="EmbeddableControlRoot">
-      <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltHighBrush}"/>
-      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}"/>
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Panel>
-            <Border Name="PART_TransparencyFallback" IsHitTestVisible="False" />
-            <Border Background="{TemplateBinding Background}">
-              <VisualLayerManager>
-                <ContentPresenter Name="PART_ContentPresenter"
-                                  ContentTemplate="{TemplateBinding ContentTemplate}"
-                                  Content="{TemplateBinding Content}"
-                                  Margin="{TemplateBinding Padding}"/>
-              </VisualLayerManager>
-            </Border>
-          </Panel>
-        </ControlTemplate>
-      </Setter>
-    </ControlTheme>
-
+  <ControlTheme x:Key="{x:Type EmbeddableControlRoot}" TargetType="EmbeddableControlRoot">
+    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltHighBrush}"/>
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}"/>
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Panel>
+          <Border Name="PART_TransparencyFallback" IsHitTestVisible="False" />
+          <Border Background="{TemplateBinding Background}">
+            <VisualLayerManager>
+              <ContentPresenter Name="PART_ContentPresenter"
+                                ContentTemplate="{TemplateBinding ContentTemplate}"
+                                Content="{TemplateBinding Content}"
+                                Margin="{TemplateBinding Padding}"/>
+            </VisualLayerManager>
+          </Border>
+        </Panel>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>

From 4f3fafc9dfa6835ed1707715eabd0665dda9bb52 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 14:56:36 +0200
Subject: [PATCH 17/70] Tweaked Expander ControlTheme.

And added "Rounded" option to ControlCatalog for testing.
---
 .../ControlCatalog/Pages/ExpanderPage.xaml    | 15 ++--
 .../ControlCatalog/Pages/ExpanderPage.xaml.cs |  2 +
 .../ViewModels/ExpanderPageViewModel.cs       | 27 +++++++
 .../Controls/Expander.xaml                    | 71 +++++++++----------
 4 files changed, 72 insertions(+), 43 deletions(-)
 create mode 100644 samples/ControlCatalog/ViewModels/ExpanderPageViewModel.cs

diff --git a/samples/ControlCatalog/Pages/ExpanderPage.xaml b/samples/ControlCatalog/Pages/ExpanderPage.xaml
index cef473af04..f9ae1c7a3c 100644
--- a/samples/ControlCatalog/Pages/ExpanderPage.xaml
+++ b/samples/ControlCatalog/Pages/ExpanderPage.xaml
@@ -8,26 +8,31 @@
                 Margin="0,16,0,0"
                 HorizontalAlignment="Center"
                 Spacing="16">
-      <Expander Header="Expand Up" ExpandDirection="Up">
+      <Expander Header="Expand Up" ExpandDirection="Up"
+                CornerRadius="{Binding CornerRadius}">
         <StackPanel>
           <TextBlock>Expanded content</TextBlock>
         </StackPanel>
       </Expander>
-      <Expander Header="Expand Down" ExpandDirection="Down">
+      <Expander Header="Expand Down" ExpandDirection="Down"
+                CornerRadius="{Binding CornerRadius}">
         <StackPanel>
           <TextBlock>Expanded content</TextBlock>
         </StackPanel>
       </Expander>
-      <Expander Header="Expand Left" ExpandDirection="Left">
+      <Expander Header="Expand Left" ExpandDirection="Left"
+                CornerRadius="{Binding CornerRadius}">
         <StackPanel>
           <TextBlock>Expanded content</TextBlock>
         </StackPanel>
       </Expander>
-      <Expander Header="Expand Right" ExpandDirection="Right">
+      <Expander Header="Expand Right" ExpandDirection="Right"
+                CornerRadius="{Binding CornerRadius}">
         <StackPanel>
           <TextBlock>Expanded content</TextBlock>
         </StackPanel>
       </Expander>
-    </StackPanel>    
+      <CheckBox IsChecked="{Binding Rounded}">Rounded</CheckBox>
+    </StackPanel>
   </StackPanel>
 </UserControl>
diff --git a/samples/ControlCatalog/Pages/ExpanderPage.xaml.cs b/samples/ControlCatalog/Pages/ExpanderPage.xaml.cs
index 52166d1a5f..e8a080899a 100644
--- a/samples/ControlCatalog/Pages/ExpanderPage.xaml.cs
+++ b/samples/ControlCatalog/Pages/ExpanderPage.xaml.cs
@@ -1,5 +1,6 @@
 using Avalonia.Controls;
 using Avalonia.Markup.Xaml;
+using ControlCatalog.ViewModels;
 
 namespace ControlCatalog.Pages
 {
@@ -8,6 +9,7 @@ namespace ControlCatalog.Pages
         public ExpanderPage()
         {
             this.InitializeComponent();
+            DataContext = new ExpanderPageViewModel();
         }
 
         private void InitializeComponent()
diff --git a/samples/ControlCatalog/ViewModels/ExpanderPageViewModel.cs b/samples/ControlCatalog/ViewModels/ExpanderPageViewModel.cs
new file mode 100644
index 0000000000..18511a6071
--- /dev/null
+++ b/samples/ControlCatalog/ViewModels/ExpanderPageViewModel.cs
@@ -0,0 +1,27 @@
+using Avalonia;
+using MiniMvvm;
+
+namespace ControlCatalog.ViewModels
+{
+    public class ExpanderPageViewModel : ViewModelBase
+    {
+        private CornerRadius _cornerRadius;
+        private bool _rounded;
+
+        public CornerRadius CornerRadius
+        {
+            get => _cornerRadius;
+            private set => RaiseAndSetIfChanged(ref _cornerRadius, value);
+        }
+
+        public bool Rounded
+        {
+            get => _rounded;
+            set
+            {
+                if (RaiseAndSetIfChanged(ref _rounded, value))
+                    CornerRadius = _rounded ? new CornerRadius(25) : default;
+            }
+        }
+    }
+}
diff --git a/src/Avalonia.Themes.Fluent/Controls/Expander.xaml b/src/Avalonia.Themes.Fluent/Controls/Expander.xaml
index 36f6008782..7d5bb48333 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Expander.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Expander.xaml
@@ -3,29 +3,39 @@
                     x:CompileBindings="True">
   <Design.PreviewWith>
     <Border Padding="20">
-      <StackPanel Orientation="Vertical" Spacing="20" Width="350">
-        <Expander ExpandDirection="Up" Header="Expand Up" CornerRadius="25">
-          <Expander.Header>
-            <Grid ColumnDefinitions="*, Auto">
-              <TextBlock Grid.Column="0" Text="Expand" />
-              <TextBlock Grid.Column="1" Text="Up" />
-            </Grid>
-          </Expander.Header>
+      <StackPanel Orientation="Vertical" Spacing="20" Width="350" Height="600">
+        <Expander ExpandDirection="Up" Header="Expand Up">
           <StackPanel>
             <TextBlock>Expanded content</TextBlock>
           </StackPanel>
         </Expander>
-        <Expander ExpandDirection="Down" Header="Expand Down" CornerRadius="25">
+        <Expander ExpandDirection="Down" Header="Expand Down">
           <StackPanel>
             <TextBlock>Expanded content</TextBlock>
           </StackPanel>
         </Expander>
-        <Expander ExpandDirection="Left" Header="Expand Left" CornerRadius="25">
+        <Expander ExpandDirection="Left" Header="Expand Left">
           <StackPanel>
             <TextBlock>Expanded content</TextBlock>
           </StackPanel>
         </Expander>
-        <Expander ExpandDirection="Right" Header="Expand Right" CornerRadius="25">
+        <Expander ExpandDirection="Right" Header="Expand Right">
+          <StackPanel>
+            <TextBlock>Expanded content</TextBlock>
+          </StackPanel>
+        </Expander>
+        <Expander ExpandDirection="Up">
+          <Expander.Header>
+            <Grid ColumnDefinitions="*, Auto">
+              <TextBlock Grid.Column="0" Text="Control" />
+              <TextBlock Grid.Column="1" Text="Header" />
+            </Grid>
+          </Expander.Header>
+          <StackPanel>
+            <TextBlock>Expanded content</TextBlock>
+          </StackPanel>
+        </Expander>
+        <Expander ExpandDirection="Up" Header="Rounded" CornerRadius="25">
           <StackPanel>
             <TextBlock>Expanded content</TextBlock>
           </StackPanel>
@@ -36,25 +46,19 @@
 
   <Thickness x:Key="ExpanderHeaderPadding">16</Thickness>
   <Thickness x:Key="ExpanderContentPadding">16</Thickness>
-
   <Thickness x:Key="ExpanderBorderThickness">1</Thickness>
-
   <Thickness x:Key="ExpanderDropdownLeftBorderThickness">1,1,0,1</Thickness>
   <Thickness x:Key="ExpanderDropdownUpBorderThickness">1,1,1,0</Thickness>
   <Thickness x:Key="ExpanderDropdownRightBorderThickness">0,1,1,1</Thickness>
   <Thickness x:Key="ExpanderDropdownDownBorderThickness">1,0,1,1</Thickness>
-
   <SolidColorBrush x:Key="ExpanderBackground" Color="{DynamicResource SystemAltMediumHighColor}" />
   <SolidColorBrush x:Key="ExpanderBorderBrush" Color="{DynamicResource SystemBaseLowColor}" />
-
   <SolidColorBrush x:Key="ExpanderDropDownBackground" Color="{DynamicResource SystemChromeMediumLowColor}" />
   <SolidColorBrush x:Key="ExpanderDropDownBorderBrush" Color="{DynamicResource SystemBaseLowColor}" />
-
   <SolidColorBrush x:Key="ExpanderForeground" Color="{DynamicResource SystemBaseHighColor}" />
-
   <SolidColorBrush x:Key="ExpanderChevronForeground" Color="{DynamicResource SystemBaseHighColor}" />
 
-  <ControlTheme x:Key="FluentExpanderToggleButtonTheme" TargetType="ToggleButton" BasedOn="{StaticResource {x:Type ToggleButton}}">
+  <ControlTheme x:Key="FluentExpanderToggleButtonTheme" TargetType="ToggleButton">
     <Setter Property="Template">
       <ControlTemplate>
         <Border x:Name="ToggleButtonBackground"
@@ -94,7 +98,7 @@
         </Border>
       </ControlTemplate>
     </Setter>
-    <Style Selector="^[Tag=Expanded] /template/ Border#ExpandCollapseChevronBorder">
+    <Style Selector="^:checked /template/ Border#ExpandCollapseChevronBorder">
       <Style.Animations>
         <Animation FillMode="Both" Duration="0:0:0.0625">
           <KeyFrame Cue="100%">
@@ -103,7 +107,7 @@
         </Animation>
       </Style.Animations>
     </Style>
-    <Style Selector="^[Tag=NotExpanded] /template/ Border#ExpandCollapseChevronBorder">
+    <Style Selector="^:not(:checked) /template/ Border#ExpandCollapseChevronBorder">
       <Style.Animations>
         <Animation FillMode="Both" Duration="0:0:0.0625">
           <KeyFrame Cue="0%">
@@ -173,7 +177,7 @@
         </DockPanel>
       </ControlTemplate>
     </Setter>
- 
+
     <Style Selector="^ /template/ ToggleButton#ExpanderHeader:pressed">
       <Setter Property="RenderTransform" Value="{x:Null}" />
     </Style>
@@ -186,28 +190,28 @@
       <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius}" />
     </Style>
     <Style Selector="^:expanded:up /template/ ToggleButton#ExpanderHeader">
-      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource BottomCornerRadiusFilterConverter}}" />
+      <Setter Property="CornerRadius" Value="{TemplateBinding CornerRadius, Converter={StaticResource BottomCornerRadiusFilterConverter}}" />
     </Style>
     <Style Selector="^:expanded:up /template/ Border#ExpanderContent">
-      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource TopCornerRadiusFilterConverter}}" />
+      <Setter Property="CornerRadius" Value="{TemplateBinding CornerRadius, Converter={StaticResource TopCornerRadiusFilterConverter}}" />
     </Style>
     <Style Selector="^:expanded:down /template/ ToggleButton#ExpanderHeader">
-      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource TopCornerRadiusFilterConverter}}" />
+      <Setter Property="CornerRadius" Value="{TemplateBinding CornerRadius, Converter={StaticResource TopCornerRadiusFilterConverter}}" />
     </Style>
     <Style Selector="^:expanded:down /template/ Border#ExpanderContent">
-      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource BottomCornerRadiusFilterConverter}}" />
+      <Setter Property="CornerRadius" Value="{TemplateBinding CornerRadius, Converter={StaticResource BottomCornerRadiusFilterConverter}}" />
     </Style>
     <Style Selector="^:expanded:left /template/ ToggleButton#ExpanderHeader">
-      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource RightCornerRadiusFilterConverter}}" />
+      <Setter Property="CornerRadius" Value="{TemplateBinding CornerRadius, Converter={StaticResource RightCornerRadiusFilterConverter}}" />
     </Style>
     <Style Selector="^:expanded:left /template/ Border#ExpanderContent">
-      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
+      <Setter Property="CornerRadius" Value="{TemplateBinding CornerRadius, Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
     </Style>
     <Style Selector="^:expanded:right /template/ ToggleButton#ExpanderHeader">
-      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
+      <Setter Property="CornerRadius" Value="{TemplateBinding CornerRadius, Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
     </Style>
     <Style Selector="^:expanded:right /template/ Border#ExpanderContent">
-      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource RightCornerRadiusFilterConverter}}" />
+      <Setter Property="CornerRadius" Value="{TemplateBinding CornerRadius, Converter={StaticResource RightCornerRadiusFilterConverter}}" />
     </Style>
 
     <Style Selector="^:left /template/ ToggleButton#ExpanderHeader">
@@ -223,14 +227,6 @@
       <Setter Property="DockPanel.Dock" Value="Top" />
     </Style>
 
-
-    <Style Selector="^:expanded /template/ ToggleButton#ExpanderHeader">
-      <Setter Property="Tag" Value="Expanded"/>
-    </Style>
-    <Style Selector="^:not(:expanded) /template/ ToggleButton#ExpanderHeader">
-      <Setter Property="Tag" Value="NotExpanded"/>
-    </Style>
-
     <Style Selector="^:left /template/ ToggleButton#ExpanderHeader">
       <Setter Property="Theme" Value="{StaticResource FluentExpanderToggleButtonLeftTheme}" />
     </Style>
@@ -244,7 +240,6 @@
       <Setter Property="Theme" Value="{StaticResource FluentExpanderToggleButtonDownTheme}" />
     </Style>
 
-
     <Style Selector="^:left /template/ Border#ExpanderContent">
       <Setter Property="BorderThickness" Value="{DynamicResource ExpanderDropdownLeftBorderThickness}" />
     </Style>

From c246d76a206df3b8325006d88ef8aa7891772e1a Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 14:58:15 +0200
Subject: [PATCH 18/70] Formated ItemsControl ControlTheme.

---
 .../Controls/ItemsControl.xaml                | 32 +++++++++----------
 1 file changed, 16 insertions(+), 16 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/ItemsControl.xaml b/src/Avalonia.Themes.Fluent/Controls/ItemsControl.xaml
index b8d7c2c4ef..fc85b7b9ff 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ItemsControl.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ItemsControl.xaml
@@ -1,19 +1,19 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTheme x:Key="{x:Type ItemsControl}" TargetType="ItemsControl">
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Border Background="{TemplateBinding Background}"
-                  BorderBrush="{TemplateBinding BorderBrush}"
-                  BorderThickness="{TemplateBinding BorderThickness}"
-                  CornerRadius="{TemplateBinding CornerRadius}"
-                  Padding="{TemplateBinding Padding}">
-            <ItemsPresenter Name="PART_ItemsPresenter"
-                            Items="{TemplateBinding Items}"
-                            ItemsPanel="{TemplateBinding ItemsPanel}"
-                            ItemTemplate="{TemplateBinding ItemTemplate}"/>
-          </Border>
-        </ControlTemplate>
-      </Setter>
-    </ControlTheme>
+  <ControlTheme x:Key="{x:Type ItemsControl}" TargetType="ItemsControl">
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Background="{TemplateBinding Background}"
+                BorderBrush="{TemplateBinding BorderBrush}"
+                BorderThickness="{TemplateBinding BorderThickness}"
+                CornerRadius="{TemplateBinding CornerRadius}"
+                Padding="{TemplateBinding Padding}">
+          <ItemsPresenter Name="PART_ItemsPresenter"
+                          Items="{TemplateBinding Items}"
+                          ItemsPanel="{TemplateBinding ItemsPanel}"
+                          ItemTemplate="{TemplateBinding ItemTemplate}"/>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>

From 4d73e2b3a946fa65db1df2c7b7c222e0c1b6410a Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 14:58:40 +0200
Subject: [PATCH 19/70] Formatted Label ControlTheme.

---
 .../Controls/Label.xaml                       | 36 +++++++++----------
 1 file changed, 18 insertions(+), 18 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/Label.xaml b/src/Avalonia.Themes.Fluent/Controls/Label.xaml
index ad57239648..ff6909ee87 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Label.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Label.xaml
@@ -1,22 +1,22 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
 
-    <ControlTheme x:Key="{x:Type Label}" TargetType="Label">
-      <Setter Property="Padding" Value="3"/>
-      <Setter Property="Template">
-        <ControlTemplate>
-          <ContentPresenter Name="PART_ContentPresenter"
-                            Background="{TemplateBinding Background}"
-                            BorderBrush="{TemplateBinding BorderBrush}"
-                            BorderThickness="{TemplateBinding BorderThickness}"
-                            CornerRadius="{TemplateBinding CornerRadius}"
-                            ContentTemplate="{TemplateBinding ContentTemplate}"
-                            Content="{TemplateBinding Content}"
-                            Padding="{TemplateBinding Padding}"
-                            RecognizesAccessKey="True"
-                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
-        </ControlTemplate>
-      </Setter>
-    </ControlTheme>
+  <ControlTheme x:Key="{x:Type Label}" TargetType="Label">
+    <Setter Property="Padding" Value="3"/>
+    <Setter Property="Template">
+      <ControlTemplate>
+        <ContentPresenter Name="PART_ContentPresenter"
+                          Background="{TemplateBinding Background}"
+                          BorderBrush="{TemplateBinding BorderBrush}"
+                          BorderThickness="{TemplateBinding BorderThickness}"
+                          CornerRadius="{TemplateBinding CornerRadius}"
+                          ContentTemplate="{TemplateBinding ContentTemplate}"
+                          Content="{TemplateBinding Content}"
+                          Padding="{TemplateBinding Padding}"
+                          RecognizesAccessKey="True"
+                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>

From 901026a187d03fa020c7c503efb443f855cc32f8 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 15:01:03 +0200
Subject: [PATCH 20/70] Formatted ListBox/Item ControlTheme.

---
 .../Controls/ListBox.xaml                     |  88 ++++++------
 .../Controls/ListBoxItem.xaml                 | 132 +++++++++---------
 2 files changed, 110 insertions(+), 110 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/ListBox.xaml b/src/Avalonia.Themes.Fluent/Controls/ListBox.xaml
index b1d4b77a3f..c17dc65cca 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ListBox.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ListBox.xaml
@@ -1,47 +1,47 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Design.PreviewWith>
-      <Border Padding="20">
-        <ListBox>
-          <ListBoxItem>Test</ListBoxItem>
-          <ListBoxItem>Test</ListBoxItem>
-          <ListBoxItem>Test</ListBoxItem>
-          <ListBoxItem>Test</ListBoxItem>
-        </ListBox>
-      </Border>
-    </Design.PreviewWith>
-  
-    <ControlTheme x:Key="{x:Type ListBox}" TargetType="ListBox">
-      <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}" />
-      <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource SystemControlForegroundBaseHighBrush}" />
-      <Setter Property="BorderThickness" Value="{DynamicResource ListBoxBorderThemeThickness}" />
-      <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
-      <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
-      <Setter Property="ScrollViewer.IsScrollChainingEnabled" Value="True" />
-      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Border Name="border"
-                  ClipToBounds="{TemplateBinding ClipToBounds}" 
-                  Background="{TemplateBinding Background}" 
-                  BorderBrush="{TemplateBinding BorderBrush}"
-                  BorderThickness="{TemplateBinding BorderThickness}"
-                  CornerRadius="{TemplateBinding CornerRadius}">
-            <ScrollViewer Name="PART_ScrollViewer" 
-                          HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}" 
-                          VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}"
-                          IsScrollChainingEnabled="{TemplateBinding (ScrollViewer.IsScrollChainingEnabled)}"
-                          AllowAutoHide="{TemplateBinding (ScrollViewer.AllowAutoHide)}">
-              <ItemsPresenter Name="PART_ItemsPresenter" 
-                              Items="{TemplateBinding Items}" 
-                              ItemsPanel="{TemplateBinding ItemsPanel}"
-                              ItemTemplate="{TemplateBinding ItemTemplate}" 
-                              Margin="{TemplateBinding Padding}"
-                              VirtualizationMode="{TemplateBinding VirtualizationMode}" />
-            </ScrollViewer>
-          </Border>
-        </ControlTemplate>
-      </Setter>
-    </ControlTheme>
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <ListBox>
+        <ListBoxItem>Test</ListBoxItem>
+        <ListBoxItem>Test</ListBoxItem>
+        <ListBoxItem>Test</ListBoxItem>
+        <ListBoxItem>Test</ListBoxItem>
+      </ListBox>
+    </Border>
+  </Design.PreviewWith>
+
+  <ControlTheme x:Key="{x:Type ListBox}" TargetType="ListBox">
+    <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}" />
+    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource SystemControlForegroundBaseHighBrush}" />
+    <Setter Property="BorderThickness" Value="{DynamicResource ListBoxBorderThemeThickness}" />
+    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
+    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
+    <Setter Property="ScrollViewer.IsScrollChainingEnabled" Value="True" />
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Name="border"
+                ClipToBounds="{TemplateBinding ClipToBounds}"
+                Background="{TemplateBinding Background}"
+                BorderBrush="{TemplateBinding BorderBrush}"
+                BorderThickness="{TemplateBinding BorderThickness}"
+                CornerRadius="{TemplateBinding CornerRadius}">
+          <ScrollViewer Name="PART_ScrollViewer"
+                        HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}"
+                        VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}"
+                        IsScrollChainingEnabled="{TemplateBinding (ScrollViewer.IsScrollChainingEnabled)}"
+                        AllowAutoHide="{TemplateBinding (ScrollViewer.AllowAutoHide)}">
+            <ItemsPresenter Name="PART_ItemsPresenter"
+                            Items="{TemplateBinding Items}"
+                            ItemsPanel="{TemplateBinding ItemsPanel}"
+                            ItemTemplate="{TemplateBinding ItemTemplate}"
+                            Margin="{TemplateBinding Padding}"
+                            VirtualizationMode="{TemplateBinding VirtualizationMode}" />
+          </ScrollViewer>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ListBoxItem.xaml b/src/Avalonia.Themes.Fluent/Controls/ListBoxItem.xaml
index c00e920f75..fc1d0c5ff1 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ListBoxItem.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ListBoxItem.xaml
@@ -1,79 +1,79 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Design.PreviewWith>
-      <Border Padding="0">
-        <ListBox>
-          <ListBoxItem IsEnabled="False">Disabled</ListBoxItem>
-          <ListBoxItem Background="#66000000"
-                       Padding="20">
-            Test
-          </ListBoxItem>
-          <ListBoxItem>Test</ListBoxItem>
-        </ListBox>
-      </Border>
-    </Design.PreviewWith>
-    <Thickness x:Key="ListBoxItemPadding">12,9,12,12</Thickness>
-    <ControlTheme x:Key="{x:Type ListBoxItem}" TargetType="ListBoxItem">
-      <Setter Property="Background" Value="Transparent" />
-      <Setter Property="Padding" Value="{DynamicResource ListBoxItemPadding}" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <ContentPresenter Name="PART_ContentPresenter"
-                            Background="{TemplateBinding Background}"
-                            BorderBrush="{TemplateBinding BorderBrush}"
-                            BorderThickness="{TemplateBinding BorderThickness}"
-                            CornerRadius="{TemplateBinding CornerRadius}"
-                            ContentTemplate="{TemplateBinding ContentTemplate}"
-                            Content="{TemplateBinding Content}"
-                            FontWeight="Normal"
-                            FontSize="{DynamicResource ControlContentThemeFontSize}"
-                            Padding="{TemplateBinding Padding}"
-                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" />
-        </ControlTemplate>
-      </Setter>
+  <Design.PreviewWith>
+    <Border Padding="0">
+      <ListBox>
+        <ListBoxItem IsEnabled="False">Disabled</ListBoxItem>
+        <ListBoxItem Background="#66000000"
+                     Padding="20">
+          Test
+        </ListBoxItem>
+        <ListBoxItem>Test</ListBoxItem>
+      </ListBox>
+    </Border>
+  </Design.PreviewWith>
+  <Thickness x:Key="ListBoxItemPadding">12,9,12,12</Thickness>
+  <ControlTheme x:Key="{x:Type ListBoxItem}" TargetType="ListBoxItem">
+    <Setter Property="Background" Value="Transparent" />
+    <Setter Property="Padding" Value="{DynamicResource ListBoxItemPadding}" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <ContentPresenter Name="PART_ContentPresenter"
+                          Background="{TemplateBinding Background}"
+                          BorderBrush="{TemplateBinding BorderBrush}"
+                          BorderThickness="{TemplateBinding BorderThickness}"
+                          CornerRadius="{TemplateBinding CornerRadius}"
+                          ContentTemplate="{TemplateBinding ContentTemplate}"
+                          Content="{TemplateBinding Content}"
+                          FontWeight="Normal"
+                          FontSize="{DynamicResource ControlContentThemeFontSize}"
+                          Padding="{TemplateBinding Padding}"
+                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" />
+      </ControlTemplate>
+    </Setter>
 
-      <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
-        <Setter Property="Foreground" Value="{DynamicResource SystemControlDisabledBaseMediumLowBrush}" />
-      </Style>
+    <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="Foreground" Value="{DynamicResource SystemControlDisabledBaseMediumLowBrush}" />
+    </Style>
 
-      <!--  PointerOver State  -->
-      <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-        <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListLowBrush}" />
+    <!--  PointerOver State  -->
+    <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListLowBrush}" />
+      <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
+    </Style>
+
+    <!--  Pressed State  -->
+    <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListMediumBrush}" />
+      <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
+    </Style>
+
+    <!--  Selected State  -->
+    <Style Selector="^:selected">
+
+      <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentLowBrush}" />
         <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
       </Style>
 
-      <!--  Pressed State  -->
-      <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
-        <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListMediumBrush}" />
+      <!--  Selected Unfocused State  -->
+      <Style Selector="^:not(:focus) /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentLowBrush}" />
         <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
       </Style>
 
-      <!--  Selected State  -->
-      <Style Selector="^:selected">
-
-        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentLowBrush}" />
-          <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-        </Style>
-
-        <!--  Selected Unfocused State  -->
-        <Style Selector="^:not(:focus) /template/ ContentPresenter#PART_ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentLowBrush}" />
-          <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-        </Style>
-
-        <!--  Selected PointerOver State  -->
-        <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentMediumBrush}" />
-          <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-        </Style>
+      <!--  Selected PointerOver State  -->
+      <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentMediumBrush}" />
+        <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
+      </Style>
 
-        <!--  Selected Pressed State  -->
-        <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentHighBrush}" />
-          <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-        </Style>
+      <!--  Selected Pressed State  -->
+      <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentHighBrush}" />
+        <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
       </Style>
-    </ControlTheme>
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From 800967c62742ca9934f47d6e68be94095b1241c1 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 15:02:52 +0200
Subject: [PATCH 21/70] Formatted Menu/FlyoutPresenter ControlTheme.

---
 src/Avalonia.Themes.Fluent/Controls/Menu.xaml | 62 ++++++++---------
 .../Controls/MenuFlyoutPresenter.xaml         | 67 ++++++++++---------
 2 files changed, 65 insertions(+), 64 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/Menu.xaml b/src/Avalonia.Themes.Fluent/Controls/Menu.xaml
index d42e413f00..11d21b6b23 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Menu.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Menu.xaml
@@ -1,35 +1,35 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
-                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Design.PreviewWith>
-      <Border Padding="20">
-        <Menu>
-          <MenuItem Header="New" />
-          <MenuItem Header="Open" />
-        </Menu>
-      </Border>
-    </Design.PreviewWith>
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <Menu>
+        <MenuItem Header="New" />
+        <MenuItem Header="Open" />
+      </Menu>
+    </Border>
+  </Design.PreviewWith>
 
-    <x:Double x:Key="MenuBarHeight">32</x:Double>
+  <x:Double x:Key="MenuBarHeight">32</x:Double>
 
-    <ControlTheme x:Key="{x:Type Menu}" TargetType="Menu">
-      <Setter Property="Background" Value="Transparent" />
-      <Setter Property="Height" Value="{DynamicResource MenuBarHeight}" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Border Background="{TemplateBinding Background}"
-                  BorderBrush="{TemplateBinding BorderBrush}"
-                  BorderThickness="{TemplateBinding BorderThickness}"
-                  CornerRadius="{TemplateBinding CornerRadius}"
-                  HorizontalAlignment="Stretch"
-                  Padding="{TemplateBinding Padding}">
-            <ItemsPresenter Name="PART_ItemsPresenter"
-                            Items="{TemplateBinding Items}"
-                            ItemsPanel="{TemplateBinding ItemsPanel}"
-                            ItemTemplate="{TemplateBinding ItemTemplate}"
-                            VerticalAlignment="Stretch"
-                            KeyboardNavigation.TabNavigation="Continue" />
-          </Border>
-        </ControlTemplate>
-      </Setter>
-    </ControlTheme>
+  <ControlTheme x:Key="{x:Type Menu}" TargetType="Menu">
+    <Setter Property="Background" Value="Transparent" />
+    <Setter Property="Height" Value="{DynamicResource MenuBarHeight}" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Background="{TemplateBinding Background}"
+                BorderBrush="{TemplateBinding BorderBrush}"
+                BorderThickness="{TemplateBinding BorderThickness}"
+                CornerRadius="{TemplateBinding CornerRadius}"
+                HorizontalAlignment="Stretch"
+                Padding="{TemplateBinding Padding}">
+          <ItemsPresenter Name="PART_ItemsPresenter"
+                          Items="{TemplateBinding Items}"
+                          ItemsPanel="{TemplateBinding ItemsPanel}"
+                          ItemTemplate="{TemplateBinding ItemTemplate}"
+                          VerticalAlignment="Stretch"
+                          KeyboardNavigation.TabNavigation="Continue" />
+        </Border>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/MenuFlyoutPresenter.xaml b/src/Avalonia.Themes.Fluent/Controls/MenuFlyoutPresenter.xaml
index 7769f0a5c9..264438390d 100644
--- a/src/Avalonia.Themes.Fluent/Controls/MenuFlyoutPresenter.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/MenuFlyoutPresenter.xaml
@@ -1,34 +1,35 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTheme x:Key="{x:Type MenuFlyoutPresenter}" TargetType="MenuFlyoutPresenter">
-      <Setter Property="Background" Value="{DynamicResource MenuFlyoutPresenterBackground}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource MenuFlyoutPresenterBorderBrush}" />
-      <Setter Property="BorderThickness" Value="{DynamicResource MenuFlyoutPresenterBorderThemeThickness}" />
-      <Setter Property="Padding" Value="{DynamicResource MenuFlyoutPresenterThemePadding}" />
-      <Setter Property="MaxWidth" Value="{DynamicResource FlyoutThemeMaxWidth}" />
-      <Setter Property="MinHeight" Value="{DynamicResource MenuFlyoutThemeMinHeight}" />
-      <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
-      <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
-      <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Border Name="LayoutRoot"
-                  Background="{TemplateBinding Background}"
-                  BorderBrush="{TemplateBinding BorderBrush}"
-                  BorderThickness="{TemplateBinding BorderThickness}"
-                  Padding="{DynamicResource FlyoutBorderThemePadding}"
-                  CornerRadius="{TemplateBinding CornerRadius}">
-            <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
-                          VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
-              <ItemsPresenter Name="PART_ItemsPresenter"
-                              Items="{TemplateBinding Items}"
-                              ItemsPanel="{TemplateBinding ItemsPanel}"
-                              ItemTemplate="{TemplateBinding ItemTemplate}"
-                              Margin="{DynamicResource MenuFlyoutScrollerMargin}"
-                              KeyboardNavigation.TabNavigation="Continue"
-                              Grid.IsSharedSizeScope="True" />
-            </ScrollViewer>
-          </Border>
-        </ControlTemplate>
-      </Setter>
-    </ControlTheme>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+  <ControlTheme x:Key="{x:Type MenuFlyoutPresenter}" TargetType="MenuFlyoutPresenter">
+    <Setter Property="Background" Value="{DynamicResource MenuFlyoutPresenterBackground}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource MenuFlyoutPresenterBorderBrush}" />
+    <Setter Property="BorderThickness" Value="{DynamicResource MenuFlyoutPresenterBorderThemeThickness}" />
+    <Setter Property="Padding" Value="{DynamicResource MenuFlyoutPresenterThemePadding}" />
+    <Setter Property="MaxWidth" Value="{DynamicResource FlyoutThemeMaxWidth}" />
+    <Setter Property="MinHeight" Value="{DynamicResource MenuFlyoutThemeMinHeight}" />
+    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
+    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
+    <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Name="LayoutRoot"
+                Background="{TemplateBinding Background}"
+                BorderBrush="{TemplateBinding BorderBrush}"
+                BorderThickness="{TemplateBinding BorderThickness}"
+                Padding="{DynamicResource FlyoutBorderThemePadding}"
+                CornerRadius="{TemplateBinding CornerRadius}">
+          <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
+                        VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
+            <ItemsPresenter Name="PART_ItemsPresenter"
+                            Items="{TemplateBinding Items}"
+                            ItemsPanel="{TemplateBinding ItemsPanel}"
+                            ItemTemplate="{TemplateBinding ItemTemplate}"
+                            Margin="{DynamicResource MenuFlyoutScrollerMargin}"
+                            KeyboardNavigation.TabNavigation="Continue"
+                            Grid.IsSharedSizeScope="True" />
+          </ScrollViewer>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>

From f82541a90d4916f192e432c76fa329d4d3dd3dbf Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 15:09:47 +0200
Subject: [PATCH 22/70] Tweaked NotificationCard ControlTheme.

---
 .../Accents/FluentControlResourcesDark.xaml   |  1 +
 .../Accents/FluentControlResourcesLight.xaml  |  1 +
 .../Controls/NotificationCard.xaml            | 82 +++++++++----------
 3 files changed, 43 insertions(+), 41 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Accents/FluentControlResourcesDark.xaml b/src/Avalonia.Themes.Fluent/Accents/FluentControlResourcesDark.xaml
index c5bb70bed3..9d04009aed 100644
--- a/src/Avalonia.Themes.Fluent/Accents/FluentControlResourcesDark.xaml
+++ b/src/Avalonia.Themes.Fluent/Accents/FluentControlResourcesDark.xaml
@@ -308,6 +308,7 @@
    
     <!--Resources for NotificationCard.xaml -->
     <SolidColorBrush x:Key="NotificationCardBackgroundBrush" Color="#444444" />
+    <StaticResource x:Key="NotificationCardForegroundBrush" ResourceKey="SystemControlForegroundBaseHighBrush" />
     <SolidColorBrush x:Key="NotificationCardProgressBackgroundBrush" Color="#9A9A9A" />
     <SolidColorBrush x:Key="NotificationCardInformationBackgroundBrush" Color="#007ACC" Opacity="0.75"/>
     <SolidColorBrush x:Key="NotificationCardSuccessBackgroundBrush" Color="#1F9E45" Opacity="0.75"/>
diff --git a/src/Avalonia.Themes.Fluent/Accents/FluentControlResourcesLight.xaml b/src/Avalonia.Themes.Fluent/Accents/FluentControlResourcesLight.xaml
index 8d38d39bd5..7b673767b8 100644
--- a/src/Avalonia.Themes.Fluent/Accents/FluentControlResourcesLight.xaml
+++ b/src/Avalonia.Themes.Fluent/Accents/FluentControlResourcesLight.xaml
@@ -304,6 +304,7 @@
     
     <!--Resources for NotificationCard.xaml -->
     <SolidColorBrush x:Key="NotificationCardBackgroundBrush" Color="White" />
+    <StaticResource x:Key="NotificationCardForegroundBrush" ResourceKey="SystemControlForegroundBaseHighBrush" />
     <SolidColorBrush x:Key="NotificationCardProgressBackgroundBrush" Color="#9A9A9A" />
     <SolidColorBrush x:Key="NotificationCardInformationBackgroundBrush" Color="#0078D4" />
     <SolidColorBrush x:Key="NotificationCardSuccessBackgroundBrush" Color="#128B44" />
diff --git a/src/Avalonia.Themes.Fluent/Controls/NotificationCard.xaml b/src/Avalonia.Themes.Fluent/Controls/NotificationCard.xaml
index e55fcb90e8..51dcdd42e3 100644
--- a/src/Avalonia.Themes.Fluent/Controls/NotificationCard.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/NotificationCard.xaml
@@ -9,7 +9,7 @@
     <Setter Property="UseLayoutRounding" Value="True"/>
     <Setter Property="Width" Value="350"/>
     <Setter Property="FontSize" Value="14"/>
-    <Setter Property="Foreground" Value="White"/>
+    <Setter Property="Foreground" Value="{DynamicResource NotificationCardForegroundBrush}"/>
     <Setter Property="RenderTransformOrigin" Value="50%,75%"/>
     <Setter Property="BorderThickness" Value="0" />
     <Setter Property="Background" Value="{DynamicResource NotificationCardBackgroundBrush}" />
@@ -53,47 +53,47 @@
       </Animation>
     </ControlTheme.Animations>
 
-  <Style Selector="^[IsClosing=true] /template/ LayoutTransformControl#PART_LayoutTransformControl">
-    <Setter Property="RenderTransformOrigin" Value="50%,0%"/>
-    <Style.Animations>
-      <Animation Duration="0:0:0.75" Easing="QuadraticEaseOut" FillMode="Forward">
-        <KeyFrame Cue="0%">
-          <Setter Property="TranslateTransform.X" Value="0"/>
-          <Setter Property="ScaleTransform.ScaleY" Value="1"/>
-        </KeyFrame>
-        <KeyFrame Cue="70%">
-          <Setter Property="TranslateTransform.X" Value="800"/>
-          <Setter Property="ScaleTransform.ScaleY" Value="1"/>
-        </KeyFrame>
-        <KeyFrame Cue="100%">
-          <Setter Property="ScaleTransform.ScaleY" Value="0"/>
-          <Setter Property="TranslateTransform.X" Value="800"/>
-        </KeyFrame>
-      </Animation>
-    </Style.Animations>
-  </Style>
+    <Style Selector="^[IsClosing=true] /template/ LayoutTransformControl#PART_LayoutTransformControl">
+      <Setter Property="RenderTransformOrigin" Value="50%,0%"/>
+      <Style.Animations>
+        <Animation Duration="0:0:0.75" Easing="QuadraticEaseOut" FillMode="Forward">
+          <KeyFrame Cue="0%">
+            <Setter Property="TranslateTransform.X" Value="0"/>
+            <Setter Property="ScaleTransform.ScaleY" Value="1"/>
+          </KeyFrame>
+          <KeyFrame Cue="70%">
+            <Setter Property="TranslateTransform.X" Value="800"/>
+            <Setter Property="ScaleTransform.ScaleY" Value="1"/>
+          </KeyFrame>
+          <KeyFrame Cue="100%">
+            <Setter Property="ScaleTransform.ScaleY" Value="0"/>
+            <Setter Property="TranslateTransform.X" Value="800"/>
+          </KeyFrame>
+        </Animation>
+      </Style.Animations>
+    </Style>
 
-  <Style Selector="^[IsClosing=true]">
-    <Style.Animations>
-      <Animation Duration="0:0:1.25" Easing="QuadraticEaseOut" FillMode="Forward">
-        <KeyFrame Cue="100%">
-          <Setter Property="IsClosed" Value="True"/>
-        </KeyFrame>
-      </Animation>
-    </Style.Animations>
-  </Style>
+    <Style Selector="^[IsClosing=true]">
+      <Style.Animations>
+        <Animation Duration="0:0:1.25" Easing="QuadraticEaseOut" FillMode="Forward">
+          <KeyFrame Cue="100%">
+            <Setter Property="IsClosed" Value="True"/>
+          </KeyFrame>
+        </Animation>
+      </Style.Animations>
+    </Style>
 
-  <Style Selector="^:information /template/ Panel#PART_HeaderBar">
-    <Setter Property="Background" Value="{DynamicResource NotificationCardInformationBackgroundBrush}"/>
-  </Style>
-  <Style Selector="^:success /template/ Panel#PART_HeaderBar">
-    <Setter Property="Background" Value="{DynamicResource NotificationCardSuccessBackgroundBrush}"/>
-  </Style>
-  <Style Selector="^:warning /template/ Panel#PART_HeaderBar">
-    <Setter Property="Background" Value="{DynamicResource NotificationCardWarningBackgroundBrush}"/>
-  </Style>
-  <Style Selector="^:error /template/ Panel#PART_HeaderBar">
-    <Setter Property="Background" Value="{DynamicResource NotificationCardErrorBackgroundBrush}"/>
-  </Style>
+    <Style Selector="^:information /template/ Panel#PART_HeaderBar">
+      <Setter Property="Background" Value="{DynamicResource NotificationCardInformationBackgroundBrush}"/>
+    </Style>
+    <Style Selector="^:success /template/ Panel#PART_HeaderBar">
+      <Setter Property="Background" Value="{DynamicResource NotificationCardSuccessBackgroundBrush}"/>
+    </Style>
+    <Style Selector="^:warning /template/ Panel#PART_HeaderBar">
+      <Setter Property="Background" Value="{DynamicResource NotificationCardWarningBackgroundBrush}"/>
+    </Style>
+    <Style Selector="^:error /template/ Panel#PART_HeaderBar">
+      <Setter Property="Background" Value="{DynamicResource NotificationCardErrorBackgroundBrush}"/>
+    </Style>
   </ControlTheme>
 </ResourceDictionary>

From db954bfd0ebf0401a9bc1cfc6dc517cd1e2d5a08 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 15:11:10 +0200
Subject: [PATCH 23/70] Formatted NumericUpDown ControlTheme.

---
 .../Controls/NumericUpDown.xaml               | 126 +++++++++---------
 1 file changed, 62 insertions(+), 64 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/NumericUpDown.xaml b/src/Avalonia.Themes.Fluent/Controls/NumericUpDown.xaml
index 74ffff0f5c..872367c6da 100644
--- a/src/Avalonia.Themes.Fluent/Controls/NumericUpDown.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/NumericUpDown.xaml
@@ -1,67 +1,65 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Design.PreviewWith>
-      <Border Padding="20">
-        <StackPanel Spacing="20">
-          <NumericUpDown Minimum="0"
-                         Maximum="10"
-                         Increment="0.5"
-                         Width="150"
-                         Watermark="Enter text" />
-          <NumericUpDown Minimum="0"
-                         Maximum="10"
-                         Increment="0.5"
-                         Width="150"
-                         VerticalContentAlignment="Center"
-                         HorizontalContentAlignment="Center"
-                         ButtonSpinnerLocation="Left"
-                         Watermark="Enter text" />
-        </StackPanel>
-      </Border>
-    </Design.PreviewWith>
-  
-    <ControlTheme x:Key="{x:Type NumericUpDown}" TargetType="NumericUpDown">
-      <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
-      <Setter Property="Background" Value="{DynamicResource TextControlBackground}" />
-      <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThickness}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrush}" />
-      <Setter Property="MinHeight" Value="{DynamicResource TextControlThemeMinHeight}" />
-      <Setter Property="MinWidth" Value="{DynamicResource TextControlThemeMinWidth}" />
-      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-      <Setter Property="Padding" Value="{DynamicResource TextControlThemePadding}" />
-      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <ButtonSpinner Name="PART_Spinner" 
-                         Background="{TemplateBinding Background}" 
-                         BorderThickness="{TemplateBinding BorderThickness}" 
-                         BorderBrush="{TemplateBinding BorderBrush}"
-                         CornerRadius="{TemplateBinding CornerRadius}"
-                         Padding="0"
-                         MinWidth="0"
-                         HorizontalContentAlignment="Stretch"
-                         VerticalContentAlignment="Stretch"
-                         AllowSpin="{TemplateBinding AllowSpin}"
-                         ShowButtonSpinner="{TemplateBinding ShowButtonSpinner}" 
-                         DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
-                         ButtonSpinnerLocation="{TemplateBinding ButtonSpinnerLocation}">
-            <TextBox Name="PART_TextBox" 
-                     Background="Transparent"
-                     BorderBrush="Transparent"
-                     Margin="-1" 
-                     Padding="{TemplateBinding Padding}" 
-                     MinWidth="0" 
-                     Foreground="{TemplateBinding Foreground}"
-                     FontSize="{TemplateBinding FontSize}" 
-                     Watermark="{TemplateBinding Watermark}" 
-                     IsReadOnly="{TemplateBinding IsReadOnly}" 
-                     VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                     HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" 
-                     Text="{TemplateBinding Text}" 
-                     AcceptsReturn="False"
-                     TextWrapping="NoWrap" />
-          </ButtonSpinner>
-        </ControlTemplate>
-      </Setter>
-    </ControlTheme>
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <StackPanel Spacing="20">
+        <NumericUpDown Minimum="0"
+                       Maximum="10"
+                       Increment="0.5"
+                       Watermark="Enter text" />
+        <NumericUpDown Minimum="0"
+                       Maximum="10"
+                       Increment="0.5"
+                       VerticalContentAlignment="Center"
+                       HorizontalContentAlignment="Center"
+                       ButtonSpinnerLocation="Left"
+                       Watermark="Enter text" />
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
+
+  <ControlTheme x:Key="{x:Type NumericUpDown}" TargetType="NumericUpDown">
+    <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
+    <Setter Property="Background" Value="{DynamicResource TextControlBackground}" />
+    <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThickness}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrush}" />
+    <Setter Property="MinHeight" Value="{DynamicResource TextControlThemeMinHeight}" />
+    <Setter Property="MinWidth" Value="{DynamicResource TextControlThemeMinWidth}" />
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="Padding" Value="{DynamicResource TextControlThemePadding}" />
+    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <ButtonSpinner Name="PART_Spinner"
+                       Background="{TemplateBinding Background}"
+                       BorderThickness="{TemplateBinding BorderThickness}"
+                       BorderBrush="{TemplateBinding BorderBrush}"
+                       CornerRadius="{TemplateBinding CornerRadius}"
+                       Padding="0"
+                       MinWidth="0"
+                       HorizontalContentAlignment="Stretch"
+                       VerticalContentAlignment="Stretch"
+                       AllowSpin="{TemplateBinding AllowSpin}"
+                       ShowButtonSpinner="{TemplateBinding ShowButtonSpinner}"
+                       DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
+                       ButtonSpinnerLocation="{TemplateBinding ButtonSpinnerLocation}">
+          <TextBox Name="PART_TextBox"
+                   Background="Transparent"
+                   BorderBrush="Transparent"
+                   Margin="-1"
+                   Padding="{TemplateBinding Padding}"
+                   MinWidth="0"
+                   Foreground="{TemplateBinding Foreground}"
+                   FontSize="{TemplateBinding FontSize}"
+                   Watermark="{TemplateBinding Watermark}"
+                   IsReadOnly="{TemplateBinding IsReadOnly}"
+                   VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                   HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                   Text="{TemplateBinding Text}"
+                   AcceptsReturn="False"
+                   TextWrapping="NoWrap" />
+        </ButtonSpinner>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>

From 474df23c0715253fe3be730fc1cdd59d093a2749 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 15:11:35 +0200
Subject: [PATCH 24/70] Formatted OverlayPopupHost ControlTheme.

---
 .../Controls/OverlayPopupHost.xaml            | 40 +++++++++----------
 1 file changed, 20 insertions(+), 20 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/OverlayPopupHost.xaml b/src/Avalonia.Themes.Fluent/Controls/OverlayPopupHost.xaml
index 0b587e6037..28d8fb508c 100644
--- a/src/Avalonia.Themes.Fluent/Controls/OverlayPopupHost.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/OverlayPopupHost.xaml
@@ -1,23 +1,23 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTheme x:Key="{x:Type OverlayPopupHost}" TargetType="OverlayPopupHost">
-      <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>
-      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}"/>
-      <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
-      <Setter Property="FontWeight" Value="400" />
-      <Setter Property="FontStyle" Value="Normal" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <LayoutTransformControl LayoutTransform="{TemplateBinding Transform}">
-            <VisualLayerManager IsPopup="True">
-              <ContentPresenter Name="PART_ContentPresenter"
-                                Background="{TemplateBinding Background}"
-                                ContentTemplate="{TemplateBinding ContentTemplate}"
-                                Content="{TemplateBinding Content}"
-                                Padding="{TemplateBinding Padding}"/>
-            </VisualLayerManager>
-          </LayoutTransformControl>
-        </ControlTemplate>
-      </Setter>
-    </ControlTheme>
+  <ControlTheme x:Key="{x:Type OverlayPopupHost}" TargetType="OverlayPopupHost">
+    <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}"/>
+    <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
+    <Setter Property="FontWeight" Value="400" />
+    <Setter Property="FontStyle" Value="Normal" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <LayoutTransformControl LayoutTransform="{TemplateBinding Transform}">
+          <VisualLayerManager IsPopup="True">
+            <ContentPresenter Name="PART_ContentPresenter"
+                              Background="{TemplateBinding Background}"
+                              ContentTemplate="{TemplateBinding ContentTemplate}"
+                              Content="{TemplateBinding Content}"
+                              Padding="{TemplateBinding Padding}"/>
+          </VisualLayerManager>
+        </LayoutTransformControl>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>

From 0d7bb472b38e042e44b1200f0f08e0c405f6c353 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 15:12:20 +0200
Subject: [PATCH 25/70] Formatted PathIcon ControlTheme.

---
 .../Controls/PathIcon.xaml                    | 44 +++++++++----------
 1 file changed, 22 insertions(+), 22 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/PathIcon.xaml b/src/Avalonia.Themes.Fluent/Controls/PathIcon.xaml
index b9967a1b44..5584eb3ab9 100644
--- a/src/Avalonia.Themes.Fluent/Controls/PathIcon.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/PathIcon.xaml
@@ -1,25 +1,25 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Design.PreviewWith>
-      <StackPanel>
-        <StackPanel.Resources>
-          <StreamGeometry x:Key="settings_regular">M14 9.50006C11.5147 9.50006 9.5 11.5148 9.5 14.0001C9.5 16.4853 11.5147 18.5001 14 18.5001C15.3488 18.5001 16.559 17.9066 17.3838 16.9666C18.0787 16.1746 18.5 15.1365 18.5 14.0001C18.5 13.5401 18.431 13.0963 18.3028 12.6784C17.7382 10.8381 16.0253 9.50006 14 9.50006ZM11 14.0001C11 12.3432 12.3431 11.0001 14 11.0001C15.6569 11.0001 17 12.3432 17 14.0001C17 15.6569 15.6569 17.0001 14 17.0001C12.3431 17.0001 11 15.6569 11 14.0001Z  M21.7093 22.3948L19.9818 21.6364C19.4876 21.4197 18.9071 21.4515 18.44 21.7219C17.9729 21.9924 17.675 22.4693 17.6157 23.0066L17.408 24.8855C17.3651 25.273 17.084 25.5917 16.7055 25.682C14.9263 26.1061 13.0725 26.1061 11.2933 25.682C10.9148 25.5917 10.6336 25.273 10.5908 24.8855L10.3834 23.0093C10.3225 22.4731 10.0112 21.9976 9.54452 21.7281C9.07783 21.4586 8.51117 21.4269 8.01859 21.6424L6.29071 22.4009C5.93281 22.558 5.51493 22.4718 5.24806 22.1859C4.00474 20.8536 3.07924 19.2561 2.54122 17.5137C2.42533 17.1384 2.55922 16.7307 2.8749 16.4977L4.40219 15.3703C4.83721 15.0501 5.09414 14.5415 5.09414 14.0007C5.09414 13.4598 4.83721 12.9512 4.40162 12.6306L2.87529 11.5051C2.55914 11.272 2.42513 10.8638 2.54142 10.4882C3.08038 8.74734 4.00637 7.15163 5.24971 5.82114C5.51684 5.53528 5.93492 5.44941 6.29276 5.60691L8.01296 6.36404C8.50793 6.58168 9.07696 6.54881 9.54617 6.27415C10.0133 6.00264 10.3244 5.52527 10.3844 4.98794L10.5933 3.11017C10.637 2.71803 10.9245 2.39704 11.3089 2.31138C12.19 2.11504 13.0891 2.01071 14.0131 2.00006C14.9147 2.01047 15.8128 2.11485 16.6928 2.31149C17.077 2.39734 17.3643 2.71823 17.4079 3.11017L17.617 4.98937C17.7116 5.85221 18.4387 6.50572 19.3055 6.50663C19.5385 6.507 19.769 6.45838 19.9843 6.36294L21.7048 5.60568C22.0626 5.44818 22.4807 5.53405 22.7478 5.81991C23.9912 7.1504 24.9172 8.74611 25.4561 10.487C25.5723 10.8623 25.4386 11.2703 25.1228 11.5035L23.5978 12.6297C23.1628 12.95 22.9 13.4586 22.9 13.9994C22.9 14.5403 23.1628 15.0489 23.5988 15.3698L25.1251 16.4965C25.441 16.7296 25.5748 17.1376 25.4586 17.5131C24.9198 19.2536 23.9944 20.8492 22.7517 22.1799C22.4849 22.4657 22.0671 22.5518 21.7093 22.3948ZM16.263 22.1966C16.4982 21.4685 16.9889 20.8288 17.6884 20.4238C18.5702 19.9132 19.6536 19.8547 20.5841 20.2627L21.9281 20.8526C22.791 19.8538 23.4593 18.7013 23.8981 17.4552L22.7095 16.5778L22.7086 16.5771C21.898 15.98 21.4 15.0277 21.4 13.9994C21.4 12.9719 21.8974 12.0195 22.7073 11.4227L22.7085 11.4218L23.8957 10.545C23.4567 9.2988 22.7881 8.14636 21.9248 7.1477L20.5922 7.73425L20.5899 7.73527C20.1844 7.91463 19.7472 8.00722 19.3039 8.00663C17.6715 8.00453 16.3046 6.77431 16.1261 5.15465L16.1259 5.15291L15.9635 3.69304C15.3202 3.57328 14.6677 3.50872 14.013 3.50017C13.3389 3.50891 12.6821 3.57367 12.0377 3.69328L11.8751 5.15452C11.7625 6.16272 11.1793 7.05909 10.3019 7.56986C9.41937 8.0856 8.34453 8.14844 7.40869 7.73694L6.07273 7.14893C5.20949 8.14751 4.54092 9.29983 4.10196 10.5459L5.29181 11.4233C6.11115 12.0269 6.59414 12.9837 6.59414 14.0007C6.59414 15.0173 6.11142 15.9742 5.29237 16.5776L4.10161 17.4566C4.54002 18.7044 5.2085 19.8585 6.07205 20.8587L7.41742 20.2682C8.34745 19.8613 9.41573 19.9215 10.2947 20.4292C11.174 20.937 11.7593 21.832 11.8738 22.84L11.8744 22.8445L12.0362 24.3088C13.3326 24.5638 14.6662 24.5638 15.9626 24.3088L16.1247 22.8418C16.1491 22.6217 16.1955 22.4055 16.263 22.1966Z</StreamGeometry>
-        </StackPanel.Resources>
-        <PathIcon Data="{StaticResource settings_regular}" />
-      </StackPanel>
-    </Design.PreviewWith>
-    <ControlTheme x:Key="{x:Type PathIcon}" TargetType="PathIcon">
-      <Setter Property="Background" Value="Transparent" />
-      <Setter Property="Height" Value="{DynamicResource IconElementThemeHeight}" />
-      <Setter Property="Width" Value="{DynamicResource IconElementThemeWidth}" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Border Background="{TemplateBinding Background}">
-            <Viewbox Height="{TemplateBinding Height}" Width="{TemplateBinding Width}">
-              <Path Fill="{TemplateBinding Foreground}" Data="{TemplateBinding Data}" Stretch="Uniform" />
-            </Viewbox>
-          </Border>
-        </ControlTemplate>
-      </Setter>
-    </ControlTheme>
+  <Design.PreviewWith>
+    <StackPanel>
+      <StackPanel.Resources>
+        <StreamGeometry x:Key="settings_regular">M14 9.50006C11.5147 9.50006 9.5 11.5148 9.5 14.0001C9.5 16.4853 11.5147 18.5001 14 18.5001C15.3488 18.5001 16.559 17.9066 17.3838 16.9666C18.0787 16.1746 18.5 15.1365 18.5 14.0001C18.5 13.5401 18.431 13.0963 18.3028 12.6784C17.7382 10.8381 16.0253 9.50006 14 9.50006ZM11 14.0001C11 12.3432 12.3431 11.0001 14 11.0001C15.6569 11.0001 17 12.3432 17 14.0001C17 15.6569 15.6569 17.0001 14 17.0001C12.3431 17.0001 11 15.6569 11 14.0001Z  M21.7093 22.3948L19.9818 21.6364C19.4876 21.4197 18.9071 21.4515 18.44 21.7219C17.9729 21.9924 17.675 22.4693 17.6157 23.0066L17.408 24.8855C17.3651 25.273 17.084 25.5917 16.7055 25.682C14.9263 26.1061 13.0725 26.1061 11.2933 25.682C10.9148 25.5917 10.6336 25.273 10.5908 24.8855L10.3834 23.0093C10.3225 22.4731 10.0112 21.9976 9.54452 21.7281C9.07783 21.4586 8.51117 21.4269 8.01859 21.6424L6.29071 22.4009C5.93281 22.558 5.51493 22.4718 5.24806 22.1859C4.00474 20.8536 3.07924 19.2561 2.54122 17.5137C2.42533 17.1384 2.55922 16.7307 2.8749 16.4977L4.40219 15.3703C4.83721 15.0501 5.09414 14.5415 5.09414 14.0007C5.09414 13.4598 4.83721 12.9512 4.40162 12.6306L2.87529 11.5051C2.55914 11.272 2.42513 10.8638 2.54142 10.4882C3.08038 8.74734 4.00637 7.15163 5.24971 5.82114C5.51684 5.53528 5.93492 5.44941 6.29276 5.60691L8.01296 6.36404C8.50793 6.58168 9.07696 6.54881 9.54617 6.27415C10.0133 6.00264 10.3244 5.52527 10.3844 4.98794L10.5933 3.11017C10.637 2.71803 10.9245 2.39704 11.3089 2.31138C12.19 2.11504 13.0891 2.01071 14.0131 2.00006C14.9147 2.01047 15.8128 2.11485 16.6928 2.31149C17.077 2.39734 17.3643 2.71823 17.4079 3.11017L17.617 4.98937C17.7116 5.85221 18.4387 6.50572 19.3055 6.50663C19.5385 6.507 19.769 6.45838 19.9843 6.36294L21.7048 5.60568C22.0626 5.44818 22.4807 5.53405 22.7478 5.81991C23.9912 7.1504 24.9172 8.74611 25.4561 10.487C25.5723 10.8623 25.4386 11.2703 25.1228 11.5035L23.5978 12.6297C23.1628 12.95 22.9 13.4586 22.9 13.9994C22.9 14.5403 23.1628 15.0489 23.5988 15.3698L25.1251 16.4965C25.441 16.7296 25.5748 17.1376 25.4586 17.5131C24.9198 19.2536 23.9944 20.8492 22.7517 22.1799C22.4849 22.4657 22.0671 22.5518 21.7093 22.3948ZM16.263 22.1966C16.4982 21.4685 16.9889 20.8288 17.6884 20.4238C18.5702 19.9132 19.6536 19.8547 20.5841 20.2627L21.9281 20.8526C22.791 19.8538 23.4593 18.7013 23.8981 17.4552L22.7095 16.5778L22.7086 16.5771C21.898 15.98 21.4 15.0277 21.4 13.9994C21.4 12.9719 21.8974 12.0195 22.7073 11.4227L22.7085 11.4218L23.8957 10.545C23.4567 9.2988 22.7881 8.14636 21.9248 7.1477L20.5922 7.73425L20.5899 7.73527C20.1844 7.91463 19.7472 8.00722 19.3039 8.00663C17.6715 8.00453 16.3046 6.77431 16.1261 5.15465L16.1259 5.15291L15.9635 3.69304C15.3202 3.57328 14.6677 3.50872 14.013 3.50017C13.3389 3.50891 12.6821 3.57367 12.0377 3.69328L11.8751 5.15452C11.7625 6.16272 11.1793 7.05909 10.3019 7.56986C9.41937 8.0856 8.34453 8.14844 7.40869 7.73694L6.07273 7.14893C5.20949 8.14751 4.54092 9.29983 4.10196 10.5459L5.29181 11.4233C6.11115 12.0269 6.59414 12.9837 6.59414 14.0007C6.59414 15.0173 6.11142 15.9742 5.29237 16.5776L4.10161 17.4566C4.54002 18.7044 5.2085 19.8585 6.07205 20.8587L7.41742 20.2682C8.34745 19.8613 9.41573 19.9215 10.2947 20.4292C11.174 20.937 11.7593 21.832 11.8738 22.84L11.8744 22.8445L12.0362 24.3088C13.3326 24.5638 14.6662 24.5638 15.9626 24.3088L16.1247 22.8418C16.1491 22.6217 16.1955 22.4055 16.263 22.1966Z</StreamGeometry>
+      </StackPanel.Resources>
+      <PathIcon Data="{StaticResource settings_regular}" />
+    </StackPanel>
+  </Design.PreviewWith>
+  <ControlTheme x:Key="{x:Type PathIcon}" TargetType="PathIcon">
+    <Setter Property="Background" Value="Transparent" />
+    <Setter Property="Height" Value="{DynamicResource IconElementThemeHeight}" />
+    <Setter Property="Width" Value="{DynamicResource IconElementThemeWidth}" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Background="{TemplateBinding Background}">
+          <Viewbox Height="{TemplateBinding Height}" Width="{TemplateBinding Width}">
+            <Path Fill="{TemplateBinding Foreground}" Data="{TemplateBinding Data}" Stretch="Uniform" />
+          </Viewbox>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>

From 8b69e083e8968df9361378454ddad87b834159f2 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 15:12:54 +0200
Subject: [PATCH 26/70] Formatted PopupRoot ControlTheme.

---
 .../Controls/PopupRoot.xaml                   | 50 +++++++++----------
 1 file changed, 25 insertions(+), 25 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/PopupRoot.xaml b/src/Avalonia.Themes.Fluent/Controls/PopupRoot.xaml
index f57ecd2013..5a924830b1 100644
--- a/src/Avalonia.Themes.Fluent/Controls/PopupRoot.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/PopupRoot.xaml
@@ -1,28 +1,28 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTheme x:Key="{x:Type PopupRoot}" TargetType="PopupRoot">
-      <Setter Property="Background" Value="{x:Null}" />
-      <Setter Property="TransparencyLevelHint" Value="Transparent" />
-      <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}" />
-      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-      <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
-      <Setter Property="FontWeight" Value="400" />
-      <Setter Property="FontStyle" Value="Normal" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <LayoutTransformControl LayoutTransform="{TemplateBinding Transform}">
-            <Panel>
-              <Border Name="PART_TransparencyFallback" IsHitTestVisible="False" />
-              <VisualLayerManager IsPopup="True">
-                <ContentPresenter Name="PART_ContentPresenter"
-                                  Background="{TemplateBinding Background}"
-                                  ContentTemplate="{TemplateBinding ContentTemplate}"
-                                  Content="{TemplateBinding Content}"
-                                  Padding="{TemplateBinding Padding}" />
-              </VisualLayerManager>
-            </Panel>
-          </LayoutTransformControl>
-        </ControlTemplate>
-      </Setter>
-    </ControlTheme>
+  <ControlTheme x:Key="{x:Type PopupRoot}" TargetType="PopupRoot">
+    <Setter Property="Background" Value="{x:Null}" />
+    <Setter Property="TransparencyLevelHint" Value="Transparent" />
+    <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}" />
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
+    <Setter Property="FontWeight" Value="400" />
+    <Setter Property="FontStyle" Value="Normal" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <LayoutTransformControl LayoutTransform="{TemplateBinding Transform}">
+          <Panel>
+            <Border Name="PART_TransparencyFallback" IsHitTestVisible="False" />
+            <VisualLayerManager IsPopup="True">
+              <ContentPresenter Name="PART_ContentPresenter"
+                                Background="{TemplateBinding Background}"
+                                ContentTemplate="{TemplateBinding ContentTemplate}"
+                                Content="{TemplateBinding Content}"
+                                Padding="{TemplateBinding Padding}" />
+            </VisualLayerManager>
+          </Panel>
+        </LayoutTransformControl>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>

From 3dc70c0725526db91f6f9c765ba212d363ef1514 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 15:17:15 +0200
Subject: [PATCH 27/70] Checked ProgressBar ControlTheme.

---
 .../Controls/ProgressBar.xaml                 | 348 +++++++++---------
 1 file changed, 176 insertions(+), 172 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/ProgressBar.xaml b/src/Avalonia.Themes.Fluent/Controls/ProgressBar.xaml
index 3c7d22e13f..6bf813385d 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ProgressBar.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ProgressBar.xaml
@@ -2,178 +2,182 @@
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     x:CompileBindings="True">
-      <Design.PreviewWith>
-      <Border Padding="20">
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <StackPanel Orientation="Horizontal" Spacing="10">
         <StackPanel Spacing="10">
-          <ProgressBar VerticalAlignment="Center" IsIndeterminate="True" />
-          <ProgressBar VerticalAlignment="Center" Value="5" Maximum="10" />
-          <ProgressBar VerticalAlignment="Center" Value="50" />
-          <ProgressBar VerticalAlignment="Center" Value="50" Minimum="25" Maximum="75" />
-          <ProgressBar HorizontalAlignment="Left" IsIndeterminate="True" Orientation="Vertical" />
+          <ProgressBar Value="5" Maximum="10" />
+          <ProgressBar Value="50" />
+          <ProgressBar Value="50" Minimum="25" Maximum="75" />
+          <ProgressBar IsIndeterminate="True" />
+          <ProgressBar ShowProgressText="True" Value="50"/>
         </StackPanel>
-      </Border>
-    </Design.PreviewWith>
-  
-    <ControlTheme x:Key="{x:Type ProgressBar}" TargetType="ProgressBar">
-        <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAccentBrush}" />
-        <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundBaseLowBrush}" />
-        <Setter Property="BorderThickness" Value="{DynamicResource ProgressBarBorderThemeThickness}" />
-        <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource SystemControlHighlightTransparentBrush}" />
-        <Setter Property="MinHeight" Value="{DynamicResource ProgressBarThemeMinHeight}" />
-        <Setter Property="VerticalAlignment" Value="Center" />
-        <Setter Property="Template">
-            <ControlTemplate>
-                <Border
-                    x:Name="ProgressBarRoot"
-                    Background="{TemplateBinding Background}"
-                    BorderBrush="{TemplateBinding BorderBrush}"
-                    BorderThickness="{TemplateBinding BorderThickness}"
-                    ClipToBounds="True"
-                    CornerRadius="{TemplateBinding CornerRadius}">
-                    <Panel>
-                        <Panel x:Name="DeterminateRoot" Opacity="1">
-                          <Panel.Transitions>
-                            <Transitions>
-                              <DoubleTransition Property="Opacity" Duration="0:0:0.197" />
-                            </Transitions>
-                          </Panel.Transitions>
-                            <Border
-                                x:Name="PART_Indicator"
-                                Margin="{TemplateBinding Padding}"
-                                Background="{TemplateBinding Foreground}"
-                                CornerRadius="{TemplateBinding CornerRadius}" />
-                        </Panel>
-                        <Panel x:Name="IndeterminateRoot" Opacity="0">
-                          <Panel.Transitions>
-                            <Transitions>
-                              <DoubleTransition Property="Opacity" Duration="0:0:0.197" />
-                            </Transitions>
-                          </Panel.Transitions>
-                            <Border
-                                x:Name="IndeterminateProgressBarIndicator"
-                                Margin="{TemplateBinding Padding}"
-                                Background="{TemplateBinding Foreground}"
-                                CornerRadius="{TemplateBinding CornerRadius}" />
-                            <Border
-                                x:Name="IndeterminateProgressBarIndicator2"
-                                Margin="{TemplateBinding Padding}"
-                                Background="{TemplateBinding Foreground}"
-                                CornerRadius="{TemplateBinding CornerRadius}" />
-                        </Panel>
-                        <LayoutTransformControl
-                            x:Name="PART_LayoutTransformControl"
-                            HorizontalAlignment="Center"
-                            VerticalAlignment="Center"
-                            IsVisible="{TemplateBinding ShowProgressText}">
-                            <TextBlock 
-                              Foreground="{DynamicResource SystemControlForegroundBaseHighBrush}" 
-                              Text="{ReflectionBinding Value, RelativeSource={RelativeSource TemplatedParent}, StringFormat={}{0:0}%}" />
-                        </LayoutTransformControl>
-                    </Panel>
-                </Border>
-            </ControlTemplate>
-        </Setter>
-        <Style Selector="^:horizontal /template/ Border#PART_Indicator">
-            <Setter Property="HorizontalAlignment" Value="Left" />
-            <Setter Property="VerticalAlignment" Value="Stretch" />
-        </Style>
-        <Style Selector="^:vertical /template/ Border#PART_Indicator">
-            <Setter Property="HorizontalAlignment" Value="Stretch" />
-            <Setter Property="VerticalAlignment" Value="Bottom" />
-        </Style>
-        <Style Selector="^:horizontal">
-            <Setter Property="MinWidth" Value="200" />
-            <Setter Property="MinHeight" Value="4" />
-        </Style>
-        <Style Selector="^:vertical">
-            <Setter Property="MinWidth" Value="4" />
-            <Setter Property="MinHeight" Value="200" />
-        </Style>
-        <Style Selector="^:vertical /template/ LayoutTransformControl#PART_LayoutTransformControl">
-            <Setter Property="LayoutTransform">
-                <Setter.Value>
-                    <RotateTransform Angle="90" />
-                </Setter.Value>
-            </Setter>
-        </Style>
-        <Style Selector="^:indeterminate /template/ Panel#DeterminateRoot">
-            <Setter Property="Opacity" Value="0" />
-        </Style>
-        <Style Selector="^:indeterminate /template/ Panel#IndeterminateRoot">
-            <Setter Property="Opacity" Value="1" />
-        </Style>
-        <Style Selector="^:horizontal:indeterminate /template/ Border#IndeterminateProgressBarIndicator">
-            <Style.Animations>
-                <Animation IterationCount="Infinite" Duration="0:0:2">
-                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0">
-                        <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationStartPosition}" />
-                    </KeyFrame>
-                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:1.5">
-                        <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationEndPosition}" />
-                    </KeyFrame>
-                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:2">
-                        <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationEndPosition}" />
-                    </KeyFrame>
-                </Animation>
-            </Style.Animations>
-        </Style>
-        <Style Selector="^:horizontal:indeterminate /template/ Border#IndeterminateProgressBarIndicator2">
-            <Style.Animations>
-                <Animation IterationCount="Infinite" Duration="0:0:2">
-                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0">
-                        <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationStartPosition}" />
-                    </KeyFrame>
-                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0.75">
-                        <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationStartPosition}" />
-                    </KeyFrame>
-                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:2">
-                        <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationEndPosition}" />
-                    </KeyFrame>
-                </Animation>
-            </Style.Animations>
-        </Style>
-        <Style Selector="^:vertical:indeterminate /template/ Border#IndeterminateProgressBarIndicator">
-            <Style.Animations>
-                <Animation IterationCount="Infinite" Duration="0:0:2">
-                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0">
-                        <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationStartPosition}" />
-                    </KeyFrame>
-                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:1.5">
-                        <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationEndPosition}" />
-                    </KeyFrame>
-                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:2">
-                        <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationEndPosition}" />
-                    </KeyFrame>
-                </Animation>
-            </Style.Animations>
-        </Style>
-        <Style Selector="^:vertical:indeterminate /template/ Border#IndeterminateProgressBarIndicator2">
-            <Style.Animations>
-                <Animation IterationCount="Infinite" Duration="0:0:2">
-                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0">
-                        <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationStartPosition}" />
-                    </KeyFrame>
-                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0.75">
-                        <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationStartPosition}" />
-                    </KeyFrame>
-                    <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:2">
-                        <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationEndPosition}" />
-                    </KeyFrame>
-                </Animation>
-            </Style.Animations>
-        </Style>
-        <Style Selector="^:horizontal /template/ Border#IndeterminateProgressBarIndicator">
-            <Setter Property="Width" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerWidth}" />
-        </Style>
-        <Style Selector="^:horizontal /template/ Border#IndeterminateProgressBarIndicator2">
-            <Setter Property="Width" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2Width}" />
-        </Style>
-        <Style Selector="^:vertical /template/ Border#IndeterminateProgressBarIndicator">
-            <Setter Property="Height" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerWidth}" />
-        </Style>
-        <Style Selector="^:vertical /template/ Border#IndeterminateProgressBarIndicator2">
-            <Setter Property="Height" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2Width}" />
-        </Style>
-    </ControlTheme>
+        <ProgressBar IsIndeterminate="True" Orientation="Vertical" />
+        <ProgressBar ShowProgressText="True" Value="50" Orientation="Vertical"/>
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
+
+  <ControlTheme x:Key="{x:Type ProgressBar}" TargetType="ProgressBar">
+    <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAccentBrush}" />
+    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundBaseLowBrush}" />
+    <Setter Property="BorderThickness" Value="{DynamicResource ProgressBarBorderThemeThickness}" />
+    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource SystemControlHighlightTransparentBrush}" />
+    <Setter Property="MinHeight" Value="{DynamicResource ProgressBarThemeMinHeight}" />
+    <Setter Property="VerticalAlignment" Value="Center" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border
+            x:Name="ProgressBarRoot"
+            Background="{TemplateBinding Background}"
+            BorderBrush="{TemplateBinding BorderBrush}"
+            BorderThickness="{TemplateBinding BorderThickness}"
+            ClipToBounds="True"
+            CornerRadius="{TemplateBinding CornerRadius}">
+          <Panel>
+            <Panel x:Name="DeterminateRoot" Opacity="1">
+              <Panel.Transitions>
+                <Transitions>
+                  <DoubleTransition Property="Opacity" Duration="0:0:0.197" />
+                </Transitions>
+              </Panel.Transitions>
+              <Border
+                  x:Name="PART_Indicator"
+                  Margin="{TemplateBinding Padding}"
+                  Background="{TemplateBinding Foreground}"
+                  CornerRadius="{TemplateBinding CornerRadius}" />
+            </Panel>
+            <Panel x:Name="IndeterminateRoot" Opacity="0">
+              <Panel.Transitions>
+                <Transitions>
+                  <DoubleTransition Property="Opacity" Duration="0:0:0.197" />
+                </Transitions>
+              </Panel.Transitions>
+              <Border
+                  x:Name="IndeterminateProgressBarIndicator"
+                  Margin="{TemplateBinding Padding}"
+                  Background="{TemplateBinding Foreground}"
+                  CornerRadius="{TemplateBinding CornerRadius}" />
+              <Border
+                  x:Name="IndeterminateProgressBarIndicator2"
+                  Margin="{TemplateBinding Padding}"
+                  Background="{TemplateBinding Foreground}"
+                  CornerRadius="{TemplateBinding CornerRadius}" />
+            </Panel>
+            <LayoutTransformControl
+                x:Name="PART_LayoutTransformControl"
+                HorizontalAlignment="Center"
+                VerticalAlignment="Center"
+                IsVisible="{TemplateBinding ShowProgressText}">
+              <TextBlock
+                Foreground="{DynamicResource SystemControlForegroundBaseHighBrush}"
+                Text="{ReflectionBinding Value, RelativeSource={RelativeSource TemplatedParent}, StringFormat={}{0:0}%}" />
+            </LayoutTransformControl>
+          </Panel>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+    <Style Selector="^:horizontal /template/ Border#PART_Indicator">
+      <Setter Property="HorizontalAlignment" Value="Left" />
+      <Setter Property="VerticalAlignment" Value="Stretch" />
+    </Style>
+    <Style Selector="^:vertical /template/ Border#PART_Indicator">
+      <Setter Property="HorizontalAlignment" Value="Stretch" />
+      <Setter Property="VerticalAlignment" Value="Bottom" />
+    </Style>
+    <Style Selector="^:horizontal">
+      <Setter Property="MinWidth" Value="200" />
+      <Setter Property="MinHeight" Value="4" />
+    </Style>
+    <Style Selector="^:vertical">
+      <Setter Property="MinWidth" Value="4" />
+      <Setter Property="MinHeight" Value="200" />
+    </Style>
+    <Style Selector="^:vertical /template/ LayoutTransformControl#PART_LayoutTransformControl">
+      <Setter Property="LayoutTransform">
+        <Setter.Value>
+          <RotateTransform Angle="90" />
+        </Setter.Value>
+      </Setter>
+    </Style>
+    <Style Selector="^:indeterminate /template/ Panel#DeterminateRoot">
+      <Setter Property="Opacity" Value="0" />
+    </Style>
+    <Style Selector="^:indeterminate /template/ Panel#IndeterminateRoot">
+      <Setter Property="Opacity" Value="1" />
+    </Style>
+    <Style Selector="^:horizontal:indeterminate /template/ Border#IndeterminateProgressBarIndicator">
+      <Style.Animations>
+        <Animation IterationCount="Infinite" Duration="0:0:2">
+          <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0">
+            <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationStartPosition}" />
+          </KeyFrame>
+          <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:1.5">
+            <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationEndPosition}" />
+          </KeyFrame>
+          <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:2">
+            <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationEndPosition}" />
+          </KeyFrame>
+        </Animation>
+      </Style.Animations>
+    </Style>
+    <Style Selector="^:horizontal:indeterminate /template/ Border#IndeterminateProgressBarIndicator2">
+      <Style.Animations>
+        <Animation IterationCount="Infinite" Duration="0:0:2">
+          <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0">
+            <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationStartPosition}" />
+          </KeyFrame>
+          <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0.75">
+            <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationStartPosition}" />
+          </KeyFrame>
+          <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:2">
+            <Setter Property="TranslateTransform.X" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationEndPosition}" />
+          </KeyFrame>
+        </Animation>
+      </Style.Animations>
+    </Style>
+    <Style Selector="^:vertical:indeterminate /template/ Border#IndeterminateProgressBarIndicator">
+      <Style.Animations>
+        <Animation IterationCount="Infinite" Duration="0:0:2">
+          <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0">
+            <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationStartPosition}" />
+          </KeyFrame>
+          <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:1.5">
+            <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationEndPosition}" />
+          </KeyFrame>
+          <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:2">
+            <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerAnimationEndPosition}" />
+          </KeyFrame>
+        </Animation>
+      </Style.Animations>
+    </Style>
+    <Style Selector="^:vertical:indeterminate /template/ Border#IndeterminateProgressBarIndicator2">
+      <Style.Animations>
+        <Animation IterationCount="Infinite" Duration="0:0:2">
+          <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0">
+            <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationStartPosition}" />
+          </KeyFrame>
+          <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:0.75">
+            <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationStartPosition}" />
+          </KeyFrame>
+          <KeyFrame KeySpline="0.4,0,0.6,1" KeyTime="0:0:2">
+            <Setter Property="TranslateTransform.Y" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2AnimationEndPosition}" />
+          </KeyFrame>
+        </Animation>
+      </Style.Animations>
+    </Style>
+    <Style Selector="^:horizontal /template/ Border#IndeterminateProgressBarIndicator">
+      <Setter Property="Width" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerWidth}" />
+    </Style>
+    <Style Selector="^:horizontal /template/ Border#IndeterminateProgressBarIndicator2">
+      <Setter Property="Width" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2Width}" />
+    </Style>
+    <Style Selector="^:vertical /template/ Border#IndeterminateProgressBarIndicator">
+      <Setter Property="Height" Value="{Binding $parent[ProgressBar].TemplateProperties.ContainerWidth}" />
+    </Style>
+    <Style Selector="^:vertical /template/ Border#IndeterminateProgressBarIndicator2">
+      <Setter Property="Height" Value="{Binding $parent[ProgressBar].TemplateProperties.Container2Width}" />
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From d284822731e941224c76f0bf9eda3fa1349f3470 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 15:20:16 +0200
Subject: [PATCH 28/70] Tweaked RepeatButton ControlTheme.

---
 .../Controls/RepeatButton.xaml                | 110 +++++++++---------
 1 file changed, 54 insertions(+), 56 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/RepeatButton.xaml b/src/Avalonia.Themes.Fluent/Controls/RepeatButton.xaml
index 670212c4b1..5e789e7e10 100644
--- a/src/Avalonia.Themes.Fluent/Controls/RepeatButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/RepeatButton.xaml
@@ -1,65 +1,63 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Design.PreviewWith>
-      <Border Padding="20">
-        <StackPanel Spacing="20">
-          <RepeatButton Content="Click Me!" />
-        </StackPanel>
-      </Border>
-    </Design.PreviewWith>
-  
-    <Thickness x:Key="ButtonPadding">8,5,8,6</Thickness>
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <StackPanel Spacing="20">
+        <RepeatButton Content="Click Me!" />
+        <RepeatButton Content="Disabled" IsEnabled="False" />
+        <RepeatButton Content="Rounded" CornerRadius="16"/>
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
 
-    <ControlTheme x:Key="{x:Type RepeatButton}" TargetType="RepeatButton">
-      <Setter Property="Background" Value="{DynamicResource RepeatButtonBackground}" />
-      <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForeground}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrush}" />
-      <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThemeThickness}" />
-      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-      <Setter Property="Padding" Value="{StaticResource ButtonPadding}" />
-      <Setter Property="HorizontalAlignment" Value="Left" />
-      <Setter Property="VerticalAlignment" Value="Center" />
-      <Setter Property="FontWeight" Value="Normal" />
-      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <ContentPresenter x:Name="PART_ContentPresenter"
-                            Background="{TemplateBinding Background}"
-                            BorderBrush="{TemplateBinding BorderBrush}"
-                            BorderThickness="{TemplateBinding BorderThickness}"
-                            CornerRadius="{TemplateBinding CornerRadius}"
-                            Content="{TemplateBinding Content}"
-                            ContentTemplate="{TemplateBinding ContentTemplate}"
-                            Padding="{TemplateBinding Padding}"
-                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
-        </ControlTemplate>
-      </Setter>
+  <Thickness x:Key="ButtonPadding">8,5,8,6</Thickness>
 
-      <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
-        <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-      </Style>
+  <ControlTheme x:Key="{x:Type RepeatButton}" TargetType="RepeatButton">
+    <Setter Property="Background" Value="{DynamicResource RepeatButtonBackground}" />
+    <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForeground}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrush}" />
+    <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThemeThickness}" />
+    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+    <Setter Property="Padding" Value="{StaticResource ButtonPadding}" />
+    <Setter Property="HorizontalAlignment" Value="Left" />
+    <Setter Property="VerticalAlignment" Value="Center" />
+    <Setter Property="FontWeight" Value="Normal" />
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <ContentPresenter x:Name="PART_ContentPresenter"
+                          Background="{TemplateBinding Background}"
+                          BorderBrush="{TemplateBinding BorderBrush}"
+                          BorderThickness="{TemplateBinding BorderThickness}"
+                          CornerRadius="{TemplateBinding CornerRadius}"
+                          Content="{TemplateBinding Content}"
+                          ContentTemplate="{TemplateBinding ContentTemplate}"
+                          Padding="{TemplateBinding Padding}"
+                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
+      </ControlTemplate>
+    </Setter>
 
-      <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-        <Setter Property="Background" Value="{DynamicResource RepeatButtonBackgroundPointerOver}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrushPointerOver}" />
-        <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundPointerOver}" />
-      </Style>
+    <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource RepeatButtonBackgroundPointerOver}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrushPointerOver}" />
+      <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundPointerOver}" />
+    </Style>
 
-      <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
-        <Setter Property="Background" Value="{DynamicResource RepeatButtonBackgroundPressed}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrushPressed}" />
-        <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundPressed}" />
-      </Style>
+    <Style Selector="^:pressed">
+      <Setter Property="RenderTransform" Value="scale(0.98)" />
+    </Style>
 
-      <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
-        <Setter Property="Background" Value="{DynamicResource RepeatButtonBackgroundDisabled}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrushDisabled}" />
-        <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundDisabled}" />
-      </Style>
+    <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource RepeatButtonBackgroundPressed}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrushPressed}" />
+      <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundPressed}" />
+    </Style>
 
-      <Style Selector="^:pressed">
-        <Setter Property="RenderTransform" Value="scale(0.98)" />
-      </Style>
-    </ControlTheme>
+    <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource RepeatButtonBackgroundDisabled}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrushDisabled}" />
+      <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundDisabled}" />
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From 250b5b91ef8c5d4d8fefd66c14029ee0720fe0ec Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 16:02:03 +0200
Subject: [PATCH 29/70] Tweaked Slider ControlTheme.

---
 .../Controls/Slider.xaml                      | 534 +++++++++---------
 1 file changed, 269 insertions(+), 265 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/Slider.xaml b/src/Avalonia.Themes.Fluent/Controls/Slider.xaml
index c74878e8be..9378640d64 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Slider.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Slider.xaml
@@ -1,57 +1,71 @@
-<ResourceDictionary 
-  xmlns="https://github.com/avaloniaui" 
-  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-     <Design.PreviewWith>
-      <Border Margin="20" Width="200" Height="200">
-        <DockPanel LastChildFill="True">
-          <StackPanel Spacing="10" DockPanel.Dock="Top">
-            <Slider Value="50" />
-            <Slider IsEnabled="False" Value="50" />
-          </StackPanel>
-          <StackPanel Spacing="10" Orientation="Horizontal">
-            <Slider Value="50" Orientation="Vertical" />
-            <Slider IsEnabled="False" Orientation="Vertical" Value="50" />
-          </StackPanel>
-        </DockPanel>
-      </Border>
-    </Design.PreviewWith>
-    <Thickness x:Key="SliderTopHeaderMargin">0,0,0,4</Thickness>
-    <GridLength x:Key="SliderPreContentMargin">15</GridLength>
-    <GridLength x:Key="SliderPostContentMargin">15</GridLength>
-    <x:Double x:Key="SliderHorizontalHeight">32</x:Double>
-    <x:Double x:Key="SliderVerticalWidth">32</x:Double>
-    <CornerRadius x:Key="SliderThumbCornerRadius">10</CornerRadius>
-    <x:Double x:Key="SliderHorizontalThumbWidth">20</x:Double>
-    <x:Double x:Key="SliderHorizontalThumbHeight">20</x:Double>
-    <x:Double x:Key="SliderVerticalThumbWidth">20</x:Double>
-    <x:Double x:Key="SliderVerticalThumbHeight">20</x:Double>
-
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:sys="clr-namespace:System;assembly=netstandard">
+  <Design.PreviewWith>
+    <Border Margin="20" Width="200" Height="400">
+      <DockPanel LastChildFill="True">
+        <StackPanel Spacing="10" DockPanel.Dock="Top">
+          <Slider Value="50" />
+          <Slider IsDirectionReversed="True" Value="50" />
+          <Slider IsEnabled="False" Value="50" />
+          <Slider Value="50">
+            <DataValidationErrors.Error>
+              <sys:Exception>
+                <x:Arguments>
+                  <x:String>Error</x:String>
+                </x:Arguments>
+              </sys:Exception>
+            </DataValidationErrors.Error>
+          </Slider>
+        </StackPanel>
+        <StackPanel Spacing="10" Orientation="Horizontal">
+          <Slider Value="50" Orientation="Vertical" />
+          <Slider IsDirectionReversed="True" Value="50" Orientation="Vertical" />
+          <Slider IsEnabled="False" Orientation="Vertical" Value="50" />
+        </StackPanel>
+      </DockPanel>
+    </Border>
+  </Design.PreviewWith>
+  
+  <Thickness x:Key="SliderTopHeaderMargin">0,0,0,4</Thickness>
+  <GridLength x:Key="SliderPreContentMargin">15</GridLength>
+  <GridLength x:Key="SliderPostContentMargin">15</GridLength>
+  <x:Double x:Key="SliderHorizontalHeight">32</x:Double>
+  <x:Double x:Key="SliderVerticalWidth">32</x:Double>
+  <CornerRadius x:Key="SliderThumbCornerRadius">10</CornerRadius>
+  <x:Double x:Key="SliderHorizontalThumbWidth">20</x:Double>
+  <x:Double x:Key="SliderHorizontalThumbHeight">20</x:Double>
+  <x:Double x:Key="SliderVerticalThumbWidth">20</x:Double>
+  <x:Double x:Key="SliderVerticalThumbHeight">20</x:Double>
 
-  <ControlTheme x:Key="FluentBaseSliderDecreaseIncreaseRepeatButtonTheme" TargetType="RepeatButton" BasedOn="{StaticResource {x:Type RepeatButton}}">
+  <ControlTheme x:Key="FluentSliderHorizontalRepeatButton" TargetType="RepeatButton">
     <Setter Property="Template">
       <ControlTemplate>
         <Grid>
-          <Border
-              Name="FocusTarget"
-              Margin="0,-10"
-              Background="Transparent" />
-          <Border
-              Name="TrackBackground"
-              Background="{TemplateBinding Background}"
-              CornerRadius="{DynamicResource ControlCornerRadius}" />
+          <Border Name="FocusTarget" Margin="0,-10" Background="Transparent" />
+          <Border Name="TrackBackground"
+                  Background="{TemplateBinding Background}"
+                  CornerRadius="{DynamicResource ControlCornerRadius}"
+                  Height="{DynamicResource SliderTrackThemeHeight}"
+                  VerticalAlignment="Center"/>
         </Grid>
       </ControlTemplate>
     </Setter>
   </ControlTheme>
-  
-  <ControlTheme x:Key="FluentHorizontalSliderDecreaseIncreaseRepeatButtonTheme" TargetType="RepeatButton" BasedOn="{StaticResource FluentBaseSliderDecreaseIncreaseRepeatButtonTheme}">
-    <Setter Property="Height" Value="{DynamicResource SliderTrackThemeHeight}"/>
-    <Setter Property="VerticalAlignment" Value="Center"/>
-  </ControlTheme>
-  
-  <ControlTheme x:Key="FluentVerticalSliderDecreaseIncreaseRepeatButtonTheme" TargetType="RepeatButton" BasedOn="{StaticResource FluentBaseSliderDecreaseIncreaseRepeatButtonTheme}">
-    <Setter Property="Width" Value="{DynamicResource SliderTrackThemeHeight}"/>
-    <Setter Property="HorizontalAlignment" Value="Center"/>
+
+  <ControlTheme x:Key="FluentSliderVerticalRepeatButton" TargetType="RepeatButton">
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Grid>
+          <Border Name="FocusTarget" Margin="0,-10" Background="Transparent" />
+          <Border Name="TrackBackground"
+                  Background="{TemplateBinding Background}"
+                  CornerRadius="{DynamicResource ControlCornerRadius}"
+                  Width="{DynamicResource SliderTrackThemeHeight}"
+                  HorizontalAlignment="Center"/>
+        </Grid>
+      </ControlTemplate>
+    </Setter>
   </ControlTheme>
 
   <ControlTheme x:Key="FluentSliderThumbTheme" TargetType="Thumb">
@@ -65,225 +79,215 @@
       </ControlTemplate>
     </Setter>
   </ControlTheme>
-  
+
   <ControlTheme x:Key="{x:Type Slider}" TargetType="Slider">
     <Setter Property="Background" Value="{DynamicResource SliderTrackFill}" />
     <Setter Property="BorderThickness" Value="{DynamicResource SliderBorderThemeThickness}" />
     <Setter Property="Foreground" Value="{DynamicResource SliderTrackValueFill}" />
     <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
     <Style Selector="^:horizontal">
-        <Setter Property="Template">
-            <ControlTemplate>
-                <DataValidationErrors>
-                    <Border
-                        BorderBrush="{TemplateBinding BorderBrush}"
-                        BorderThickness="{TemplateBinding BorderThickness}"
-                        CornerRadius="{TemplateBinding CornerRadius}">
-                        <Grid
-                            Name="grid"
-                            Margin="{TemplateBinding Padding}"
-                            RowDefinitions="Auto, *">
-                            <ContentPresenter
-                                x:Name="HeaderContentPresenter"
-                                Grid.Row="0"
-                                Margin="{DynamicResource SliderTopHeaderMargin}"
-                                TextElement.FontWeight="{DynamicResource SliderHeaderThemeFontWeight}"
-                                TextElement.Foreground="{DynamicResource SliderHeaderForeground}" />
-                            <Grid x:Name="SliderContainer" Grid.Row="1">
-                                <Grid.Styles>
-                                    <Style Selector="TickBar">
-                                        <Setter Property="ReservedSpace" Value="{Binding #PART_Track.Thumb.Bounds}" />
-                                    </Style>
-                                </Grid.Styles>
-                                <Grid
-                                    x:Name="HorizontalTemplate"
-                                    MinHeight="{DynamicResource SliderHorizontalHeight}"
-                                    ColumnDefinitions="Auto,Auto,*">
-                                    <Grid.RowDefinitions>
-                                        <RowDefinition Height="{DynamicResource SliderPreContentMargin}" />
-                                        <RowDefinition Height="Auto" />
-                                        <RowDefinition Height="{DynamicResource SliderPostContentMargin}" />
-                                    </Grid.RowDefinitions>
-                                    <TickBar
-                                        Name="TopTickBar"
-                                        Grid.ColumnSpan="3"
-                                        Ticks="{TemplateBinding Ticks}"
-                                        TickFrequency="{TemplateBinding Slider.TickFrequency}"
-                                        Orientation="{TemplateBinding Slider.Orientation}"
-                                        Minimum="{TemplateBinding Slider.Minimum}"
-                                        Maximum="{TemplateBinding Slider.Maximum}"
-                                        Height="{DynamicResource SliderOutsideTickBarThemeHeight}"
-                                        Margin="0,0,0,4"
-                                        VerticalAlignment="Bottom"
-                                        Placement="Top" />
-                                    <TickBar
-                                        Name="BottomTickBar"
-                                        Grid.Row="2"
-                                        Grid.ColumnSpan="3"
-                                        Ticks="{TemplateBinding Ticks}"
-                                        TickFrequency="{TemplateBinding Slider.TickFrequency}"
-                                        Orientation="{TemplateBinding Slider.Orientation}"
-                                        Minimum="{TemplateBinding Slider.Minimum}"
-                                        Maximum="{TemplateBinding Slider.Maximum}"
-                                        Height="{DynamicResource SliderOutsideTickBarThemeHeight}"
-                                        Margin="0,4,0,0"
-                                        VerticalAlignment="Top"
-                                        Placement="Bottom" />
-                                    <Track
-                                        Name="PART_Track"
-                                        Grid.Row="1"
-                                        Grid.ColumnSpan="3"
-                                        Minimum="{TemplateBinding Minimum}"
-                                        Maximum="{TemplateBinding Maximum}"
-                                        Value="{TemplateBinding Value, Mode=TwoWay}"
-                                        IsDirectionReversed="{TemplateBinding IsDirectionReversed}"
-                                        Orientation="Horizontal">
-                                        <Track.DecreaseButton>
-                                            <RepeatButton
-                                                Name="PART_DecreaseButton"
-                                                HorizontalAlignment="Stretch"
-                                                VerticalAlignment="Stretch"
-                                                Theme="{StaticResource FluentHorizontalSliderDecreaseIncreaseRepeatButtonTheme}"
-                                                Background="{TemplateBinding Foreground}"
-                                                Focusable="False"/>
-                                        </Track.DecreaseButton>
-                                        <Track.IncreaseButton>
-                                            <RepeatButton
-                                                Name="PART_IncreaseButton"
-                                                HorizontalAlignment="Stretch"
-                                                VerticalAlignment="Stretch"
-                                                Theme="{StaticResource FluentHorizontalSliderDecreaseIncreaseRepeatButtonTheme}"
-                                                Background="{TemplateBinding Background}"
-                                                Focusable="False"/>
-                                        </Track.IncreaseButton>
-                                      <Thumb
-                                          Name="thumb"
-                                          Width="{DynamicResource SliderHorizontalThumbWidth}"
-                                          Height="{DynamicResource SliderHorizontalThumbHeight}"
-                                          Margin="0"
-                                          Padding="0"
-                                          BorderThickness="0"
-                                          Classes="SliderThumbStyle"
-                                          Theme="{StaticResource FluentSliderThumbTheme}"
-                                          DataContext="{TemplateBinding Value}"/>
-                                    </Track>
-                                </Grid>
-                            </Grid>
-                        </Grid>
-                    </Border>
-                </DataValidationErrors>
-            </ControlTemplate>
-        </Setter>
+      <Setter Property="Template">
+        <ControlTemplate>
+          <DataValidationErrors>
+            <Border
+                BorderBrush="{TemplateBinding BorderBrush}"
+                BorderThickness="{TemplateBinding BorderThickness}"
+                CornerRadius="{TemplateBinding CornerRadius}">
+              <Grid
+                  Name="grid"
+                  Margin="{TemplateBinding Padding}"
+                  RowDefinitions="Auto, *">
+                <ContentPresenter
+                    x:Name="HeaderContentPresenter"
+                    Grid.Row="0"
+                    Margin="{DynamicResource SliderTopHeaderMargin}"
+                    TextElement.FontWeight="{DynamicResource SliderHeaderThemeFontWeight}"
+                    TextElement.Foreground="{DynamicResource SliderHeaderForeground}" />
+                <Grid x:Name="SliderContainer" Grid.Row="1">
+                  <Grid.Styles>
+                    <Style Selector="TickBar">
+                      <Setter Property="ReservedSpace" Value="{Binding #PART_Track.Thumb.Bounds}" />
+                    </Style>
+                  </Grid.Styles>
+                  <Grid
+                      x:Name="HorizontalTemplate"
+                      MinHeight="{DynamicResource SliderHorizontalHeight}"
+                      ColumnDefinitions="Auto,Auto,*">
+                    <Grid.RowDefinitions>
+                      <RowDefinition Height="{DynamicResource SliderPreContentMargin}" />
+                      <RowDefinition Height="Auto" />
+                      <RowDefinition Height="{DynamicResource SliderPostContentMargin}" />
+                    </Grid.RowDefinitions>
+                    <TickBar
+                        Name="TopTickBar"
+                        Grid.ColumnSpan="3"
+                        Ticks="{TemplateBinding Ticks}"
+                        TickFrequency="{TemplateBinding Slider.TickFrequency}"
+                        Orientation="{TemplateBinding Slider.Orientation}"
+                        Minimum="{TemplateBinding Slider.Minimum}"
+                        Maximum="{TemplateBinding Slider.Maximum}"
+                        Height="{DynamicResource SliderOutsideTickBarThemeHeight}"
+                        Margin="0,0,0,4"
+                        VerticalAlignment="Bottom"
+                        Placement="Top" />
+                    <TickBar
+                        Name="BottomTickBar"
+                        Grid.Row="2"
+                        Grid.ColumnSpan="3"
+                        Ticks="{TemplateBinding Ticks}"
+                        TickFrequency="{TemplateBinding Slider.TickFrequency}"
+                        Orientation="{TemplateBinding Slider.Orientation}"
+                        Minimum="{TemplateBinding Slider.Minimum}"
+                        Maximum="{TemplateBinding Slider.Maximum}"
+                        Height="{DynamicResource SliderOutsideTickBarThemeHeight}"
+                        Margin="0,4,0,0"
+                        VerticalAlignment="Top"
+                        Placement="Bottom" />
+                    <Track
+                        Name="PART_Track"
+                        Grid.Row="1"
+                        Grid.ColumnSpan="3"
+                        Minimum="{TemplateBinding Minimum}"
+                        Maximum="{TemplateBinding Maximum}"
+                        Value="{TemplateBinding Value, Mode=TwoWay}"
+                        IsDirectionReversed="{TemplateBinding IsDirectionReversed}"
+                        Orientation="Horizontal">
+                      <Track.DecreaseButton>
+                        <RepeatButton
+                            Name="PART_DecreaseButton"
+                            Theme="{StaticResource FluentSliderHorizontalRepeatButton}"
+                            Background="{TemplateBinding Foreground}"
+                            Focusable="False"/>
+                      </Track.DecreaseButton>
+                      <Track.IncreaseButton>
+                        <RepeatButton
+                            Name="PART_IncreaseButton"
+                            Theme="{StaticResource FluentSliderHorizontalRepeatButton}"
+                            Background="{TemplateBinding Background}"
+                            Focusable="False"/>
+                      </Track.IncreaseButton>
+                      <Thumb
+                          Name="thumb"
+                          Width="{DynamicResource SliderHorizontalThumbWidth}"
+                          Height="{DynamicResource SliderHorizontalThumbHeight}"
+                          Margin="0"
+                          Padding="0"
+                          BorderThickness="0"
+                          Theme="{StaticResource FluentSliderThumbTheme}"
+                          DataContext="{TemplateBinding Value}"/>
+                    </Track>
+                  </Grid>
+                </Grid>
+              </Grid>
+            </Border>
+          </DataValidationErrors>
+        </ControlTemplate>
+      </Setter>
     </Style>
     <Style Selector="^:vertical">
-        <Setter Property="Template">
-            <ControlTemplate>
-                <DataValidationErrors>
-                    <Border
-                        BorderBrush="{TemplateBinding BorderBrush}"
-                        BorderThickness="{TemplateBinding BorderThickness}"
-                        CornerRadius="{TemplateBinding CornerRadius}">
-                        <Grid
-                            Name="grid"
-                            Margin="{TemplateBinding Padding}"
-                            RowDefinitions="Auto, *">
-                            <ContentPresenter
-                                x:Name="HeaderContentPresenter"
-                                Grid.Row="0"
-                                Margin="{DynamicResource SliderTopHeaderMargin}"
-                                TextElement.FontWeight="{DynamicResource SliderHeaderThemeFontWeight}"
-                                TextElement.Foreground="{DynamicResource SliderHeaderForeground}" />
-                            <Grid x:Name="SliderContainer" Grid.Row="1">
-                                <Grid.Styles>
-                                    <Style Selector="TickBar">
-                                        <Setter Property="ReservedSpace" Value="{Binding #PART_Track.Thumb.Bounds}" />
-                                    </Style>
-                                </Grid.Styles>
-                                <Grid
-                                    x:Name="VerticalTemplate"
-                                    MinWidth="{DynamicResource SliderVerticalWidth}"
-                                    RowDefinitions="*,Auto,Auto">
-                                    <Grid.ColumnDefinitions>
-                                        <ColumnDefinition Width="{DynamicResource SliderPreContentMargin}" />
-                                        <ColumnDefinition Width="Auto" />
-                                        <ColumnDefinition Width="{DynamicResource SliderPostContentMargin}" />
-                                    </Grid.ColumnDefinitions>
-                                    <TickBar
-                                        Name="LeftTickBar"
-                                        Grid.RowSpan="3"
-                                        Ticks="{TemplateBinding Ticks}"
-                                        TickFrequency="{TemplateBinding Slider.TickFrequency}"
-                                        Orientation="{TemplateBinding Slider.Orientation}"
-                                        Minimum="{TemplateBinding Slider.Minimum}"
-                                        Maximum="{TemplateBinding Slider.Maximum}"
-                                        Width="{DynamicResource SliderOutsideTickBarThemeHeight}"
-                                        Margin="0,0,4,0"
-                                        HorizontalAlignment="Right"
-                                        Placement="Left" />
-                                    <TickBar
-                                        Name="RightTickBar"
-                                        Grid.RowSpan="3"
-                                        Grid.Column="2"
-                                        Ticks="{TemplateBinding Ticks}"
-                                        TickFrequency="{TemplateBinding Slider.TickFrequency}"
-                                        Orientation="{TemplateBinding Slider.Orientation}"
-                                        Minimum="{TemplateBinding Slider.Minimum}"
-                                        Maximum="{TemplateBinding Slider.Maximum}"
-                                        Width="{DynamicResource SliderOutsideTickBarThemeHeight}"
-                                        Margin="4,0,0,0"
-                                        HorizontalAlignment="Left"
-                                        Placement="Right" />
-                                    <Track
-                                        Name="PART_Track"
-                                        Grid.RowSpan="3"
-                                        Grid.Column="1"
-                                        Grid.ColumnSpan="1"
-                                        Minimum="{TemplateBinding Minimum}"
-                                        Maximum="{TemplateBinding Maximum}"
-                                        Value="{TemplateBinding Value, Mode=TwoWay}"
-                                        IsDirectionReversed="{TemplateBinding IsDirectionReversed}"
-                                        Orientation="Vertical">
-                                        <Track.DecreaseButton>
-                                            <RepeatButton
-                                                Name="PART_DecreaseButton"
-                                                HorizontalAlignment="Stretch"
-                                                VerticalAlignment="Stretch"
-                                                Theme="{StaticResource FluentVerticalSliderDecreaseIncreaseRepeatButtonTheme}"
-                                                Background="{TemplateBinding Foreground}"
-                                                Focusable="False"/>
-                                        </Track.DecreaseButton>
-                                        <Track.IncreaseButton>
-                                            <RepeatButton
-                                                Name="PART_IncreaseButton"
-                                                HorizontalAlignment="Stretch"
-                                                VerticalAlignment="Stretch"
-                                                Background="{TemplateBinding Background}"
-                                                Theme="{StaticResource FluentVerticalSliderDecreaseIncreaseRepeatButtonTheme}"
-                                                Focusable="False"/>
-                                        </Track.IncreaseButton>
-                                        <Thumb
-                                            Name="SliderThumb"
-                                            Width="{DynamicResource SliderVerticalThumbWidth}"
-                                            Height="{DynamicResource SliderVerticalThumbHeight}"
-                                            Margin="0"
-                                            Padding="0"
-                                            BorderThickness="0"
-                                            Classes="SliderThumbStyle"
-                                            Theme="{StaticResource FluentSliderThumbTheme}"
-                                            DataContext="{TemplateBinding Value}" />
-                                    </Track>
-                                </Grid>
-                            </Grid>
-                        </Grid>
-                    </Border>
-                </DataValidationErrors>
-            </ControlTemplate>
-        </Setter>
+      <Setter Property="Template">
+        <ControlTemplate>
+          <DataValidationErrors>
+            <Border
+                BorderBrush="{TemplateBinding BorderBrush}"
+                BorderThickness="{TemplateBinding BorderThickness}"
+                CornerRadius="{TemplateBinding CornerRadius}">
+              <Grid
+                  Name="grid"
+                  Margin="{TemplateBinding Padding}"
+                  RowDefinitions="Auto, *">
+                <ContentPresenter
+                    x:Name="HeaderContentPresenter"
+                    Grid.Row="0"
+                    Margin="{DynamicResource SliderTopHeaderMargin}"
+                    TextElement.FontWeight="{DynamicResource SliderHeaderThemeFontWeight}"
+                    TextElement.Foreground="{DynamicResource SliderHeaderForeground}" />
+                <Grid x:Name="SliderContainer" Grid.Row="1">
+                  <Grid.Styles>
+                    <Style Selector="TickBar">
+                      <Setter Property="ReservedSpace" Value="{Binding #PART_Track.Thumb.Bounds}" />
+                    </Style>
+                  </Grid.Styles>
+                  <Grid
+                      x:Name="VerticalTemplate"
+                      MinWidth="{DynamicResource SliderVerticalWidth}"
+                      RowDefinitions="*,Auto,Auto">
+                    <Grid.ColumnDefinitions>
+                      <ColumnDefinition Width="{DynamicResource SliderPreContentMargin}" />
+                      <ColumnDefinition Width="Auto" />
+                      <ColumnDefinition Width="{DynamicResource SliderPostContentMargin}" />
+                    </Grid.ColumnDefinitions>
+                    <TickBar
+                        Name="LeftTickBar"
+                        Grid.RowSpan="3"
+                        Ticks="{TemplateBinding Ticks}"
+                        TickFrequency="{TemplateBinding Slider.TickFrequency}"
+                        Orientation="{TemplateBinding Slider.Orientation}"
+                        Minimum="{TemplateBinding Slider.Minimum}"
+                        Maximum="{TemplateBinding Slider.Maximum}"
+                        Width="{DynamicResource SliderOutsideTickBarThemeHeight}"
+                        Margin="0,0,4,0"
+                        HorizontalAlignment="Right"
+                        Placement="Left" />
+                    <TickBar
+                        Name="RightTickBar"
+                        Grid.RowSpan="3"
+                        Grid.Column="2"
+                        Ticks="{TemplateBinding Ticks}"
+                        TickFrequency="{TemplateBinding Slider.TickFrequency}"
+                        Orientation="{TemplateBinding Slider.Orientation}"
+                        Minimum="{TemplateBinding Slider.Minimum}"
+                        Maximum="{TemplateBinding Slider.Maximum}"
+                        Width="{DynamicResource SliderOutsideTickBarThemeHeight}"
+                        Margin="4,0,0,0"
+                        HorizontalAlignment="Left"
+                        Placement="Right" />
+                    <Track
+                        Name="PART_Track"
+                        Grid.RowSpan="3"
+                        Grid.Column="1"
+                        Grid.ColumnSpan="1"
+                        Minimum="{TemplateBinding Minimum}"
+                        Maximum="{TemplateBinding Maximum}"
+                        Value="{TemplateBinding Value, Mode=TwoWay}"
+                        IsDirectionReversed="{TemplateBinding IsDirectionReversed}"
+                        Orientation="Vertical">
+                      <Track.DecreaseButton>
+                        <RepeatButton
+                            Name="PART_DecreaseButton"
+                            Theme="{StaticResource FluentSliderVerticalRepeatButton}"
+                            Background="{TemplateBinding Foreground}"
+                            Focusable="False"/>
+                      </Track.DecreaseButton>
+                      <Track.IncreaseButton>
+                        <RepeatButton
+                            Name="PART_IncreaseButton"
+                            Background="{TemplateBinding Background}"
+                            Theme="{StaticResource FluentSliderVerticalRepeatButton}"
+                            Focusable="False"/>
+                      </Track.IncreaseButton>
+                      <Thumb
+                          Name="SliderThumb"
+                          Width="{DynamicResource SliderVerticalThumbWidth}"
+                          Height="{DynamicResource SliderVerticalThumbHeight}"
+                          Margin="0"
+                          Padding="0"
+                          BorderThickness="0"
+                          Theme="{StaticResource FluentSliderThumbTheme}"
+                          DataContext="{TemplateBinding Value}" />
+                    </Track>
+                  </Grid>
+                </Grid>
+              </Grid>
+            </Border>
+          </DataValidationErrors>
+        </ControlTemplate>
+      </Setter>
     </Style>
 
     <!--  Normal State  -->
 
-    <Style Selector="^ /template/ Thumb.SliderThumbStyle">
+    <Style Selector="^ /template/ Thumb">
       <Setter Property="Background" Value="{DynamicResource SliderThumbBackground}" />
     </Style>
     <Style Selector="^ /template/ Grid#SliderContainer">
@@ -297,19 +301,19 @@
     <!--  TickBar Placement States  -->
 
     <Style Selector="^[TickPlacement=TopLeft] /template/ TickBar#LeftTickBar, ^[TickPlacement=Outside] /template/ TickBar#LeftTickBar">
-        <Setter Property="IsVisible" Value="True" />
+      <Setter Property="IsVisible" Value="True" />
     </Style>
 
     <Style Selector="^[TickPlacement=TopLeft] /template/ TickBar#TopTickBar, ^[TickPlacement=Outside] /template/ TickBar#TopTickBar">
-        <Setter Property="IsVisible" Value="True" />
+      <Setter Property="IsVisible" Value="True" />
     </Style>
 
     <Style Selector="^[TickPlacement=BottomRight] /template/ TickBar#BottomTickBar, ^[TickPlacement=Outside] /template/ TickBar#BottomTickBar">
-        <Setter Property="IsVisible" Value="True" />
+      <Setter Property="IsVisible" Value="True" />
     </Style>
 
     <Style Selector="^[TickPlacement=BottomRight] /template/ TickBar#RightTickBar, ^[TickPlacement=Outside] /template/ TickBar#RightTickBar">
-        <Setter Property="IsVisible" Value="True" />
+      <Setter Property="IsVisible" Value="True" />
     </Style>
 
     <!--  Disabled State  -->
@@ -326,7 +330,7 @@
         <Setter Property="Background" Value="{DynamicResource SliderTrackFillDisabled}" />
       </Style>
 
-      <Style Selector="^ /template/ Thumb.SliderThumbStyle">
+      <Style Selector="^ /template/ Thumb">
         <Setter Property="Background" Value="{DynamicResource SliderThumbBackgroundDisabled}" />
       </Style>
 
@@ -344,18 +348,18 @@
         <Setter Property="Background" Value="{DynamicResource SliderTrackFillPointerOver}" />
       </Style>
 
-      <Style Selector="^ /template/ Thumb.SliderThumbStyle">
-          <Setter Property="Background" Value="{DynamicResource SliderThumbBackgroundPointerOver}" />
+      <Style Selector="^ /template/ Thumb">
+        <Setter Property="Background" Value="{DynamicResource SliderThumbBackgroundPointerOver}" />
       </Style>
 
       <Style Selector="^ /template/ Grid#SliderContainer">
-          <Setter Property="Background" Value="{DynamicResource SliderContainerBackgroundPointerOver}" />
+        <Setter Property="Background" Value="{DynamicResource SliderContainerBackgroundPointerOver}" />
       </Style>
 
       <Style Selector="^ /template/ RepeatButton#PART_DecreaseButton">
-          <Setter Property="Background" Value="{DynamicResource SliderTrackValueFillPointerOver}" />
+        <Setter Property="Background" Value="{DynamicResource SliderTrackValueFillPointerOver}" />
       </Style>
-    
+
     </Style>
 
     <!--  Pressed State  -->
@@ -370,14 +374,14 @@
         <Setter Property="Background" Value="{DynamicResource SliderTrackFillPressed}" />
       </Style>
 
-      <Style Selector="^ /template/ Thumb.SliderThumbStyle">
+      <Style Selector="^ /template/ Thumb">
         <Setter Property="Background" Value="{DynamicResource SliderThumbBackgroundPressed}" />
       </Style>
     </Style>
 
     <Style Selector="^:error">
       <Setter Property="Foreground" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
-      <Style Selector="^ /template/ Thumb.SliderThumbStyle">
+      <Style Selector="^ /template/ Thumb">
         <Setter Property="Background" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
       </Style>
     </Style>

From e5f70deab03fea424de8b06a98c4e50f23eecde6 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 16:04:37 +0200
Subject: [PATCH 30/70] Formatted TabControl ControlTheme.

---
 .../Controls/TabControl.xaml                  | 111 +++++++++---------
 1 file changed, 54 insertions(+), 57 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/TabControl.xaml b/src/Avalonia.Themes.Fluent/Controls/TabControl.xaml
index 1cc31f8e15..17d179e0cd 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TabControl.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TabControl.xaml
@@ -1,63 +1,60 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Design.PreviewWith>
-      <Border Width="400">
-        <TabControl>
-          <TabItem Header="Arch">
-            <Border Background="AntiqueWhite"
-                    Height="100">
-              <TextBlock Text="Content" Foreground="Black" FontSize="20"/>
-            </Border>
-          </TabItem>
-          <TabItem Header="Leaf">
-            <Border Background="Green"
-                    Height="100" />
-          </TabItem>
-          <TabItem Header="Disabled"
-                   IsEnabled="False" />
-        </TabControl>
-      </Border>
-    </Design.PreviewWith>
+  <Design.PreviewWith>
+    <Border Width="400">
+      <TabControl>
+        <TabItem Header="Arch">
+          <Border Background="AntiqueWhite" Height="100">
+            <TextBlock Text="Content" Foreground="Black" FontSize="20"/>
+          </Border>
+        </TabItem>
+        <TabItem Header="Leaf">
+          <Border Background="Green" Height="100" />
+        </TabItem>
+        <TabItem Header="Disabled" IsEnabled="False" />
+      </TabControl>
+    </Border>
+  </Design.PreviewWith>
 
-    <Thickness x:Key="TabControlTopPlacementItemMargin">0 0 0 2</Thickness>
+  <Thickness x:Key="TabControlTopPlacementItemMargin">0 0 0 2</Thickness>
 
-    <ControlTheme x:Key="{x:Type TabControl}" TargetType="TabControl">
-      <Setter Property="Margin" Value="0" />
-      <Setter Property="Padding" Value="{DynamicResource TabItemMargin}" />
-      <Setter Property="Background" Value="{DynamicResource TabControlBackground}" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Border BorderBrush="{TemplateBinding BorderBrush}"
-                  BorderThickness="{TemplateBinding BorderThickness}"
-                  CornerRadius="{TemplateBinding CornerRadius}"
-                  Background="{TemplateBinding Background}"
-                  HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
-                  VerticalAlignment="{TemplateBinding VerticalAlignment}">
-            <DockPanel>
-              <ItemsPresenter Name="PART_ItemsPresenter"
-                              Items="{TemplateBinding Items}"
-                              ItemsPanel="{TemplateBinding ItemsPanel}"
-                              ItemTemplate="{TemplateBinding ItemTemplate}"
-                              DockPanel.Dock="{TemplateBinding TabStripPlacement}" />
-              <ContentPresenter Name="PART_SelectedContentHost"
-                                Margin="{TemplateBinding Padding}"
-                                HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                                Content="{TemplateBinding SelectedContent}"
-                                ContentTemplate="{TemplateBinding SelectedContentTemplate}" />
-            </DockPanel>
-          </Border>
-        </ControlTemplate>
-      </Setter>
+  <ControlTheme x:Key="{x:Type TabControl}" TargetType="TabControl">
+    <Setter Property="Margin" Value="0" />
+    <Setter Property="Padding" Value="{DynamicResource TabItemMargin}" />
+    <Setter Property="Background" Value="{DynamicResource TabControlBackground}" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border BorderBrush="{TemplateBinding BorderBrush}"
+                BorderThickness="{TemplateBinding BorderThickness}"
+                CornerRadius="{TemplateBinding CornerRadius}"
+                Background="{TemplateBinding Background}"
+                HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
+                VerticalAlignment="{TemplateBinding VerticalAlignment}">
+          <DockPanel>
+            <ItemsPresenter Name="PART_ItemsPresenter"
+                            Items="{TemplateBinding Items}"
+                            ItemsPanel="{TemplateBinding ItemsPanel}"
+                            ItemTemplate="{TemplateBinding ItemTemplate}"
+                            DockPanel.Dock="{TemplateBinding TabStripPlacement}" />
+            <ContentPresenter Name="PART_SelectedContentHost"
+                              Margin="{TemplateBinding Padding}"
+                              HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                              VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                              Content="{TemplateBinding SelectedContent}"
+                              ContentTemplate="{TemplateBinding SelectedContentTemplate}" />
+          </DockPanel>
+        </Border>
+      </ControlTemplate>
+    </Setter>
 
-      <Style Selector="^[TabStripPlacement=Left] /template/ ItemsPresenter#PART_ItemsPresenter > WrapPanel">
-        <Setter Property="Orientation" Value="Vertical" />
-      </Style>
-      <Style Selector="^[TabStripPlacement=Right] /template/ ItemsPresenter#PART_ItemsPresenter > WrapPanel">
-        <Setter Property="Orientation" Value="Vertical" />
-      </Style>
-      <Style Selector="^[TabStripPlacement=Top] /template/ ItemsPresenter#PART_ItemsPresenter">
-        <Setter Property="Margin" Value="{DynamicResource TabControlTopPlacementItemMargin}" />
-      </Style>
-    </ControlTheme>
+    <Style Selector="^[TabStripPlacement=Left] /template/ ItemsPresenter#PART_ItemsPresenter > WrapPanel">
+      <Setter Property="Orientation" Value="Vertical" />
+    </Style>
+    <Style Selector="^[TabStripPlacement=Right] /template/ ItemsPresenter#PART_ItemsPresenter > WrapPanel">
+      <Setter Property="Orientation" Value="Vertical" />
+    </Style>
+    <Style Selector="^[TabStripPlacement=Top] /template/ ItemsPresenter#PART_ItemsPresenter">
+      <Setter Property="Margin" Value="{DynamicResource TabControlTopPlacementItemMargin}" />
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From 27abe8200987ac1ab627549f3642d1f9353e9e18 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 16:15:06 +0200
Subject: [PATCH 31/70] Twaked TabItem ControlTheme.

---
 .../Controls/TabItem.xaml                     | 230 +++++++++---------
 1 file changed, 113 insertions(+), 117 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/TabItem.xaml b/src/Avalonia.Themes.Fluent/Controls/TabItem.xaml
index 110ffc2f48..e323be72e2 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TabItem.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TabItem.xaml
@@ -2,132 +2,128 @@
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     x:CompileBindings="True">
-     <Design.PreviewWith>
-      <Border Padding="20">
-        <StackPanel Spacing="20">
-          <TabItem Header="Leaf" />
-          <TabItem Header="Arch" IsSelected="True" />
-        </StackPanel>
-      </Border>
-    </Design.PreviewWith>
-  
-    <x:Double x:Key="TabItemMinHeight">48</x:Double>
-    <x:Double x:Key="TabItemVerticalPipeHeight">24</x:Double>
-    <x:Double x:Key="TabItemPipeThickness">2</x:Double>
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <StackPanel Spacing="20">
+        <TabItem Header="Leaf" />
+        <TabItem Header="Arch" IsSelected="True" />
+        <TabItem Header="Background" Background="Yellow"/>
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
 
-    <ControlTheme x:Key="{x:Type TabItem}" TargetType="TabItem">
-        <Setter Property="FontSize" Value="{DynamicResource TabItemHeaderFontSize}" />
-        <Setter Property="FontWeight" Value="{DynamicResource TabItemHeaderThemeFontWeight}" />
-        <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselected}" />
-        <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselected}" />
-        <Setter Property="Padding" Value="{DynamicResource TabItemHeaderMargin}" />
-        <Setter Property="Margin" Value="0" />
-        <Setter Property="MinHeight" Value="{DynamicResource TabItemMinHeight}" />
-        <Setter Property="VerticalContentAlignment" Value="Center" />
-        <Setter Property="Template">
-            <ControlTemplate>
-                <Border
-                    Name="PART_LayoutRoot"
-                    Padding="{TemplateBinding Padding}"
-                    BorderBrush="{TemplateBinding BorderBrush}"
-                    BorderThickness="{TemplateBinding BorderThickness}"
-                    CornerRadius="{TemplateBinding CornerRadius}">
-                    <Panel>
-                        <ContentPresenter
-                            Name="PART_ContentPresenter"
-                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                            Content="{TemplateBinding Header}"
-                            ContentTemplate="{TemplateBinding HeaderTemplate}"
-                            FontFamily="{TemplateBinding FontFamily}"
-                            FontSize="{TemplateBinding FontSize}"
-                            FontWeight="{TemplateBinding FontWeight}" />
-                        <Border Name="PART_SelectedPipe" Background="{DynamicResource TabItemHeaderSelectedPipeFill}" />
-                    </Panel>
-                </Border>
-            </ControlTemplate>
-        </Setter>
+  <x:Double x:Key="TabItemMinHeight">48</x:Double>
+  <x:Double x:Key="TabItemVerticalPipeHeight">24</x:Double>
+  <x:Double x:Key="TabItemPipeThickness">2</x:Double>
 
-        <!--  Nornal state  -->
-        <Style Selector="^ /template/ Border#PART_LayoutRoot">
-            <Setter Property="Background" Value="{Binding $parent[TabItem].Background}" />
-        </Style>
-        <Style Selector="^ /template/ Border#PART_SelectedPipe">
-            <Setter Property="IsVisible" Value="False" />
-            <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-        </Style>
+  <ControlTheme x:Key="{x:Type TabItem}" TargetType="TabItem">
+    <Setter Property="FontSize" Value="{DynamicResource TabItemHeaderFontSize}" />
+    <Setter Property="FontWeight" Value="{DynamicResource TabItemHeaderThemeFontWeight}" />
+    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselected}" />
+    <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselected}" />
+    <Setter Property="Padding" Value="{DynamicResource TabItemHeaderMargin}" />
+    <Setter Property="Margin" Value="0" />
+    <Setter Property="MinHeight" Value="{DynamicResource TabItemMinHeight}" />
+    <Setter Property="VerticalContentAlignment" Value="Center" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border
+            Name="PART_LayoutRoot"            
+            Background="{TemplateBinding Background}"
+            BorderBrush="{TemplateBinding BorderBrush}"
+            BorderThickness="{TemplateBinding BorderThickness}"
+            CornerRadius="{TemplateBinding CornerRadius}"
+            Padding="{TemplateBinding Padding}">
+          <Panel>
+            <ContentPresenter
+                Name="PART_ContentPresenter"
+                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                Content="{TemplateBinding Header}"
+                ContentTemplate="{TemplateBinding HeaderTemplate}"
+                FontFamily="{TemplateBinding FontFamily}"
+                FontSize="{TemplateBinding FontSize}"
+                FontWeight="{TemplateBinding FontWeight}" />
+            <Border Name="PART_SelectedPipe"
+                    Background="{DynamicResource TabItemHeaderSelectedPipeFill}"
+                    CornerRadius="{DynamicResource ControlCornerRadius}"
+                    IsVisible="False"/>
+          </Panel>
+        </Border>
+      </ControlTemplate>
+    </Setter>
 
-        <!--  Selected state  -->
-        <!--  We don't use selector to PART_LayoutRoot, so developer can override selected item background with TabStripItem.Background  -->
-        <Style Selector="^:selected">
-            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelected}" />
-            <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundSelected}" />
-        </Style>
-        <Style Selector="^:selected /template/ Border#PART_SelectedPipe">
-            <Setter Property="IsVisible" Value="True" />
-        </Style>
+    <!--  Selected state  -->
+    <!--  We don't use selector to PART_LayoutRoot, so developer can override selected item background with TabStripItem.Background  -->
+    <Style Selector="^:selected">
+      <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelected}" />
+      <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundSelected}" />
+    </Style>
+    <Style Selector="^:selected /template/ Border#PART_SelectedPipe">
+      <Setter Property="IsVisible" Value="True" />
+    </Style>
 
-        <!--  PointerOver state  -->
-        <Style Selector="^:pointerover /template/ Border#PART_LayoutRoot">
-            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPointerOver}" />
-            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPointerOver}" />
-        </Style>
+    <!--  PointerOver state  -->
+    <Style Selector="^:pointerover /template/ Border#PART_LayoutRoot">
+      <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPointerOver}" />
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPointerOver}" />
+    </Style>
 
-        <!--  Selected PointerOver state  -->
-        <Style Selector="^:selected:pointerover /template/ Border#PART_LayoutRoot">
-            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPointerOver}" />
-            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPointerOver}" />
-        </Style>
+    <!--  Selected PointerOver state  -->
+    <Style Selector="^:selected:pointerover /template/ Border#PART_LayoutRoot">
+      <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPointerOver}" />
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPointerOver}" />
+    </Style>
 
-        <!--  Pressed state  -->
-        <Style Selector="^:pressed /template/ Border#PART_LayoutRoot">
-            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPressed}" />
-            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPressed}" />
-        </Style>
+    <!--  Pressed state  -->
+    <Style Selector="^:pressed /template/ Border#PART_LayoutRoot">
+      <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPressed}" />
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPressed}" />
+    </Style>
 
-        <!--  Selected Pressed state  -->
-        <Style Selector="^:selected:pressed /template/ Border#PART_LayoutRoot">
-            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPressed}" />
-            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPressed}" />
-        </Style>
+    <!--  Selected Pressed state  -->
+    <Style Selector="^:selected:pressed /template/ Border#PART_LayoutRoot">
+      <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPressed}" />
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPressed}" />
+    </Style>
 
-        <!--  Disabled state  -->
-        <Style Selector="^:disabled /template/ Border#PART_LayoutRoot">
-            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundDisabled}" />
-            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundDisabled}" />
-        </Style>
+    <!--  Disabled state  -->
+    <Style Selector="^:disabled /template/ Border#PART_LayoutRoot">
+      <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundDisabled}" />
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundDisabled}" />
+    </Style>
 
-        <!--  TabStripPlacement States Group  -->
-        <Style Selector="^[TabStripPlacement=Left] /template/ Border#PART_SelectedPipe">
-            <Setter Property="Width" Value="{DynamicResource TabItemPipeThickness}" />
-            <Setter Property="Height" Value="{DynamicResource TabItemVerticalPipeHeight}" />
-            <Setter Property="Margin" Value="0,0,2,0" />
-            <Setter Property="HorizontalAlignment" Value="Left" />
-            <Setter Property="VerticalAlignment" Value="Center" />
-        </Style>
-        <Style Selector="^[TabStripPlacement=Left] /template/ ContentPresenter#PART_ContentPresenter">
-            <Setter Property="Margin" Value="8,0,0,0" />
-        </Style>
+    <!--  TabStripPlacement States Group  -->
+    <Style Selector="^[TabStripPlacement=Left] /template/ Border#PART_SelectedPipe">
+      <Setter Property="Width" Value="{DynamicResource TabItemPipeThickness}" />
+      <Setter Property="Height" Value="{DynamicResource TabItemVerticalPipeHeight}" />
+      <Setter Property="Margin" Value="0,0,2,0" />
+      <Setter Property="HorizontalAlignment" Value="Left" />
+      <Setter Property="VerticalAlignment" Value="Center" />
+    </Style>
+    <Style Selector="^[TabStripPlacement=Left] /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="Margin" Value="8,0,0,0" />
+    </Style>
 
-        <Style Selector="^[TabStripPlacement=Top] /template/ Border#PART_SelectedPipe, ^[TabStripPlacement=Bottom] /template/ Border#PART_SelectedPipe">
-            <Setter Property="Height" Value="{DynamicResource TabItemPipeThickness}" />
-            <Setter Property="Margin" Value="0,0,0,2" />
-            <Setter Property="HorizontalAlignment" Value="Stretch" />
-            <Setter Property="VerticalAlignment" Value="Bottom" />
-        </Style>
+    <Style Selector="^[TabStripPlacement=Top] /template/ Border#PART_SelectedPipe, ^[TabStripPlacement=Bottom] /template/ Border#PART_SelectedPipe">
+      <Setter Property="Height" Value="{DynamicResource TabItemPipeThickness}" />
+      <Setter Property="Margin" Value="0,0,0,2" />
+      <Setter Property="HorizontalAlignment" Value="Stretch" />
+      <Setter Property="VerticalAlignment" Value="Bottom" />
+    </Style>
 
-        <Style Selector="^[TabStripPlacement=Right] /template/ Border#PART_SelectedPipe">
-            <Setter Property="Width" Value="{DynamicResource TabItemPipeThickness}" />
-            <Setter Property="Height" Value="{DynamicResource TabItemVerticalPipeHeight}" />
-            <Setter Property="Margin" Value="2,0,0,0" />
-            <Setter Property="HorizontalAlignment" Value="Right" />
-            <Setter Property="VerticalAlignment" Value="Center" />
-        </Style>
-        <Style Selector="^[TabStripPlacement=Right] /template/ ContentPresenter#PART_ContentPresenter">
-            <Setter Property="Margin" Value="0,0,8,0" />
-        </Style>
-        <Style Selector="^[TabStripPlacement=Right]">
-            <Setter Property="HorizontalContentAlignment" Value="Right" />
-        </Style>
-    </ControlTheme>
+    <Style Selector="^[TabStripPlacement=Right] /template/ Border#PART_SelectedPipe">
+      <Setter Property="Width" Value="{DynamicResource TabItemPipeThickness}" />
+      <Setter Property="Height" Value="{DynamicResource TabItemVerticalPipeHeight}" />
+      <Setter Property="Margin" Value="2,0,0,0" />
+      <Setter Property="HorizontalAlignment" Value="Right" />
+      <Setter Property="VerticalAlignment" Value="Center" />
+    </Style>
+    <Style Selector="^[TabStripPlacement=Right] /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="Margin" Value="0,0,8,0" />
+    </Style>
+    <Style Selector="^[TabStripPlacement=Right]">
+      <Setter Property="HorizontalContentAlignment" Value="Right" />
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From 1af445893abf5d66af80bedd05d932e8e0febe44 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 16:20:33 +0200
Subject: [PATCH 32/70] Tweaked TabStrip/Item ControlTemplates.

---
 .../Controls/TabStrip.xaml                    |  62 +++---
 .../Controls/TabStripItem.xaml                | 180 +++++++++---------
 2 files changed, 116 insertions(+), 126 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/TabStrip.xaml b/src/Avalonia.Themes.Fluent/Controls/TabStrip.xaml
index 15c3ba2f37..59cb7f6752 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TabStrip.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TabStrip.xaml
@@ -1,34 +1,34 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Design.PreviewWith>
-      <Border Padding="20">
-        <TabStrip>
-          <TabStripItem>Item 1</TabStripItem>
-          <TabStripItem>Item 2</TabStripItem>
-          <TabStripItem IsEnabled="False">Disabled</TabStripItem>
-        </TabStrip>
-      </Border>
-    </Design.PreviewWith>
-  
-    <ControlTheme x:Key="{x:Type TabStrip}" TargetType="TabStrip">
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Border Background="{TemplateBinding Background}"
-                  BorderBrush="{TemplateBinding BorderBrush}"
-                  BorderThickness="{TemplateBinding BorderThickness}"
-                  CornerRadius="{TemplateBinding CornerRadius}"
-                  Padding="{TemplateBinding Padding}">
-            <ItemsPresenter Name="PART_ItemsPresenter"
-                            Items="{TemplateBinding Items}"
-                            ItemsPanel="{TemplateBinding ItemsPanel}"
-                            ItemTemplate="{TemplateBinding ItemTemplate}" />
-          </Border>
-        </ControlTemplate>
-      </Setter>
-      <Setter Property="ItemsPanel">
-        <ItemsPanelTemplate>
-          <WrapPanel />
-        </ItemsPanelTemplate>
-      </Setter>
-    </ControlTheme>
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <TabStrip>
+        <TabStripItem>Item 1</TabStripItem>
+        <TabStripItem>Item 2</TabStripItem>
+        <TabStripItem IsEnabled="False">Disabled</TabStripItem>
+      </TabStrip>
+    </Border>
+  </Design.PreviewWith>
+
+  <ControlTheme x:Key="{x:Type TabStrip}" TargetType="TabStrip">
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Background="{TemplateBinding Background}"
+                BorderBrush="{TemplateBinding BorderBrush}"
+                BorderThickness="{TemplateBinding BorderThickness}"
+                CornerRadius="{TemplateBinding CornerRadius}"
+                Padding="{TemplateBinding Padding}">
+          <ItemsPresenter Name="PART_ItemsPresenter"
+                          Items="{TemplateBinding Items}"
+                          ItemsPanel="{TemplateBinding ItemsPanel}"
+                          ItemTemplate="{TemplateBinding ItemTemplate}" />
+        </Border>
+      </ControlTemplate>
+    </Setter>
+    <Setter Property="ItemsPanel">
+      <ItemsPanelTemplate>
+        <WrapPanel />
+      </ItemsPanelTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/TabStripItem.xaml b/src/Avalonia.Themes.Fluent/Controls/TabStripItem.xaml
index 5ccd430d33..fab8ba87aa 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TabStripItem.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TabStripItem.xaml
@@ -2,107 +2,97 @@
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     x:CompileBindings="True">
-     <Design.PreviewWith>
-      <Border Padding="20">
-        <StackPanel Spacing="20">
-          <TabStripItem>Leaf</TabStripItem>
-          <TabStripItem IsSelected="True">Arch</TabStripItem>
-        </StackPanel>
-      </Border>
-    </Design.PreviewWith>
-  
-    <x:Double x:Key="TabStripItemMinHeight">48</x:Double>
-    <x:Double x:Key="TabStripItemPipeThickness">2</x:Double>
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <StackPanel Spacing="20">
+        <TabStripItem>Leaf</TabStripItem>
+        <TabStripItem IsSelected="True">Arch</TabStripItem>
+        <TabStripItem Background="Yellow">Background</TabStripItem>
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
 
-    <ControlTheme x:Key="{x:Type TabStripItem}" TargetType="TabStripItem">
-        <Setter Property="FontSize" Value="{DynamicResource TabItemHeaderFontSize}" />
-        <Setter Property="FontWeight" Value="{DynamicResource TabItemHeaderThemeFontWeight}" />
-        <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselected}" />
-        <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselected}" />
-        <Setter Property="Padding" Value="{DynamicResource TabItemHeaderMargin}" />
-        <Setter Property="Margin" Value="0" />
-        <Setter Property="MinHeight" Value="{DynamicResource TabStripItemMinHeight}" />
-        <Setter Property="VerticalContentAlignment" Value="Center" />
-        <Setter Property="Template">
-            <ControlTemplate>
-                <Border
-                    Name="PART_LayoutRoot"
-                    Padding="{TemplateBinding Padding}"
-                    BorderBrush="{TemplateBinding BorderBrush}"
-                    BorderThickness="{TemplateBinding BorderThickness}"
-                    CornerRadius="{TemplateBinding CornerRadius}">
-                    <Panel>
-                        <ContentPresenter
-                            Name="PART_ContentPresenter"
-                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                            Content="{TemplateBinding Content}"
-                            ContentTemplate="{TemplateBinding ContentTemplate}"
-                            FontFamily="{TemplateBinding FontFamily}"
-                            FontSize="{TemplateBinding FontSize}"
-                            FontWeight="{TemplateBinding FontWeight}" />
-                        <Border Name="PART_SelectedPipe" Background="{DynamicResource TabItemHeaderSelectedPipeFill}" />
-                    </Panel>
-                </Border>
-            </ControlTemplate>
-        </Setter>
+  <x:Double x:Key="TabStripItemMinHeight">48</x:Double>
+  <x:Double x:Key="TabStripItemPipeThickness">2</x:Double>
 
-        <Style Selector="^ /template/ Border#PART_SelectedPipe">
-            <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-        </Style>
+  <ControlTheme x:Key="{x:Type TabStripItem}" TargetType="TabStripItem">
+    <Setter Property="FontSize" Value="{DynamicResource TabItemHeaderFontSize}" />
+    <Setter Property="FontWeight" Value="{DynamicResource TabItemHeaderThemeFontWeight}" />
+    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselected}" />
+    <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselected}" />
+    <Setter Property="Padding" Value="{DynamicResource TabItemHeaderMargin}" />
+    <Setter Property="Margin" Value="0" />
+    <Setter Property="MinHeight" Value="{DynamicResource TabStripItemMinHeight}" />
+    <Setter Property="VerticalContentAlignment" Value="Center" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border
+            Name="PART_LayoutRoot"
+            Background="{TemplateBinding Background}"
+            BorderBrush="{TemplateBinding BorderBrush}"
+            BorderThickness="{TemplateBinding BorderThickness}"
+            CornerRadius="{TemplateBinding CornerRadius}"
+            Padding="{TemplateBinding Padding}">
+          <Panel>
+            <ContentPresenter
+                Name="PART_ContentPresenter"
+                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                Content="{TemplateBinding Content}"
+                ContentTemplate="{TemplateBinding ContentTemplate}"
+                FontFamily="{TemplateBinding FontFamily}"
+                FontSize="{TemplateBinding FontSize}"
+                FontWeight="{TemplateBinding FontWeight}" />
+            <Border Name="PART_SelectedPipe"
+                    Background="{DynamicResource TabItemHeaderSelectedPipeFill}"
+                    CornerRadius="{DynamicResource ControlCornerRadius}"
+                    Height="{DynamicResource TabStripItemPipeThickness}"
+                    IsVisible="False"
+                    Margin="0,0,0,2"
+                    VerticalAlignment="Bottom"/>
+          </Panel>
+        </Border>
+      </ControlTemplate>
+    </Setter>
 
-        <!--  Nornal state  -->
-        <Style Selector="^ /template/ Border#PART_LayoutRoot">
-            <Setter Property="Background" Value="{Binding $parent[TabStripItem].Background}" />
-        </Style>
-        <Style Selector="^ /template/ Border#PART_SelectedPipe">
-            <Setter Property="IsVisible" Value="False" />
-        </Style>
-        <Style Selector="^ /template/ Border#PART_SelectedPipe">
-            <Setter Property="Height" Value="{DynamicResource TabStripItemPipeThickness}" />
-            <Setter Property="Margin" Value="0,0,0,2" />
-            <Setter Property="HorizontalAlignment" Value="Stretch" />
-            <Setter Property="VerticalAlignment" Value="Bottom" />
-        </Style>
+    <!--  Selected state  -->
+    <!--  We don't use selector to PART_LayoutRoot, so developer can override selected item background with TabStripItem.Background  -->
+    <Style Selector="^:selected">
+      <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelected}" />
+      <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundSelected}" />
+    </Style>
+    <Style Selector="^:selected /template/ Border#PART_SelectedPipe">
+      <Setter Property="IsVisible" Value="True" />
+    </Style>
 
-        <!--  Selected state  -->
-        <!--  We don't use selector to PART_LayoutRoot, so developer can override selected item background with TabStripItem.Background  -->
-        <Style Selector="^:selected">
-            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelected}" />
-            <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundSelected}" />
-        </Style>
-        <Style Selector="^:selected /template/ Border#PART_SelectedPipe">
-            <Setter Property="IsVisible" Value="True" />
-        </Style>
+    <!--  PointerOver state  -->
+    <Style Selector="^:pointerover /template/ Border#PART_LayoutRoot">
+      <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPointerOver}" />
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPointerOver}" />
+    </Style>
 
-        <!--  PointerOver state  -->
-        <Style Selector="^:pointerover /template/ Border#PART_LayoutRoot">
-            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPointerOver}" />
-            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPointerOver}" />
-        </Style>
+    <!--  Selected PointerOver state  -->
+    <Style Selector="^:selected:pointerover /template/ Border#PART_LayoutRoot">
+      <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPointerOver}" />
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPointerOver}" />
+    </Style>
 
-        <!--  Selected PointerOver state  -->
-        <Style Selector="^:selected:pointerover /template/ Border#PART_LayoutRoot">
-            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPointerOver}" />
-            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPointerOver}" />
-        </Style>
+    <!--  Pressed state  -->
+    <Style Selector="^:pressed /template/ Border#PART_LayoutRoot">
+      <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPressed}" />
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPressed}" />
+    </Style>
 
-        <!--  Pressed state  -->
-        <Style Selector="^:pressed /template/ Border#PART_LayoutRoot">
-            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPressed}" />
-            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPressed}" />
-        </Style>
+    <!--  Selected Pressed state  -->
+    <Style Selector="^:selected:pressed /template/ Border#PART_LayoutRoot">
+      <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPressed}" />
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPressed}" />
+    </Style>
 
-        <!--  Selected Pressed state  -->
-        <Style Selector="^:selected:pressed /template/ Border#PART_LayoutRoot">
-            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPressed}" />
-            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPressed}" />
-        </Style>
-
-        <!--  Disabled state  -->
-        <Style Selector="^:disabled /template/ Border#PART_LayoutRoot">
-            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundDisabled}" />
-            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundDisabled}" />
-        </Style>
-    </ControlTheme>
+    <!--  Disabled state  -->
+    <Style Selector="^:disabled /template/ Border#PART_LayoutRoot">
+      <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundDisabled}" />
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundDisabled}" />
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From c27f5e798e0bb1a15491c931abc3330fa3e17d4e Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 16:24:51 +0200
Subject: [PATCH 33/70] Tweaked ToggleButton ControlTheme.

---
 src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml b/src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml
index 617f3e9c45..36c0c50064 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml
@@ -45,10 +45,6 @@
       </ControlTemplate>
     </Setter>
 
-    <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
-      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    </Style>
-
     <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
       <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundPointerOver}" />
       <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushPointerOver}" />

From 9e0e15fedfccef030047cb8a7e98d2e682a8313d Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 16:33:43 +0200
Subject: [PATCH 34/70] Tweaked ToggleSwitch ControlTheme.

---
 .../Controls/ToggleSwitch.xaml                | 563 ++++++++----------
 1 file changed, 262 insertions(+), 301 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/ToggleSwitch.xaml b/src/Avalonia.Themes.Fluent/Controls/ToggleSwitch.xaml
index 533903bec7..aaa20a105c 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ToggleSwitch.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ToggleSwitch.xaml
@@ -2,306 +2,267 @@
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:sys="clr-namespace:System;assembly=netstandard">
-     <Design.PreviewWith>
-      <StackPanel Margin="20" Width="250" Spacing="24" >
-        <StackPanel Spacing="12" >
-          <TextBlock
-            Text="Automatic updates"
-            Classes="h1"/>
-          <TextBlock
-            Text="Updates will be automaticly Downloaded and installed shile the computer is shutting down or restarting"
-            TextWrapping="Wrap"/>
-          <ToggleSwitch HorizontalContentAlignment="Left"
-            Content="Enable automatic Updates?"
-            OffContent="Uit"
-            OnContent="Aan"
-            VerticalAlignment="Bottom"/>
-        </StackPanel>
-
-        <StackPanel Spacing="12">
-          <TextBlock
-            Text="Previewer"
-            Classes="h1"/>
-          <TextBlock
-            Text="The previewer Shows a preview off your code, this could slow down your system"
-            TextWrapping="Wrap"/>
-          <ToggleSwitch
-            Background="Green"
-            IsChecked="True" />
-        </StackPanel>
+  <Design.PreviewWith>
+    <StackPanel Margin="20" Width="250" Spacing="24">
+      <StackPanel Spacing="12" >
+        <ToggleSwitch/>
+        <ToggleSwitch IsChecked="True" />
+        <ToggleSwitch HorizontalContentAlignment="Left"
+                      Content="Header"
+                      OffContent="Off"
+                      OnContent="On"/>
+        <ToggleSwitch Background="Yellow"/>
       </StackPanel>
-    </Design.PreviewWith>
-  
-    <Thickness x:Key="ToggleSwitchTopHeaderMargin">0,0,0,6</Thickness>
-    <GridLength x:Key="ToggleSwitchPreContentMargin">6</GridLength>
-    <GridLength x:Key="ToggleSwitchPostContentMargin">6</GridLength>
-    <x:Double x:Key="ToggleSwitchThemeMinWidth">0</x:Double>
-
-
-    <ControlTheme x:Key="{x:Type ToggleSwitch}" TargetType="ToggleSwitch">
-        <Setter Property="Foreground" Value="{DynamicResource ToggleSwitchContentForeground}" />
-        <Setter Property="HorizontalAlignment" Value="Left" />
-        <Setter Property="VerticalAlignment" Value="Center" />
-        <Setter Property="HorizontalContentAlignment" Value="Left" />
-        <Setter Property="VerticalContentAlignment" Value="Center" />
-        <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-        <Setter Property="Template">
-            <ControlTemplate>
-                <Grid Background="{TemplateBinding Background}" RowDefinitions="Auto,*">
-
-                    <ContentPresenter
-                        x:Name="PART_ContentPresenter"
-                        Grid.Row="0"
-                        VerticalAlignment="Top"
-                        Content="{TemplateBinding Content}"
-                        ContentTemplate="{TemplateBinding ContentTemplate}"
-                        RecognizesAccessKey="True" />
-
-                    <Grid
-                        Grid.Row="1"
-                        MinWidth="{DynamicResource ToggleSwitchThemeMinWidth}"
-                        HorizontalAlignment="Left"
-                        VerticalAlignment="Top">
-
-                        <Grid.RowDefinitions>
-                            <RowDefinition Height="{DynamicResource ToggleSwitchPreContentMargin}" />
-                            <RowDefinition Height="Auto" />
-                            <RowDefinition Height="{DynamicResource ToggleSwitchPostContentMargin}" />
-                        </Grid.RowDefinitions>
-
-                        <Grid.ColumnDefinitions>
-                            <ColumnDefinition Width="Auto" />
-                            <ColumnDefinition Width="12" MaxWidth="12" />
-                            <ColumnDefinition Width="Auto" />
-                        </Grid.ColumnDefinitions>
-
-                        <Grid
-                            x:Name="SwitchAreaGrid"
-                            Grid.RowSpan="3"
-                            Grid.ColumnSpan="3"
-                            Margin="0,5"
-                            TemplatedControl.IsTemplateFocusTarget="True" />
-
-                        <ContentPresenter
-                            x:Name="PART_OffContentPresenter"
-                            Grid.RowSpan="3"
-                            Grid.Column="2"
-                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                            Content="{TemplateBinding OffContent}"
-                            ContentTemplate="{TemplateBinding OffContentTemplate}" />
-
-                        <ContentPresenter
-                            x:Name="PART_OnContentPresenter"
-                            Grid.RowSpan="3"
-                            Grid.Column="2"
-                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                            Content="{TemplateBinding OnContent}"
-                            ContentTemplate="{TemplateBinding OnContentTemplate}" />
-
-                        <Border
-                            x:Name="OuterBorder"
-                            Grid.Row="1"
-                            Width="40"
-                            Height="20"
-                            BorderThickness="{DynamicResource ToggleSwitchOuterBorderStrokeThickness}"
-                            CornerRadius="10" />
-
-                        <Border
-                            x:Name="SwitchKnobBounds"
-                            Grid.Row="1"
-                            Width="40"
-                            Height="20"
-                            BorderThickness="{DynamicResource ToggleSwitchOnStrokeThickness}"
-                            CornerRadius="10" />
-
-                        <Canvas
-                            x:Name="SwitchKnob"
-                            Grid.Row="1"
-                            Width="20"
-                            Height="20"
-                            HorizontalAlignment="Left">
-
-                            <Grid
-                                x:Name="MovingKnobs"
-                                Width="20"
-                                Height="20">
-
-                                <Ellipse
-                                    x:Name="SwitchKnobOn"
-                                    Width="10"
-                                    Height="10" />
-
-                                <Ellipse
-                                    x:Name="SwitchKnobOff"
-                                    Width="10"
-                                    Height="10" />
-                            </Grid>
-                        </Canvas>
-                    </Grid>
-                </Grid>
-            </ControlTemplate>
-        </Setter>
-
-        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
-            <Setter Property="Margin" Value="{DynamicResource ToggleSwitchTopHeaderMargin}" />
-        </Style>
-        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter:empty">
-            <Setter Property="Margin" Value="0" />
-        </Style>
-
-        <!--  NormalState  -->
-        <Style Selector="^ /template/ Grid#SwitchAreaGrid">
-            <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackground}" />
-        </Style>
-
-        <Style Selector="^ /template/ Border#OuterBorder">
-            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOff}" />
-            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOff}" />
-        </Style>
-
-        <Style Selector="^ /template/ Border#SwitchKnobBounds">
-            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOn}" />
-            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOn}" />
-        </Style>
-
-        <Style Selector="^ /template/ Ellipse#SwitchKnobOn">
-            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOn}" />
-        </Style>
-
-        <Style Selector="^ /template/ Ellipse#SwitchKnobOff">
-            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOff}" />
-        </Style>
-
-        <Style Selector="^:not(:dragging) /template/ Grid#MovingKnobs">
-            <Setter Property="Transitions">
-                <Transitions>
-                    <DoubleTransition
-                        Easing="CubicEaseOut"
-                        Property="Canvas.Left"
-                        Duration="0:0:0.2" />
-                </Transitions>
-            </Setter>
-        </Style>
-
-        <!--  PointerOverState  -->
-        <Style Selector="^:pointerover /template/ Border#OuterBorder">
-            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffPointerOver}" />
-            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffPointerOver}" />
-        </Style>
-
-        <Style Selector="^:pointerover /template/ Ellipse#SwitchKnobOff">
-            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffPointerOver}" />
-        </Style>
-
-        <Style Selector="^:pointerover /template/ Ellipse#SwitchKnobOn">
-            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnPointerOver}" />
-        </Style>
-
-        <Style Selector="^:pointerover /template/ Border#SwitchKnobBounds">
-            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnPointerOver}" />
-            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnPointerOver}" />
-        </Style>
-
-        <Style Selector="^:pointerover /template/ Grid#SwitchAreaGrid">
-            <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundPointerOver}" />
-        </Style>
-
-        <!--  PressedState  -->
-        <Style Selector="^:pressed /template/ Border#OuterBorder">
-            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffPressed}" />
-            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffPressed}" />
-        </Style>
-
-        <Style Selector="^:pressed /template/ Border#SwitchKnobBounds">
-            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnPressed}" />
-            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnPressed}" />
-        </Style>
-
-        <Style Selector="^:pressed /template/ Ellipse#SwitchKnobOff">
-            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffPressed}" />
-        </Style>
-
-        <Style Selector="^:pressed /template/ Ellipse#SwitchKnobOn">
-            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnPressed}" />
-        </Style>
-
-        <Style Selector="^:pressed /template/ Grid#SwitchAreaGrid">
-            <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundPressed}" />
-        </Style>
-
-        <!--  DisabledState  -->
-        <Style Selector="^:disabled">
-            <Setter Property="Foreground" Value="{DynamicResource ToggleSwitchHeaderForegroundDisabled}" />
-        </Style>
-
-        <Style Selector="^:disabled /template/ Border#OuterBorder">
-            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffDisabled}" />
-            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffDisabled}" />
-        </Style>
-
-        <Style Selector="^:disabled /template/ Ellipse#SwitchKnobOff">
-            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffDisabled}" />
-        </Style>
-
-        <Style Selector="^:disabled /template/ Ellipse#SwitchKnobOn">
-            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnDisabled}" />
-        </Style>
-
-        <Style Selector="^:disabled /template/ Border#SwitchKnobBounds">
-            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnDisabled}" />
-            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnDisabled}" />
-        </Style>
-
-        <!--  CheckedState  -->
-        <Style Selector="^:checked /template/ Border#OuterBorder">
-            <Setter Property="Opacity" Value="0" />
-        </Style>
-
-        <Style Selector="^:checked  /template/ Ellipse#SwitchKnobOff">
-            <Setter Property="Opacity" Value="0" />
-        </Style>
-
-        <Style Selector="^:checked  /template/ Border#SwitchKnobBounds">
-            <Setter Property="Opacity" Value="1" />
-        </Style>
-
-        <Style Selector="^:checked /template/ Ellipse#SwitchKnobOn">
-            <Setter Property="Opacity" Value="1" />
-        </Style>
-
-        <Style Selector="^:checked /template/ ContentPresenter#PART_OffContentPresenter">
-            <Setter Property="Opacity" Value="0" />
-        </Style>
-
-        <Style Selector="^:checked /template/ ContentPresenter#PART_OnContentPresenter">
-            <Setter Property="Opacity" Value="1" />
-        </Style>
-
-        <!--  UncheckedState  -->
-        <Style Selector="^:unchecked /template/ Border#OuterBorder">
-            <Setter Property="Opacity" Value="1" />
-        </Style>
-
-        <Style Selector="^:unchecked /template/ Ellipse#SwitchKnobOff">
-            <Setter Property="Opacity" Value="1" />
-        </Style>
-
-        <Style Selector="^:unchecked /template/ Ellipse#SwitchKnobOn">
-            <Setter Property="Opacity" Value="0" />
-        </Style>
-
-        <Style Selector="^:unchecked  /template/ Border#SwitchKnobBounds">
-            <Setter Property="Opacity" Value="0" />
-        </Style>
-
-        <Style Selector="^:unchecked /template/ ContentPresenter#PART_OffContentPresenter">
-            <Setter Property="Opacity" Value="1" />
-        </Style>
-
-        <Style Selector="^:unchecked /template/ ContentPresenter#PART_OnContentPresenter">
-            <Setter Property="Opacity" Value="0" />
-        </Style>
-    </ControlTheme>
+    </StackPanel>
+  </Design.PreviewWith>
+
+  <Thickness x:Key="ToggleSwitchTopHeaderMargin">0,0,0,6</Thickness>
+  <GridLength x:Key="ToggleSwitchPreContentMargin">6</GridLength>
+  <GridLength x:Key="ToggleSwitchPostContentMargin">6</GridLength>
+  <x:Double x:Key="ToggleSwitchThemeMinWidth">0</x:Double>
+
+  <ControlTheme x:Key="{x:Type ToggleSwitch}" TargetType="ToggleSwitch">
+    <Setter Property="Foreground" Value="{DynamicResource ToggleSwitchContentForeground}" />
+    <Setter Property="HorizontalAlignment" Value="Left" />
+    <Setter Property="VerticalAlignment" Value="Center" />
+    <Setter Property="HorizontalContentAlignment" Value="Left" />
+    <Setter Property="VerticalContentAlignment" Value="Center" />
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Grid Background="{TemplateBinding Background}" RowDefinitions="Auto,*">
+
+          <ContentPresenter
+              x:Name="PART_ContentPresenter"
+              Grid.Row="0"
+              VerticalAlignment="Top"
+              Content="{TemplateBinding Content}"
+              ContentTemplate="{TemplateBinding ContentTemplate}"
+              Margin="{DynamicResource ToggleSwitchTopHeaderMargin}"
+              RecognizesAccessKey="True" />
+
+          <Grid
+              Grid.Row="1"
+              MinWidth="{DynamicResource ToggleSwitchThemeMinWidth}"
+              HorizontalAlignment="Left"
+              VerticalAlignment="Top">
+
+            <Grid.RowDefinitions>
+              <RowDefinition Height="{DynamicResource ToggleSwitchPreContentMargin}" />
+              <RowDefinition Height="Auto" />
+              <RowDefinition Height="{DynamicResource ToggleSwitchPostContentMargin}" />
+            </Grid.RowDefinitions>
+
+            <Grid.ColumnDefinitions>
+              <ColumnDefinition Width="Auto" />
+              <ColumnDefinition Width="12" MaxWidth="12" />
+              <ColumnDefinition Width="Auto" />
+            </Grid.ColumnDefinitions>
+
+            <Grid
+                x:Name="SwitchAreaGrid"
+                Grid.RowSpan="3"
+                Grid.ColumnSpan="3"
+                Background="{DynamicResource ToggleSwitchContainerBackground}"
+                Margin="0,5"
+                TemplatedControl.IsTemplateFocusTarget="True" />
+
+            <ContentPresenter
+                x:Name="PART_OffContentPresenter"
+                Grid.RowSpan="3"
+                Grid.Column="2"
+                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                Content="{TemplateBinding OffContent}"
+                ContentTemplate="{TemplateBinding OffContentTemplate}" />
+
+            <ContentPresenter
+                x:Name="PART_OnContentPresenter"
+                Grid.RowSpan="3"
+                Grid.Column="2"
+                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                Content="{TemplateBinding OnContent}"
+                ContentTemplate="{TemplateBinding OnContentTemplate}" />
+
+            <Border
+                x:Name="OuterBorder"
+                Grid.Row="1"
+                Width="40"
+                Height="20"
+                Background="{DynamicResource ToggleSwitchFillOff}"
+                BorderBrush="{DynamicResource ToggleSwitchStrokeOff}"
+                BorderThickness="{DynamicResource ToggleSwitchOuterBorderStrokeThickness}"
+                CornerRadius="10" />
+
+            <Border
+                x:Name="SwitchKnobBounds"
+                Grid.Row="1"
+                Width="40"
+                Height="20"
+                Background="{DynamicResource ToggleSwitchFillOn}"
+                BorderBrush="{DynamicResource ToggleSwitchStrokeOn}"
+                BorderThickness="{DynamicResource ToggleSwitchOnStrokeThickness}"
+                CornerRadius="10" />
+
+            <Canvas
+                x:Name="SwitchKnob"
+                Grid.Row="1"
+                Width="20"
+                Height="20"
+                HorizontalAlignment="Left">
+
+              <Grid x:Name="MovingKnobs" Width="20" Height="20">
+                <Ellipse
+                  x:Name="SwitchKnobOn"
+                  Fill="{DynamicResource ToggleSwitchKnobFillOn}"
+                  Width="10"
+                  Height="10" />
+                <Ellipse
+                  x:Name="SwitchKnobOff"
+                  Fill="{DynamicResource ToggleSwitchKnobFillOff}"
+                  Width="10"
+                  Height="10" />
+              </Grid>
+            </Canvas>
+          </Grid>
+        </Grid>
+      </ControlTemplate>
+    </Setter>
+
+    <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter:empty">
+      <Setter Property="Margin" Value="0" />
+    </Style>
+
+    <!--  NormalState  -->
+    <Style Selector="^:not(:dragging) /template/ Grid#MovingKnobs">
+      <Setter Property="Transitions">
+        <Transitions>
+          <DoubleTransition
+              Easing="CubicEaseOut"
+              Property="Canvas.Left"
+              Duration="0:0:0.2" />
+        </Transitions>
+      </Setter>
+    </Style>
+
+    <!--  PointerOverState  -->
+    <Style Selector="^:pointerover /template/ Border#OuterBorder">
+      <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffPointerOver}" />
+      <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffPointerOver}" />
+    </Style>
+
+    <Style Selector="^:pointerover /template/ Ellipse#SwitchKnobOff">
+      <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffPointerOver}" />
+    </Style>
+
+    <Style Selector="^:pointerover /template/ Ellipse#SwitchKnobOn">
+      <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnPointerOver}" />
+    </Style>
+
+    <Style Selector="^:pointerover /template/ Border#SwitchKnobBounds">
+      <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnPointerOver}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnPointerOver}" />
+    </Style>
+
+    <Style Selector="^:pointerover /template/ Grid#SwitchAreaGrid">
+      <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundPointerOver}" />
+    </Style>
+
+    <!--  PressedState  -->
+    <Style Selector="^:pressed /template/ Border#OuterBorder">
+      <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffPressed}" />
+      <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffPressed}" />
+    </Style>
+
+    <Style Selector="^:pressed /template/ Border#SwitchKnobBounds">
+      <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnPressed}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnPressed}" />
+    </Style>
+
+    <Style Selector="^:pressed /template/ Ellipse#SwitchKnobOff">
+      <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffPressed}" />
+    </Style>
+
+    <Style Selector="^:pressed /template/ Ellipse#SwitchKnobOn">
+      <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnPressed}" />
+    </Style>
+
+    <Style Selector="^:pressed /template/ Grid#SwitchAreaGrid">
+      <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundPressed}" />
+    </Style>
+
+    <!--  DisabledState  -->
+    <Style Selector="^:disabled">
+      <Setter Property="Foreground" Value="{DynamicResource ToggleSwitchHeaderForegroundDisabled}" />
+    </Style>
+
+    <Style Selector="^:disabled /template/ Border#OuterBorder">
+      <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffDisabled}" />
+      <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffDisabled}" />
+    </Style>
+
+    <Style Selector="^:disabled /template/ Ellipse#SwitchKnobOff">
+      <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffDisabled}" />
+    </Style>
+
+    <Style Selector="^:disabled /template/ Ellipse#SwitchKnobOn">
+      <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnDisabled}" />
+    </Style>
+
+    <Style Selector="^:disabled /template/ Border#SwitchKnobBounds">
+      <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnDisabled}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnDisabled}" />
+    </Style>
+
+    <!--  CheckedState  -->
+    <Style Selector="^:checked /template/ Border#OuterBorder">
+      <Setter Property="Opacity" Value="0" />
+    </Style>
+
+    <Style Selector="^:checked  /template/ Ellipse#SwitchKnobOff">
+      <Setter Property="Opacity" Value="0" />
+    </Style>
+
+    <Style Selector="^:checked  /template/ Border#SwitchKnobBounds">
+      <Setter Property="Opacity" Value="1" />
+    </Style>
+
+    <Style Selector="^:checked /template/ Ellipse#SwitchKnobOn">
+      <Setter Property="Opacity" Value="1" />
+    </Style>
+
+    <Style Selector="^:checked /template/ ContentPresenter#PART_OffContentPresenter">
+      <Setter Property="Opacity" Value="0" />
+    </Style>
+
+    <Style Selector="^:checked /template/ ContentPresenter#PART_OnContentPresenter">
+      <Setter Property="Opacity" Value="1" />
+    </Style>
+
+    <!--  UncheckedState  -->
+    <Style Selector="^:unchecked /template/ Border#OuterBorder">
+      <Setter Property="Opacity" Value="1" />
+    </Style>
+
+    <Style Selector="^:unchecked /template/ Ellipse#SwitchKnobOff">
+      <Setter Property="Opacity" Value="1" />
+    </Style>
+
+    <Style Selector="^:unchecked /template/ Ellipse#SwitchKnobOn">
+      <Setter Property="Opacity" Value="0" />
+    </Style>
+
+    <Style Selector="^:unchecked  /template/ Border#SwitchKnobBounds">
+      <Setter Property="Opacity" Value="0" />
+    </Style>
+
+    <Style Selector="^:unchecked /template/ ContentPresenter#PART_OffContentPresenter">
+      <Setter Property="Opacity" Value="1" />
+    </Style>
+
+    <Style Selector="^:unchecked /template/ ContentPresenter#PART_OnContentPresenter">
+      <Setter Property="Opacity" Value="0" />
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From e8091cfe80759251c7fe35f834c91fe606b8576c Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 16:48:04 +0200
Subject: [PATCH 35/70] Tweaked ToolTip ControlTheme.

---
 .../Controls/ToolTip.xaml                     | 113 ++++++++----------
 1 file changed, 50 insertions(+), 63 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/ToolTip.xaml b/src/Avalonia.Themes.Fluent/Controls/ToolTip.xaml
index 1070f3b68c..bc9dceb545 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ToolTip.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ToolTip.xaml
@@ -2,70 +2,57 @@
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                     xmlns:sys="clr-namespace:System;assembly=netstandard"
                     x:CompileBindings="True">
-    <Design.PreviewWith>
-      <Grid RowDefinitions="Auto,Auto"
-            ColumnDefinitions="Auto,Auto"
-            HorizontalAlignment="Center">
-        <Border Grid.Column="0"
-                Grid.Row="1"
-                Background="{DynamicResource SystemControlBackgroundAccentBrush}"
-                Margin="5" Padding="50" ToolTip.Tip="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.">
-          <TextBlock>Hover Here</TextBlock>
-        </Border>
-        <CheckBox Grid.Column="1"
-                  Margin="5"
-                  Grid.Row="0"
-                  IsChecked="{Binding ElementName=Border, Path=(ToolTip.IsOpen)}"
-                  Content="ToolTip Open" />
-        <Border Name="Border"
-                Grid.Column="1"
-                Grid.Row="1"
-                Background="{DynamicResource SystemControlBackgroundAccentBrush}"
-                Margin="5"
-                Padding="50"
-                ToolTip.Placement="Bottom">
-          <ToolTip.Tip>
-            <StackPanel>
-              <TextBlock Classes="h1">ToolTip</TextBlock>
-              <TextBlock Classes="h2">A control which pops up a hint when a control is hovered</TextBlock>
-            </StackPanel>
-          </ToolTip.Tip>
-          <TextBlock>ToolTip bottom placement</TextBlock>
-        </Border>
-      </Grid>
-    </Design.PreviewWith>
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <StackPanel Spacing="20">
+        <ToolTip Opacity="1">Text Content</ToolTip>
+        <ToolTip Opacity="1">Very long text content which should exceed the maximum with of the tooltip and wrap.</ToolTip>
+        <ToolTip Opacity="1">
+          <StackPanel>
+            <TextBlock>Multi-line</TextBlock>
+            <TextBlock>Control Content</TextBlock>
+          </StackPanel>
+        </ToolTip>
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
 
-    <sys:Double x:Key="ToolTipContentMaxWidth">320</sys:Double>
+  <sys:Double x:Key="ToolTipContentMaxWidth">320</sys:Double>
 
-    <ControlTheme x:Key="{x:Type ToolTip}" TargetType="ToolTip">
-      <Setter Property="Foreground" Value="{DynamicResource ToolTipForeground}" />
-      <Setter Property="Background" Value="{DynamicResource ToolTipBackground}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource ToolTipBorderBrush}" />
-      <Setter Property="BorderThickness" Value="{DynamicResource ToolTipBorderThemeThickness}" />
-      <Setter Property="FontSize" Value="{DynamicResource ToolTipContentThemeFontSize}" />
-      <Setter Property="Padding" Value="{DynamicResource ToolTipBorderThemePadding}" />
-      <Setter Property="MaxWidth" Value="{DynamicResource ToolTipContentMaxWidth}" />
-      <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
-      <Setter Property="Opacity" Value="0" />
-      <Setter Property="Transitions">
-        <Transitions>
-          <DoubleTransition Property="Opacity" Duration="0:0:0.15" />
-        </Transitions>
-      </Setter>
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Border Name="PART_LayoutRoot" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" Padding="{TemplateBinding Padding}" CornerRadius="{TemplateBinding CornerRadius}">
-            <ContentPresenter Name="PART_ContentPresenter" MaxWidth="{TemplateBinding MaxWidth}" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" />
-          </Border>
-        </ControlTemplate>
-      </Setter>
-
-      <!--<Style Selector="^ > TextBlock">
-        <Setter Property="TextWrapping" Value="Wrap" />
-      </Style>-->
+  <ControlTheme x:Key="{x:Type ToolTip}" TargetType="ToolTip">
+    <Setter Property="Foreground" Value="{DynamicResource ToolTipForeground}" />
+    <Setter Property="Background" Value="{DynamicResource ToolTipBackground}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource ToolTipBorderBrush}" />
+    <Setter Property="BorderThickness" Value="{DynamicResource ToolTipBorderThemeThickness}" />
+    <Setter Property="FontSize" Value="{DynamicResource ToolTipContentThemeFontSize}" />
+    <Setter Property="Padding" Value="{DynamicResource ToolTipBorderThemePadding}" />
+    <Setter Property="MaxWidth" Value="{DynamicResource ToolTipContentMaxWidth}" />
+    <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
+    <Setter Property="Opacity" Value="0" />
+    <Setter Property="Transitions">
+      <Transitions>
+        <DoubleTransition Property="Opacity" Duration="0:0:0.15" />
+      </Transitions>
+    </Setter>
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Name="PART_LayoutRoot"
+                BorderThickness="{TemplateBinding BorderThickness}"
+                Background="{TemplateBinding Background}"
+                BorderBrush="{TemplateBinding BorderBrush}"
+                Padding="{TemplateBinding Padding}"
+                CornerRadius="{TemplateBinding CornerRadius}">
+          <ContentPresenter Name="PART_ContentPresenter"
+                            MaxWidth="{TemplateBinding MaxWidth}"
+                            Content="{TemplateBinding Content}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
+                            TextBlock.TextWrapping="Wrap"/>
+        </Border>
+      </ControlTemplate>
+    </Setter>
 
-      <Style Selector="^:open">
-        <Setter Property="Opacity" Value="1" />
-      </Style>
-    </ControlTheme>
+    <Style Selector="^:open">
+      <Setter Property="Opacity" Value="1" />
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From 433325e7463376756de70912a9fac103c958d54c Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 16:48:44 +0200
Subject: [PATCH 36/70] Formatted TransitioningContentControl ControlTheme.

---
 .../Controls/TransitioningContentControl.xaml | 32 +++++++++----------
 1 file changed, 16 insertions(+), 16 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/TransitioningContentControl.xaml b/src/Avalonia.Themes.Fluent/Controls/TransitioningContentControl.xaml
index f28dc66a5f..f1971fe236 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TransitioningContentControl.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TransitioningContentControl.xaml
@@ -1,19 +1,19 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTheme x:Key="{x:Type TransitioningContentControl}" TargetType="TransitioningContentControl">
-      <Setter Property="Template">
-        <ControlTemplate>
-          <ContentPresenter Name="PART_ContentPresenter"
-                            Background="{TemplateBinding Background}" 
-                            BorderBrush="{TemplateBinding BorderBrush}"
-                            BorderThickness="{TemplateBinding BorderThickness}"
-                            CornerRadius="{TemplateBinding CornerRadius}"
-                            ContentTemplate="{TemplateBinding ContentTemplate}"
-                            Content="{TemplateBinding CurrentContent}"
-                            Padding="{TemplateBinding Padding}"
-                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" />
-        </ControlTemplate>
-      </Setter>
-    </ControlTheme>
+  <ControlTheme x:Key="{x:Type TransitioningContentControl}" TargetType="TransitioningContentControl">
+    <Setter Property="Template">
+      <ControlTemplate>
+        <ContentPresenter Name="PART_ContentPresenter"
+                          Background="{TemplateBinding Background}"
+                          BorderBrush="{TemplateBinding BorderBrush}"
+                          BorderThickness="{TemplateBinding BorderThickness}"
+                          CornerRadius="{TemplateBinding CornerRadius}"
+                          ContentTemplate="{TemplateBinding ContentTemplate}"
+                          Content="{TemplateBinding CurrentContent}"
+                          Padding="{TemplateBinding Padding}"
+                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" />
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>

From 1bbff64d1fffd557c031e5fc4e78b003fdfe2c35 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 16:50:39 +0200
Subject: [PATCH 37/70] Added preview to TreeView ControlTheme.

---
 .../Controls/TreeView.xaml                    | 66 +++++++++++--------
 1 file changed, 39 insertions(+), 27 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/TreeView.xaml b/src/Avalonia.Themes.Fluent/Controls/TreeView.xaml
index 4fcec79f25..c340599000 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TreeView.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TreeView.xaml
@@ -1,31 +1,43 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <StackPanel Spacing="20">
+        <TreeView>
+          <TreeViewItem Header="Root" IsExpanded="True">
+            <TreeViewItem Header="Child1"/>
+            <TreeViewItem Header="Child2"/>
+          </TreeViewItem>
+        </TreeView>
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
 
-    <ControlTheme x:Key="{x:Type TreeView}" TargetType="TreeView">
-      <Setter Property="Background" Value="Transparent" />
-      <Setter Property="BorderBrush" Value="Transparent" />
-      <Setter Property="BorderThickness" Value="0" />
-      <Setter Property="Padding" Value="0" />
-      <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
-      <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
-      <Setter Property="ScrollViewer.IsScrollChainingEnabled" Value="True" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Border BorderBrush="{TemplateBinding BorderBrush}"
-                  BorderThickness="{TemplateBinding BorderThickness}"
-                  CornerRadius="{TemplateBinding CornerRadius}">
-            <ScrollViewer Background="{TemplateBinding Background}"
-                          HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}"
-                          VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}"
-                          IsScrollChainingEnabled="{TemplateBinding (ScrollViewer.IsScrollChainingEnabled)}"
-                          AllowAutoHide="{TemplateBinding (ScrollViewer.AllowAutoHide)}">
-              <ItemsPresenter Name="PART_ItemsPresenter"
-                              Items="{TemplateBinding Items}"
-                              ItemsPanel="{TemplateBinding ItemsPanel}"
-                              Margin="{TemplateBinding Padding}" />
-            </ScrollViewer>
-          </Border>
-        </ControlTemplate>
-      </Setter>
-    </ControlTheme>
+  <ControlTheme x:Key="{x:Type TreeView}" TargetType="TreeView">
+    <Setter Property="Background" Value="Transparent" />
+    <Setter Property="BorderBrush" Value="Transparent" />
+    <Setter Property="BorderThickness" Value="0" />
+    <Setter Property="Padding" Value="0" />
+    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
+    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
+    <Setter Property="ScrollViewer.IsScrollChainingEnabled" Value="True" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border BorderBrush="{TemplateBinding BorderBrush}"
+                BorderThickness="{TemplateBinding BorderThickness}"
+                CornerRadius="{TemplateBinding CornerRadius}">
+          <ScrollViewer Background="{TemplateBinding Background}"
+                        HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}"
+                        VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}"
+                        IsScrollChainingEnabled="{TemplateBinding (ScrollViewer.IsScrollChainingEnabled)}"
+                        AllowAutoHide="{TemplateBinding (ScrollViewer.AllowAutoHide)}">
+            <ItemsPresenter Name="PART_ItemsPresenter"
+                            Items="{TemplateBinding Items}"
+                            ItemsPanel="{TemplateBinding ItemsPanel}"
+                            Margin="{TemplateBinding Padding}" />
+          </ScrollViewer>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>

From 42da6cde7c1d237161768939c032bbf8a54b3f53 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 16:56:49 +0200
Subject: [PATCH 38/70] Formatted Window ControlTheme.

---
 .../Controls/Window.xaml                      | 54 +++++++++----------
 1 file changed, 27 insertions(+), 27 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/Window.xaml b/src/Avalonia.Themes.Fluent/Controls/Window.xaml
index d78fd76a37..35cc81663f 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Window.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Window.xaml
@@ -1,30 +1,30 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTheme x:Key="{x:Type Window}" TargetType="Window">
-      <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltHighBrush}"/>
-      <Setter Property="TransparencyBackgroundFallback" Value="{DynamicResource SystemControlBackgroundAltHighBrush}" />
-      <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>
-      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}"/>
-      <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Panel>
-            <Border Name="PART_TransparencyFallback" IsHitTestVisible="False" />
-            <Border Background="{TemplateBinding Background}" IsHitTestVisible="False" />
-            <Panel Background="Transparent" Margin="{TemplateBinding WindowDecorationMargin}" />
-            <VisualLayerManager>
-              <VisualLayerManager.ChromeOverlayLayer>
-                <TitleBar />
-              </VisualLayerManager.ChromeOverlayLayer>
-              <ContentPresenter Name="PART_ContentPresenter"
-                                ContentTemplate="{TemplateBinding ContentTemplate}"
-                                Content="{TemplateBinding Content}"
-                                Margin="{TemplateBinding Padding}"
-                                HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
-            </VisualLayerManager>
-          </Panel>
-        </ControlTemplate>
-      </Setter>
-    </ControlTheme>
+  <ControlTheme x:Key="{x:Type Window}" TargetType="Window">
+    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltHighBrush}"/>
+    <Setter Property="TransparencyBackgroundFallback" Value="{DynamicResource SystemControlBackgroundAltHighBrush}" />
+    <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}"/>
+    <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Panel>
+          <Border Name="PART_TransparencyFallback" IsHitTestVisible="False" />
+          <Border Background="{TemplateBinding Background}" IsHitTestVisible="False" />
+          <Panel Background="Transparent" Margin="{TemplateBinding WindowDecorationMargin}" />
+          <VisualLayerManager>
+            <VisualLayerManager.ChromeOverlayLayer>
+              <TitleBar />
+            </VisualLayerManager.ChromeOverlayLayer>
+            <ContentPresenter Name="PART_ContentPresenter"
+                              ContentTemplate="{TemplateBinding ContentTemplate}"
+                              Content="{TemplateBinding Content}"
+                              Margin="{TemplateBinding Padding}"
+                              HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                              VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
+          </VisualLayerManager>
+        </Panel>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>

From fa65cae7d82d6d3769d9a74f46a0033ea9852967 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 16:58:05 +0200
Subject: [PATCH 39/70] Formatted WindowNotificationManager ControlTheme.

---
 .../Controls/WindowNotificationManager.xaml   | 105 +++++++++---------
 1 file changed, 52 insertions(+), 53 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/WindowNotificationManager.xaml b/src/Avalonia.Themes.Fluent/Controls/WindowNotificationManager.xaml
index d5d5114c1b..77f49941f0 100644
--- a/src/Avalonia.Themes.Fluent/Controls/WindowNotificationManager.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/WindowNotificationManager.xaml
@@ -1,58 +1,57 @@
-<ResourceDictionary
-    xmlns="https://github.com/avaloniaui"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    x:CompileBindings="True"
-    x:DataType="WindowNotificationManager">
-    <ControlTheme x:Key="{x:Type WindowNotificationManager}" TargetType="WindowNotificationManager">
-        <Setter Property="Margin" Value="0 0" />
-        <Setter Property="Template">
-            <ControlTemplate>
-                <ReversibleStackPanel Name="PART_Items">
-                    <ReversibleStackPanel.DataTemplates>
-                        <DataTemplate DataType="INotification">
-                            <StackPanel
-                                Margin="12"
-                                Spacing="8"
-                                TextElement.Foreground="{DynamicResource SystemControlForegroundBaseHighBrush}">
-                                <TextBlock FontWeight="Medium" Text="{Binding Title}" />
-                                <TextBlock
-                                    MaxHeight="80"
-                                    Margin="0,0,12,0"
-                                    Text="{Binding Message}"
-                                    TextWrapping="Wrap" />
-                            </StackPanel>
-                        </DataTemplate>
-                        <DataTemplate DataType="x:String">
-                            <TextBlock
-                                Margin="12"
-                                Foreground="{DynamicResource SystemControlForegroundBaseHighBrush}"
-                                Text="{Binding}" />
-                        </DataTemplate>
-                    </ReversibleStackPanel.DataTemplates>
-                </ReversibleStackPanel>
-            </ControlTemplate>
-        </Setter>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    x:CompileBindings="True"
+                    x:DataType="WindowNotificationManager">
+  <ControlTheme x:Key="{x:Type WindowNotificationManager}" TargetType="WindowNotificationManager">
+    <Setter Property="Margin" Value="0 0" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <ReversibleStackPanel Name="PART_Items">
+          <ReversibleStackPanel.DataTemplates>
+            <DataTemplate DataType="INotification">
+              <StackPanel
+                  Margin="12"
+                  Spacing="8"
+                  TextElement.Foreground="{DynamicResource SystemControlForegroundBaseHighBrush}">
+                <TextBlock FontWeight="Medium" Text="{Binding Title}" />
+                <TextBlock
+                    MaxHeight="80"
+                    Margin="0,0,12,0"
+                    Text="{Binding Message}"
+                    TextWrapping="Wrap" />
+              </StackPanel>
+            </DataTemplate>
+            <DataTemplate DataType="x:String">
+              <TextBlock
+                  Margin="12"
+                  Foreground="{DynamicResource SystemControlForegroundBaseHighBrush}"
+                  Text="{Binding}" />
+            </DataTemplate>
+          </ReversibleStackPanel.DataTemplates>
+        </ReversibleStackPanel>
+      </ControlTemplate>
+    </Setter>
 
-        <Style Selector="^:topleft /template/ ReversibleStackPanel#PART_Items">
-            <Setter Property="VerticalAlignment" Value="Top" />
-            <Setter Property="HorizontalAlignment" Value="Left" />
-        </Style>
+    <Style Selector="^:topleft /template/ ReversibleStackPanel#PART_Items">
+      <Setter Property="VerticalAlignment" Value="Top" />
+      <Setter Property="HorizontalAlignment" Value="Left" />
+    </Style>
 
-        <Style Selector="^:topright /template/ ReversibleStackPanel#PART_Items">
-            <Setter Property="VerticalAlignment" Value="Top" />
-            <Setter Property="HorizontalAlignment" Value="Right" />
-        </Style>
+    <Style Selector="^:topright /template/ ReversibleStackPanel#PART_Items">
+      <Setter Property="VerticalAlignment" Value="Top" />
+      <Setter Property="HorizontalAlignment" Value="Right" />
+    </Style>
 
-        <Style Selector="^:bottomleft /template/ ReversibleStackPanel#PART_Items">
-            <Setter Property="ReverseOrder" Value="True" />
-            <Setter Property="VerticalAlignment" Value="Bottom" />
-            <Setter Property="HorizontalAlignment" Value="Left" />
-        </Style>
+    <Style Selector="^:bottomleft /template/ ReversibleStackPanel#PART_Items">
+      <Setter Property="ReverseOrder" Value="True" />
+      <Setter Property="VerticalAlignment" Value="Bottom" />
+      <Setter Property="HorizontalAlignment" Value="Left" />
+    </Style>
 
-        <Style Selector="^:bottomright /template/ ReversibleStackPanel#PART_Items">
-            <Setter Property="ReverseOrder" Value="True" />
-            <Setter Property="VerticalAlignment" Value="Bottom" />
-            <Setter Property="HorizontalAlignment" Value="Right" />
-        </Style>
-    </ControlTheme>
+    <Style Selector="^:bottomright /template/ ReversibleStackPanel#PART_Items">
+      <Setter Property="ReverseOrder" Value="True" />
+      <Setter Property="VerticalAlignment" Value="Bottom" />
+      <Setter Property="HorizontalAlignment" Value="Right" />
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From 5229cf57336c771ecda45dfea704340a7d1141e3 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 17:00:12 +0200
Subject: [PATCH 40/70] Formatted Calendar ControlTheme.

---
 .../Controls/Calendar.xaml                    | 52 +++++++++----------
 1 file changed, 26 insertions(+), 26 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/Calendar.xaml b/src/Avalonia.Themes.Fluent/Controls/Calendar.xaml
index 3434f9b6e5..8d54cb93ca 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Calendar.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Calendar.xaml
@@ -5,36 +5,36 @@
     // All other rights reserved.
 -->
 
-<ResourceDictionary xmlns="https://github.com/avaloniaui" 
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-   <Design.PreviewWith>
+  <Design.PreviewWith>
     <Border Padding="20">
       <Calendar />
     </Border>
   </Design.PreviewWith>
 
-    <ControlTheme x:Key="{x:Type Calendar}" TargetType="Calendar">
-        <Setter Property="Foreground" Value="{DynamicResource CalendarViewForeground}" />
-        <Setter Property="Background" Value="{DynamicResource CalendarViewBackground}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewBorderBrush}" />
-        <Setter Property="BorderThickness" Value="1" />
-        <Setter Property="HorizontalAlignment" Value="Left" />
-        <Setter Property="VerticalAlignment" Value="Center" />
-        <Setter Property="Template">
-            <ControlTemplate>
-                <StackPanel
-                    Name="Root"
-                    HorizontalAlignment="Center"
-                    ClipToBounds="True">
-                    <CalendarItem
-                        Name="CalendarItem"
-                        Background="{TemplateBinding Background}"
-                        BorderBrush="{TemplateBinding BorderBrush}"
-                        BorderThickness="{TemplateBinding BorderThickness}"
-                        CornerRadius="{TemplateBinding CornerRadius}"
-                        HeaderBackground="{TemplateBinding HeaderBackground}" />
-                </StackPanel>
-            </ControlTemplate>
-        </Setter>
-    </ControlTheme>
+  <ControlTheme x:Key="{x:Type Calendar}" TargetType="Calendar">
+    <Setter Property="Foreground" Value="{DynamicResource CalendarViewForeground}" />
+    <Setter Property="Background" Value="{DynamicResource CalendarViewBackground}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewBorderBrush}" />
+    <Setter Property="BorderThickness" Value="1" />
+    <Setter Property="HorizontalAlignment" Value="Left" />
+    <Setter Property="VerticalAlignment" Value="Center" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <StackPanel
+            Name="Root"
+            HorizontalAlignment="Center"
+            ClipToBounds="True">
+          <CalendarItem
+              Name="CalendarItem"
+              Background="{TemplateBinding Background}"
+              BorderBrush="{TemplateBinding BorderBrush}"
+              BorderThickness="{TemplateBinding BorderThickness}"
+              CornerRadius="{TemplateBinding CornerRadius}"
+              HeaderBackground="{TemplateBinding HeaderBackground}" />
+        </StackPanel>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>

From 7af2eb9a29e0ea5a2b8b08b3a00b72518b34b6ef Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 17:08:40 +0200
Subject: [PATCH 41/70] Formatted CalendarButton ControlTheme.

---
 .../Controls/CalendarButton.xaml              | 178 +++++++++---------
 1 file changed, 93 insertions(+), 85 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/CalendarButton.xaml b/src/Avalonia.Themes.Fluent/Controls/CalendarButton.xaml
index 0381022910..d1aee7ee9a 100644
--- a/src/Avalonia.Themes.Fluent/Controls/CalendarButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/CalendarButton.xaml
@@ -4,106 +4,114 @@
 // Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
 // All other rights reserved.
 -->
-<ResourceDictionary xmlns="https://github.com/avaloniaui" 
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTheme x:Key="{x:Type CalendarButton}" TargetType="CalendarButton">
-      <Setter Property="ClickMode" Value="Release" />
-      <Setter Property="MinWidth" Value="40" />
-      <Setter Property="MinHeight" Value="40" />
-      <Setter Property="Margin" Value="1" />
-      <Setter Property="Padding" Value="0,0,0,0" />
-      <!--These are actually set on the CalendarView in WinUI-->
-      <Setter Property="Foreground" Value="{DynamicResource CalendarViewCalendarItemForeground}" />
-      <Setter Property="Background" Value="{DynamicResource CalendarViewCalendarItemRevealBackground}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewCalendarItemRevealBorderBrush}" />
-      <Setter Property="BorderThickness" Value="2" />
-      <Setter Property="FontSize" Value="20" />
-      <Setter Property="ClipToBounds" Value="False" />
-      <Setter Property="HorizontalContentAlignment" Value="Center" />
-      <Setter Property="VerticalContentAlignment" Value="Center" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Panel>
-            <!-- To mimic WinUI SystemFocusVisual, Focus visual is drawn outside the bounds of the item -->
-            <Border Name="Root" Background="{TemplateBinding Background}"
-                    BorderThickness="0" ClipToBounds="True">
-              <ContentControl Name="Content"
-                              ContentTemplate="{TemplateBinding ContentTemplate}"
-                              Content="{TemplateBinding Content}"
-                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                              FontSize="{TemplateBinding FontSize}"
-                              Margin="{TemplateBinding Padding}" />
-            </Border>
-            
-            <!-- Drawn Border should render on top of background to preserve the 1px margin between items -->
-            <Border Name="Border"
-                    BorderThickness="2"
-                    BorderBrush="{TemplateBinding BorderBrush}" />
-          </Panel>
-        </ControlTemplate>
-      </Setter>
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <StackPanel Spacing="20">
+        <CalendarButton/>
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
 
-      <Style Selector="^:pointerover /template/ Border#Border">
-        <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewHoverBorderBrush}" />
+  <ControlTheme x:Key="{x:Type CalendarButton}" TargetType="CalendarButton">
+    <Setter Property="ClickMode" Value="Release" />
+    <Setter Property="MinWidth" Value="40" />
+    <Setter Property="MinHeight" Value="40" />
+    <Setter Property="Margin" Value="1" />
+    <Setter Property="Padding" Value="0,0,0,0" />
+    <!--These are actually set on the CalendarView in WinUI-->
+    <Setter Property="Foreground" Value="{DynamicResource CalendarViewCalendarItemForeground}" />
+    <Setter Property="Background" Value="{DynamicResource CalendarViewCalendarItemRevealBackground}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewCalendarItemRevealBorderBrush}" />
+    <Setter Property="BorderThickness" Value="2" />
+    <Setter Property="FontSize" Value="20" />
+    <Setter Property="ClipToBounds" Value="False" />
+    <Setter Property="HorizontalContentAlignment" Value="Center" />
+    <Setter Property="VerticalContentAlignment" Value="Center" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Panel>
+          <!-- To mimic WinUI SystemFocusVisual, Focus visual is drawn outside the bounds of the item -->
+          <Border Name="Root" Background="{TemplateBinding Background}"
+                  BorderThickness="0" ClipToBounds="True">
+            <ContentControl Name="Content"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
+                            Content="{TemplateBinding Content}"
+                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                            FontSize="{TemplateBinding FontSize}"
+                            Margin="{TemplateBinding Padding}" />
+          </Border>
+
+          <!-- Drawn Border should render on top of background to preserve the 1px margin between items -->
+          <Border Name="Border"
+                  BorderThickness="2"
+                  BorderBrush="{TemplateBinding BorderBrush}" />
+        </Panel>
+      </ControlTemplate>
+    </Setter>
+
+    <Style Selector="^:pointerover /template/ Border#Border">
+      <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewHoverBorderBrush}" />
+    </Style>
+
+    <Style Selector="^:pressed /template/ Border#Border">
+      <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark2}" />
+    </Style>
+
+    <!-- Adjusted :selected to look like :today from DayItem -->
+    <Style Selector="^:selected">
+      <Style Selector="^ /template/ Border#Root">
+        <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
       </Style>
-      
-      <Style Selector="^:pressed /template/ Border#Border">
-        <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark2}" />
+
+      <Style Selector="^ /template/ Border#Border">
+        <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedBorderBrush}" />
       </Style>
 
-      <!-- Adjusted :selected to look like :today from DayItem -->
-      <Style Selector="^:selected">
-        <Style Selector="^ /template/ Border#Root">
-          <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
-        </Style>
-        
-        <Style Selector="^ /template/ Border#Border">
-          <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedBorderBrush}" />
-        </Style>
+      <Style Selector="^ /template/ ContentControl#Content">
+        <Setter Property="Foreground" Value="{DynamicResource CalendarViewTodayForeground}" />
+        <Setter Property="FontWeight" Value="SemiBold" />
+      </Style>
 
-        <Style Selector="^ /template/ ContentControl#Content">
-          <Setter Property="Foreground" Value="{DynamicResource CalendarViewTodayForeground}" />
-          <Setter Property="FontWeight" Value="SemiBold" />
+      <Style Selector="^:pointerover">
+        <Style Selector="^ /template/ Border#Border">
+          <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark1}" />
         </Style>
-
-        <Style Selector="^:pointerover">
-          <Style Selector="^ /template/ Border#Border">
-            <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark1}" />
-          </Style>
-          <Style Selector="^ /template/ Border#Root">
-            <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
-          </Style>
+        <Style Selector="^ /template/ Border#Root">
+          <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
         </Style>
+      </Style>
 
-        <Style Selector="^:pressed">
-          <Style Selector="^ /template/ Border#Border">
-            <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark2}" />
-          </Style>
-          
-          <Style Selector="^ /template/ Border#Root">
-            <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
-          </Style>
+      <Style Selector="^:pressed">
+        <Style Selector="^ /template/ Border#Border">
+          <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark2}" />
         </Style>
-      </Style>
 
-      <!-- WinUI calls this OutOfFocus -->
-      <Style Selector="^:inactive">
         <Style Selector="^ /template/ Border#Root">
-          <!-- These are probably set in code, but consistent -->
-          <Setter Property="Background" Value="{DynamicResource CalendarViewOutOfScopeBackground}"/>
-        </Style>
-        <Style Selector="^ /template/ ContentControl#Content">
-          <Setter Property="Foreground" Value="{DynamicResource CalendarViewOutOfScopeForeground}"/>
+          <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
         </Style>
       </Style>
+    </Style>
 
-      <Style Selector="^:blackout /template/ ContentControl#Content">
-        <Setter Property="Foreground" Value="{DynamicResource CalendarViewBlackoutForeground}" />
+    <!-- WinUI calls this OutOfFocus -->
+    <Style Selector="^:inactive">
+      <Style Selector="^ /template/ Border#Root">
+        <!-- These are probably set in code, but consistent -->
+        <Setter Property="Background" Value="{DynamicResource CalendarViewOutOfScopeBackground}"/>
       </Style>
-
-      <Style Selector="^:disabled /template/ ContentControl#Content">
-        <Setter Property="Foreground" Value="{DynamicResource CalendarViewWeekDayForegroundDisabled}" />
+      <Style Selector="^ /template/ ContentControl#Content">
+        <Setter Property="Foreground" Value="{DynamicResource CalendarViewOutOfScopeForeground}"/>
       </Style>
-    </ControlTheme>
+    </Style>
+
+    <Style Selector="^:blackout /template/ ContentControl#Content">
+      <Setter Property="Foreground" Value="{DynamicResource CalendarViewBlackoutForeground}" />
+    </Style>
+
+    <Style Selector="^:disabled /template/ ContentControl#Content">
+      <Setter Property="Foreground" Value="{DynamicResource CalendarViewWeekDayForegroundDisabled}" />
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From f66d9aca7a7c034ecdc6ec1565176790677c1c39 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 17:10:48 +0200
Subject: [PATCH 42/70] Formatted CalendarDayButton ControlTheme.

---
 .../Controls/CalendarDayButton.xaml           | 172 +++++++++---------
 1 file changed, 90 insertions(+), 82 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/CalendarDayButton.xaml b/src/Avalonia.Themes.Fluent/Controls/CalendarDayButton.xaml
index 9f476d51bc..dd2692cc5a 100644
--- a/src/Avalonia.Themes.Fluent/Controls/CalendarDayButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/CalendarDayButton.xaml
@@ -6,99 +6,107 @@
 -->
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTheme x:Key="{x:Type CalendarDayButton}" TargetType="CalendarDayButton">
-      <Setter Property="ClickMode" Value="Release" />
-      <Setter Property="MinWidth" Value="40" />
-      <Setter Property="MinHeight" Value="40" />
-      <Setter Property="Margin" Value="1" />
-      <Setter Property="Padding" Value="0,0,0,0" />
-      <!--These are actually set on the CalendarView in WinUI-->
-      <Setter Property="Foreground" Value="{DynamicResource CalendarViewCalendarItemForeground}" />
-      <Setter Property="Background" Value="{DynamicResource CalendarViewCalendarItemRevealBackground}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewCalendarItemRevealBorderBrush}" />
-      <Setter Property="BorderThickness" Value="2" />
-      <Setter Property="FontSize" Value="20" />
-      <Setter Property="ClipToBounds" Value="False" />
-      <Setter Property="HorizontalContentAlignment" Value="Center" />
-      <Setter Property="VerticalContentAlignment" Value="Center" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Panel>
-            <!-- To mimic WinUI SystemFocusVisual, Focus visual is drawn outside the bounds of the item -->
-            <Border Name="Root" Background="{TemplateBinding Background}"
-                    BorderThickness="0" ClipToBounds="True">
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <StackPanel Spacing="20">
+        <CalendarButton/>
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
 
-              <ContentControl Name="Content"
-                              ContentTemplate="{TemplateBinding ContentTemplate}"
-                              Content="{TemplateBinding Content}"
-                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                              FontSize="{TemplateBinding FontSize}"
-                              Margin="{TemplateBinding Padding}" />
-              
-            </Border>
-            
-            <!-- Drawn Border should render on top of background to preserve the 1px margin between items-->
-            <Border Name="Border"
-                    BorderThickness="2"
-                    BorderBrush="{TemplateBinding BorderBrush}" />
-          </Panel>
-        </ControlTemplate>
-      </Setter>
+  <ControlTheme x:Key="{x:Type CalendarDayButton}" TargetType="CalendarDayButton">
+    <Setter Property="ClickMode" Value="Release" />
+    <Setter Property="MinWidth" Value="40" />
+    <Setter Property="MinHeight" Value="40" />
+    <Setter Property="Margin" Value="1" />
+    <Setter Property="Padding" Value="0,0,0,0" />
+    <!--These are actually set on the CalendarView in WinUI-->
+    <Setter Property="Foreground" Value="{DynamicResource CalendarViewCalendarItemForeground}" />
+    <Setter Property="Background" Value="{DynamicResource CalendarViewCalendarItemRevealBackground}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewCalendarItemRevealBorderBrush}" />
+    <Setter Property="BorderThickness" Value="2" />
+    <Setter Property="FontSize" Value="20" />
+    <Setter Property="ClipToBounds" Value="False" />
+    <Setter Property="HorizontalContentAlignment" Value="Center" />
+    <Setter Property="VerticalContentAlignment" Value="Center" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Panel>
+          <!-- To mimic WinUI SystemFocusVisual, Focus visual is drawn outside the bounds of the item -->
+          <Border Name="Root" Background="{TemplateBinding Background}"
+                  BorderThickness="0" ClipToBounds="True">
 
+            <ContentControl Name="Content"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
+                            Content="{TemplateBinding Content}"
+                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                            FontSize="{TemplateBinding FontSize}"
+                            Margin="{TemplateBinding Padding}" />
+
+          </Border>
+
+          <!-- Drawn Border should render on top of background to preserve the 1px margin between items-->
+          <Border Name="Border"
+                  BorderThickness="2"
+                  BorderBrush="{TemplateBinding BorderBrush}" />
+        </Panel>
+      </ControlTemplate>
+    </Setter>
+
+    <Style Selector="^:pointerover /template/ Border#Border">
+      <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewHoverBorderBrush}" />
+    </Style>
+
+    <Style Selector="^:pressed /template/ Border#Border">
+      <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewPressedBorderBrush}" />
+    </Style>
+
+    <Style Selector="^:selected">
+      <Style Selector="^ /template/ Border#Border">
+        <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedBorderBrush}" />
+      </Style>
       <Style Selector="^:pointerover /template/ Border#Border">
-        <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewHoverBorderBrush}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedHoverBorderBrush}" />
       </Style>
-
       <Style Selector="^:pressed /template/ Border#Border">
-        <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewPressedBorderBrush}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedPressedBorderBrush}" />
       </Style>
+    </Style>
 
-      <Style Selector="^:selected">
-        <Style Selector="^ /template/ Border#Border">
-          <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedBorderBrush}" />
-        </Style>
-        <Style Selector="^:pointerover /template/ Border#Border">
-          <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedHoverBorderBrush}" />
-        </Style>
-        <Style Selector="^:pressed /template/ Border#Border">
-          <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedPressedBorderBrush}" />
-        </Style>
+    <Style Selector="^:today">
+      <Style Selector="^ /template/ Border#Root">
+        <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
       </Style>
-
-      <Style Selector="^:today">
-        <Style Selector="^ /template/ Border#Root">
-          <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
-        </Style>
-        <!-- These are probably set in code, but consistent -->
-        <Style Selector="^:pointerover /template/ Border#Border">
-          <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark1}" />
-        </Style>
-        <Style Selector="^:pressed /template/ Border#Border">
-          <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark2}" />
-        </Style>
-        <Style Selector="^ ContentControl#Content">
-          <Setter Property="Foreground" Value="{DynamicResource CalendarViewTodayForeground}" />
-          <Setter Property="FontWeight" Value="SemiBold" />
-        </Style>
+      <!-- These are probably set in code, but consistent -->
+      <Style Selector="^:pointerover /template/ Border#Border">
+        <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark1}" />
       </Style>
-
-      <!-- WinUI calls this OutOfFocus -->
-      <Style Selector="^:inactive">
-        <Style Selector="^ /template/ Border#Root">
-          <Setter Property="Background" Value="{DynamicResource CalendarViewOutOfScopeBackground}" />
-        </Style>
-        <Style Selector="^ /template/ ContentControl#Content">
-          <Setter Property="Foreground" Value="{DynamicResource CalendarViewOutOfScopeForeground}" />
-        </Style>
+      <Style Selector="^:pressed /template/ Border#Border">
+        <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark2}" />
       </Style>
-
-      <Style Selector="^:blackout /template/ ContentControl#Content">
-        <Setter Property="Foreground" Value="{DynamicResource CalendarViewBlackoutForeground}" />
+      <Style Selector="^ ContentControl#Content">
+        <Setter Property="Foreground" Value="{DynamicResource CalendarViewTodayForeground}" />
+        <Setter Property="FontWeight" Value="SemiBold" />
       </Style>
+    </Style>
 
-      <Style Selector="^:disabled /template/ ContentControl#Content">
-        <Setter Property="Foreground" Value="{DynamicResource CalendarViewWeekDayForegroundDisabled}" />
+    <!-- WinUI calls this OutOfFocus -->
+    <Style Selector="^:inactive">
+      <Style Selector="^ /template/ Border#Root">
+        <Setter Property="Background" Value="{DynamicResource CalendarViewOutOfScopeBackground}" />
       </Style>
-    </ControlTheme>
+      <Style Selector="^ /template/ ContentControl#Content">
+        <Setter Property="Foreground" Value="{DynamicResource CalendarViewOutOfScopeForeground}" />
+      </Style>
+    </Style>
+
+    <Style Selector="^:blackout /template/ ContentControl#Content">
+      <Setter Property="Foreground" Value="{DynamicResource CalendarViewBlackoutForeground}" />
+    </Style>
+
+    <Style Selector="^:disabled /template/ ContentControl#Content">
+      <Setter Property="Foreground" Value="{DynamicResource CalendarViewWeekDayForegroundDisabled}" />
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From 1e642fb3218d990cc8bbbe84e22c8f8d336ca52b Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 17:23:24 +0200
Subject: [PATCH 43/70] Tweaked CalendarItem ControlTheme.

---
 .../Controls/CalendarItem.xaml                | 276 +++++++++---------
 1 file changed, 143 insertions(+), 133 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/CalendarItem.xaml b/src/Avalonia.Themes.Fluent/Controls/CalendarItem.xaml
index f8fec58ef7..6914a0db08 100644
--- a/src/Avalonia.Themes.Fluent/Controls/CalendarItem.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/CalendarItem.xaml
@@ -6,145 +6,155 @@
 -->
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+        xmlns:sys="clr-namespace:System;assembly=netstandard"
         x:CompileBindings="True"
         x:DataType="CalendarItem">
-    <Design.PreviewWith>
-      <Border Padding="20">
-        <Calendar />
-      </Border>
-    </Design.PreviewWith>
-  
-    <ControlTheme x:Key="FluentCalendarItemButton" TargetType="Button">
-      <Setter Property="HorizontalAlignment" Value="Stretch" />
-      <Setter Property="VerticalAlignment" Value="Stretch" />
-      <Setter Property="VerticalContentAlignment" Value="Center" />
-      <Setter Property="FontSize" Value="20" />
-      <Setter Property="Background" Value="{DynamicResource CalendarViewNavigationButtonBackground}" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <!-- HCA was changed here to ensure nav arrows display correctly -->
-          <ContentPresenter Name="Text" Background="{TemplateBinding Background}"
-                            BorderBrush="{DynamicResource CalendarViewNavigationButtonBorderBrush}"
-                            BorderThickness="{TemplateBinding BorderThickness}"
-                            Content="{TemplateBinding Content}"
-                            Margin="{TemplateBinding Padding}"
-                            HorizontalContentAlignment="Stretch"
-                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
-        </ControlTemplate>
-      </Setter>
-      
-      <Style Selector="^:pointerover /template/ ContentPresenter#Text">
-        <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewNavigationButtonBorderBrushPointerOver}" />
-        <Setter Property="Foreground" Value="{DynamicResource CalendarViewNavigationButtonForegroundPointerOver}" />
-      </Style>
-      <Style Selector="^:pressed /template/ ContentPresenter#Text">
-        <Setter Property="Foreground" Value="{DynamicResource CalendarViewNavigationButtonForegroundPressed}" />
-      </Style>
-      <Style Selector="^:disabled /template/ ContentPresenter">
-        <Setter Property="Foreground" Value="{DynamicResource CalendarViewWeekDayForegroundDisabled}" />
-      </Style>
-    </ControlTheme>
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <Calendar DisplayDate="2000-01-01">
+        <Calendar.BlackoutDates>
+          <CalendarDateRange>
+            <x:Arguments>
+              <sys:DateTime>2000-01-01</sys:DateTime>
+              <sys:DateTime>2000-01-05</sys:DateTime>
+            </x:Arguments>
+          </CalendarDateRange>
+        </Calendar.BlackoutDates>
+      </Calendar>
+    </Border>
+  </Design.PreviewWith>
 
-    <ControlTheme x:Key="{x:Type CalendarItem}" TargetType="CalendarItem">
-      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-      <Setter Property="DayTitleTemplate">
-        <Template>
-          <TextBlock Text="{Binding}"
-                     HorizontalAlignment="Center"
-                     VerticalAlignment="Center"
-                     FontSize="12" />
-        </Template>
-      </Setter>
-      
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Border BorderThickness="{TemplateBinding BorderThickness}" 
-                  Background="{TemplateBinding Background}"
-                  BorderBrush="{TemplateBinding BorderBrush}"
-                  CornerRadius="{TemplateBinding CornerRadius}">
-            <!-- To keep calendar from resizing when switching DisplayMode
+  <ControlTheme x:Key="FluentCalendarButton" TargetType="Button">
+    <Setter Property="HorizontalAlignment" Value="Stretch" />
+    <Setter Property="VerticalAlignment" Value="Stretch" />
+    <Setter Property="VerticalContentAlignment" Value="Center" />
+    <Setter Property="FontSize" Value="20" />
+    <Setter Property="Background" Value="{DynamicResource CalendarViewNavigationButtonBackground}" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <!-- HCA was changed here to ensure nav arrows display correctly -->
+        <ContentPresenter Name="Text" Background="{TemplateBinding Background}"
+                          BorderBrush="{DynamicResource CalendarViewNavigationButtonBorderBrush}"
+                          BorderThickness="{TemplateBinding BorderThickness}"
+                          Content="{TemplateBinding Content}"
+                          Margin="{TemplateBinding Padding}"
+                          HorizontalContentAlignment="Stretch"
+                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
+      </ControlTemplate>
+    </Setter>
+
+    <Style Selector="^:pointerover /template/ ContentPresenter#Text">
+      <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewNavigationButtonBorderBrushPointerOver}" />
+      <Setter Property="Foreground" Value="{DynamicResource CalendarViewNavigationButtonForegroundPointerOver}" />
+    </Style>
+    <Style Selector="^:pressed /template/ ContentPresenter#Text">
+      <Setter Property="Foreground" Value="{DynamicResource CalendarViewNavigationButtonForegroundPressed}" />
+    </Style>
+    <Style Selector="^:disabled /template/ ContentPresenter">
+      <Setter Property="Foreground" Value="{DynamicResource CalendarViewWeekDayForegroundDisabled}" />
+    </Style>
+  </ControlTheme>
+
+  <ControlTheme x:Key="{x:Type CalendarItem}" TargetType="CalendarItem">
+    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+    <Setter Property="DayTitleTemplate">
+      <Template>
+        <TextBlock Text="{Binding}"
+                   HorizontalAlignment="Center"
+                   VerticalAlignment="Center"
+                   FontSize="12" />
+      </Template>
+    </Setter>
+
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border BorderThickness="{TemplateBinding BorderThickness}"
+                Background="{TemplateBinding Background}"
+                BorderBrush="{TemplateBinding BorderBrush}"
+                CornerRadius="{TemplateBinding CornerRadius}">
+          <!-- To keep calendar from resizing when switching DisplayMode
                  In WinUI Min-Width from TemplateSettings
                  basically...MinWidth of DayItem = 40, 40 * 7 = 280 + margins/padding = ~294
                  Viewport height is set from # of rows displayed (2-8) in Month mode, = ~290 for 6 weeks (+ day names)
                  -->
-            <Grid VerticalAlignment="Stretch" HorizontalAlignment="Stretch" RowDefinitions="40,*" MinWidth="294">
-              <Grid ColumnDefinitions="5*,*,*">
-                <Button Name="HeaderButton" 
-                        Theme="{StaticResource FluentCalendarItemButton}"
-                        Foreground="{TemplateBinding Foreground}"
-                        Padding="12,0,0,0"
-                        HorizontalContentAlignment="Left" />
-                <Button Name="PreviousButton"
-                        Grid.Column="1"
-                        Theme="{StaticResource FluentCalendarItemButton}"
-                        Foreground="{TemplateBinding Foreground}"
-                        Padding="1"
-                        HorizontalContentAlignment="Left">
-                  <!--Path mimics Segoe MDL2 Assets font glyph used in WinUI-->
-                  <Path StrokeThickness="1.5" Data="M 0,9 L 9,0 L 18,9" HorizontalAlignment="Center" VerticalAlignment="Center" />
-                </Button>
-                <Button Name="NextButton"
-                        Grid.Column="2"
-                        Theme="{StaticResource FluentCalendarItemButton}"
-                        Foreground="{TemplateBinding Foreground}" 
-                        Padding="1"
-                        HorizontalContentAlignment="Left">
-                  <!--Path mimics Segoe MDL2 Assets font glyph used in WinUI-->
-                  <Path StrokeThickness="1.5" Data="M 0,0 L 9,9 L 18,0" HorizontalAlignment="Center" VerticalAlignment="Center" />
-                </Button>
-              </Grid>
-              <!--Border below is used only for MonthView but it can't be moved inside of Grid because CalendarItem expects it to be empty and it will cause side-effects-->
-              <Border Name="BackgroundLayer" Background="{TemplateBinding BorderBrush}" Margin="0,38,0,0" IsVisible="{ReflectionBinding #MonthView.IsVisible}" Grid.Row="1" />
-              <Grid Name="MonthView" Grid.Row="1" IsVisible="False" MinHeight="290">
-                <Grid.RowDefinitions>
-                  <!--This should always be the week day names??-->
-                  <RowDefinition Height="38" />
-                  <RowDefinition Height="Auto" />
-                  <RowDefinition Height="Auto" />
-                  <RowDefinition Height="Auto" />
-                  <RowDefinition Height="Auto" />
-                  <RowDefinition Height="Auto" />
-                  <RowDefinition Height="Auto" />
-                </Grid.RowDefinitions>
-                <Grid.ColumnDefinitions>
-                  <ColumnDefinition Width="Auto" />
-                  <ColumnDefinition Width="Auto" />
-                  <ColumnDefinition Width="Auto" />
-                  <ColumnDefinition Width="Auto" />
-                  <ColumnDefinition Width="Auto" />
-                  <ColumnDefinition Width="Auto" />
-                  <ColumnDefinition Width="Auto" />
-                </Grid.ColumnDefinitions>
-              </Grid>
-              <Grid Name="YearView"
-                    Background="{TemplateBinding BorderBrush}"
-                    MinHeight="290"
-                    Grid.Row="1"
-                    IsVisible="False">
-                <Grid.RowDefinitions>
-                  <RowDefinition Height="*" />
-                  <RowDefinition Height="*" />
-                  <RowDefinition Height="*" />
-                </Grid.RowDefinitions>
-                <Grid.ColumnDefinitions>
-                  <ColumnDefinition Width="*" />
-                  <ColumnDefinition Width="*" />
-                  <ColumnDefinition Width="*" />
-                  <ColumnDefinition Width="*" />
-                </Grid.ColumnDefinitions>
-              </Grid>
+          <Grid VerticalAlignment="Stretch" HorizontalAlignment="Stretch" RowDefinitions="40,*" MinWidth="294">
+            <Grid ColumnDefinitions="5*,*,*">
+              <Button Name="HeaderButton"
+                      Theme="{StaticResource FluentCalendarButton}"
+                      Foreground="{TemplateBinding Foreground}"
+                      Padding="12,0,0,0"
+                      HorizontalContentAlignment="Left" />
+              <Button Name="PreviousButton"
+                      Grid.Column="1"
+                      Theme="{StaticResource FluentCalendarButton}"
+                      Foreground="{TemplateBinding Foreground}"
+                      Padding="1"
+                      HorizontalContentAlignment="Left">
+                <!--Path mimics Segoe MDL2 Assets font glyph used in WinUI-->
+                <Path StrokeThickness="1.5" Data="M 0,9 L 9,0 L 18,9" HorizontalAlignment="Center" VerticalAlignment="Center" />
+              </Button>
+              <Button Name="NextButton"
+                      Grid.Column="2"
+                      Theme="{StaticResource FluentCalendarButton}"
+                      Foreground="{TemplateBinding Foreground}"
+                      Padding="1"
+                      HorizontalContentAlignment="Left">
+                <!--Path mimics Segoe MDL2 Assets font glyph used in WinUI-->
+                <Path StrokeThickness="1.5" Data="M 0,0 L 9,9 L 18,0" HorizontalAlignment="Center" VerticalAlignment="Center" />
+              </Button>
+            </Grid>
+            <!--Border below is used only for MonthView but it can't be moved inside of Grid because CalendarItem expects it to be empty and it will cause side-effects-->
+            <Border Name="BackgroundLayer" Background="{TemplateBinding BorderBrush}" Margin="0,38,0,0" IsVisible="{ReflectionBinding #MonthView.IsVisible}" Grid.Row="1" />
+            <Grid Name="MonthView" Grid.Row="1" IsVisible="False" MinHeight="290">
+              <Grid.RowDefinitions>
+                <!--This should always be the week day names??-->
+                <RowDefinition Height="38" />
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="Auto" />
+              </Grid.RowDefinitions>
+              <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="Auto" />
+                <ColumnDefinition Width="Auto" />
+                <ColumnDefinition Width="Auto" />
+                <ColumnDefinition Width="Auto" />
+                <ColumnDefinition Width="Auto" />
+                <ColumnDefinition Width="Auto" />
+                <ColumnDefinition Width="Auto" />
+              </Grid.ColumnDefinitions>
+            </Grid>
+            <Grid Name="YearView"
+                  Background="{TemplateBinding BorderBrush}"
+                  MinHeight="290"
+                  Grid.Row="1"
+                  IsVisible="False">
+              <Grid.RowDefinitions>
+                <RowDefinition Height="*" />
+                <RowDefinition Height="*" />
+                <RowDefinition Height="*" />
+              </Grid.RowDefinitions>
+              <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="*" />
+                <ColumnDefinition Width="*" />
+                <ColumnDefinition Width="*" />
+                <ColumnDefinition Width="*" />
+              </Grid.ColumnDefinitions>
             </Grid>
-          </Border>
-        </ControlTemplate>
-      </Setter>
-      <Style Selector="^ /template/ Button > Path">
-        <Setter Property="Stroke" Value="{DynamicResource CalendarViewForeground}" />
-      </Style>
-      <Style Selector="^ /template/ Button:pointerover > Path">
-        <Setter Property="Stroke" Value="{DynamicResource CalendarViewNavigationButtonForegroundPointerOver}" />
-      </Style>
-      <Style Selector="^ /template/ Button:pressed > Path">
-        <Setter Property="Stroke" Value="{DynamicResource CalendarViewNavigationButtonForegroundPressed}" />
-      </Style>
-    </ControlTheme>
+          </Grid>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+    <Style Selector="^ /template/ Button > Path">
+      <Setter Property="Stroke" Value="{DynamicResource CalendarViewForeground}" />
+    </Style>
+    <Style Selector="^ /template/ Button:pointerover > Path">
+      <Setter Property="Stroke" Value="{DynamicResource CalendarViewNavigationButtonForegroundPointerOver}" />
+    </Style>
+    <Style Selector="^ /template/ Button:pressed > Path">
+      <Setter Property="Stroke" Value="{DynamicResource CalendarViewNavigationButtonForegroundPressed}" />
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From f6e8dda027e159820f744a03ebff8cca80d1c998 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 17:26:17 +0200
Subject: [PATCH 44/70] Formatted CalendarDatePicker ControlTheme.

---
 .../Controls/CalendarDatePicker.xaml          | 328 +++++++++---------
 1 file changed, 163 insertions(+), 165 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/CalendarDatePicker.xaml b/src/Avalonia.Themes.Fluent/Controls/CalendarDatePicker.xaml
index eefd9e9b51..54f6a200b8 100644
--- a/src/Avalonia.Themes.Fluent/Controls/CalendarDatePicker.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/CalendarDatePicker.xaml
@@ -2,179 +2,177 @@
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                     xmlns:sys="clr-namespace:System;assembly=netstandard"
                     x:CompileBindings="True">
-    <Design.PreviewWith>
-      <Border Margin="20, 20, 20, 200">
-        <CalendarDatePicker Width="200" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" />
-      </Border>
-    </Design.PreviewWith>
-  
-    <x:Double x:Key="CalendarDatePickerCurrentDayFontSize">12</x:Double>
-    <x:Double x:Key="CalendarDatePickerMinHeight">32</x:Double>
+  <Design.PreviewWith>
+    <Border Margin="20, 20, 20, 200">
+      <CalendarDatePicker Width="200" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" />
+    </Border>
+  </Design.PreviewWith>
 
-    <ControlTheme x:Key="FluentCalendarDatePickerButton" TargetType="Button">
-      <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerCalendarGlyphForeground}" />
-      <Setter Property="Margin" Value="2,0,4,0" />
-      <Setter Property="Width" Value="20" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Grid Height="24"
-                Width="20"
-                HorizontalAlignment="Center"
-                VerticalAlignment="Center"
-                Margin="0"
-                ColumnDefinitions="*,*,*,*"
-                RowDefinitions="23*,19*,19*,19*"
-                ClipToBounds="False">
-            <Border Name="Background"
-                    Margin="0,-1,0,0"
-                    Grid.ColumnSpan="4"
-                    Grid.Row="1"
-                    Grid.RowSpan="3"
-                    BorderThickness="0.5,0,0.5,0.5"
-                    BorderBrush="{TemplateBinding Foreground}"
-                    CornerRadius="0,0,2,2" />
-            <Border Grid.ColumnSpan="4"
-                    Grid.RowSpan="1"
-                    BorderBrush="{TemplateBinding Foreground}"
-                    BorderThickness="0.5"
-                    CornerRadius="2,2,0,0" />
-            <TextBlock Margin="0,-1,0,0"
-                       VerticalAlignment="Center"
-                       HorizontalAlignment="Center"
-                       Grid.Column="0"
-                       Grid.Row="1"
-                       Grid.ColumnSpan="4"
-                       Grid.RowSpan="3"
-                       Foreground="{TemplateBinding Foreground}"
-                       FontSize="{DynamicResource CalendarDatePickerCurrentDayFontSize}"
-                       Text="{Binding Source={x:Static sys:DateTime.Today}, Path=Day}" />
-            <Ellipse HorizontalAlignment="Center"
+  <x:Double x:Key="CalendarDatePickerCurrentDayFontSize">12</x:Double>
+  <x:Double x:Key="CalendarDatePickerMinHeight">32</x:Double>
+
+  <ControlTheme x:Key="FluentCalendarDatePickerButton" TargetType="Button">
+    <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerCalendarGlyphForeground}" />
+    <Setter Property="Margin" Value="2,0,4,0" />
+    <Setter Property="Width" Value="20" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Grid Height="24"
+              Width="20"
+              HorizontalAlignment="Center"
+              VerticalAlignment="Center"
+              Margin="0"
+              ColumnDefinitions="*,*,*,*"
+              RowDefinitions="23*,19*,19*,19*"
+              ClipToBounds="False">
+          <Border Name="Background"
+                  Margin="0,-1,0,0"
+                  Grid.ColumnSpan="4"
+                  Grid.Row="1"
+                  Grid.RowSpan="3"
+                  BorderThickness="0.5,0,0.5,0.5"
+                  BorderBrush="{TemplateBinding Foreground}"
+                  CornerRadius="0,0,2,2" />
+          <Border Grid.ColumnSpan="4"
+                  Grid.RowSpan="1"
+                  BorderBrush="{TemplateBinding Foreground}"
+                  BorderThickness="0.5"
+                  CornerRadius="2,2,0,0" />
+          <TextBlock Margin="0,-1,0,0"
                      VerticalAlignment="Center"
-                     Fill="{TemplateBinding Foreground}"
-                     StrokeThickness="0"
+                     HorizontalAlignment="Center"
+                     Grid.Column="0"
+                     Grid.Row="1"
                      Grid.ColumnSpan="4"
-                     Width="3"
-                     Height="3" />
-          </Grid>
-        </ControlTemplate>
-      </Setter>
-    </ControlTheme>
-    
-    <ControlTheme x:Key="{x:Type CalendarDatePicker}" TargetType="CalendarDatePicker">
-      <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackground}" />
-      <Setter Property="Foreground" Value="{DynamicResource CalendarDatePickerForeground}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrush}" />
-      <Setter Property="BorderThickness" Value="{DynamicResource CalendarDatePickerBorderThemeThickness}" />
-      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-      <Setter Property="MinHeight" Value="{DynamicResource CalendarDatePickerMinHeight}" />
-      <Setter Property="HorizontalAlignment" Value="Left" />
-      <Setter Property="VerticalAlignment" Value="Center" />
-      <Setter Property="HorizontalContentAlignment" Value="Left" />
-      <Setter Property="VerticalContentAlignment" Value="Center" />
-      <Setter Property="Padding" Value="4" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <DataValidationErrors>
-            <Panel x:Name="LayoutRoot"
-                   HorizontalAlignment="Stretch"
-                   VerticalAlignment="Stretch">
-              <Border x:Name="Background"
-                      CornerRadius="{TemplateBinding CornerRadius}"
-                      BorderThickness="{TemplateBinding BorderThickness}"
-                      BorderBrush="{TemplateBinding BorderBrush}"
-                      Background="{TemplateBinding Background}" />
-              <Grid ColumnDefinitions="*,Auto">
-                <TextBox Name="PART_TextBox"
-                         Foreground="{TemplateBinding Foreground}"
-                         Background="Transparent"
-                         BorderBrush="Transparent"
-                         BorderThickness="0"
-                         CornerRadius="{TemplateBinding CornerRadius}"
-                         Margin="{TemplateBinding BorderThickness}"
-                         Padding="{TemplateBinding Padding}"
-                         Watermark="{TemplateBinding Watermark}"
-                         UseFloatingWatermark="{TemplateBinding UseFloatingWatermark}"
-                         HorizontalAlignment="Stretch"
-                         VerticalAlignment="Stretch"
-                         VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                         HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                         Grid.Column="0">
-                  <TextBox.Styles>
-                    <Style Selector="TextBox#PART_TextBox:focus /template/ Border#PART_BorderElement">
-                      <!-- By default the TextBox has its own focused state, override this to disable it here -->
-                      <Setter Property="Background" Value="Transparent"/>
-                      <Setter Property="BorderBrush" Value="Transparent"/>
-                      <Setter Property="BorderThickness" Value="0" />
+                     Grid.RowSpan="3"
+                     Foreground="{TemplateBinding Foreground}"
+                     FontSize="{DynamicResource CalendarDatePickerCurrentDayFontSize}"
+                     Text="{Binding Source={x:Static sys:DateTime.Today}, Path=Day}" />
+          <Ellipse HorizontalAlignment="Center"
+                   VerticalAlignment="Center"
+                   Fill="{TemplateBinding Foreground}"
+                   StrokeThickness="0"
+                   Grid.ColumnSpan="4"
+                   Width="3"
+                   Height="3" />
+        </Grid>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
+
+  <ControlTheme x:Key="{x:Type CalendarDatePicker}" TargetType="CalendarDatePicker">
+    <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackground}" />
+    <Setter Property="Foreground" Value="{DynamicResource CalendarDatePickerForeground}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrush}" />
+    <Setter Property="BorderThickness" Value="{DynamicResource CalendarDatePickerBorderThemeThickness}" />
+    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+    <Setter Property="MinHeight" Value="{DynamicResource CalendarDatePickerMinHeight}" />
+    <Setter Property="HorizontalAlignment" Value="Left" />
+    <Setter Property="VerticalAlignment" Value="Center" />
+    <Setter Property="HorizontalContentAlignment" Value="Left" />
+    <Setter Property="VerticalContentAlignment" Value="Center" />
+    <Setter Property="Padding" Value="4" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <DataValidationErrors>
+          <Panel x:Name="LayoutRoot"
+                 HorizontalAlignment="Stretch"
+                 VerticalAlignment="Stretch">
+            <Border x:Name="Background"
+                    CornerRadius="{TemplateBinding CornerRadius}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    Background="{TemplateBinding Background}" />
+            <Grid ColumnDefinitions="*,Auto">
+              <TextBox Name="PART_TextBox"
+                       Foreground="{TemplateBinding Foreground}"
+                       Background="Transparent"
+                       BorderBrush="Transparent"
+                       BorderThickness="0"
+                       CornerRadius="{TemplateBinding CornerRadius}"
+                       Margin="{TemplateBinding BorderThickness}"
+                       Padding="{TemplateBinding Padding}"
+                       Watermark="{TemplateBinding Watermark}"
+                       UseFloatingWatermark="{TemplateBinding UseFloatingWatermark}"
+                       HorizontalAlignment="Stretch"
+                       VerticalAlignment="Stretch"
+                       VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                       HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                       Grid.Column="0">
+                <TextBox.Styles>
+                  <Style Selector="TextBox#PART_TextBox:focus /template/ Border#PART_BorderElement">
+                    <!-- By default the TextBox has its own focused state, override this to disable it here -->
+                    <Setter Property="Background" Value="Transparent"/>
+                    <Setter Property="BorderBrush" Value="Transparent"/>
+                    <Setter Property="BorderThickness" Value="0" />
+                  </Style>
+                  <Style Selector="TextBox#PART_TextBox:disabled">
+                    <Style Selector="^ /template/ Border#PART_BorderElement">
+                      <!-- By default the TextBox has its own disabled state, override this to make the border background show through -->
+                      <Setter Property="Background" Value="Transparent" />
+                      <Setter Property="BorderBrush" Value="Transparent" />
                     </Style>
-                    <Style Selector="TextBox#PART_TextBox:disabled">
-                      <Style Selector="^ /template/ Border#PART_BorderElement">
-                        <!-- By default the TextBox has its own disabled state, override this to make the border background show through -->
-                        <Setter Property="Background" Value="Transparent" />
-                        <Setter Property="BorderBrush" Value="Transparent" />
-                      </Style>
-                      <Style Selector="^ /template/ TextBlock#PART_Watermark, ^ TextBlock#PART_FloatingWatermark">
-                        <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerTextForegroundDisabled}" />
-                      </Style>
+                    <Style Selector="^ /template/ TextBlock#PART_Watermark, ^ TextBlock#PART_FloatingWatermark">
+                      <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerTextForegroundDisabled}" />
                     </Style>
-                  </TextBox.Styles>
-                </TextBox>
-                <Button Name="PART_Button" 
-                        Theme="{StaticResource FluentCalendarDatePickerButton}"
-                        Grid.Column="1"
-                        Focusable="False" />
-                <Popup Name="PART_Popup"
-                       PlacementTarget="{TemplateBinding}"
-                       IsLightDismissEnabled="True">
-                  <Calendar Name="PART_Calendar" 
-                            FirstDayOfWeek="{TemplateBinding FirstDayOfWeek}" 
-                            IsTodayHighlighted="{TemplateBinding IsTodayHighlighted}"
-                            SelectedDate="{TemplateBinding SelectedDate, Mode=TwoWay}"
-                            DisplayDate="{TemplateBinding DisplayDate}" 
-                            DisplayDateStart="{TemplateBinding DisplayDateStart}"
-                            DisplayDateEnd="{TemplateBinding DisplayDateEnd}" />
-                </Popup>
-              </Grid>
-            </Panel>
-          </DataValidationErrors>
-        </ControlTemplate>
-      </Setter>
-     
-      <!-- Pressed State -->
-      <Style Selector="^:pressed /template/ Border#Background">
-        <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackgroundPressed}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrushPressed}" />
-      </Style>
-      
-      <!-- Pointer-over State -->
-      <Style Selector="^:pointerover /template/ Border#Background">
-        <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackgroundPointerOver}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrushPointerOver}" />
-      </Style>
+                  </Style>
+                </TextBox.Styles>
+              </TextBox>
+              <Button Name="PART_Button"
+                      Theme="{StaticResource FluentCalendarDatePickerButton}"
+                      Grid.Column="1"
+                      Focusable="False" />
+              <Popup Name="PART_Popup"
+                     PlacementTarget="{TemplateBinding}"
+                     IsLightDismissEnabled="True">
+                <Calendar Name="PART_Calendar"
+                          FirstDayOfWeek="{TemplateBinding FirstDayOfWeek}"
+                          IsTodayHighlighted="{TemplateBinding IsTodayHighlighted}"
+                          SelectedDate="{TemplateBinding SelectedDate, Mode=TwoWay}"
+                          DisplayDate="{TemplateBinding DisplayDate}"
+                          DisplayDateStart="{TemplateBinding DisplayDateStart}"
+                          DisplayDateEnd="{TemplateBinding DisplayDateEnd}" />
+              </Popup>
+            </Grid>
+          </Panel>
+        </DataValidationErrors>
+      </ControlTemplate>
+    </Setter>
 
-      <!-- Disabled State -->
-      <Style Selector="^:disabled">
-        <Style Selector="^ /template/ Border#Background">
-          <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackgroundDisabled}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrushDisabled}" />
-        </Style>
-        
-        <Style Selector="^ /template/ Button#PART_Button">
-          <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerCalendarGlyphForegroundDisabled}" />
-        </Style>
+    <!-- Pressed State -->
+    <Style Selector="^:pressed /template/ Border#Background">
+      <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackgroundPressed}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrushPressed}" />
+    </Style>
 
-      </Style>
+    <!-- Pointer-over State -->
+    <Style Selector="^:pointerover /template/ Border#Background">
+      <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackgroundPointerOver}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrushPointerOver}" />
+    </Style>
 
-      <!-- Focused State -->
-      <Style Selector="^:focus-within:not(CalendarDatePicker:focus) /template/ Border#Background">
-        <Setter Property="Background" Value="{DynamicResource TextControlBackgroundFocused}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrushFocused}" />
-        <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThicknessFocused}" />
+    <!-- Disabled State -->
+    <Style Selector="^:disabled">
+      <Style Selector="^ /template/ Border#Background">
+        <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackgroundDisabled}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrushDisabled}" />
       </Style>
-      
-      <!-- Error State -->
-      <Style Selector="^:error /template/ Border#Background">
-        <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
+
+      <Style Selector="^ /template/ Button#PART_Button">
+        <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerCalendarGlyphForegroundDisabled}" />
       </Style>
-    </ControlTheme>
-  
+    </Style>
+
+    <!-- Focused State -->
+    <Style Selector="^:focus-within:not(CalendarDatePicker:focus) /template/ Border#Background">
+      <Setter Property="Background" Value="{DynamicResource TextControlBackgroundFocused}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrushFocused}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThicknessFocused}" />
+    </Style>
+
+    <!-- Error State -->
+    <Style Selector="^:error /template/ Border#Background">
+      <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From 902955dd0a7cf62ae5c5d4766db9f098bff5c388 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 17:27:20 +0200
Subject: [PATCH 45/70] Formatted Carousel ControlTheme.

---
 .../Controls/Carousel.xaml                    | 34 +++++++++----------
 1 file changed, 17 insertions(+), 17 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/Carousel.xaml b/src/Avalonia.Themes.Fluent/Controls/Carousel.xaml
index 6c05a62250..2cac701e1b 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Carousel.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Carousel.xaml
@@ -1,20 +1,20 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTheme x:Key="{x:Type Carousel}" TargetType="Carousel">
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Border Background="{TemplateBinding Background}"
-                  BorderBrush="{TemplateBinding BorderBrush}"
-                  BorderThickness="{TemplateBinding BorderThickness}"
-                  CornerRadius="{TemplateBinding CornerRadius}">
-            <CarouselPresenter IsVirtualized="{TemplateBinding IsVirtualized}"
-                               Items="{TemplateBinding Items}"
-                               ItemsPanel="{TemplateBinding ItemsPanel}"
-                               Margin="{TemplateBinding Padding}"
-                               SelectedIndex="{TemplateBinding SelectedIndex}"
-                               PageTransition="{TemplateBinding PageTransition}"/>
-          </Border>
-        </ControlTemplate>
-      </Setter>
-    </ControlTheme>
+  <ControlTheme x:Key="{x:Type Carousel}" TargetType="Carousel">
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Background="{TemplateBinding Background}"
+                BorderBrush="{TemplateBinding BorderBrush}"
+                BorderThickness="{TemplateBinding BorderThickness}"
+                CornerRadius="{TemplateBinding CornerRadius}">
+          <CarouselPresenter IsVirtualized="{TemplateBinding IsVirtualized}"
+                             Items="{TemplateBinding Items}"
+                             ItemsPanel="{TemplateBinding ItemsPanel}"
+                             Margin="{TemplateBinding Padding}"
+                             SelectedIndex="{TemplateBinding SelectedIndex}"
+                             PageTransition="{TemplateBinding PageTransition}"/>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>

From 0647492701663bba1cdb9ccdaa9a0cc27d352b4a Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 17:28:39 +0200
Subject: [PATCH 46/70] Formatted ContextMenu ControlTheme.

---
 .../Controls/ContextMenu.xaml                 | 132 +++++++++---------
 1 file changed, 65 insertions(+), 67 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/ContextMenu.xaml b/src/Avalonia.Themes.Fluent/Controls/ContextMenu.xaml
index fe0f0f3f6c..8365ee61d3 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ContextMenu.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ContextMenu.xaml
@@ -1,72 +1,70 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Design.PreviewWith>
-      <Border Background="{DynamicResource SystemAccentColor}"
-              Margin="16"
-              Padding="48"
-              Width="400"
-              Height="200">
-        <Border.ContextMenu>
-          <ContextMenu>
-            <MenuItem Header="Standard _Menu Item" />
-            <MenuItem Header="Disabled"
-                      IsEnabled="False" />
-            <Separator />
-            <MenuItem Header="Menu with _Submenu">
-              <MenuItem Header="Submenu _1" />
-              <MenuItem Header="Submenu _2" />
-            </MenuItem>
-            <MenuItem Header="Menu Item with _Icon" />
-            <MenuItem Header="Menu Item with _Checkbox">
-              <MenuItem.Icon>
-                <CheckBox BorderThickness="0"
-                          IsHitTestVisible="False"
-                          IsChecked="True" />
-              </MenuItem.Icon>
-            </MenuItem>
-          </ContextMenu>
-        </Border.ContextMenu>
-        <TextBlock Text="Defined in XAML" />
-      </Border>
-    </Design.PreviewWith>
+  <Design.PreviewWith>
+    <Border Background="{DynamicResource SystemAccentColor}"
+            Margin="16"
+            Padding="48"
+            Width="400"
+            Height="200">
+      <Border.ContextMenu>
+        <ContextMenu>
+          <MenuItem Header="Standard _Menu Item" />
+          <MenuItem Header="Disabled" IsEnabled="False" />
+          <Separator />
+          <MenuItem Header="Menu with _Submenu">
+            <MenuItem Header="Submenu _1" />
+            <MenuItem Header="Submenu _2" />
+          </MenuItem>
+          <MenuItem Header="Menu Item with _Icon" />
+          <MenuItem Header="Menu Item with _Checkbox">
+            <MenuItem.Icon>
+              <CheckBox BorderThickness="0"
+                        IsHitTestVisible="False"
+                        IsChecked="True" />
+            </MenuItem.Icon>
+          </MenuItem>
+        </ContextMenu>
+      </Border.ContextMenu>
+      <TextBlock Text="Defined in XAML" />
+    </Border>
+  </Design.PreviewWith>
 
-    <!-- Added missing resource -->
-    <Thickness x:Key="MenuFlyoutScrollerMargin">0,4,0,4</Thickness>
-
-    <ControlTheme x:Key="{x:Type ContextMenu}" TargetType="ContextMenu">
-      <Setter Property="Background" Value="{DynamicResource MenuFlyoutPresenterBackground}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource MenuFlyoutPresenterBorderBrush}" />
-      <Setter Property="BorderThickness" Value="{DynamicResource MenuFlyoutPresenterBorderThemeThickness}" />
-      <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
-      <Setter Property="MaxWidth" Value="{DynamicResource FlyoutThemeMaxWidth}" />
-      <Setter Property="MinHeight" Value="{DynamicResource MenuFlyoutThemeMinHeight}" />
-      <Setter Property="Padding" Value="{DynamicResource MenuFlyoutPresenterThemePadding}" />
-      <Setter Property="HorizontalAlignment" Value="Stretch" />
-      <Setter Property="TextBlock.FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-      <Setter Property="TextBlock.FontWeight" Value="Normal" />
-      <Setter Property="WindowManagerAddShadowHint" Value="False" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Border Background="{TemplateBinding Background}"
-                  BorderBrush="{TemplateBinding BorderBrush}"
-                  BorderThickness="{TemplateBinding BorderThickness}"
-                  Padding="{TemplateBinding Padding}"
-                  MaxWidth="{TemplateBinding MaxWidth}"
-                  MinHeight="{TemplateBinding MinHeight}"
-                  HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
-                  CornerRadius="{TemplateBinding CornerRadius}">
-            <ScrollViewer Classes="menuscroller">
-              <ItemsPresenter Name="PART_ItemsPresenter"
-                              Items="{TemplateBinding Items}"
-                              ItemsPanel="{TemplateBinding ItemsPanel}"
-                              ItemTemplate="{TemplateBinding ItemTemplate}"
-                              Margin="{DynamicResource MenuFlyoutScrollerMargin}"
-                              KeyboardNavigation.TabNavigation="Continue"
-                              Grid.IsSharedSizeScope="True" />
-            </ScrollViewer>
-          </Border>
-        </ControlTemplate>
-      </Setter>
-    </ControlTheme>
+  <!-- Added missing resource -->
+  <Thickness x:Key="MenuFlyoutScrollerMargin">0,4,0,4</Thickness>
 
+  <ControlTheme x:Key="{x:Type ContextMenu}" TargetType="ContextMenu">
+    <Setter Property="Background" Value="{DynamicResource MenuFlyoutPresenterBackground}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource MenuFlyoutPresenterBorderBrush}" />
+    <Setter Property="BorderThickness" Value="{DynamicResource MenuFlyoutPresenterBorderThemeThickness}" />
+    <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
+    <Setter Property="MaxWidth" Value="{DynamicResource FlyoutThemeMaxWidth}" />
+    <Setter Property="MinHeight" Value="{DynamicResource MenuFlyoutThemeMinHeight}" />
+    <Setter Property="Padding" Value="{DynamicResource MenuFlyoutPresenterThemePadding}" />
+    <Setter Property="HorizontalAlignment" Value="Stretch" />
+    <Setter Property="TextBlock.FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="TextBlock.FontWeight" Value="Normal" />
+    <Setter Property="WindowManagerAddShadowHint" Value="False" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Background="{TemplateBinding Background}"
+                BorderBrush="{TemplateBinding BorderBrush}"
+                BorderThickness="{TemplateBinding BorderThickness}"
+                Padding="{TemplateBinding Padding}"
+                MaxWidth="{TemplateBinding MaxWidth}"
+                MinHeight="{TemplateBinding MinHeight}"
+                HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
+                CornerRadius="{TemplateBinding CornerRadius}">
+          <ScrollViewer Classes="menuscroller">
+            <ItemsPresenter Name="PART_ItemsPresenter"
+                            Items="{TemplateBinding Items}"
+                            ItemsPanel="{TemplateBinding ItemsPanel}"
+                            ItemTemplate="{TemplateBinding ItemTemplate}"
+                            Margin="{DynamicResource MenuFlyoutScrollerMargin}"
+                            KeyboardNavigation.TabNavigation="Continue"
+                            Grid.IsSharedSizeScope="True" />
+          </ScrollViewer>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+  </ControlTheme>
 </ResourceDictionary>

From fbe983b6042fd6a8c4bd727545bd600e8dd7c077 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 21:12:26 +0200
Subject: [PATCH 47/70] Ported TextBox to ControlTheme.

---
 .../Controls/FluentControls.xaml              |   2 +-
 .../Controls/TextBox.xaml                     | 361 ++++++++----------
 2 files changed, 166 insertions(+), 197 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
index d344fedf0a..0b5f6a4a72 100644
--- a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
@@ -41,6 +41,7 @@
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabItem.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabStrip.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabStripItem.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TextBox.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ToggleButton.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ToggleSwitch.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ToolTip.xaml" />
@@ -66,7 +67,6 @@
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/FocusAdorner.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/MenuItem.xaml" />
     <!--  TabControl needs to come after TabStrip as it redefines the inner TabStrip.ItemsPanel  -->
-    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TextBox.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TreeViewItem.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitButton.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitView.xaml" />
diff --git a/src/Avalonia.Themes.Fluent/Controls/TextBox.xaml b/src/Avalonia.Themes.Fluent/Controls/TextBox.xaml
index 0fd3758d77..17c69da8fd 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TextBox.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TextBox.xaml
@@ -1,36 +1,100 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        x:CompileBindings="True">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    x:CompileBindings="True">
   <Design.PreviewWith>
     <Border Padding="20">
-      <TextBox Text="Sample"
-               FontSize="20"
-               Width="100"
-               Classes="clearButton"
-               TextAlignment="Center"/>
+      <StackPanel Spacing="20">
+        <TextBox>Left</TextBox>
+        <TextBox TextAlignment="Center">Center</TextBox>
+        <TextBox Classes="clearButton">Clear</TextBox>
+        <TextBox PasswordChar="*" Classes="revealPasswordButton">Reveal Password</TextBox>
+        <TextBox PasswordChar="*" Classes="revealPasswordButton" RevealPassword="True">Password Revealed</TextBox>
+        <TextBox Watermark="Watermark"/>
+        <TextBox Watermark="Floating Watermark" UseFloatingWatermark="True"/>
+        <TextBox Watermark="Floating Watermark" UseFloatingWatermark="True">Content</TextBox>
+      </StackPanel>
     </Border>
   </Design.PreviewWith>
 
-  <Styles.Resources>
-    <Thickness x:Key="TextBoxTopHeaderMargin">0,0,0,4</Thickness>
-    <StreamGeometry x:Key="TextBoxClearButtonData">M 11.416016,10 20,1.4160156 18.583984,0 10,8.5839846 1.4160156,0 0,1.4160156 8.5839844,10 0,18.583985 1.4160156,20 10,11.416015 18.583984,20 20,18.583985 Z</StreamGeometry>
-    <StreamGeometry x:Key="PasswordBoxRevealButtonData">m10.051 7.0032c2.215 0 4.0105 1.7901 4.0105 3.9984s-1.7956 3.9984-4.0105 3.9984c-2.215 0-4.0105-1.7901-4.0105-3.9984s1.7956-3.9984 4.0105-3.9984zm0 1.4994c-1.3844 0-2.5066 1.1188-2.5066 2.499s1.1222 2.499 2.5066 2.499 2.5066-1.1188 2.5066-2.499-1.1222-2.499-2.5066-2.499zm0-5.0026c4.6257 0 8.6188 3.1487 9.7267 7.5613 0.10085 0.40165-0.14399 0.80877-0.54686 0.90931-0.40288 0.10054-0.81122-0.14355-0.91208-0.54521-0.94136-3.7492-4.3361-6.4261-8.2678-6.4261-3.9334 0-7.3292 2.6792-8.2689 6.4306-0.10063 0.40171-0.50884 0.64603-0.91177 0.54571s-0.648-0.5073-0.54737-0.90901c1.106-4.4152 5.1003-7.5667 9.728-7.5667z</StreamGeometry>
-    <StreamGeometry x:Key="PasswordBoxHideButtonData">m0.21967 0.21965c-0.26627 0.26627-0.29047 0.68293-0.07262 0.97654l0.07262 0.08412 4.0346 4.0346c-1.922 1.3495-3.3585 3.365-3.9554 5.7495-0.10058 0.4018 0.14362 0.8091 0.54543 0.9097 0.40182 0.1005 0.80909-0.1436 0.90968-0.5455 0.52947-2.1151 1.8371-3.8891 3.5802-5.0341l1.8096 1.8098c-0.70751 0.7215-1.1438 1.71-1.1438 2.8003 0 2.2092 1.7909 4 4 4 1.0904 0 2.0788-0.4363 2.8004-1.1438l5.9193 5.9195c0.2929 0.2929 0.7677 0.2929 1.0606 0 0.2663-0.2662 0.2905-0.6829 0.0726-0.9765l-0.0726-0.0841-6.1135-6.1142 0.0012-0.0015-1.2001-1.1979-2.8699-2.8693 2e-3 -8e-4 -2.8812-2.8782 0.0012-0.0018-1.1333-1.1305-4.3064-4.3058c-0.29289-0.29289-0.76777-0.29289-1.0607 0zm7.9844 9.0458 3.5351 3.5351c-0.45 0.4358-1.0633 0.704-1.7392 0.704-1.3807 0-2.5-1.1193-2.5-2.5 0-0.6759 0.26824-1.2892 0.7041-1.7391zm1.7959-5.7655c-1.0003 0-1.9709 0.14807-2.8889 0.425l1.237 1.2362c0.5358-0.10587 1.0883-0.16119 1.6519-0.16119 3.9231 0 7.3099 2.6803 8.2471 6.4332 0.1004 0.4018 0.5075 0.6462 0.9094 0.5459 0.4019-0.1004 0.6463-0.5075 0.5459-0.9094-1.103-4.417-5.0869-7.5697-9.7024-7.5697zm0.1947 3.5093 3.8013 3.8007c-0.1018-2.0569-1.7488-3.7024-3.8013-3.8007z</StreamGeometry>
+  <Thickness x:Key="TextBoxTopHeaderMargin">0,0,0,4</Thickness>
+  <StreamGeometry x:Key="TextBoxClearButtonData">M 11.416016,10 20,1.4160156 18.583984,0 10,8.5839846 1.4160156,0 0,1.4160156 8.5839844,10 0,18.583985 1.4160156,20 10,11.416015 18.583984,20 20,18.583985 Z</StreamGeometry>
+  <StreamGeometry x:Key="PasswordBoxRevealButtonData">m10.051 7.0032c2.215 0 4.0105 1.7901 4.0105 3.9984s-1.7956 3.9984-4.0105 3.9984c-2.215 0-4.0105-1.7901-4.0105-3.9984s1.7956-3.9984 4.0105-3.9984zm0 1.4994c-1.3844 0-2.5066 1.1188-2.5066 2.499s1.1222 2.499 2.5066 2.499 2.5066-1.1188 2.5066-2.499-1.1222-2.499-2.5066-2.499zm0-5.0026c4.6257 0 8.6188 3.1487 9.7267 7.5613 0.10085 0.40165-0.14399 0.80877-0.54686 0.90931-0.40288 0.10054-0.81122-0.14355-0.91208-0.54521-0.94136-3.7492-4.3361-6.4261-8.2678-6.4261-3.9334 0-7.3292 2.6792-8.2689 6.4306-0.10063 0.40171-0.50884 0.64603-0.91177 0.54571s-0.648-0.5073-0.54737-0.90901c1.106-4.4152 5.1003-7.5667 9.728-7.5667z</StreamGeometry>
+  <StreamGeometry x:Key="PasswordBoxHideButtonData">m0.21967 0.21965c-0.26627 0.26627-0.29047 0.68293-0.07262 0.97654l0.07262 0.08412 4.0346 4.0346c-1.922 1.3495-3.3585 3.365-3.9554 5.7495-0.10058 0.4018 0.14362 0.8091 0.54543 0.9097 0.40182 0.1005 0.80909-0.1436 0.90968-0.5455 0.52947-2.1151 1.8371-3.8891 3.5802-5.0341l1.8096 1.8098c-0.70751 0.7215-1.1438 1.71-1.1438 2.8003 0 2.2092 1.7909 4 4 4 1.0904 0 2.0788-0.4363 2.8004-1.1438l5.9193 5.9195c0.2929 0.2929 0.7677 0.2929 1.0606 0 0.2663-0.2662 0.2905-0.6829 0.0726-0.9765l-0.0726-0.0841-6.1135-6.1142 0.0012-0.0015-1.2001-1.1979-2.8699-2.8693 2e-3 -8e-4 -2.8812-2.8782 0.0012-0.0018-1.1333-1.1305-4.3064-4.3058c-0.29289-0.29289-0.76777-0.29289-1.0607 0zm7.9844 9.0458 3.5351 3.5351c-0.45 0.4358-1.0633 0.704-1.7392 0.704-1.3807 0-2.5-1.1193-2.5-2.5 0-0.6759 0.26824-1.2892 0.7041-1.7391zm1.7959-5.7655c-1.0003 0-1.9709 0.14807-2.8889 0.425l1.237 1.2362c0.5358-0.10587 1.0883-0.16119 1.6519-0.16119 3.9231 0 7.3099 2.6803 8.2471 6.4332 0.1004 0.4018 0.5075 0.6462 0.9094 0.5459 0.4019-0.1004 0.6463-0.5075 0.5459-0.9094-1.103-4.417-5.0869-7.5697-9.7024-7.5697zm0.1947 3.5093 3.8013 3.8007c-0.1018-2.0569-1.7488-3.7024-3.8013-3.8007z</StreamGeometry>
 
-    <MenuFlyout x:Key="DefaultTextBoxContextFlyout" Placement="Bottom">
-      <MenuItem x:Name="TextBoxContextFlyoutCutItem" Header="Cut" Command="{Binding $parent[TextBox].Cut}" IsEnabled="{Binding $parent[TextBox].CanCut}" InputGesture="{x:Static TextBox.CutGesture}" />
-      <MenuItem x:Name="TextBoxContextFlyoutCopyItem" Header="Copy" Command="{Binding $parent[TextBox].Copy}" IsEnabled="{Binding $parent[TextBox].CanCopy}" InputGesture="{x:Static TextBox.CopyGesture}"/>
-      <MenuItem x:Name="TextBoxContextFlyoutPasteItem" Header="Paste" Command="{Binding $parent[TextBox].Paste}" IsEnabled="{Binding $parent[TextBox].CanPaste}" InputGesture="{x:Static TextBox.PasteGesture}"/>
-    </MenuFlyout>
+  <MenuFlyout x:Key="DefaultTextBoxContextFlyout" Placement="Bottom">
+    <MenuItem x:Name="TextBoxContextFlyoutCutItem" Header="Cut" Command="{Binding $parent[TextBox].Cut}" IsEnabled="{Binding $parent[TextBox].CanCut}" InputGesture="{x:Static TextBox.CutGesture}" />
+    <MenuItem x:Name="TextBoxContextFlyoutCopyItem" Header="Copy" Command="{Binding $parent[TextBox].Copy}" IsEnabled="{Binding $parent[TextBox].CanCopy}" InputGesture="{x:Static TextBox.CopyGesture}"/>
+    <MenuItem x:Name="TextBoxContextFlyoutPasteItem" Header="Paste" Command="{Binding $parent[TextBox].Paste}" IsEnabled="{Binding $parent[TextBox].CanPaste}" InputGesture="{x:Static TextBox.PasteGesture}"/>
+  </MenuFlyout>
 
-    <ContextMenu x:Key="DefaultTextBoxContextMenu" x:Name="TextBoxContextMenu">
-      <MenuItem x:Name="TextBoxContextMenuCutItem" Header="Cut" Command="{Binding $parent[TextBox].Cut}" IsEnabled="{Binding $parent[TextBox].CanCut}" InputGesture="{x:Static TextBox.CutGesture}" />
-      <MenuItem x:Name="TextBoxContextMenuCopyItem" Header="Copy" Command="{Binding $parent[TextBox].Copy}" IsEnabled="{Binding $parent[TextBox].CanCopy}" InputGesture="{x:Static TextBox.CopyGesture}"/>
-      <MenuItem x:Name="TextBoxContextMenuPasteItem" Header="Paste" Command="{Binding $parent[TextBox].Paste}" IsEnabled="{Binding $parent[TextBox].CanPaste}" InputGesture="{x:Static TextBox.PasteGesture}"/>
-    </ContextMenu>
-  </Styles.Resources>
+  <ContextMenu x:Key="DefaultTextBoxContextMenu" x:Name="TextBoxContextMenu">
+    <MenuItem x:Name="TextBoxContextMenuCutItem" Header="Cut" Command="{Binding $parent[TextBox].Cut}" IsEnabled="{Binding $parent[TextBox].CanCut}" InputGesture="{x:Static TextBox.CutGesture}" />
+    <MenuItem x:Name="TextBoxContextMenuCopyItem" Header="Copy" Command="{Binding $parent[TextBox].Copy}" IsEnabled="{Binding $parent[TextBox].CanCopy}" InputGesture="{x:Static TextBox.CopyGesture}"/>
+    <MenuItem x:Name="TextBoxContextMenuPasteItem" Header="Paste" Command="{Binding $parent[TextBox].Paste}" IsEnabled="{Binding $parent[TextBox].CanPaste}" InputGesture="{x:Static TextBox.PasteGesture}"/>
+  </ContextMenu>
 
-  <Style Selector="TextBox">
+  <ControlTheme x:Key="FluentTextBoxButton" TargetType="Button">
+    <Setter Property="Background" Value="{DynamicResource TextControlButtonBackground}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource TextControlButtonBorderBrush}" />
+    <Setter Property="Focusable" Value="False"/>
+    <Setter Property="MinWidth" Value="34" />
+    <Setter Property="Padding" Value="{DynamicResource ButtonPadding}" />
+    <Setter Property="Width" Value="{Binding $self.Bounds.Height}"/>
+    <Setter Property="TextElement.Foreground" Value="{DynamicResource TextControlButtonForeground}"/>
+    <Setter Property="Template">
+      <Setter.Value>
+        <ControlTemplate TargetType="Button">
+          <ContentPresenter x:Name="PART_ContentPresenter"
+                            Background="{TemplateBinding Background}"
+                            BorderBrush="{TemplateBinding BorderBrush}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
+                            Content="{TemplateBinding Content}"
+                            Padding="{TemplateBinding Padding}">
+          </ContentPresenter>
+        </ControlTemplate>
+      </Setter.Value>
+    </Setter>
+
+    <Style Selector="^:pointerover /template/ ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource TextControlButtonBackgroundPointerOver}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource TextControlButtonBorderBrushPointerOver}" />
+      <Setter Property="Foreground" Value="{DynamicResource TextControlButtonForegroundPointerOver}" />
+    </Style>
+
+    <Style Selector="^:pressed /template/ ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource TextControlButtonBackgroundPressed}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource TextControlButtonBorderBrushPressed}" />
+      <Setter Property="Foreground" Value="{DynamicResource TextControlButtonForegroundPressed}" />
+    </Style>
+
+    <Style Selector="^:disabled /template/ ContentPresenter">
+      <Setter Property="Opacity" Value="0" />
+    </Style>
+  </ControlTheme>
+
+  <ControlTheme x:Key="FluentTextBoxToggleButton"
+                TargetType="ToggleButton"
+                BasedOn="{StaticResource FluentTextBoxButton}">
+    <Setter Property="Template">
+      <Setter.Value>
+        <ControlTemplate TargetType="ToggleButton">
+          <ContentPresenter x:Name="PART_ContentPresenter"
+                            Background="{TemplateBinding Background}"
+                            Content="{TemplateBinding Content}"
+                            Padding="{TemplateBinding Padding}">
+          </ContentPresenter>
+        </ControlTemplate>
+      </Setter.Value>
+    </Setter>
+
+    <Style Selector="^:checked /template/ ContentPresenter, ^:indeterminate /template/ ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource TextControlButtonBackgroundPressed}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource TextControlButtonBorderBrushPressed}" />
+      <Setter Property="Foreground" Value="{DynamicResource TextControlButtonForegroundPressed}" />
+    </Style>
+  </ControlTheme>
+
+  <ControlTheme x:Key="{x:Type TextBox}" TargetType="TextBox">
     <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
     <Setter Property="Background" Value="{DynamicResource TextControlBackground}" />
     <Setter Property="CaretBrush" Value="{DynamicResource TextControlForeground}" />
@@ -62,11 +126,18 @@
             <Border
               Margin="{TemplateBinding BorderThickness}">
               <Grid ColumnDefinitions="Auto,*,Auto" >
-                <ContentPresenter Grid.Column="0" Grid.ColumnSpan="1" Content="{TemplateBinding InnerLeftContent}"/>
-                <DockPanel x:Name="PART_InnerDockPanel" Grid.Column="1" Grid.ColumnSpan="1" Margin="{TemplateBinding Padding}">
+                <ContentPresenter Grid.Column="0"
+                                  Grid.ColumnSpan="1"
+                                  Content="{TemplateBinding InnerLeftContent}"/>
+                <DockPanel x:Name="PART_InnerDockPanel"
+                           Grid.Column="1"
+                           Grid.ColumnSpan="1"
+                           Cursor="IBeam"
+                           Margin="{TemplateBinding Padding}">
                   <TextBlock Name="PART_FloatingWatermark"
                              Foreground="{DynamicResource SystemAccentColor}"
                              FontSize="{TemplateBinding FontSize}"
+                             IsVisible="False"
                              Text="{TemplateBinding Watermark}"
                              DockPanel.Dock="Top" />
                   <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}"
@@ -107,187 +178,85 @@
         </DataValidationErrors>
       </ControlTemplate>
     </Setter>
-  </Style>
 
-  <!-- Disabled State -->
-  <Style Selector="TextBox:disabled">
-    <Setter Property="Foreground" Value="{DynamicResource TextControlForegroundDisabled}" />
-  </Style>
+    <!-- Disabled State -->
+    <Style Selector="^:disabled">
+      <Setter Property="Foreground" Value="{DynamicResource TextControlForegroundDisabled}" />
 
-  <Style Selector="TextBox:disabled /template/ Border#PART_BorderElement">
-    <Setter Property="Background" Value="{DynamicResource TextControlBackgroundDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrushDisabled}" />
-  </Style>
+      <Style Selector="^ /template/ Border#PART_BorderElement">
+        <Setter Property="Background" Value="{DynamicResource TextControlBackgroundDisabled}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrushDisabled}" />
+      </Style>
 
-  <Style Selector="TextBox:disabled /template/ TextBlock#PART_Watermark, TextBox:disabled /template/ TextBlock#PART_FloatingWatermark">
-    <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForegroundDisabled}" />
-  </Style>
+      <Style Selector="^ /template/ TextBlock#PART_Watermark, ^ /template/ TextBlock#PART_FloatingWatermark">
+        <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForegroundDisabled}" />
+      </Style>
+    </Style>
 
-  <!-- PointerOver State-->
-  <Style Selector="TextBox:pointerover">
-    <Setter Property="Foreground" Value="{DynamicResource TextControlForegroundPointerOver}" />
-  </Style>
+    <!-- PointerOver State-->
+    <Style Selector="^:pointerover">
+      <Setter Property="Foreground" Value="{DynamicResource TextControlForegroundPointerOver}" />
 
-  <Style Selector="TextBox:pointerover /template/ Border#PART_BorderElement">
-    <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrushPointerOver}"/>
-    <Setter Property="Background" Value="{DynamicResource TextControlBackgroundPointerOver}" />
-  </Style>
+      <Style Selector="^ /template/ Border#PART_BorderElement">
+        <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrushPointerOver}"/>
+        <Setter Property="Background" Value="{DynamicResource TextControlBackgroundPointerOver}" />
+      </Style>
 
-  <Style Selector="TextBox:pointerover /template/ TextBlock#PART_Watermark, TextBox:pointerover /template/ TextBlock#PART_FloatingWatermark">
-    <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForegroundPointerOver}" />
-  </Style>
+      <Style Selector="^ /template/ TextBlock#PART_Watermark">
+        <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForegroundPointerOver}" />
+      </Style>
+    </Style>
 
-  <!-- Focused State -->
-  <Style Selector="TextBox:focus">
-    <Setter Property="Foreground" Value="{DynamicResource TextControlForegroundFocused}" />
-  </Style>
+    <!-- Focused State -->
+    <Style Selector="^:focus">
+      <Setter Property="Foreground" Value="{DynamicResource TextControlForegroundFocused}" />
 
-  <Style Selector="TextBox:focus /template/ TextBlock#PART_Watermark, TextBox:focus /template/ TextBlock#PART_FloatingWatermark">
-    <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForegroundFocused}" />
-  </Style>
+      <Style Selector="^ /template/ TextBlock#PART_Watermark">
+        <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForegroundFocused}" />
+      </Style>
 
-  <Style Selector="TextBox:focus /template/ Border#PART_BorderElement">
-    <Setter Property="Background" Value="{DynamicResource TextControlBackgroundFocused}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrushFocused}"/>
-    <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThicknessFocused}" />
-  </Style>
+      <Style Selector="^ /template/ Border#PART_BorderElement">
+        <Setter Property="Background" Value="{DynamicResource TextControlBackgroundFocused}"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrushFocused}"/>
+        <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThicknessFocused}" />
+      </Style>
+    </Style>
 
-  <Style Selector="TextBox:error /template/ Border#PART_BorderElement">
-    <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
-  </Style>
+    <Style Selector="^:error /template/ Border#PART_BorderElement">
+      <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
+    </Style>
 
-  <Style Selector="TextBox /template/ DockPanel#PART_InnerDockPanel">
-    <Setter Property="Cursor" Value="IBeam" />
-  </Style>
-
-  <Style Selector="TextBox /template/ TextBlock#PART_FloatingWatermark">
-    <Setter Property="IsVisible" Value="False" />
-  </Style>
-  <Style Selector="TextBox[UseFloatingWatermark=true]:not(TextBox:empty) /template/ TextBlock#PART_FloatingWatermark">
-    <Setter Property="IsVisible" Value="True" />
-  </Style>
-
-  <Style Selector="TextBox.revealPasswordButton[AcceptsReturn=False][IsReadOnly=False]:not(TextBox:empty)">
-    <Setter Property="InnerRightContent">
-      <Template>
-        <ToggleButton Classes="passwordBoxRevealButton"
-                      IsChecked="{Binding $parent[TextBox].RevealPassword, Mode=TwoWay}" />
-      </Template>
-    </Setter>
-  </Style>
+    <Style Selector="^[UseFloatingWatermark=true]:not(:empty) /template/ TextBlock#PART_FloatingWatermark">
+      <Setter Property="IsVisible" Value="True" />
+    </Style>
 
-  <Style Selector="TextBox.clearButton[AcceptsReturn=False][IsReadOnly=False]:focus:not(TextBox:empty)">
-    <Setter Property="InnerRightContent">
-      <Template>
-        <Button Classes="textBoxClearButton"
-                Command="{Binding $parent[TextBox].Clear}" />
-      </Template>
-    </Setter>
-  </Style>
-
-  <Style Selector="ToggleButton.passwordBoxRevealButton">
-    <Setter Property="Template">
-      <Setter.Value>
-        <ControlTemplate TargetType="ToggleButton">
-          <Border x:Name="PART_ButtonLayoutBorder"
-                  BorderThickness="{TemplateBinding BorderThickness}">
+    <Style Selector="^.revealPasswordButton[AcceptsReturn=False][IsReadOnly=False]:not(TextBox:empty)">
+      <Setter Property="InnerRightContent">
+        <Template>
+          <ToggleButton Theme="{StaticResource FluentTextBoxToggleButton}"
+                        IsChecked="{Binding $parent[TextBox].RevealPassword, Mode=TwoWay}">
             <Panel>
-              <Path x:Name="PART_GlyphElement_Reveal"
-                    Data="{StaticResource PasswordBoxRevealButtonData}"
-                    Height="8"
-                    Width="12"
-                    Stretch="Uniform"
-                    VerticalAlignment="Center"
-                    HorizontalAlignment="Center" />
-              <Path x:Name="PART_GlyphElement_Hide"
-                    Data="{StaticResource PasswordBoxHideButtonData}"
-                    Height="12"
-                    Width="12"
-                    Stretch="Uniform"
-                    VerticalAlignment="Center"
-                    HorizontalAlignment="Center" />
+              <PathIcon Data="{StaticResource PasswordBoxRevealButtonData}"
+                        Height="8" Width="12"
+                        IsVisible="{Binding $parent[ToggleButton].!IsChecked}"/>
+              <PathIcon Data="{StaticResource PasswordBoxHideButtonData}"
+                        Height="12" Width="12"
+                        IsVisible="{Binding $parent[ToggleButton].IsChecked}"/>
             </Panel>
-          </Border>
-        </ControlTemplate>
-      </Setter.Value>
-    </Setter>
-  </Style>
-
-  <Style Selector="Button.textBoxClearButton">
-    <Setter Property="Template">
-      <Setter.Value>
-        <ControlTemplate TargetType="Button">
-          <Border x:Name="PART_ButtonLayoutBorder"
-                  BorderThickness="{TemplateBinding BorderThickness}">
-            <Path x:Name="PART_GlyphElement"
-                  Data="{StaticResource TextBoxClearButtonData}"
-                  Height="10"
-                  Width="10"
-                  Stretch="Uniform"
-                  VerticalAlignment="Center"
-                  HorizontalAlignment="Center"/>
-          </Border>
-        </ControlTemplate>
-      </Setter.Value>
-    </Setter>
-  </Style>
-
-  <!-- TextBox.Button Normal State -->
-  <Style Selector="Button.textBoxClearButton, ToggleButton.passwordBoxRevealButton">
-    <Setter Property="MinWidth" Value="34" />
-    <Setter Property="Width" Value="{Binding $self.Bounds.Height}"/>
-    <Setter Property="Focusable" Value="False" />
-    <Setter Property="VerticalAlignment" Value="Stretch" />
-  </Style>
-  <Style Selector="Button.textBoxClearButton /template/ Border#PART_ButtonLayoutBorder,
-                   ToggleButton.passwordBoxRevealButton /template/ Border#PART_ButtonLayoutBorder">
-    <Setter Property="Background" Value="{DynamicResource TextControlButtonBackground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource TextControlButtonBorderBrush}" />
-  </Style>
-  <Style Selector="Button.textBoxClearButton /template/ Path#PART_GlyphElement,
-                   ToggleButton.passwordBoxRevealButton /template/ Path#PART_GlyphElement_Reveal,
-                   ToggleButton.passwordBoxRevealButton /template/ Path#PART_GlyphElement_Hide">
-    <Setter Property="Fill" Value="{DynamicResource TextControlButtonForeground}" />
-  </Style>
-
-  <!-- TextBox.Button PointerOver State -->
-  <Style Selector="Button.textBoxClearButton:pointerover /template/ Border#PART_ButtonLayoutBorder,
-                   ToggleButton.passwordBoxRevealButton:pointerover /template/ Border#PART_ButtonLayoutBorder">
-    <Setter Property="Background" Value="{DynamicResource TextControlButtonBackgroundPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource TextControlButtonBorderBrushPointerOver}" />
-  </Style>
-  <Style Selector="Button.textBoxClearButton:pointerover /template/ Path#PART_GlyphElement,
-                   ToggleButton.passwordBoxRevealButton:pointerover /template/ Path#PART_GlyphElement_Reveal,
-                   ToggleButton.passwordBoxRevealButton:pointerover /template/ Path#PART_GlyphElement_Hide">
-    <Setter Property="Fill" Value="{DynamicResource TextControlButtonForegroundPointerOver}" />
-  </Style>
-
-  <!-- TextBox.Button Pressed State -->
-  <Style Selector="Button.textBoxClearButton:pressed /template/ Border#PART_ButtonLayoutBorder,
-                   ToggleButton.passwordBoxRevealButton:pressed /template/ Border#PART_ButtonLayoutBorder,
-                   ToggleButton.passwordBoxRevealButton:checked /template/ Border#PART_ButtonLayoutBorder,
-                   ToggleButton.passwordBoxRevealButton:indeterminate /template/ Border#PART_ButtonLayoutBorder">
-    <Setter Property="Background" Value="{DynamicResource TextControlButtonBackgroundPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource TextControlButtonBorderBrushPressed}" />
-  </Style>
-  <Style Selector="Button.textBoxClearButton:pressed /template/ Path#PART_GlyphElement,
-                   ToggleButton.passwordBoxRevealButton:pressed /template/ Path#PART_GlyphElement_Reveal,
-                   ToggleButton.passwordBoxRevealButton:checked /template/ Path#PART_GlyphElement_Hide,
-                   ToggleButton.passwordBoxRevealButton:indeterminate /template/ Path#PART_GlyphElement_Reveal">
-    <Setter Property="Fill" Value="{DynamicResource TextControlButtonForegroundPressed}" />
-  </Style>
-
-  <!-- TextBox.Button Disabled State -->
-  <Style Selector="Button.textBoxClearButton:disabled /template/ Border#PART_ButtonLayoutBorder,
-                   ToggleButton.passwordBoxRevealButton:disabled /template/ Border#PART_ButtonLayoutBorder">
-    <Setter Property="Opacity" Value="0" />
-  </Style>
-
-  <Style Selector="ToggleButton.passwordBoxRevealButton:not(ToggleButton:checked) /template/ Path#PART_GlyphElement_Hide">
-    <Setter Property="IsVisible" Value="False" />
-  </Style>
-  <Style Selector="ToggleButton.passwordBoxRevealButton:checked /template/ Path#PART_GlyphElement_Reveal">
-    <Setter Property="IsVisible" Value="False" />
-  </Style>
+          </ToggleButton>
+        </Template>
+      </Setter>
+    </Style>
 
-</Styles>
+    <Style Selector="^.clearButton[AcceptsReturn=False][IsReadOnly=False]:focus:not(TextBox:empty)">
+      <Setter Property="InnerRightContent">
+        <Template>
+          <Button Theme="{StaticResource FluentTextBoxButton}"
+                  Command="{Binding $parent[TextBox].Clear}">
+            <PathIcon Data="{StaticResource TextBoxClearButtonData}" Height="10" Width="10"/>
+          </Button>
+        </Template>
+      </Setter>
+    </Style>
+  </ControlTheme>
+</ResourceDictionary>

From 23a6517a6b064cecda957be0eeb768074bf76823 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Fri, 8 Jul 2022 22:36:40 +0200
Subject: [PATCH 48/70] Refactored CaptionButtons.

Converted buttons to be actual buttons instead of `Panel`s so that we get correct button behavior, i.e. the possibility to cancel by releasing the mouse outside the button.
---
 .../Chrome/CaptionButtons.cs                  |  27 ++--
 .../Controls/CaptionButtons.xaml              | 152 +++++++++++-------
 2 files changed, 108 insertions(+), 71 deletions(-)

diff --git a/src/Avalonia.Controls/Chrome/CaptionButtons.cs b/src/Avalonia.Controls/Chrome/CaptionButtons.cs
index d5923a8b37..6d7e542bb2 100644
--- a/src/Avalonia.Controls/Chrome/CaptionButtons.cs
+++ b/src/Avalonia.Controls/Chrome/CaptionButtons.cs
@@ -8,10 +8,10 @@ namespace Avalonia.Controls.Chrome
     /// <summary>
     /// Draws window minimize / maximize / close buttons in a <see cref="TitleBar"/> when managed client decorations are enabled.
     /// </summary>
-    [TemplatePart("PART_CloseButton",      typeof(Panel))]
-    [TemplatePart("PART_RestoreButton",    typeof(Panel))]
-    [TemplatePart("PART_MinimiseButton",   typeof(Panel))]
-    [TemplatePart("PART_FullScreenButton", typeof(Panel))]
+    [TemplatePart("PART_CloseButton",      typeof(Button))]
+    [TemplatePart("PART_RestoreButton",    typeof(Button))]
+    [TemplatePart("PART_MinimiseButton",   typeof(Button))]
+    [TemplatePart("PART_FullScreenButton", typeof(Button))]
     [PseudoClasses(":minimized", ":normal", ":maximized", ":fullscreen")]
     public class CaptionButtons : TemplatedControl
     {
@@ -88,18 +88,15 @@ namespace Avalonia.Controls.Chrome
         {
             base.OnApplyTemplate(e);
 
-            var closeButton = e.NameScope.Get<Panel>("PART_CloseButton");
-            var restoreButton = e.NameScope.Get<Panel>("PART_RestoreButton");
-            var minimiseButton = e.NameScope.Get<Panel>("PART_MinimiseButton");
-            var fullScreenButton = e.NameScope.Get<Panel>("PART_FullScreenButton");
+            var closeButton = e.NameScope.Get<Button>("PART_CloseButton");
+            var restoreButton = e.NameScope.Get<Button>("PART_RestoreButton");
+            var minimiseButton = e.NameScope.Get<Button>("PART_MinimiseButton");
+            var fullScreenButton = e.NameScope.Get<Button>("PART_FullScreenButton");
 
-            closeButton.PointerReleased += (sender, e) => OnClose();
-
-            restoreButton.PointerReleased += (sender, e) => OnRestore();
-
-            minimiseButton.PointerReleased += (sender, e) => OnMinimize();
-
-            fullScreenButton.PointerReleased += (sender, e) => OnToggleFullScreen();
+            closeButton.Click += (sender, e) => OnClose();
+            restoreButton.Click += (sender, e) => OnRestore();
+            minimiseButton.Click += (sender, e) => OnMinimize();
+            fullScreenButton.Click += (sender, e) => OnToggleFullScreen();
         }
     }
 }
diff --git a/src/Avalonia.Themes.Fluent/Controls/CaptionButtons.xaml b/src/Avalonia.Themes.Fluent/Controls/CaptionButtons.xaml
index 3c45de18c6..c91e008e02 100644
--- a/src/Avalonia.Themes.Fluent/Controls/CaptionButtons.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/CaptionButtons.xaml
@@ -1,57 +1,97 @@
-<ResourceDictionary 
-  xmlns="https://github.com/avaloniaui" 
-  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTheme x:Key="{x:Type CaptionButtons}" TargetType="CaptionButtons">
-      <Setter Property="MaxHeight" Value="30" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <StackPanel Spacing="2" VerticalAlignment="Stretch" TextElement.FontSize="10" Orientation="Horizontal">
-            <StackPanel.Styles>
-              <Style Selector="Panel:pointerover">
-                <Setter Property="Background" Value="#7F7f7f7f" />
-              </Style>
-              <Style Selector="Panel#PART_CloseButton:pointerover">
-                <Setter Property="Background" Value="#7FFF0000" />
-              </Style>
-            </StackPanel.Styles>
-            <Panel x:Name="PART_FullScreenButton" IsVisible="False" Width="45" Background="Transparent">
-              <Viewbox Width="11" Margin="2">
-                <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}" Data="M2048 2048v-819h-205v469l-1493 -1493h469v-205h-819v819h205v-469l1493 1493h-469v205h819z" />
-              </Viewbox>
-            </Panel>
-            <Panel x:Name="PART_MinimiseButton" Width="45" Background="Transparent">
-              <Viewbox Width="11" Margin="2">
-                <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}" Data="M2048 1229v-205h-2048v205h2048z" />
-              </Viewbox>
-            </Panel>
-            <Panel x:Name="PART_RestoreButton" Width="45" Background="Transparent">
-              <Viewbox Width="11" Margin="2">
-                <Viewbox.RenderTransform>
-                  <RotateTransform Angle="-90" />
-                </Viewbox.RenderTransform>
-                <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}" Data="M2048 2048v-2048h-2048v2048h2048zM1843 1843h-1638v-1638h1638v1638z"/>
-              </Viewbox>
-            </Panel>
-            <Panel x:Name="PART_CloseButton" Width="45" Background="Transparent">
-              <Viewbox Width="11" Margin="2">
-                <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}" Data="M1169 1024l879 -879l-145 -145l-879 879l-879 -879l-145 145l879 879l-879 879l145 145l879 -879l879 879l145 -145z" />
-              </Viewbox>
-            </Panel>
-          </StackPanel>
-        </ControlTemplate>
-      </Setter>
-      <Style Selector="^:maximized /template/ Panel#PART_RestoreButton Path">
-        <Setter Property="Data" Value="M2048 410h-410v-410h-1638v1638h410v410h1638v-1638zM1434 1434h-1229v-1229h1229v1229zM1843 1843h-1229v-205h1024v-1024h205v1229z" />
-      </Style>
-      <Style Selector="^:fullscreen /template/ Panel#PART_FullScreenButton Path">
-        <Setter Property="IsVisible" Value="True" />
-        <Setter Property="Data" Value="M205 1024h819v-819h-205v469l-674 -674l-145 145l674 674h-469v205zM1374 1229h469v-205h-819v819h205v-469l674 674l145 -145z" />
-      </Style>
-      <Style Selector="^:fullscreen /template/ Panel#PART_RestoreButton">
-        <Setter Property="IsVisible" Value="False" />
-      </Style>
-      <Style Selector="^:fullscreen /template/ Panel#PART_MinimiseButton">
-        <Setter Property="IsVisible" Value="False" />
-      </Style>
-    </ControlTheme>
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <StackPanel Spacing="20">
+        <CaptionButtons Height="30"/>
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
+
+  <ControlTheme x:Key="FluentCaptionButton" TargetType="Button">
+    <Setter Property="Background" Value="#ffe5e5e5" />
+    <!-- Reusing BorderBrush to define pressed background color, as it's not used otherwise -->
+    <Setter Property="BorderBrush" Value="#ffcacaca" />
+    <Setter Property="Foreground" Value="Black"/>
+    <Setter Property="Width" Value="45"/>
+    <Setter Property="VerticalAlignment" Value="Stretch"/>
+    <Setter Property="Template">
+      <ControlTemplate>
+        <ContentPresenter Name="PART_ContentPresenter"
+                          Background="Transparent"
+                          Content="{TemplateBinding Content}"/>
+      </ControlTemplate>
+    </Setter>
+
+    <Style Selector="^:pointerover /template/ ContentPresenter">
+      <Setter Property="Background" Value="{TemplateBinding Background}" />
+    </Style>
+
+    <Style Selector="^:pressed /template/ ContentPresenter">
+      <Setter Property="Background" Value="{TemplateBinding BorderBrush}" />
+    </Style>
+  </ControlTheme>
+  
+  <ControlTheme x:Key="{x:Type CaptionButtons}" TargetType="CaptionButtons">
+    <Setter Property="MaxHeight" Value="30" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <StackPanel Spacing="2" VerticalAlignment="Stretch" TextElement.FontSize="10" Orientation="Horizontal">
+          <Button x:Name="PART_FullScreenButton"
+                  Theme="{StaticResource FluentCaptionButton}"
+                  IsVisible="False">
+            <Viewbox Width="11" Margin="2">
+              <Path Name="FullScreenButtonPath"
+                    Stretch="UniformToFill"
+                    Fill="{TemplateBinding Foreground}"
+                    Data="M2048 2048v-819h-205v469l-1493 -1493h469v-205h-819v819h205v-469l1493 1493h-469v205h819z" />
+            </Viewbox>
+          </Button>
+          <Button x:Name="PART_MinimiseButton"
+                  Theme="{StaticResource FluentCaptionButton}">
+            <Viewbox Width="11" Margin="2">
+              <Path Stretch="UniformToFill"
+                    Fill="{TemplateBinding Foreground}"
+                    Data="M2048 1229v-205h-2048v205h2048z" />
+            </Viewbox>
+          </Button>
+          <Button x:Name="PART_RestoreButton"
+                  Theme="{StaticResource FluentCaptionButton}">
+            <Viewbox Width="11" Margin="2">
+              <Viewbox.RenderTransform>
+                <RotateTransform Angle="-90" />
+              </Viewbox.RenderTransform>
+              <Path Name="RestoreButtonPath"
+                    Stretch="UniformToFill"
+                    Fill="{TemplateBinding Foreground}"
+                    Data="M2048 2048v-2048h-2048v2048h2048zM1843 1843h-1638v-1638h1638v1638z"/>
+            </Viewbox>
+          </Button>
+          <Button x:Name="PART_CloseButton"
+                  Background="#ffe81123"
+                  BorderBrush="#fff1707a"
+                  Theme="{StaticResource FluentCaptionButton}">
+            <Viewbox Width="11" Margin="2">
+              <Path Stretch="UniformToFill"
+                    Fill="{TemplateBinding Foreground}"
+                    Data="M1169 1024l879 -879l-145 -145l-879 879l-879 -879l-145 145l879 879l-879 879l145 145l879 -879l879 879l145 -145z" />
+            </Viewbox>
+          </Button>
+        </StackPanel>
+      </ControlTemplate>
+    </Setter>
+    <Style Selector="^:maximized /template/ Path#RestoreButtonPath">
+      <Setter Property="Data" Value="M2048 410h-410v-410h-1638v1638h410v410h1638v-1638zM1434 1434h-1229v-1229h1229v1229zM1843 1843h-1229v-205h1024v-1024h205v1229z" />
+    </Style>
+    <Style Selector="^:fullscreen /template/ Path#PART_FullScreenButtonPath">
+      <Setter Property="IsVisible" Value="True" />
+      <Setter Property="Data" Value="M205 1024h819v-819h-205v469l-674 -674l-145 145l674 674h-469v205zM1374 1229h469v-205h-819v819h205v-469l674 674l145 -145z" />
+    </Style>
+    <Style Selector="^:fullscreen /template/ Panel#PART_RestoreButton">
+      <Setter Property="IsVisible" Value="False" />
+    </Style>
+    <Style Selector="^:fullscreen /template/ Panel#PART_MinimiseButton">
+      <Setter Property="IsVisible" Value="False" />
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From 83140fe427b8ddcb691b7dc063e5af965de40180 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Sat, 9 Jul 2022 00:18:28 +0200
Subject: [PATCH 49/70] Reset button animations correctly.

Otherwise they keep on animating way after the interaction.
---
 src/Avalonia.Themes.Fluent/Controls/Button.xaml       | 1 +
 src/Avalonia.Themes.Fluent/Controls/RepeatButton.xaml | 1 +
 src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml | 1 +
 3 files changed, 3 insertions(+)

diff --git a/src/Avalonia.Themes.Fluent/Controls/Button.xaml b/src/Avalonia.Themes.Fluent/Controls/Button.xaml
index 7ac5c4351a..7828fd52ed 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Button.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Button.xaml
@@ -20,6 +20,7 @@
     <Setter Property="Padding" Value="{DynamicResource ButtonPadding}" />
     <Setter Property="HorizontalAlignment" Value="Left" />
     <Setter Property="VerticalAlignment" Value="Center" />
+    <Setter Property="RenderTransform" Value="none" />
     <Setter Property="Transitions">
       <Transitions>
         <TransformOperationsTransition Property="RenderTransform" Duration="0:0:.075" />
diff --git a/src/Avalonia.Themes.Fluent/Controls/RepeatButton.xaml b/src/Avalonia.Themes.Fluent/Controls/RepeatButton.xaml
index 5e789e7e10..a54187104b 100644
--- a/src/Avalonia.Themes.Fluent/Controls/RepeatButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/RepeatButton.xaml
@@ -23,6 +23,7 @@
     <Setter Property="VerticalAlignment" Value="Center" />
     <Setter Property="FontWeight" Value="Normal" />
     <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="RenderTransform" Value="none" />
     <Setter Property="Template">
       <ControlTemplate>
         <ContentPresenter x:Name="PART_ContentPresenter"
diff --git a/src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml b/src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml
index 36c0c50064..7a46f21534 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml
@@ -23,6 +23,7 @@
     <Setter Property="VerticalAlignment" Value="Center" />
     <Setter Property="FontWeight" Value="Normal" />
     <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="RenderTransform" Value="none" />
     <Setter Property="Transitions">
       <Transitions>
         <TransformOperationsTransition Property="RenderTransform" Duration="0:0:.075" />

From 0d5b10ec3aa041b21d5cd4a785b37201dec03f7a Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Sat, 9 Jul 2022 00:25:04 +0200
Subject: [PATCH 50/70] Tweaked DatePicker ControlTheme.

---
 .../Controls/DatePicker.xaml                  | 629 +++++++++---------
 1 file changed, 317 insertions(+), 312 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml b/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml
index a7093c1341..0537feb60b 100644
--- a/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml
@@ -9,344 +9,349 @@
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:sys="clr-namespace:System;assembly=netstandard"
         x:CompileBindings="True">
-    <Design.PreviewWith>
-      <Border Padding="20">
-        <DatePicker CornerRadius="10" />
-      </Border>
-    </Design.PreviewWith>
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <DatePicker CornerRadius="10" />
+    </Border>
+  </Design.PreviewWith>
 
-    <Thickness x:Key="DatePickerTopHeaderMargin">0,0,0,4</Thickness>
-    <x:Double x:Key="DatePickerFlyoutPresenterHighlightHeight">40</x:Double>
-    <x:Double x:Key="DatePickerFlyoutPresenterItemHeight">40</x:Double>
-    <x:Double x:Key="DatePickerFlyoutPresenterAcceptDismissHostGridHeight">41</x:Double>
-    <x:Double x:Key="DatePickerThemeMinWidth">296</x:Double>
-    <x:Double x:Key="DatePickerThemeMaxWidth">456</x:Double>
-    <Thickness x:Key="DatePickerFlyoutPresenterItemPadding">0,3,0,6</Thickness>
-    <Thickness x:Key="DatePickerFlyoutPresenterMonthPadding">9,3,0,6</Thickness>
-    <Thickness x:Key="DatePickerHostPadding">0,3,0,6</Thickness>
-    <Thickness x:Key="DatePickerHostMonthPadding">9,3,0,6</Thickness>
-    <x:Double x:Key="DatePickerSpacerThemeWidth">1</x:Double>
+  <Thickness x:Key="DatePickerTopHeaderMargin">0,0,0,4</Thickness>
+  <x:Double x:Key="DatePickerFlyoutPresenterHighlightHeight">40</x:Double>
+  <x:Double x:Key="DatePickerFlyoutPresenterItemHeight">40</x:Double>
+  <x:Double x:Key="DatePickerFlyoutPresenterAcceptDismissHostGridHeight">41</x:Double>
+  <x:Double x:Key="DatePickerThemeMinWidth">296</x:Double>
+  <x:Double x:Key="DatePickerThemeMaxWidth">456</x:Double>
+  <Thickness x:Key="DatePickerFlyoutPresenterItemPadding">0,3,0,6</Thickness>
+  <Thickness x:Key="DatePickerFlyoutPresenterMonthPadding">9,3,0,6</Thickness>
+  <Thickness x:Key="DatePickerHostPadding">0,3,0,6</Thickness>
+  <Thickness x:Key="DatePickerHostMonthPadding">9,3,0,6</Thickness>
+  <x:Double x:Key="DatePickerSpacerThemeWidth">1</x:Double>
 
-    <!-- Theme for the items displayed in the selectors -->
-    <ControlTheme x:Key="FluentDateTimePickerItem" TargetType="ListBoxItem" BasedOn="{StaticResource {x:Type ListBoxItem}}">
-      <Setter Property="Padding" Value="{DynamicResource DatePickerFlyoutPresenterItemPadding}"/>
-      <Setter Property="VerticalContentAlignment" Value="Center" />
-      <Setter Property="HorizontalContentAlignment" Value="Center" />
-      
-      <Style Selector="^:selected">
-        <Setter Property="IsHitTestVisible" Value="False"/>
-        <Style Selector="^/template/ Rectangle#PressedBackground">
-          <Setter Property="Fill" Value="Transparent"/>
-        </Style>
-        <Style Selector="^/template/ ContentPresenter">
-          <Setter Property="Background" Value="Transparent" />
-          <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>
-        </Style>
+  <!-- Theme for the items displayed in the selectors -->
+  <ControlTheme x:Key="FluentDateTimePickerItem" TargetType="ListBoxItem" BasedOn="{StaticResource {x:Type ListBoxItem}}">
+    <Setter Property="Padding" Value="{DynamicResource DatePickerFlyoutPresenterItemPadding}"/>
+    <Setter Property="VerticalContentAlignment" Value="Center" />
+    <Setter Property="HorizontalContentAlignment" Value="Center" />
+
+    <Style Selector="^:selected">
+      <Setter Property="IsHitTestVisible" Value="False"/>
+      <Style Selector="^/template/ Rectangle#PressedBackground">
+        <Setter Property="Fill" Value="Transparent"/>
       </Style>
-      <Style Selector="^.MonthItem">
-        <Setter Property="Padding" Value="{DynamicResource DatePickerFlyoutPresenterMonthPadding}"/>
-        <Setter Property="VerticalContentAlignment" Value="Center" />
-        <Setter Property="HorizontalContentAlignment" Value="Left" />
+      <Style Selector="^/template/ ContentPresenter">
+        <Setter Property="Background" Value="Transparent" />
+        <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>
       </Style>
-    </ControlTheme>
+    </Style>
+    <Style Selector="^.MonthItem">
+      <Setter Property="Padding" Value="{DynamicResource DatePickerFlyoutPresenterMonthPadding}"/>
+      <Setter Property="VerticalContentAlignment" Value="Center" />
+      <Setter Property="HorizontalContentAlignment" Value="Left" />
+    </Style>
+  </ControlTheme>
 
-    <!-- This is used for both the accept/dismiss & repeatbuttons in the presenter-->
-    <ControlTheme x:Key="FluentDateTimePickerButton" TargetType="Button">
-      <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackground}" />
-      <Setter Property="HorizontalContentAlignment" Value="Center"/>
-      <Setter Property="VerticalContentAlignment" Value="Center"/>
-      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <!-- 
+  <!-- This is used for both the accept/dismiss & repeatbuttons in the presenter-->
+  <ControlTheme x:Key="FluentDateTimePickerButton" TargetType="Button">
+    <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackground}" />
+    <Setter Property="HorizontalContentAlignment" Value="Center"/>
+    <Setter Property="VerticalContentAlignment" Value="Center"/>
+    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+    <Setter Property="RenderTransform" Value="none" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <!-- 
                 The background is doubled here for the loopingselector up/down repeat buttons 
                 that appear opaque. Not sure how MS does it though I suspect this is it
                 but source isn't MIT yet, so this is my solution -->
-          <Border Background="{TemplateBinding Background}">
-            <ContentPresenter x:Name="ContentPresenter"
-                    Background="{TemplateBinding Background}"
-                    BorderBrush="{DynamicResource DateTimePickerFlyoutButtonBorderBrush}"
-                    BorderThickness="{DynamicResource DateTimeFlyoutButtonBorderThickness}"
-                    Content="{TemplateBinding Content}"
-                    Foreground="{DynamicResource SystemControlHighlightAltBaseHighBrush}"
-                    ContentTemplate="{TemplateBinding ContentTemplate}"
-                    Padding="{TemplateBinding Padding}"
-                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                    CornerRadius="{TemplateBinding CornerRadius}"/>
-          </Border>
-        </ControlTemplate>
-      </Setter>
+        <Border Background="{TemplateBinding Background}">
+          <ContentPresenter x:Name="ContentPresenter"
+                  Background="{TemplateBinding Background}"
+                  BorderBrush="{DynamicResource DateTimePickerFlyoutButtonBorderBrush}"
+                  BorderThickness="{DynamicResource DateTimeFlyoutButtonBorderThickness}"
+                  Content="{TemplateBinding Content}"
+                  Foreground="{DynamicResource SystemControlHighlightAltBaseHighBrush}"
+                  ContentTemplate="{TemplateBinding ContentTemplate}"
+                  Padding="{TemplateBinding Padding}"
+                  HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                  VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                  CornerRadius="{TemplateBinding CornerRadius}"/>
+        </Border>
+      </ControlTemplate>
+    </Setter>
 
-      <Style Selector="^:pointerover /template/ ContentPresenter">
-        <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackgroundPointerOver}"/>
-        <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerFlyoutButtonBorderBrushPointerOver}"/>
-        <Setter Property="Foreground" Value="{DynamicResource DateTimePickerFlyoutButtonForegroundPointerOver}"/>
-      </Style>
+    <Style Selector="^:pointerover /template/ ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackgroundPointerOver}"/>
+      <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerFlyoutButtonBorderBrushPointerOver}"/>
+      <Setter Property="Foreground" Value="{DynamicResource DateTimePickerFlyoutButtonForegroundPointerOver}"/>
+    </Style>
 
-      <Style Selector="^:pressed /template/ ContentPresenter">
-        <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackgroundPressed}"/>
-        <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerFlyoutButtonBorderBrushPressed}"/>
-        <Setter Property="Foreground" Value="{DynamicResource DateTimePickerFlyoutButtonForegroundPressed}"/>
-      </Style>
-    </ControlTheme>
+    <Style Selector="^:pressed">
+      <Setter Property="RenderTransform" Value="scale(0.98)" />
+    </Style>
 
-    <ControlTheme x:Key="FluentDateTimePickerUpButton" TargetType="RepeatButton" BasedOn="{StaticResource FluentDateTimePickerButton}">
-      <Setter Property="VerticalAlignment" Value="Top"/>
-      <Setter Property="Height" Value="22" />
-      <Setter Property="HorizontalAlignment" Value="Stretch" />
-      <Setter Property="Focusable" Value="False" />
-      <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
-      <Setter Property="Content">
-        <Template>
-          <Viewbox Height="10" Width="10" HorizontalAlignment="Center" VerticalAlignment="Center">
-            <Path Stroke="{Binding $parent[RepeatButton].Foreground}" StrokeThickness="1" Data="M 0,9 L 9,0 L 18,9"/>
-          </Viewbox>
-        </Template>
-      </Setter>
-    </ControlTheme>
+    <Style Selector="^:pressed /template/ ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackgroundPressed}"/>
+      <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerFlyoutButtonBorderBrushPressed}"/>
+      <Setter Property="Foreground" Value="{DynamicResource DateTimePickerFlyoutButtonForegroundPressed}"/>
+    </Style>
+  </ControlTheme>
 
-    <ControlTheme x:Key="FluentDateTimePickerDownButton" TargetType="RepeatButton" BasedOn="{StaticResource FluentDateTimePickerButton}">
-      <Setter Property="VerticalAlignment" Value="Bottom"/>
-      <Setter Property="Height" Value="22" />
-      <Setter Property="HorizontalAlignment" Value="Stretch" />
-      <Setter Property="Focusable" Value="False" />
-      <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
-      <Setter Property="Content">
-        <Template>
-          <Viewbox Height="10" Width="10" HorizontalAlignment="Center" VerticalAlignment="Center">
-            <Path Stroke="{Binding $parent[RepeatButton].Foreground}" StrokeThickness="1" Data="M 0,0 L 9,9 L 18,0"/>
-          </Viewbox>
-        </Template>
-      </Setter>
-    </ControlTheme>
+  <ControlTheme x:Key="FluentDateTimePickerUpButton" TargetType="RepeatButton" BasedOn="{StaticResource FluentDateTimePickerButton}">
+    <Setter Property="VerticalAlignment" Value="Top"/>
+    <Setter Property="Height" Value="22" />
+    <Setter Property="HorizontalAlignment" Value="Stretch" />
+    <Setter Property="Focusable" Value="False" />
+    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
+    <Setter Property="Content">
+      <Template>
+        <Viewbox Height="10" Width="10" HorizontalAlignment="Center" VerticalAlignment="Center">
+          <Path Stroke="{Binding $parent[RepeatButton].Foreground}" StrokeThickness="1" Data="M 0,9 L 9,0 L 18,9"/>
+        </Viewbox>
+      </Template>
+    </Setter>
+  </ControlTheme>
 
-    <ControlTheme x:Key="{x:Type DatePicker}" TargetType="DatePicker">
-      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-      <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForeground}" />
-      <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackground}"/>
-      <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrush}"/>
-      <Setter Property="BorderThickness" Value="1"/>
-      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-      <Setter Property="HorizontalAlignment" Value="Left" />
-      <Setter Property="VerticalAlignment" Value="Center" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <DataValidationErrors>
-            <Grid Name="LayoutRoot" Margin="{TemplateBinding Padding}" RowDefinitions="Auto,*">
-              <ContentPresenter Name="HeaderContentPresenter" Grid.Row="0"
-                                Content="{TemplateBinding Header}"
-                                Foreground="{DynamicResource DatePickerHeaderForeground}"
-                                ContentTemplate="{TemplateBinding HeaderTemplate}"
-                                Margin="{DynamicResource DatePickerTopHeaderMargin}"
-                                MaxWidth="{DynamicResource DatePickerThemeMaxWidth}"
-                                HorizontalAlignment="Stretch"
-                                VerticalAlignment="Top"/>
+  <ControlTheme x:Key="FluentDateTimePickerDownButton" TargetType="RepeatButton" BasedOn="{StaticResource FluentDateTimePickerButton}">
+    <Setter Property="VerticalAlignment" Value="Bottom"/>
+    <Setter Property="Height" Value="22" />
+    <Setter Property="HorizontalAlignment" Value="Stretch" />
+    <Setter Property="Focusable" Value="False" />
+    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
+    <Setter Property="Content">
+      <Template>
+        <Viewbox Height="10" Width="10" HorizontalAlignment="Center" VerticalAlignment="Center">
+          <Path Stroke="{Binding $parent[RepeatButton].Foreground}" StrokeThickness="1" Data="M 0,0 L 9,9 L 18,0"/>
+        </Viewbox>
+      </Template>
+    </Setter>
+  </ControlTheme>
 
-              <Button Name="FlyoutButton" Grid.Row="1"
-                      Foreground="{TemplateBinding Foreground}"
-                      Background="{TemplateBinding Background}"
-                      BorderBrush="{TemplateBinding BorderBrush}"
-                      BorderThickness="{TemplateBinding BorderThickness}"
-                      CornerRadius="{TemplateBinding CornerRadius}"
-                      IsEnabled="{TemplateBinding IsEnabled}"
-                      MinWidth="{DynamicResource DatePickerThemeMinWidth}"
-                      MaxWidth="{DynamicResource DatePickerThemeMaxWidth}"
-                      HorizontalAlignment="Stretch"
-                      VerticalAlignment="Stretch"
-                      HorizontalContentAlignment="Stretch"
-                      VerticalContentAlignment="Stretch"
-                      TemplatedControl.IsTemplateFocusTarget="True">
-                <Button.Template>
-                  <ControlTemplate>
-                    <ContentPresenter Name="ContentPresenter"
-                                      BorderBrush="{TemplateBinding BorderBrush}"
-                                      Background="{TemplateBinding Background}"
-                                      BorderThickness="{TemplateBinding BorderThickness}"
-                                      Content="{TemplateBinding Content}"
-                                      Foreground="{TemplateBinding Foreground}"
-                                      HorizontalContentAlignment="Stretch"
-                                      VerticalContentAlignment="Stretch"
-                                      CornerRadius="{TemplateBinding CornerRadius}"/>
-                  </ControlTemplate>
-                </Button.Template>
-                <Grid Name="ButtonContentGrid" ColumnDefinitions="78*,Auto,132*,Auto,78*">
-                  <TextBlock Name="DayText" Text="day" HorizontalAlignment="Center"
-                             Padding="{DynamicResource DatePickerHostPadding}"
-                             FontFamily="{TemplateBinding FontFamily}"
-                             FontWeight="{TemplateBinding FontWeight}"
-                             FontSize="{TemplateBinding FontSize}"/>
-                  <TextBlock Name="MonthText" Text="month" TextAlignment="Left"
-                             Padding="{DynamicResource DatePickerHostMonthPadding}"
-                             FontFamily="{TemplateBinding FontFamily}"
-                             FontWeight="{TemplateBinding FontWeight}"
-                             FontSize="{TemplateBinding FontSize}"/>
-                  <TextBlock Name="YearText" Text="year" HorizontalAlignment="Center"
-                             Padding="{DynamicResource DatePickerHostPadding}"
-                             FontFamily="{TemplateBinding FontFamily}"
-                             FontWeight="{TemplateBinding FontWeight}"
-                             FontSize="{TemplateBinding FontSize}"/>
-                  <Rectangle x:Name="FirstSpacer"
-                        Fill="{DynamicResource DatePickerSpacerFill}"
-                        HorizontalAlignment="Center"
-                        Width="1"
-                        Grid.Column="1" />
-                  <Rectangle x:Name="SecondSpacer"
-                        Fill="{DynamicResource DatePickerSpacerFill}"
-                        HorizontalAlignment="Center"
-                        Width="1"
-                        Grid.Column="3" />
-                </Grid>
-              </Button>
+  <ControlTheme x:Key="{x:Type DatePicker}" TargetType="DatePicker">
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForeground}" />
+    <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackground}"/>
+    <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrush}"/>
+    <Setter Property="BorderThickness" Value="1"/>
+    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+    <Setter Property="HorizontalAlignment" Value="Left" />
+    <Setter Property="VerticalAlignment" Value="Center" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <DataValidationErrors>
+          <Grid Name="LayoutRoot" Margin="{TemplateBinding Padding}" RowDefinitions="Auto,*">
+            <ContentPresenter Name="HeaderContentPresenter" Grid.Row="0"
+                              Content="{TemplateBinding Header}"
+                              Foreground="{DynamicResource DatePickerHeaderForeground}"
+                              ContentTemplate="{TemplateBinding HeaderTemplate}"
+                              Margin="{DynamicResource DatePickerTopHeaderMargin}"
+                              MaxWidth="{DynamicResource DatePickerThemeMaxWidth}"
+                              HorizontalAlignment="Stretch"
+                              VerticalAlignment="Top"/>
 
-              <Popup Name="Popup" WindowManagerAddShadowHint="False"
-                     IsLightDismissEnabled="True" PlacementTarget="{TemplateBinding}"
-                     PlacementMode="Bottom">
-                <DatePickerPresenter Name="PickerPresenter" />
-              </Popup>
+            <Button Name="FlyoutButton" Grid.Row="1"
+                    Foreground="{TemplateBinding Foreground}"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    CornerRadius="{TemplateBinding CornerRadius}"
+                    IsEnabled="{TemplateBinding IsEnabled}"
+                    MinWidth="{DynamicResource DatePickerThemeMinWidth}"
+                    MaxWidth="{DynamicResource DatePickerThemeMaxWidth}"
+                    HorizontalAlignment="Stretch"
+                    VerticalAlignment="Stretch"
+                    HorizontalContentAlignment="Stretch"
+                    VerticalContentAlignment="Stretch"
+                    TemplatedControl.IsTemplateFocusTarget="True">
+              <Button.Template>
+                <ControlTemplate>
+                  <ContentPresenter Name="ContentPresenter"
+                                    BorderBrush="{TemplateBinding BorderBrush}"
+                                    Background="{TemplateBinding Background}"
+                                    BorderThickness="{TemplateBinding BorderThickness}"
+                                    Content="{TemplateBinding Content}"
+                                    Foreground="{TemplateBinding Foreground}"
+                                    HorizontalContentAlignment="Stretch"
+                                    VerticalContentAlignment="Stretch"
+                                    CornerRadius="{TemplateBinding CornerRadius}"/>
+                </ControlTemplate>
+              </Button.Template>
+              <Grid Name="ButtonContentGrid" ColumnDefinitions="78*,Auto,132*,Auto,78*">
+                <TextBlock Name="DayText" Text="day" HorizontalAlignment="Center"
+                           Padding="{DynamicResource DatePickerHostPadding}"
+                           FontFamily="{TemplateBinding FontFamily}"
+                           FontWeight="{TemplateBinding FontWeight}"
+                           FontSize="{TemplateBinding FontSize}"/>
+                <TextBlock Name="MonthText" Text="month" TextAlignment="Left"
+                           Padding="{DynamicResource DatePickerHostMonthPadding}"
+                           FontFamily="{TemplateBinding FontFamily}"
+                           FontWeight="{TemplateBinding FontWeight}"
+                           FontSize="{TemplateBinding FontSize}"/>
+                <TextBlock Name="YearText" Text="year" HorizontalAlignment="Center"
+                           Padding="{DynamicResource DatePickerHostPadding}"
+                           FontFamily="{TemplateBinding FontFamily}"
+                           FontWeight="{TemplateBinding FontWeight}"
+                           FontSize="{TemplateBinding FontSize}"/>
+                <Rectangle x:Name="FirstSpacer"
+                      Fill="{DynamicResource DatePickerSpacerFill}"
+                      HorizontalAlignment="Center"
+                      Width="1"
+                      Grid.Column="1" />
+                <Rectangle x:Name="SecondSpacer"
+                      Fill="{DynamicResource DatePickerSpacerFill}"
+                      HorizontalAlignment="Center"
+                      Width="1"
+                      Grid.Column="3" />
+              </Grid>
+            </Button>
 
-            </Grid>
-          </DataValidationErrors>
-        </ControlTemplate>
-      </Setter>
+            <Popup Name="Popup" WindowManagerAddShadowHint="False"
+                   IsLightDismissEnabled="True" PlacementTarget="{TemplateBinding}"
+                   PlacementMode="Bottom">
+              <DatePickerPresenter Name="PickerPresenter" />
+            </Popup>
 
-      <Style Selector="^:disabled /template/ Rectangle">
-        <Setter Property="Fill" Value="{DynamicResource DatePickerSpacerFillDisabled}"/>
-      </Style>
+          </Grid>
+        </DataValidationErrors>
+      </ControlTemplate>
+    </Setter>
 
-      <!-- Changes foreground for watermark text when SelectedDate is null-->
-      <Style Selector="^:hasnodate /template/ Button#FlyoutButton TextBlock">
-        <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForeground}"/>
-      </Style>
-      <Style Selector="^/template/ Button#FlyoutButton">
-        <Style Selector="^:pointerover">
-          <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushPointerOver}"/>
-          <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundPointerOver}"/>
-          <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundPointerOver}"/>
-        </Style>
+    <Style Selector="^:disabled /template/ Rectangle">
+      <Setter Property="Fill" Value="{DynamicResource DatePickerSpacerFillDisabled}"/>
+    </Style>
 
-        <Style Selector="^:pressed">
-          <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushPressed}"/>
-          <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundPressed}"/>
-          <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundPressed}"/>
-        </Style>
+    <!-- Changes foreground for watermark text when SelectedDate is null-->
+    <Style Selector="^:hasnodate /template/ Button#FlyoutButton TextBlock">
+      <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForeground}"/>
+    </Style>
+    <Style Selector="^/template/ Button#FlyoutButton">
+      <Style Selector="^:pointerover">
+        <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushPointerOver}"/>
+        <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundPointerOver}"/>
+        <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundPointerOver}"/>
+      </Style>
 
-        <Style Selector="^:disabled">
-          <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushDisabled}"/>
-          <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundDisabled}"/>
-          <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundDisabled}"/>
-        </Style>
+      <Style Selector="^:pressed">
+        <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushPressed}"/>
+        <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundPressed}"/>
+        <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundPressed}"/>
       </Style>
-      <Style Selector="^:error /template/ Button#FlyoutButton">
-        <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
+
+      <Style Selector="^:disabled">
+        <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushDisabled}"/>
+        <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundDisabled}"/>
+        <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundDisabled}"/>
       </Style>
-    </ControlTheme>
+    </Style>
+    <Style Selector="^:error /template/ Button#FlyoutButton">
+      <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
+    </Style>
+  </ControlTheme>
 
-    <!--WinUI: DatePickerFlyoutPresenter-->
-    <ControlTheme x:Key="{x:Type DatePickerPresenter}" TargetType="DatePickerPresenter">
-      <Setter Property="Width" Value="296" />
-      <Setter Property="MinWidth" Value="296" />
-      <Setter Property="MaxHeight" Value="398" />
-      <Setter Property="FontWeight" Value="Normal" />
-      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-      <Setter Property="Background" Value="{DynamicResource DatePickerFlyoutPresenterBackground}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource DatePickerFlyoutPresenterBorderBrush}" />
-      <Setter Property="BorderThickness" Value="{DynamicResource DateTimeFlyoutBorderThickness}" />
-      <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Border Name="Background" Background="{TemplateBinding Background}"
-                  BorderBrush="{TemplateBinding BorderBrush}"
-                  BorderThickness="{TemplateBinding BorderThickness}"
-                  Padding="{DynamicResource DateTimeFlyoutBorderPadding}"
-                  MaxHeight="398" CornerRadius="{TemplateBinding CornerRadius}">
-            <Grid Name="ContentRoot" RowDefinitions="*,Auto">
-              <Grid Name="PickerContainer">
-                <Grid.Styles>
-                  <Style Selector="DateTimePickerPanel > ListBoxItem">
-                    <Setter Property="Theme" Value="{StaticResource FluentDateTimePickerItem}" />
-                  </Style>
-                </Grid.Styles>
-                <!--Column Definitions set in code, ignore here-->
-                <Panel Name="MonthHost">
-                  <ScrollViewer HorizontalScrollBarVisibility="Disabled"
-                                VerticalScrollBarVisibility="Hidden">
-                    <DateTimePickerPanel Name="MonthSelector"
-                                         PanelType="Month"
-                                         ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
-                                         ShouldLoop="True" />
-                  </ScrollViewer>
-                  <RepeatButton Name="MonthUpButton" Theme="{StaticResource FluentDateTimePickerUpButton}"/>
-                  <RepeatButton Name="MonthDownButton" Theme="{StaticResource FluentDateTimePickerDownButton}"/>
-                </Panel>
-                <Panel Name="DayHost">
-                  <ScrollViewer HorizontalScrollBarVisibility="Disabled"
-                                VerticalScrollBarVisibility="Hidden">
-                    <DateTimePickerPanel Name="DaySelector"
-                                         PanelType="Day"
-                                         ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
-                                         ShouldLoop="True" />
-                  </ScrollViewer>
-                  <RepeatButton Name="DayUpButton" Theme="{StaticResource FluentDateTimePickerUpButton}"/>
-                  <RepeatButton Name="DayDownButton" Theme="{StaticResource FluentDateTimePickerDownButton}"/>
-                </Panel>
-                <Panel Name="YearHost">
-                  <ScrollViewer HorizontalScrollBarVisibility="Disabled"
-                                VerticalScrollBarVisibility="Hidden">
-                    <DateTimePickerPanel Name="YearSelector"
-                                         PanelType="Year"
-                                         ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
-                                         ShouldLoop="False" />
-                  </ScrollViewer>
-                  <RepeatButton Name="YearUpButton" Theme="{StaticResource FluentDateTimePickerUpButton}"/>
-                  <RepeatButton Name="YearDownButton" Theme="{StaticResource FluentDateTimePickerDownButton}"/>
-                </Panel>
-                <Rectangle Name="HighlightRect" IsHitTestVisible="False" ZIndex="-1"
-                           Fill="{DynamicResource DatePickerFlyoutPresenterHighlightFill}"
-                           Grid.Column="0" Grid.ColumnSpan="5" VerticalAlignment="Center"
-                           Height="{DynamicResource DatePickerFlyoutPresenterHighlightHeight}" />
-                <Rectangle Name="FirstSpacer"
-                           Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
-                           HorizontalAlignment="Center"
-                           Width="{DynamicResource DatePickerSpacerThemeWidth}"
-                           Grid.Column="1" />
-                <Rectangle Name="SecondSpacer"
-                           Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
-                           HorizontalAlignment="Center"
-                           Width="{DynamicResource DatePickerSpacerThemeWidth}"
-                           Grid.Column="3" />
-              </Grid>
-              <Grid Grid.Row="1" Height="{DynamicResource DatePickerFlyoutPresenterAcceptDismissHostGridHeight}"
-                    Name="AcceptDismissGrid" ColumnDefinitions="*,*">
-                <Rectangle Height="{DynamicResource DatePickerSpacerThemeWidth}" VerticalAlignment="Top"
-                           Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
-                           Grid.ColumnSpan="2"/>
-                <Button Name="AcceptButton" Grid.Column="0" Theme="{StaticResource FluentDateTimePickerButton}"
-                        HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                  <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
-                        StrokeThickness="0.75" Data="M0.5,8.5 5,13.5 15.5,3" />
-                </Button>
-                <Button Name="DismissButton" Grid.Column="1" Theme="{StaticResource FluentDateTimePickerButton}"
-                        FontSize="16" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                  <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
-                        StrokeThickness="0.75" Data="M2,2 14,14 M2,14 14 2" />
-                </Button>
-              </Grid>
+  <!--WinUI: DatePickerFlyoutPresenter-->
+  <ControlTheme x:Key="{x:Type DatePickerPresenter}" TargetType="DatePickerPresenter">
+    <Setter Property="Width" Value="296" />
+    <Setter Property="MinWidth" Value="296" />
+    <Setter Property="MaxHeight" Value="398" />
+    <Setter Property="FontWeight" Value="Normal" />
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="Background" Value="{DynamicResource DatePickerFlyoutPresenterBackground}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource DatePickerFlyoutPresenterBorderBrush}" />
+    <Setter Property="BorderThickness" Value="{DynamicResource DateTimeFlyoutBorderThickness}" />
+    <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Name="Background" Background="{TemplateBinding Background}"
+                BorderBrush="{TemplateBinding BorderBrush}"
+                BorderThickness="{TemplateBinding BorderThickness}"
+                Padding="{DynamicResource DateTimeFlyoutBorderPadding}"
+                MaxHeight="398" CornerRadius="{TemplateBinding CornerRadius}">
+          <Grid Name="ContentRoot" RowDefinitions="*,Auto">
+            <Grid Name="PickerContainer">
+              <Grid.Styles>
+                <Style Selector="DateTimePickerPanel > ListBoxItem">
+                  <Setter Property="Theme" Value="{StaticResource FluentDateTimePickerItem}" />
+                </Style>
+              </Grid.Styles>
+              <!--Column Definitions set in code, ignore here-->
+              <Panel Name="MonthHost">
+                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
+                              VerticalScrollBarVisibility="Hidden">
+                  <DateTimePickerPanel Name="MonthSelector"
+                                       PanelType="Month"
+                                       ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
+                                       ShouldLoop="True" />
+                </ScrollViewer>
+                <RepeatButton Name="MonthUpButton" Theme="{StaticResource FluentDateTimePickerUpButton}"/>
+                <RepeatButton Name="MonthDownButton" Theme="{StaticResource FluentDateTimePickerDownButton}"/>
+              </Panel>
+              <Panel Name="DayHost">
+                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
+                              VerticalScrollBarVisibility="Hidden">
+                  <DateTimePickerPanel Name="DaySelector"
+                                       PanelType="Day"
+                                       ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
+                                       ShouldLoop="True" />
+                </ScrollViewer>
+                <RepeatButton Name="DayUpButton" Theme="{StaticResource FluentDateTimePickerUpButton}"/>
+                <RepeatButton Name="DayDownButton" Theme="{StaticResource FluentDateTimePickerDownButton}"/>
+              </Panel>
+              <Panel Name="YearHost">
+                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
+                              VerticalScrollBarVisibility="Hidden">
+                  <DateTimePickerPanel Name="YearSelector"
+                                       PanelType="Year"
+                                       ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
+                                       ShouldLoop="False" />
+                </ScrollViewer>
+                <RepeatButton Name="YearUpButton" Theme="{StaticResource FluentDateTimePickerUpButton}"/>
+                <RepeatButton Name="YearDownButton" Theme="{StaticResource FluentDateTimePickerDownButton}"/>
+              </Panel>
+              <Rectangle Name="HighlightRect" IsHitTestVisible="False" ZIndex="-1"
+                         Fill="{DynamicResource DatePickerFlyoutPresenterHighlightFill}"
+                         Grid.Column="0" Grid.ColumnSpan="5" VerticalAlignment="Center"
+                         Height="{DynamicResource DatePickerFlyoutPresenterHighlightHeight}" />
+              <Rectangle Name="FirstSpacer"
+                         Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
+                         HorizontalAlignment="Center"
+                         Width="{DynamicResource DatePickerSpacerThemeWidth}"
+                         Grid.Column="1" />
+              <Rectangle Name="SecondSpacer"
+                         Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
+                         HorizontalAlignment="Center"
+                         Width="{DynamicResource DatePickerSpacerThemeWidth}"
+                         Grid.Column="3" />
             </Grid>
-          </Border>
-        </ControlTemplate>
-      </Setter>
+            <Grid Grid.Row="1" Height="{DynamicResource DatePickerFlyoutPresenterAcceptDismissHostGridHeight}"
+                  Name="AcceptDismissGrid" ColumnDefinitions="*,*">
+              <Rectangle Height="{DynamicResource DatePickerSpacerThemeWidth}" VerticalAlignment="Top"
+                         Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
+                         Grid.ColumnSpan="2"/>
+              <Button Name="AcceptButton" Grid.Column="0" Theme="{StaticResource FluentDateTimePickerButton}"
+                      HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
+                      StrokeThickness="0.75" Data="M0.5,8.5 5,13.5 15.5,3" />
+              </Button>
+              <Button Name="DismissButton" Grid.Column="1" Theme="{StaticResource FluentDateTimePickerButton}"
+                      FontSize="16" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
+                      StrokeThickness="0.75" Data="M2,2 14,14 M2,14 14 2" />
+              </Button>
+            </Grid>
+          </Grid>
+        </Border>
+      </ControlTemplate>
+    </Setter>
 
-      <Style Selector="^ /template/ Panel">
-        <Style Selector="^ RepeatButton">
-          <Setter Property="IsVisible" Value="False" />
-        </Style>
+    <Style Selector="^ /template/ Panel">
+      <Style Selector="^ RepeatButton">
+        <Setter Property="IsVisible" Value="False" />
+      </Style>
 
-        <Style Selector="^:pointerover RepeatButton">
-          <Setter Property="IsVisible" Value="True" />
-        </Style>
-      </Style> 
-    </ControlTheme>
+      <Style Selector="^:pointerover RepeatButton">
+        <Setter Property="IsVisible" Value="True" />
+      </Style>
+    </Style>
+  </ControlTheme>
 
 
 </ResourceDictionary>

From c4541e27db84734a963dc785060ca023a2606283 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Sat, 9 Jul 2022 00:48:00 +0200
Subject: [PATCH 51/70] Ported ManagedFileChooser to ControlTheme.

---
 .../Controls/FluentControls.xaml              |   4 +-
 .../Controls/ManagedFileChooser.xaml          | 156 +++++++++---------
 2 files changed, 82 insertions(+), 78 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
index 0b5f6a4a72..1c936ba097 100644
--- a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
@@ -59,6 +59,8 @@
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/DropDownButton.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/EmbeddableControlRoot.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Slider.xaml" />
+                <!--  ManagedFileChooser comes last because it uses (and overrides) styles for a multitude of other controls...the dialogs were originally UserControls, after all  -->
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ManagedFileChooser.xaml" />
             </ResourceDictionary.MergedDictionaries>
         </ResourceDictionary>
     </Styles.Resources>
@@ -72,7 +74,5 @@
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitView.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/UserControl.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TimePicker.xaml" />
-    <!--  ManagedFileChooser comes last because it uses (and overrides) styles for a multitude of other controls...the dialogs were originally UserControls, after all  -->
-    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ManagedFileChooser.xaml" />
     <Styles.Resources />
 </Styles>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ManagedFileChooser.xaml b/src/Avalonia.Themes.Fluent/Controls/ManagedFileChooser.xaml
index dc454e4fdb..55f4893057 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ManagedFileChooser.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ManagedFileChooser.xaml
@@ -1,8 +1,14 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:dialogs="clr-namespace:Avalonia.Dialogs;assembly=Avalonia.Dialogs">
-  <Style Selector="dialogs|ManagedFileChooser">
-    <Style.Resources>
+  <Design.PreviewWith>
+    <Border Padding="20" Width="800" Height="500">
+      <dialogs:ManagedFileChooser/>
+    </Border>
+  </Design.PreviewWith>
+
+  <ControlTheme x:Key="{x:Type dialogs:ManagedFileChooser}" TargetType="dialogs:ManagedFileChooser">
+    <ControlTheme.Resources>
       <ResourceDictionary>
         <GradientStops x:Key="IconRes.FolderBackGradientStops">
         </GradientStops>
@@ -124,7 +130,7 @@
           </DrawingGroup>
         </dialogs:ResourceSelectorConverter>
       </ResourceDictionary>
-    </Style.Resources>
+    </ControlTheme.Resources>
     <Setter Property="Template">
       <ControlTemplate>
         <DockPanel>
@@ -246,79 +252,77 @@
         </DockPanel>
       </ControlTemplate>
     </Setter>
-  </Style>
+    <Style Selector="^ /template/ ListBox#QuickLinks">
+      <Setter Property="Margin" Value="0"/>
+      <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumBrush}"/>
+      <Setter Property="BorderThickness" Value="0"/>
+      <Setter Property="Width" Value="240"/>
+      <Setter Property="Padding" Value="0,20"/>
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Border Name="border" BoxShadow="inset -6 0 3 -3 #20000000" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
+            <ScrollViewer Name="PART_ScrollViewer" HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}" VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}">
+              <ItemsPresenter Name="PART_ItemsPresenter"
+                              Items="{TemplateBinding Items}"
+                              ItemsPanel="{TemplateBinding ItemsPanel}"
+                              ItemTemplate="{TemplateBinding ItemTemplate}"
+                              Margin="{TemplateBinding Padding}"
+                              VirtualizationMode="{TemplateBinding VirtualizationMode}"/>
+            </ScrollViewer>
+          </Border>
+        </ControlTemplate>
+      </Setter>
+      <Setter Property="ItemContainerTheme">
+        <ControlTheme TargetType="ListBoxItem">
+          <Setter Property="Height" Value="32"/>
+          <Setter Property="Padding" Value="30,6"/>
+          <Setter Property="Template">
+            <ControlTemplate>
+              <Border x:Name="LayoutRoot" CornerRadius="2" Margin="10,0">
+                <Panel>
+                  <Border x:Name="SelectedLine" HorizontalAlignment="Left" Margin="2,6" CornerRadius="0.5" Width="3" Background="{DynamicResource SystemControlHighlightAccentBrush}" IsVisible="{TemplateBinding IsSelected}"/>
+                  <ContentPresenter Name="PART_ContentPresenter"
+                              Background="Transparent"
+                              BorderBrush="Transparent"
+                              BorderThickness="0"
+                              ContentTemplate="{TemplateBinding ContentTemplate}"
+                              Content="{TemplateBinding Content}"
+                              Padding="{TemplateBinding Padding}"
+                              VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                              HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
 
+                </Panel>
+              </Border>
+            </ControlTemplate>
+          </Setter>
 
-  <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks">
-    <Setter Property="Margin" Value="0"/>
-    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumBrush}"/>
-    <Setter Property="BorderThickness" Value="0"/>
-    <Setter Property="Width" Value="240"/>
-    <Setter Property="Padding" Value="0,20"/>
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border Name="border" BoxShadow="inset -6 0 3 -3 #20000000" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
-          <ScrollViewer Name="PART_ScrollViewer" HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}" VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}">
-            <ItemsPresenter Name="PART_ItemsPresenter"
-                            Items="{TemplateBinding Items}"
-                            ItemsPanel="{TemplateBinding ItemsPanel}"
-                            ItemTemplate="{TemplateBinding ItemTemplate}"
-                            Margin="{TemplateBinding Padding}"
-                            VirtualizationMode="{TemplateBinding VirtualizationMode}"/>
-          </ScrollViewer>
-        </Border>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-  <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks ListBoxItem">
-    <Setter Property="Height" Value="32"/>
-    <Setter Property="Padding" Value="30,6"/>
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border x:Name="LayoutRoot" CornerRadius="2" Margin="10,0">
-          <Panel>
-            <Border x:Name="SelectedLine" HorizontalAlignment="Left" Margin="2,6" CornerRadius="0.5" Width="3" Background="{DynamicResource SystemControlHighlightAccentBrush}" IsVisible="{TemplateBinding IsSelected}"/>
-            <ContentPresenter Name="PART_ContentPresenter"
-                        Background="Transparent"
-                        BorderBrush="Transparent"
-                        BorderThickness="0"
-                        ContentTemplate="{TemplateBinding ContentTemplate}"
-                        Content="{TemplateBinding Content}"
-                        Padding="{TemplateBinding Padding}"
-                        VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                        HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
+          <Style Selector="^:pointerover /template/ Border#LayoutRoot">
+            <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltMediumBrush}"/>
+          </Style>
+          <Style Selector="^:selected /template/ Border#LayoutRoot">
+            <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltMediumHighBrush}"/>
+          </Style>
+        </ControlTheme>
+      </Setter>
+    </Style>
 
-          </Panel>
-        </Border>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-  <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks ListBoxItem:pointerover /template/ Border#LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltMediumBrush}"/>
-  </Style>
-  <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks ListBoxItem:selected /template/ Border#LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltMediumHighBrush}"/>
-  </Style>
-  <Style Selector="dialogs|ManagedFileChooser /template/ DockPanel#NavBar Button,
-                    dialogs|ManagedFileChooser /template/ DockPanel#NavBar TextBox">
-    <Setter Property="Height" Value="30"/>
-  </Style>
-  <Style Selector="dialogs|ManagedFileChooser /template/ DockPanel#NavBar Button">
-    <Setter Property="VerticalAlignment" Value="Stretch"/>
-    <Setter Property="Width" Value="40"/>
-    <Setter Property="Margin" Value="0,0,8,0"/>
-    <Setter Property="BorderThickness" Value="0"/>
-  </Style>
-  <Style Selector="dialogs|ManagedFileChooser /template/ DockPanel#NavBar Button:not(:pointerover):not(:pressed)">
-    <Setter Property="Background" Value="Transparent"/>
-  </Style>
+    <Style Selector="^ /template/ DockPanel#NavBar Button, ^ /template/ DockPanel#NavBar TextBox">
+      <Setter Property="Height" Value="30"/>
+    </Style>
+    <Style Selector="^ /template/ DockPanel#NavBar Button">
+      <Setter Property="VerticalAlignment" Value="Stretch"/>
+      <Setter Property="Width" Value="40"/>
+      <Setter Property="Margin" Value="0,0,8,0"/>
+      <Setter Property="BorderThickness" Value="0"/>
+    </Style>
+    <Style Selector="^ /template/ DockPanel#NavBar Button:not(:pointerover):not(:pressed)">
+      <Setter Property="Background" Value="Transparent"/>
+    </Style>
 
-  <Style Selector="dialogs|ManagedFileChooser /template/ UniformGrid#Finalize > Button">
-    <Setter Property="HorizontalContentAlignment" Value="Center"/>
-    <Setter Property="HorizontalAlignment" Value="Stretch"/>
-    <Setter Property="Margin" Value="4,0,0,0"/>
-  </Style>
-  <Style Selector="dialogs|ManagedFileChooser /template/ UniformGrid#Finalize > Button /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="HorizontalAlignment" Value="Stretch"/>
-  </Style>
-</Styles>
+    <Style Selector="^ /template/ UniformGrid#Finalize > Button">
+      <Setter Property="HorizontalContentAlignment" Value="Center"/>
+      <Setter Property="HorizontalAlignment" Value="Stretch"/>
+      <Setter Property="Margin" Value="4,0,0,0"/>
+    </Style>
+  </ControlTheme>
+</ResourceDictionary>

From da264ac4d0587b7cd6bd36cf0181caafacd83642 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Sat, 9 Jul 2022 02:20:14 +0200
Subject: [PATCH 52/70] WIP: Menu/Item.

Something strange is happening when you open the menu a 3rd time.
---
 .../Controls/FluentControls.xaml              |   2 +-
 src/Avalonia.Themes.Fluent/Controls/Menu.xaml |  82 ++++-
 .../Controls/MenuItem.xaml                    | 303 +++++++-----------
 3 files changed, 191 insertions(+), 196 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
index 1c936ba097..6d51dac17f 100644
--- a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
@@ -26,6 +26,7 @@
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ListBox.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ListBoxItem.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Menu.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/MenuItem.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/MenuFlyoutPresenter.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/NativeMenuBar.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/NotificationCard.xaml" />
@@ -67,7 +68,6 @@
 
     <!--  Define ToolTip first so its styles can be overriden by other controls (e.g. TextBox)  -->
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/FocusAdorner.xaml" />
-    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/MenuItem.xaml" />
     <!--  TabControl needs to come after TabStrip as it redefines the inner TabStrip.ItemsPanel  -->
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TreeViewItem.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitButton.xaml" />
diff --git a/src/Avalonia.Themes.Fluent/Controls/Menu.xaml b/src/Avalonia.Themes.Fluent/Controls/Menu.xaml
index 11d21b6b23..3e0e81f870 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Menu.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Menu.xaml
@@ -3,17 +3,95 @@
   <Design.PreviewWith>
     <Border Padding="20">
       <Menu>
-        <MenuItem Header="New" />
-        <MenuItem Header="Open" />
+        <MenuItem Header="_Standard" />
+        <MenuItem Header="Selected" IsSelected="True" />
+        <MenuItem Header="Disabled" IsEnabled="False"/>
       </Menu>
     </Border>
   </Design.PreviewWith>
 
   <x:Double x:Key="MenuBarHeight">32</x:Double>
 
+  <ControlTheme x:Key="FluentTopLevelMenuItem" TargetType="MenuItem">
+    <Setter Property="Background" Value="{DynamicResource MenuFlyoutItemBackground}" />
+    <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemForeground}" />
+    <!--  Narrow padding should be used for mouse input, when non-narrow one should be used for touch input in future.  -->
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="Padding" Value="{DynamicResource MenuBarItemPadding}" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Name="PART_LayoutRoot"
+                Background="{TemplateBinding Background}"
+                BorderBrush="{TemplateBinding BorderBrush}"
+                BorderThickness="{TemplateBinding BorderThickness}"
+                CornerRadius="{TemplateBinding CornerRadius}">
+          <Panel>
+            <ContentPresenter Name="PART_HeaderPresenter"
+                              Content="{TemplateBinding Header}"
+                              VerticalAlignment="Center"
+                              HorizontalAlignment="Stretch"
+                              RecognizesAccessKey="True"
+                              Margin="{TemplateBinding Padding}"/>
+            <Popup Name="PART_Popup"
+                   WindowManagerAddShadowHint="False"
+                   MinWidth="{ReflectionBinding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
+                   IsLightDismissEnabled="True"
+                   IsOpen="{TemplateBinding IsSubMenuOpen, Mode=TwoWay}"
+                   OverlayInputPassThroughElement="{Binding $parent[Menu]}">
+              <Border Background="{DynamicResource MenuFlyoutPresenterBackground}"
+                      BorderBrush="{DynamicResource MenuFlyoutPresenterBorderBrush}"
+                      BorderThickness="{DynamicResource MenuFlyoutPresenterBorderThemeThickness}"
+                      Padding="{DynamicResource MenuFlyoutPresenterThemePadding}"
+                      MaxWidth="{DynamicResource FlyoutThemeMaxWidth}"
+                      MinHeight="{DynamicResource MenuFlyoutThemeMinHeight}"
+                      HorizontalAlignment="Stretch"
+                      CornerRadius="{DynamicResource OverlayCornerRadius}">
+                <ScrollViewer Classes="menuscroller">
+                  <ItemsPresenter Name="PART_ItemsPresenter"
+                                  Items="{TemplateBinding Items}"
+                                  ItemsPanel="{TemplateBinding ItemsPanel}"
+                                  ItemTemplate="{TemplateBinding ItemTemplate}"
+                                  Margin="{DynamicResource MenuFlyoutScrollerMargin}"
+                                  Grid.IsSharedSizeScope="True" />
+                </ScrollViewer>
+              </Border>
+            </Popup>
+          </Panel>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+
+    <Style Selector="^:selected">
+      <Style Selector="^ /template/ Border#PART_LayoutRoot">
+        <Setter Property="Background" Value="{DynamicResource MenuFlyoutItemBackgroundPointerOver}" />
+      </Style>
+      <Style Selector="^ /template/ ContentPresenter#PART_HeaderPresenter">
+        <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemForegroundPointerOver}" />
+      </Style>
+    </Style>
+
+    <!--  Listen for PART_LayoutRoot:pointerover, so it will not be triggered when subitem is pressed  -->
+    <Style Selector="^:pressed /template/ Border#PART_LayoutRoot:pointerover">
+      <Setter Property="Background" Value="{DynamicResource MenuFlyoutItemBackgroundPressed}" />
+      <Style Selector="^ ContentPresenter#PART_HeaderPresenter">
+        <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemForegroundPressed}" />
+      </Style>
+    </Style>
+
+    <Style Selector="^:disabled">
+      <Style Selector="^ /template/ Border#PART_LayoutRoot">
+        <Setter Property="Background" Value="{DynamicResource MenuFlyoutItemBackgroundDisabled}" />
+      </Style>
+      <Style Selector="^ /template/ ContentPresenter#PART_HeaderPresenter">
+        <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemForegroundDisabled}" />
+      </Style>
+    </Style>
+  </ControlTheme>
+
   <ControlTheme x:Key="{x:Type Menu}" TargetType="Menu">
     <Setter Property="Background" Value="Transparent" />
     <Setter Property="Height" Value="{DynamicResource MenuBarHeight}" />
+    <Setter Property="ItemContainerTheme" Value="{StaticResource FluentTopLevelMenuItem}"/>
     <Setter Property="Template">
       <ControlTemplate>
         <Border Background="{TemplateBinding Background}"
diff --git a/src/Avalonia.Themes.Fluent/Controls/MenuItem.xaml b/src/Avalonia.Themes.Fluent/Controls/MenuItem.xaml
index b7a9435749..3ec65c4936 100644
--- a/src/Avalonia.Themes.Fluent/Controls/MenuItem.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/MenuItem.xaml
@@ -1,60 +1,48 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        xmlns:conv="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls"
-        xmlns:sys="clr-namespace:System;assembly=netstandard"
-        x:DataType="MenuItem"
-        x:CompileBindings="True">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:conv="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls"
+                    xmlns:sys="clr-namespace:System;assembly=netstandard"
+                    x:DataType="MenuItem"
+                    x:CompileBindings="True">
   <Design.PreviewWith>
-    <Border Padding="20"
-            Width="400"
-            Height="200">
-      <Menu VerticalAlignment="Top">
-        <MenuItem Header="File">
-          <MenuItem Header="Disabled"
-                    IsEnabled="False" />
-          <MenuItem Header="New"
-                    InputGesture="Ctrl+N">
-            <MenuItem Header="XML" />
-          </MenuItem>
-          <MenuItem Header="Open">
-            <MenuItem.Icon>
-              <CheckBox BorderThickness="0"
-                        IsHitTestVisible="False"
-                        IsChecked="True" />
-            </MenuItem.Icon>
-          </MenuItem>
-          <Separator />
-          <MenuItem Header="Exit"
-                    InputGesture="Alt+F4" />
+    <Border Padding="20">
+      <StackPanel Spacing="20">
+        <MenuItem Header="_Standard"/>
+        <MenuItem IsSelected="True" Header="Selected"/>
+        <MenuItem Header="With Icon">
+          <MenuItem.Icon>
+            <TextBlock>😊</TextBlock>
+          </MenuItem.Icon>
         </MenuItem>
-        <MenuItem Header="Edit">
-          <MenuItem Header="Go To">
-            <MenuItem Header="Go To Line" />
-          </MenuItem>
+        <MenuItem Header="With CheckBox">
+          <MenuItem.Icon>
+            <CheckBox IsChecked="True"/>
+          </MenuItem.Icon>
         </MenuItem>
-        <MenuItem Header="View">
-          <MenuItem Header="Designer"
-                    InputGesture="Shift+F7" />
+        <MenuItem Header="Input Gesture" InputGesture="Ctrl+G"/>
+        <MenuItem Header="Disabled" IsEnabled="False"/>
+        <MenuItem Header="-"/>
+        <MenuItem Header="Parent">
+          <MenuItem Header="Child"/>
         </MenuItem>
-        <MenuItem Header="Project">
-          <MenuItem Header="Add class" />
+        <MenuItem Header="Disabled Parent" IsEnabled="False">
+          <MenuItem Header="Child"/>
         </MenuItem>
-      </Menu>
+      </StackPanel>
     </Border>
   </Design.PreviewWith>
 
-  <Styles.Resources>
-    <conv:PlatformKeyGestureConverter x:Key="KeyGestureConverter" />
-    <x:Double x:Key="MenuFlyoutSubItemPopupHorizontalOffset">-4</x:Double>
-    <Thickness x:Key="MenuIconPresenterMargin">0,0,12,0</Thickness>
-    <Thickness x:Key="MenuInputGestureTextMargin">24,0,0,0</Thickness>
-    <StreamGeometry x:Key="MenuItemChevronPathData">M 1,0 10,10 l -9,10 -1,-1 L 8,10 -0,1 Z</StreamGeometry>
-  </Styles.Resources>
+  <conv:PlatformKeyGestureConverter x:Key="KeyGestureConverter" />
+  <x:Double x:Key="MenuFlyoutSubItemPopupHorizontalOffset">-4</x:Double>
+  <Thickness x:Key="MenuIconPresenterMargin">0,0,12,0</Thickness>
+  <Thickness x:Key="MenuInputGestureTextMargin">24,0,0,0</Thickness>
+  <StreamGeometry x:Key="MenuItemChevronPathData">M 1,0 10,10 l -9,10 -1,-1 L 8,10 -0,1 Z</StreamGeometry>
 
-  <Style Selector="MenuItem">
+  <ControlTheme x:Key="{x:Type MenuItem}" TargetType="MenuItem">
     <Setter Property="Background" Value="{DynamicResource MenuFlyoutItemBackground}" />
     <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemForeground}" />
-    <Setter Property="Padding" Value="{DynamicResource MenuFlyoutItemThemePadding}" />
+    <!--  Narrow padding should be used for mouse input, when non-narrow one should be used for touch input in future.  -->
+    <Setter Property="Padding" Value="{DynamicResource MenuFlyoutItemThemePaddingNarrow}" />
     <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
     <Setter Property="Template">
       <ControlTemplate>
@@ -75,35 +63,37 @@
                 <ColumnDefinition Width="Auto"
                                   SharedSizeGroup="MenuItemChevron" />
               </Grid.ColumnDefinitions>
-              <ContentPresenter Name="PART_IconPresenter"
-                                Content="{TemplateBinding Icon}"
-                                Margin="{DynamicResource MenuIconPresenterMargin}"
-                                HorizontalAlignment="Center"
-                                VerticalAlignment="Center" />
+
+              <Viewbox Name="PART_IconPresenter"
+                       Margin="{DynamicResource MenuIconPresenterMargin}"
+                       StretchDirection="DownOnly"
+                       HorizontalAlignment="Center"
+                       VerticalAlignment="Center"
+                       IsVisible="False"
+                       Width="16" Height="16">
+                <ContentPresenter Content="{TemplateBinding Icon}"/>
+              </Viewbox>
 
               <ContentPresenter Name="PART_HeaderPresenter"
                                 Content="{TemplateBinding Header}"
                                 VerticalAlignment="Center"
                                 HorizontalAlignment="Stretch"
-                                Grid.Column="1">
-                <ContentPresenter.DataTemplates>
-                  <DataTemplate DataType="sys:String">
-                    <AccessText Text="{Binding}" />
-                  </DataTemplate>
-                </ContentPresenter.DataTemplates>
-              </ContentPresenter>
+                                RecognizesAccessKey="True"
+                                Grid.Column="1"/>
               <TextBlock x:Name="PART_InputGestureText"
                          Grid.Column="2"
                          Classes="CaptionTextBlockStyle"
                          Margin="{DynamicResource MenuInputGestureTextMargin}"
                          Text="{TemplateBinding InputGesture, Converter={StaticResource KeyGestureConverter}}"
                          HorizontalAlignment="Right"
-                         VerticalAlignment="Center" />
+                         VerticalAlignment="Center"
+                         Foreground="{DynamicResource MenuFlyoutItemKeyboardAcceleratorTextForeground}"/>
               <Path Name="PART_ChevronPath"
                     Stretch="Uniform"
                     Width="8"
                     Height="16"
                     Data="{StaticResource MenuItemChevronPathData}"
+                    Fill="{DynamicResource MenuFlyoutSubItemChevron}"
                     Margin="{DynamicResource MenuFlyoutItemChevronMargin}"
                     VerticalAlignment="Center"
                     Grid.Column="3" />
@@ -136,144 +126,71 @@
         </Panel>
       </ControlTemplate>
     </Setter>
-  </Style>
-
-  <Style Selector="Menu > MenuItem">
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Border Name="PART_LayoutRoot"
-                Background="{TemplateBinding Background}"
-                BorderBrush="{TemplateBinding BorderBrush}"
-                BorderThickness="{TemplateBinding BorderThickness}"
-                CornerRadius="{TemplateBinding CornerRadius}">
-          <Panel>
-            <ContentPresenter Name="PART_HeaderPresenter"
-                              Content="{TemplateBinding Header}"
-                              VerticalAlignment="Center"
-                              HorizontalAlignment="Stretch"
-                              Margin="{TemplateBinding Padding}">
-              <ContentPresenter.DataTemplates>
-                <DataTemplate DataType="sys:String">
-                  <AccessText Text="{Binding}" />
-                </DataTemplate>
-              </ContentPresenter.DataTemplates>
-            </ContentPresenter>
-            <Popup Name="PART_Popup"
-                   WindowManagerAddShadowHint="False"
-                   MinWidth="{ReflectionBinding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
-                   IsLightDismissEnabled="True"
-                   IsOpen="{TemplateBinding IsSubMenuOpen, Mode=TwoWay}"
-                   OverlayInputPassThroughElement="{Binding $parent[Menu]}">
-              <Border Background="{DynamicResource MenuFlyoutPresenterBackground}"
-                      BorderBrush="{DynamicResource MenuFlyoutPresenterBorderBrush}"
-                      BorderThickness="{DynamicResource MenuFlyoutPresenterBorderThemeThickness}"
-                      Padding="{DynamicResource MenuFlyoutPresenterThemePadding}"
-                      MaxWidth="{DynamicResource FlyoutThemeMaxWidth}"
-                      MinHeight="{DynamicResource MenuFlyoutThemeMinHeight}"
-                      HorizontalAlignment="Stretch"
-                      CornerRadius="{DynamicResource OverlayCornerRadius}">
-                <ScrollViewer Classes="menuscroller">
-                  <ItemsPresenter Name="PART_ItemsPresenter"
-                                  Items="{TemplateBinding Items}"
-                                  ItemsPanel="{TemplateBinding ItemsPanel}"
-                                  ItemTemplate="{TemplateBinding ItemTemplate}"
-                                  Margin="{DynamicResource MenuFlyoutScrollerMargin}"
-                                  Grid.IsSharedSizeScope="True" />
-                </ScrollViewer>
-              </Border>
-            </Popup>
-          </Panel>
-        </Border>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-
-  <Style Selector="MenuItem">
-    <!--  Narrow padding should be used for mouse input, when non-narrow one should be used for touch input in future.  -->
-    <Setter Property="Padding" Value="{DynamicResource MenuFlyoutItemThemePaddingNarrow}" />
-  </Style>
-
-  <Style Selector="Menu > MenuItem">
-    <!--  Custom padding for Menu > MenuItem  -->
-    <Setter Property="Padding" Value="{DynamicResource MenuBarItemPadding}" />
-  </Style>
-
-  <Style Selector="MenuItem /template/ ContentPresenter#PART_IconPresenter">
-    <Setter Property="Width" Value="16" />
-    <Setter Property="Height" Value="16" />
-    <Setter Property="IsVisible" Value="False" />
-  </Style>
-  <Style Selector="MenuItem:icon /template/ ContentPresenter#PART_IconPresenter">
-    <Setter Property="IsVisible" Value="True" />
-  </Style>
-
-  <Style Selector="MenuItem /template/ TextBlock#PART_InputGestureText">
-    <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemKeyboardAcceleratorTextForeground}" />
-  </Style>
-  <Style Selector="MenuItem /template/ Path#PART_ChevronPath">
-    <Setter Property="Fill" Value="{DynamicResource MenuFlyoutSubItemChevron}" />
-  </Style>
 
-  <Style Selector="MenuItem:selected /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource MenuFlyoutItemBackgroundPointerOver}" />
-  </Style>
-  <Style Selector="MenuItem:selected /template/ ContentPresenter#PART_HeaderPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemForegroundPointerOver}" />
-  </Style>
-  <Style Selector="MenuItem:selected /template/ TextBlock#PART_InputGestureText">
-    <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemKeyboardAcceleratorTextForegroundPointerOver}" />
-  </Style>
-  <Style Selector="MenuItem:selected /template/ Path#PART_ChevronPath">
-    <Setter Property="Fill" Value="{DynamicResource MenuFlyoutSubItemChevronPointerOver}" />
-  </Style>
+    <Style Selector="^:icon /template/ Viewbox#PART_IconPresenter">
+      <Setter Property="IsVisible" Value="True" />
+    </Style>
 
-  <!--  Listen for PART_LayoutRoot:pointerover, so it will not be triggered when subitem is pressed  -->
-  <Style Selector="MenuItem:pressed /template/ Border#PART_LayoutRoot:pointerover">
-    <Setter Property="Background" Value="{DynamicResource MenuFlyoutItemBackgroundPressed}" />
-  </Style>
-  <Style Selector="MenuItem:pressed /template/ Border#PART_LayoutRoot:pointerover ContentPresenter#PART_HeaderPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemForegroundPressed}" />
-  </Style>
-  <Style Selector="MenuItem:pressed /template/ Border#PART_LayoutRoot:pointerover TextBlock#PART_InputGestureText">
-    <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemKeyboardAcceleratorTextForegroundPressed}" />
-  </Style>
-  <Style Selector="MenuItem:pressed /template/ Border#PART_LayoutRoot:pointerover Path#PART_ChevronPath">
-    <Setter Property="Fill" Value="{DynamicResource MenuFlyoutSubItemChevronPressed}" />
-  </Style>
+    <Style Selector="^:selected">
+      <Style Selector="^ /template/ Border#PART_LayoutRoot">
+        <Setter Property="Background" Value="{DynamicResource MenuFlyoutItemBackgroundPointerOver}" />
+      </Style>
+      <Style Selector="^ /template/ ContentPresenter#PART_HeaderPresenter">
+        <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemForegroundPointerOver}" />
+      </Style>
+      <Style Selector="^ /template/ TextBlock#PART_InputGestureText">
+        <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemKeyboardAcceleratorTextForegroundPointerOver}" />
+      </Style>
+      <Style Selector="^ /template/ Path#PART_ChevronPath">
+        <Setter Property="Fill" Value="{DynamicResource MenuFlyoutSubItemChevronPointerOver}" />
+      </Style>
+    </Style>
 
-  <Style Selector="MenuItem:disabled /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource MenuFlyoutItemBackgroundDisabled}" />
-  </Style>
-  <Style Selector="MenuItem:disabled /template/ ContentPresenter#PART_HeaderPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemForegroundDisabled}" />
-  </Style>
-  <Style Selector="MenuItem:disabled /template/ TextBlock#PART_InputGestureText">
-    <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemKeyboardAcceleratorTextForegroundDisabled}" />
-  </Style>
-  <Style Selector="MenuItem:disabled /template/ Path#PART_ChevronPath">
-    <Setter Property="Fill" Value="{DynamicResource MenuFlyoutSubItemChevronDisabled}" />
-  </Style>
+    <!--  Listen for PART_LayoutRoot:pointerover, so it will not be triggered when subitem is pressed  -->
+    <Style Selector="^:pressed /template/ Border#PART_LayoutRoot:pointerover">
+      <Setter Property="Background" Value="{DynamicResource MenuFlyoutItemBackgroundPressed}" />
+      <Style Selector="^ ContentPresenter#PART_HeaderPresenter">
+        <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemForegroundPressed}" />
+      </Style>
+      <Style Selector="^ TextBlock#PART_InputGestureText">
+        <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemKeyboardAcceleratorTextForegroundPressed}" />
+      </Style>
+      <Style Selector="^ Path#PART_ChevronPath">
+        <Setter Property="Fill" Value="{DynamicResource MenuFlyoutSubItemChevronPressed}" />
+      </Style>
+    </Style>
 
-  <Style Selector="MenuItem:open /template/ Path#PART_ChevronPath">
-    <Setter Property="Fill" Value="{DynamicResource MenuFlyoutSubItemChevronSubMenuOpened}" />
-  </Style>
+    <Style Selector="^:disabled">
+      <Style Selector="^ /template/ Border#PART_LayoutRoot">
+        <Setter Property="Background" Value="{DynamicResource MenuFlyoutItemBackgroundDisabled}" />
+      </Style>
+      <Style Selector="^ /template/ ContentPresenter#PART_HeaderPresenter">
+        <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemForegroundDisabled}" />
+      </Style>
+      <Style Selector="^ /template/ TextBlock#PART_InputGestureText">
+        <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemKeyboardAcceleratorTextForegroundDisabled}" />
+      </Style>
+      <Style Selector="^ /template/ Path#PART_ChevronPath">
+        <Setter Property="Fill" Value="{DynamicResource MenuFlyoutSubItemChevronDisabled}" />
+      </Style>
+    </Style>
 
-  <Style Selector="MenuItem:empty /template/ Path#PART_ChevronPath">
-    <Setter Property="IsVisible" Value="False" />
-  </Style>
+    <Style Selector="^:open /template/ Path#PART_ChevronPath">
+      <Setter Property="Fill" Value="{DynamicResource MenuFlyoutSubItemChevronSubMenuOpened}" />
+    </Style>
 
-  <Style Selector="MenuItem:separator">
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Separator />
-      </ControlTemplate>
-    </Setter>
-  </Style>
+    <Style Selector="^:empty /template/ Path#PART_ChevronPath">
+      <Setter Property="IsVisible" Value="False" />
+    </Style>
 
-  <Style Selector="MenuItem > Separator, ContextMenu > Separator">
-    <Setter Property="Background" Value="{DynamicResource SystemControlForegroundBaseMediumLowBrush}" />
-    <Setter Property="HorizontalAlignment" Value="Stretch" />
-    <Setter Property="Margin" Value="{DynamicResource MenuFlyoutSeparatorThemePadding}" />
-    <Setter Property="Height" Value="{DynamicResource MenuFlyoutSeparatorThemeHeight}" />
-  </Style>
-</Styles>
+    <Style Selector="^:separator">
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Separator Background="{DynamicResource SystemControlForegroundBaseMediumLowBrush}"
+                     Margin="{DynamicResource MenuFlyoutSeparatorThemePadding}"
+                     Height="{DynamicResource MenuFlyoutSeparatorThemeHeight}"/>
+        </ControlTemplate>
+      </Setter>
+    </Style>
+  </ControlTheme>
+</ResourceDictionary>

From d2e4d58f178113d500ca5dffc06734be751ce403 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Sat, 9 Jul 2022 15:17:15 +0200
Subject: [PATCH 53/70] Formatted NativeMenuBar ControlTheme.

---
 src/Avalonia.Themes.Fluent/Controls/NativeMenuBar.xaml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/NativeMenuBar.xaml b/src/Avalonia.Themes.Fluent/Controls/NativeMenuBar.xaml
index 753c03992a..4f51ebfa7f 100644
--- a/src/Avalonia.Themes.Fluent/Controls/NativeMenuBar.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/NativeMenuBar.xaml
@@ -25,5 +25,5 @@
         </Menu>
       </ControlTemplate>
     </Setter>
-   </ControlTheme>
+  </ControlTheme>
 </ResourceDictionary>

From d902c3eb0ca5a7559d1e7843abd93f567fe065bc Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Sat, 9 Jul 2022 15:53:41 +0200
Subject: [PATCH 54/70] Port ScrollViewer to ControlTheme.

Including splitting out the menu scroller into a separate xaml file for separate preview.
---
 .../Controls/FluentControls.xaml              |   1 +
 .../Controls/MenuItem.xaml                    |  28 ++-
 .../Controls/MenuScrollViewer.xaml            |  98 +++++++++++
 .../Controls/ScrollViewer.xaml                | 164 +++++++++---------
 4 files changed, 204 insertions(+), 87 deletions(-)
 create mode 100644 src/Avalonia.Themes.Fluent/Controls/MenuScrollViewer.xaml

diff --git a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
index 6d51dac17f..3e4361465c 100644
--- a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
@@ -25,6 +25,7 @@
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Label.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ListBox.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ListBoxItem.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/MenuScrollViewer.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Menu.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/MenuItem.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/MenuFlyoutPresenter.xaml" />
diff --git a/src/Avalonia.Themes.Fluent/Controls/MenuItem.xaml b/src/Avalonia.Themes.Fluent/Controls/MenuItem.xaml
index 3ec65c4936..8f77d1bc1b 100644
--- a/src/Avalonia.Themes.Fluent/Controls/MenuItem.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/MenuItem.xaml
@@ -5,8 +5,8 @@
                     x:DataType="MenuItem"
                     x:CompileBindings="True">
   <Design.PreviewWith>
-    <Border Padding="20">
-      <StackPanel Spacing="20">
+    <Border Padding="20" Width="320">
+      <StackPanel Spacing="20" HorizontalAlignment="Left">
         <MenuItem Header="_Standard"/>
         <MenuItem IsSelected="True" Header="Selected"/>
         <MenuItem Header="With Icon">
@@ -22,8 +22,26 @@
         <MenuItem Header="Input Gesture" InputGesture="Ctrl+G"/>
         <MenuItem Header="Disabled" IsEnabled="False"/>
         <MenuItem Header="-"/>
-        <MenuItem Header="Parent">
-          <MenuItem Header="Child"/>
+        <MenuItem Header="Parent" IsSubMenuOpen="True">
+          <MenuItem Header="Child 1"/>
+          <MenuItem Header="Child 2"/>
+          <MenuItem Header="Child 3"/>
+          <MenuItem Header="Child 4"/>
+          <MenuItem Header="Child 5"/>
+          <MenuItem Header="Child 6"/>
+          <MenuItem Header="Child 7"/>
+          <MenuItem Header="Child 8"/>
+          <MenuItem Header="Child 9"/>
+          <MenuItem Header="Child 10"/>
+          <MenuItem Header="Child 11"/>
+          <MenuItem Header="Child 12"/>
+          <MenuItem Header="Child 13"/>
+          <MenuItem Header="Child 14"/>
+          <MenuItem Header="Child 15"/>
+          <MenuItem Header="Child 16"/>
+          <MenuItem Header="Child 17"/>
+          <MenuItem Header="Child 18"/>
+          <MenuItem Header="Child 19"/>
         </MenuItem>
         <MenuItem Header="Disabled Parent" IsEnabled="False">
           <MenuItem Header="Child"/>
@@ -113,7 +131,7 @@
                     MinHeight="{DynamicResource MenuFlyoutThemeMinHeight}"
                     HorizontalAlignment="Stretch"
                     CornerRadius="{DynamicResource OverlayCornerRadius}">
-              <ScrollViewer Classes="menuscroller">
+              <ScrollViewer Theme="{StaticResource FluentMenuScrollViewer}">
                 <ItemsPresenter Name="PART_ItemsPresenter"
                                 Items="{TemplateBinding Items}"
                                 ItemsPanel="{TemplateBinding ItemsPanel}"
diff --git a/src/Avalonia.Themes.Fluent/Controls/MenuScrollViewer.xaml b/src/Avalonia.Themes.Fluent/Controls/MenuScrollViewer.xaml
new file mode 100644
index 0000000000..bc71d88a0d
--- /dev/null
+++ b/src/Avalonia.Themes.Fluent/Controls/MenuScrollViewer.xaml
@@ -0,0 +1,98 @@
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:converters="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls">
+
+  <Design.PreviewWith>
+    <ScrollViewer Theme="{DynamicResource FluentMenuScrollViewer}" Width="200" Height="200">
+      <StackPanel Spacing="20">
+        <TextBlock>Item 1</TextBlock>
+        <TextBlock>Item 2</TextBlock>
+        <TextBlock>Item 3</TextBlock>
+        <TextBlock>Item 4</TextBlock>
+        <TextBlock>Item 5</TextBlock>
+        <TextBlock>Item 6</TextBlock>
+        <TextBlock>Item 7</TextBlock>
+        <TextBlock>Item 8</TextBlock>
+        <TextBlock>Item 9</TextBlock>
+      </StackPanel>
+    </ScrollViewer>
+  </Design.PreviewWith>
+
+  <ControlTheme x:Key="FluentMenuScrollViewer" TargetType="ScrollViewer">
+    <Setter Property="Background" Value="Transparent" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <DockPanel>
+          <RepeatButton DockPanel.Dock="Top"
+                        BorderThickness="0"
+                        Background="Transparent"
+                        HorizontalAlignment="Stretch"
+                        HorizontalContentAlignment="Center"
+                        RenderTransform="{x:Null}"
+                        Command="{Binding LineUp, RelativeSource={RelativeSource TemplatedParent}}">
+            <RepeatButton.IsVisible>
+              <MultiBinding Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}"
+                            ConverterParameter="0">
+                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="VerticalScrollBarVisibility" />
+                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Offset.Y" />
+                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Extent.Height" />
+                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Viewport.Height" />
+              </MultiBinding>
+            </RepeatButton.IsVisible>
+            <Viewbox Width="{DynamicResource ScrollBarButtonArrowIconFontSize}"
+                     Height="{DynamicResource ScrollBarButtonArrowIconFontSize}">
+              <Path VerticalAlignment="Center"
+                    HorizontalAlignment="Center"
+                    Data="M 19.091797 14.970703 L 10 5.888672 L 0.908203 14.970703 L 0.029297 14.091797 L 10 4.111328 L 19.970703 14.091797 Z"
+                    Fill="{DynamicResource ScrollBarButtonArrowForeground}"
+                    Width="20"
+                    Height="20" />
+            </Viewbox>
+          </RepeatButton>
+          <RepeatButton DockPanel.Dock="Bottom"
+                        BorderThickness="0"
+                        Background="Transparent"
+                        HorizontalAlignment="Stretch"
+                        HorizontalContentAlignment="Center"
+                        RenderTransform="{x:Null}"
+                        Command="{Binding LineDown, RelativeSource={RelativeSource TemplatedParent}}">
+            <RepeatButton.IsVisible>
+              <MultiBinding Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}"
+                            ConverterParameter="100">
+                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="VerticalScrollBarVisibility" />
+                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Offset.Y" />
+                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Extent.Height" />
+                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Viewport.Height" />
+              </MultiBinding>
+            </RepeatButton.IsVisible>
+            <Viewbox Width="{DynamicResource ScrollBarButtonArrowIconFontSize}"
+                     Height="{DynamicResource ScrollBarButtonArrowIconFontSize}">
+              <Path VerticalAlignment="Center"
+                    HorizontalAlignment="Center"
+                    Data="M 18.935547 4.560547 L 19.814453 5.439453 L 10 15.253906 L 0.185547 5.439453 L 1.064453 4.560547 L 10 13.496094 Z"
+                    Fill="{DynamicResource ScrollBarButtonArrowForeground}"
+                    Width="20"
+                    Height="20" />
+            </Viewbox>
+          </RepeatButton>
+          <ScrollContentPresenter Name="PART_ContentPresenter"
+                                  CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}"
+                                  CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}"
+                                  Content="{TemplateBinding Content}"
+                                  Extent="{TemplateBinding Extent, Mode=TwoWay}"
+                                  Margin="{TemplateBinding Padding}"
+                                  Offset="{TemplateBinding Offset, Mode=TwoWay}"
+                                  Viewport="{TemplateBinding Viewport, Mode=TwoWay}">
+            <ScrollContentPresenter.GestureRecognizers>
+              <ScrollGestureRecognizer CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}"
+                                       CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}" />
+            </ScrollContentPresenter.GestureRecognizers>
+          </ScrollContentPresenter>
+        </DockPanel>
+      </ControlTemplate>
+    </Setter>
+    <Style Selector="^ /template/ RepeatButton:pointerover > Viewbox > Path">
+      <Setter Property="Fill" Value="{DynamicResource ScrollBarButtonArrowForegroundPointerOver}" />
+    </Style>
+  </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml b/src/Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml
index a6e02d2769..55adb54d9b 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml
@@ -1,87 +1,87 @@
-<ResourceDictionary 
+<ResourceDictionary
   xmlns="https://github.com/avaloniaui"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   xmlns:converters="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls">
-    <Design.PreviewWith>
-      <Grid ColumnDefinitions="*,20,*" Height="300" Width="200" Margin="20">
-        <ScrollViewer>
-          <Border Height="1000" Background="#ccc" />
-        </ScrollViewer>
-        <ScrollViewer Grid.Column="2" Classes="menuscroller">
-          <Border Height="1000" Background="#ccc" />
-        </ScrollViewer>
-      </Grid>
-    </Design.PreviewWith>
-  
-    <ControlTheme x:Key="{x:Type ScrollViewer}" TargetType="ScrollViewer">
-      <Setter Property="Background" Value="Transparent" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Grid ColumnDefinitions="*,Auto" RowDefinitions="*,Auto">
-            <ScrollContentPresenter Name="PART_ContentPresenter" Grid.Row="0" Grid.Column="0" Grid.RowSpan="2" Grid.ColumnSpan="2" Background="{TemplateBinding Background}" CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}" CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}" Content="{TemplateBinding Content}" Extent="{TemplateBinding Extent, Mode=TwoWay}" Padding="{TemplateBinding Padding}" Offset="{TemplateBinding Offset, Mode=TwoWay}" Viewport="{TemplateBinding Viewport, Mode=TwoWay}" IsScrollChainingEnabled="{TemplateBinding IsScrollChainingEnabled}">
-              <ScrollContentPresenter.GestureRecognizers>
-                <ScrollGestureRecognizer CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}" CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}" />
-              </ScrollContentPresenter.GestureRecognizers>
-            </ScrollContentPresenter>
-            <ScrollBar Name="PART_HorizontalScrollBar" AllowAutoHide="{TemplateBinding AllowAutoHide}" Orientation="Horizontal" LargeChange="{Binding LargeChange.Width, RelativeSource={RelativeSource TemplatedParent}}" SmallChange="{Binding SmallChange.Width, RelativeSource={RelativeSource TemplatedParent}}" Maximum="{TemplateBinding HorizontalScrollBarMaximum}" Value="{TemplateBinding HorizontalScrollBarValue, Mode=TwoWay}" ViewportSize="{TemplateBinding HorizontalScrollBarViewportSize}" Visibility="{TemplateBinding HorizontalScrollBarVisibility}" Grid.Row="1" Focusable="False" />
-            <ScrollBar Name="PART_VerticalScrollBar" AllowAutoHide="{TemplateBinding AllowAutoHide}" Orientation="Vertical" LargeChange="{Binding LargeChange.Height, RelativeSource={RelativeSource TemplatedParent}}" SmallChange="{Binding SmallChange.Height, RelativeSource={RelativeSource TemplatedParent}}" Maximum="{TemplateBinding VerticalScrollBarMaximum}" Value="{TemplateBinding VerticalScrollBarValue, Mode=TwoWay}" ViewportSize="{TemplateBinding VerticalScrollBarViewportSize}" Visibility="{TemplateBinding VerticalScrollBarVisibility}" Grid.Column="1" Focusable="False" />
-            <Panel x:Name="PART_ScrollBarsSeparator" Grid.Row="1" Grid.Column="1" Background="{DynamicResource ScrollViewerScrollBarsSeparatorBackground}" />
-          </Grid>
-        </ControlTemplate>
+  <Design.PreviewWith>
+    <ScrollViewer Width="200" Height="200"
+                  HorizontalScrollBarVisibility="Auto">
+      <StackPanel Spacing="20" Width="210">
+        <TextBlock>Item 1</TextBlock>
+        <TextBlock>Item 2</TextBlock>
+        <TextBlock>Item 3</TextBlock>
+        <TextBlock>Item 4</TextBlock>
+        <TextBlock>Item 5</TextBlock>
+        <TextBlock>Item 6</TextBlock>
+        <TextBlock>Item 7</TextBlock>
+        <TextBlock>Item 8</TextBlock>
+        <TextBlock>Item 9</TextBlock>
+      </StackPanel>
+    </ScrollViewer>
+  </Design.PreviewWith>
+
+  <ControlTheme x:Key="{x:Type ScrollViewer}" TargetType="ScrollViewer">
+    <Setter Property="Background" Value="Transparent" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Grid ColumnDefinitions="*,Auto" RowDefinitions="*,Auto">
+          <ScrollContentPresenter Name="PART_ContentPresenter"
+                                  Grid.Row="0"
+                                  Grid.Column="0"
+                                  Grid.RowSpan="2"
+                                  Grid.ColumnSpan="2"
+                                  Background="{TemplateBinding Background}"
+                                  CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}"
+                                  CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}"
+                                  Content="{TemplateBinding Content}"
+                                  Extent="{TemplateBinding Extent, Mode=TwoWay}"
+                                  Padding="{TemplateBinding Padding}"
+                                  Offset="{TemplateBinding Offset, Mode=TwoWay}"
+                                  Viewport="{TemplateBinding Viewport, Mode=TwoWay}"
+                                  IsScrollChainingEnabled="{TemplateBinding IsScrollChainingEnabled}">
+            <ScrollContentPresenter.GestureRecognizers>
+              <ScrollGestureRecognizer CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}"
+                                       CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}" />
+            </ScrollContentPresenter.GestureRecognizers>
+          </ScrollContentPresenter>
+          <ScrollBar Name="PART_HorizontalScrollBar"
+                     AllowAutoHide="{TemplateBinding AllowAutoHide}"
+                     Orientation="Horizontal"
+                     LargeChange="{Binding LargeChange.Width, RelativeSource={RelativeSource TemplatedParent}}"
+                     SmallChange="{Binding SmallChange.Width, RelativeSource={RelativeSource TemplatedParent}}"
+                     Maximum="{TemplateBinding HorizontalScrollBarMaximum}"
+                     Value="{TemplateBinding HorizontalScrollBarValue, Mode=TwoWay}"
+                     ViewportSize="{TemplateBinding HorizontalScrollBarViewportSize}"
+                     Visibility="{TemplateBinding HorizontalScrollBarVisibility}"
+                     Grid.Row="1"
+                     Focusable="False" />
+          <ScrollBar Name="PART_VerticalScrollBar"
+                     AllowAutoHide="{TemplateBinding AllowAutoHide}"
+                     Orientation="Vertical"
+                     LargeChange="{Binding LargeChange.Height, RelativeSource={RelativeSource TemplatedParent}}"
+                     SmallChange="{Binding SmallChange.Height, RelativeSource={RelativeSource TemplatedParent}}"
+                     Maximum="{TemplateBinding VerticalScrollBarMaximum}"
+                     Value="{TemplateBinding VerticalScrollBarValue, Mode=TwoWay}"
+                     ViewportSize="{TemplateBinding VerticalScrollBarViewportSize}"
+                     Visibility="{TemplateBinding VerticalScrollBarVisibility}"
+                     Grid.Column="1"
+                     Focusable="False" />
+          <Panel x:Name="PART_ScrollBarsSeparator"
+                 Grid.Row="1"
+                 Grid.Column="1"
+                 Background="{DynamicResource ScrollViewerScrollBarsSeparatorBackground}" />
+        </Grid>
+      </ControlTemplate>
+    </Setter>
+    <Style Selector="^ /template/ Panel#PART_ScrollBarsSeparator">
+      <Setter Property="Opacity" Value="0" />
+      <Setter Property="Transitions">
+        <Transitions>
+          <DoubleTransition Property="Opacity" Duration="0:0:0.1" />
+        </Transitions>
       </Setter>
-      <Style Selector="^ /template/ Panel#PART_ScrollBarsSeparator">
-        <Setter Property="Opacity" Value="0" />
-        <Setter Property="Transitions">
-          <Transitions>
-            <DoubleTransition Property="Opacity" Duration="0:0:0.1" />
-          </Transitions>
-        </Setter>
-      </Style>
-      <Style Selector="^[IsExpanded=true] /template/ Panel#PART_ScrollBarsSeparator">
-        <Setter Property="Opacity" Value="1" />
-      </Style>
-      <Style Selector="^.menuscroller">
-        <Setter Property="Template">
-          <ControlTemplate>
-            <DockPanel>
-              <RepeatButton DockPanel.Dock="Top" BorderThickness="0" Background="Transparent" HorizontalAlignment="Stretch" HorizontalContentAlignment="Center" RenderTransform="{x:Null}" Command="{Binding LineUp, RelativeSource={RelativeSource TemplatedParent}}">
-                <RepeatButton.IsVisible>
-                  <MultiBinding Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}" ConverterParameter="0">
-                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="VerticalScrollBarVisibility" />
-                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Offset.Y" />
-                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Extent.Height" />
-                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Viewport.Height" />
-                  </MultiBinding>
-                </RepeatButton.IsVisible>
-                <Viewbox Width="{DynamicResource ScrollBarButtonArrowIconFontSize}" Height="{DynamicResource ScrollBarButtonArrowIconFontSize}">
-                  <Path VerticalAlignment="Center" HorizontalAlignment="Center" Data="M 19.091797 14.970703 L 10 5.888672 L 0.908203 14.970703 L 0.029297 14.091797 L 10 4.111328 L 19.970703 14.091797 Z" Width="20" Height="20" />
-                </Viewbox>
-              </RepeatButton>
-              <RepeatButton DockPanel.Dock="Bottom" BorderThickness="0" Background="Transparent" HorizontalAlignment="Stretch" HorizontalContentAlignment="Center" RenderTransform="{x:Null}" Command="{Binding LineDown, RelativeSource={RelativeSource TemplatedParent}}">
-                <RepeatButton.IsVisible>
-                  <MultiBinding Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}" ConverterParameter="100">
-                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="VerticalScrollBarVisibility" />
-                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Offset.Y" />
-                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Extent.Height" />
-                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Viewport.Height" />
-                  </MultiBinding>
-                </RepeatButton.IsVisible>
-                <Viewbox Width="{DynamicResource ScrollBarButtonArrowIconFontSize}" Height="{DynamicResource ScrollBarButtonArrowIconFontSize}">
-                  <Path VerticalAlignment="Center" HorizontalAlignment="Center" Data="M 18.935547 4.560547 L 19.814453 5.439453 L 10 15.253906 L 0.185547 5.439453 L 1.064453 4.560547 L 10 13.496094 Z" Width="20" Height="20" />
-                </Viewbox>
-              </RepeatButton>
-              <ScrollContentPresenter Name="PART_ContentPresenter" CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}" CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}" Content="{TemplateBinding Content}" Extent="{TemplateBinding Extent, Mode=TwoWay}" Margin="{TemplateBinding Padding}" Offset="{TemplateBinding Offset, Mode=TwoWay}" Viewport="{TemplateBinding Viewport, Mode=TwoWay}" />
-            </DockPanel>
-          </ControlTemplate>
-        </Setter>
-        <Style Selector="^ /template/ RepeatButton">
-          <Style Selector="^ > Viewbox > Path">
-            <Setter Property="Fill" Value="{DynamicResource ScrollBarButtonArrowForeground}" />
-          </Style>
-          <Style Selector="^:pointerover > Viewbox > Path">
-            <Setter Property="Fill" Value="{DynamicResource ScrollBarButtonArrowForegroundPointerOver}" />
-          </Style>
-        </Style>
-      </Style>
-    </ControlTheme>
+    </Style>
+    <Style Selector="^[IsExpanded=true] /template/ Panel#PART_ScrollBarsSeparator">
+      <Setter Property="Opacity" Value="1" />
+    </Style>
+  </ControlTheme>
 </ResourceDictionary>

From 1d15d1b51343137a24171002b6f07ac98517b1af Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Sun, 10 Jul 2022 00:04:29 +0200
Subject: [PATCH 55/70] Ported SplitView to ControlTheme.

---
 .../Controls/FluentControls.xaml              |   2 +-
 .../Controls/SplitView.xaml                   | 444 +++++++++---------
 2 files changed, 231 insertions(+), 215 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
index 3e4361465c..fc89d7c21e 100644
--- a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
@@ -39,6 +39,7 @@
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ScrollBar.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Separator.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitView.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabControl.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabItem.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabStrip.xaml" />
@@ -72,7 +73,6 @@
     <!--  TabControl needs to come after TabStrip as it redefines the inner TabStrip.ItemsPanel  -->
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TreeViewItem.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitButton.xaml" />
-    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitView.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/UserControl.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TimePicker.xaml" />
     <Styles.Resources />
diff --git a/src/Avalonia.Themes.Fluent/Controls/SplitView.xaml b/src/Avalonia.Themes.Fluent/Controls/SplitView.xaml
index 6b9b94852f..9feb6c7fc6 100644
--- a/src/Avalonia.Themes.Fluent/Controls/SplitView.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/SplitView.xaml
@@ -1,4 +1,4 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:sys="using:System">
   <Design.PreviewWith>
@@ -15,219 +15,235 @@
     </Border>
   </Design.PreviewWith>
 
-  <Styles.Resources>
-    <x:Double x:Key="SplitViewOpenPaneThemeLength">320</x:Double>
-    <x:Double x:Key="SplitViewCompactPaneThemeLength">48</x:Double>
-    <sys:TimeSpan x:Key="SplitViewPaneAnimationOpenDuration">00:00:00.2</sys:TimeSpan>
-    <sys:TimeSpan x:Key="SplitViewPaneAnimationCloseDuration">00:00:00.1</sys:TimeSpan>
-    <Easing x:Key="SplitViewPaneAnimationEasing">0.1,0.9,0.2,1.0</Easing>
-    <!-- Not used here (directly), but preserving for reference
-        <x:String x:Key="SplitViewPaneAnimationOpenPreDuration">00:00:00.19999</x:String>-->
-  </Styles.Resources>
-
-  <Style Selector="SplitView">
+  <x:Double x:Key="SplitViewOpenPaneThemeLength">320</x:Double>
+  <x:Double x:Key="SplitViewCompactPaneThemeLength">48</x:Double>
+  <sys:TimeSpan x:Key="SplitViewPaneAnimationOpenDuration">00:00:00.2</sys:TimeSpan>
+  <sys:TimeSpan x:Key="SplitViewPaneAnimationCloseDuration">00:00:00.1</sys:TimeSpan>
+  <Easing x:Key="SplitViewPaneAnimationEasing">0.1,0.9,0.2,1.0</Easing>
+
+  <ControlTheme x:Key="{x:Type SplitView}" TargetType="SplitView">
     <Setter Property="OpenPaneLength" Value="{DynamicResource SplitViewOpenPaneThemeLength}" />
     <Setter Property="CompactPaneLength" Value="{DynamicResource SplitViewCompactPaneThemeLength}" />
     <Setter Property="PaneBackground" Value="{DynamicResource SystemControlPageBackgroundChromeLowBrush}" />
-  </Style>
-
-  <!-- Left -->
-  <Style Selector="SplitView:left">
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Grid Name="Container" Background="{TemplateBinding Background}">
-          <Grid.ColumnDefinitions>
-            <!-- why is this throwing a binding error? -->
-            <ColumnDefinition Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.PaneColumnGridLength}"/>
-            <ColumnDefinition Width="*"/>
-          </Grid.ColumnDefinitions>
-
-          <Panel Name="PART_PaneRoot" Background="{TemplateBinding PaneBackground}"
-                 ClipToBounds="True"
-                 HorizontalAlignment="Left"
-                 ZIndex="100">
-            <ContentPresenter x:Name="PART_PanePresenter" Content="{TemplateBinding Pane}" ContentTemplate="{TemplateBinding PaneTemplate}" />
-            <Rectangle Name="HCPaneBorder" Fill="{DynamicResource SystemControlForegroundTransparentBrush}" Width="1" HorizontalAlignment="Right"  />
-          </Panel>
-
-          <Panel Name="ContentRoot">
-            <ContentPresenter x:Name="PART_ContentPresenter" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" />
-            <Rectangle Name="LightDismissLayer"/>
-          </Panel>
-
-        </Grid>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-
-  <!-- Overlay -->
-  <Style Selector="SplitView:overlay:left /template/ Panel#PART_PaneRoot">
-    <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
-    <!-- ColumnSpan should be 2 -->
-    <Setter Property="Grid.ColumnSpan" Value="1"/>
-    <Setter Property="Grid.Column" Value="0"/>
-  </Style>
-  <Style Selector="SplitView:overlay:left /template/ Panel#ContentRoot">
-    <Setter Property="Grid.Column" Value="1"/>
-    <Setter Property="Grid.ColumnSpan" Value="2"/>
-  </Style>
-
-  <!-- CompactInline -->
-  <Style Selector="SplitView:compactinline:left /template/ Panel#PART_PaneRoot">
-    <Setter Property="Grid.ColumnSpan" Value="1"/>
-    <Setter Property="Grid.Column" Value="0"/>
-    <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
-  </Style>
-  <Style Selector="SplitView:compactinline:left /template/ Panel#ContentRoot">
-    <Setter Property="Grid.Column" Value="1"/>
-    <Setter Property="Grid.ColumnSpan" Value="1"/>
-  </Style>
-
-  <!-- CompactOverlay -->
-  <Style Selector="SplitView:compactoverlay:left /template/ Panel#PART_PaneRoot">
-    <!-- ColumnSpan should be 2 -->
-    <Setter Property="Grid.ColumnSpan" Value="1"/>
-    <Setter Property="Grid.Column" Value="0"/>
-    <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
-  </Style>
-  <Style Selector="SplitView:compactoverlay:left /template/ Panel#ContentRoot">
-    <Setter Property="Grid.Column" Value="1"/>
-    <Setter Property="Grid.ColumnSpan" Value="1"/>
-  </Style>
-
-  <!-- Inline -->
-  <Style Selector="SplitView:inline:left /template/ Panel#PART_PaneRoot">
-    <Setter Property="Grid.ColumnSpan" Value="1"/>
-    <Setter Property="Grid.Column" Value="0"/>
-    <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
-  </Style>
-  <Style Selector="SplitView:inline:left /template/ Panel#ContentRoot">
-    <Setter Property="Grid.Column" Value="1"/>
-    <Setter Property="Grid.ColumnSpan" Value="1"/>
-  </Style>
-
-  <!-- Right -->
-  <Style Selector="SplitView:right">
-    <Setter Property="Template">
-      <ControlTemplate>
-        <Grid Name="Container" Background="{TemplateBinding Background}">
-          <Grid.ColumnDefinitions>
-            <ColumnDefinition Width="*"/>
-            <ColumnDefinition Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.PaneColumnGridLength}"/>
-          </Grid.ColumnDefinitions>
-
-          <Panel Name="PART_PaneRoot" Background="{TemplateBinding PaneBackground}"
-                 ClipToBounds="True"
-                 HorizontalAlignment="Right"
-                 ZIndex="100">
-            <ContentPresenter x:Name="PART_PanePresenter" Content="{TemplateBinding Pane}" ContentTemplate="{TemplateBinding PaneTemplate}"/>
-            <Rectangle Name="HCPaneBorder"
-                       Fill="{DynamicResource SystemControlForegroundTransparentBrush}"
-                       Width="1" HorizontalAlignment="Left"  />
-          </Panel>
-
-          <Panel Name="ContentRoot">
-            <ContentPresenter x:Name="PART_ContentPresenter" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" />
-            <Rectangle Name="LightDismissLayer"/>
-          </Panel>
-
-        </Grid>
-      </ControlTemplate>
-    </Setter>
-  </Style>
-
-  <!-- Overlay -->
-  <Style Selector="SplitView:overlay:right /template/ Panel#PART_PaneRoot">
-    <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
-    <Setter Property="Grid.ColumnSpan" Value="2"/>
-    <Setter Property="Grid.Column" Value="1"/>
-  </Style>
-  <Style Selector="SplitView:overlay:right /template/ Panel#ContentRoot">
-    <Setter Property="Grid.Column" Value="0"/>
-    <Setter Property="Grid.ColumnSpan" Value="2"/>
-  </Style>
-
-  <!-- CompactInline -->
-  <Style Selector="SplitView:compactinline:right /template/ Panel#PART_PaneRoot">
-    <Setter Property="Grid.ColumnSpan" Value="1"/>
-    <Setter Property="Grid.Column" Value="1"/>
-    <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
-  </Style>
-  <Style Selector="SplitView:compactinline:right /template/ Panel#ContentRoot">
-    <Setter Property="Grid.Column" Value="0"/>
-    <Setter Property="Grid.ColumnSpan" Value="1"/>
-  </Style>
-
-  <!-- CompactOverlay -->
-  <Style Selector="SplitView:compactoverlay:right /template/ Panel#PART_PaneRoot">
-    <Setter Property="Grid.ColumnSpan" Value="2"/>
-    <Setter Property="Grid.Column" Value="1"/>
-    <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
-  </Style>
-  <Style Selector="SplitView:compactoverlay:right /template/ Panel#ContentRoot">
-    <Setter Property="Grid.Column" Value="0"/>
-    <Setter Property="Grid.ColumnSpan" Value="1"/>
-  </Style>
-
-  <!-- Inline -->
-  <Style Selector="SplitView:inline:right /template/ Panel#PART_PaneRoot">
-    <Setter Property="Grid.ColumnSpan" Value="1"/>
-    <Setter Property="Grid.Column" Value="1"/>
-    <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
-  </Style>
-  <Style Selector="SplitView:inline:right /template/ Panel#ContentRoot">
-    <Setter Property="Grid.Column" Value="0"/>
-    <Setter Property="Grid.ColumnSpan" Value="1"/>
-  </Style>
-
-  <!-- Open/Close Pane animation  -->
-  <Style Selector="SplitView:open /template/ Panel#PART_PaneRoot">
-    <Setter Property="Transitions">
-      <Transitions>
-        <DoubleTransition Property="Width" Duration="{StaticResource SplitViewPaneAnimationOpenDuration}" Easing="{StaticResource SplitViewPaneAnimationEasing}" />
-      </Transitions>
-    </Setter>
-    <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=OpenPaneLength}" />
-  </Style>
-  <Style Selector="SplitView:open /template/ Rectangle#LightDismissLayer">
-    <Setter Property="Transitions">
-      <Transitions>
-        <DoubleTransition Property="Opacity" Duration="{StaticResource SplitViewPaneAnimationOpenDuration}" Easing="{StaticResource SplitViewPaneAnimationEasing}" />
-      </Transitions>
-    </Setter>
-    <Setter Property="Opacity" Value="1.0"/>
-  </Style>
-
-  <Style Selector="SplitView:closed /template/ Panel#PART_PaneRoot">
-    <Setter Property="Transitions">
-      <Transitions>
-        <DoubleTransition Property="Width" Duration="{StaticResource SplitViewPaneAnimationCloseDuration}" Easing="{StaticResource SplitViewPaneAnimationEasing}" />
-      </Transitions>
-    </Setter>
-    <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
-  </Style>
-  <Style Selector="SplitView:closed /template/ Rectangle#LightDismissLayer">
-    <Setter Property="Transitions">
-      <Transitions>
-        <DoubleTransition Property="Opacity" Duration="{StaticResource SplitViewPaneAnimationCloseDuration}" Easing="{StaticResource SplitViewPaneAnimationEasing}" />
-      </Transitions>
-    </Setter>
-    <Setter Property="Opacity" Value="0.0"/>
-  </Style>
-
-  <Style Selector="SplitView /template/ Rectangle#LightDismissLayer">
-    <Setter Property="IsVisible" Value="False"/>
-    <Setter Property="Fill" Value="Transparent" />
-  </Style>
-  <Style Selector="SplitView:lightdismiss /template/ Rectangle#LightDismissLayer">
-    <Setter Property="Fill" Value="{DynamicResource SplitViewLightDismissOverlayBackground}" />
-  </Style>
-
-  <Style Selector="SplitView:overlay:open /template/ Rectangle#LightDismissLayer">
-    <Setter Property="IsVisible" Value="True"/>
-  </Style>
-  <Style Selector="SplitView:compactoverlay:open /template/ Rectangle#LightDismissLayer">
-    <Setter Property="IsVisible" Value="True"/>
-  </Style>
-
-</Styles>
+
+    <Style Selector="^:left">
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Grid Name="Container" Background="{TemplateBinding Background}">
+            <Grid.ColumnDefinitions>
+              <!-- why is this throwing a binding error? -->
+              <ColumnDefinition Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.PaneColumnGridLength}"/>
+              <ColumnDefinition Width="*"/>
+            </Grid.ColumnDefinitions>
+
+            <Panel Name="PART_PaneRoot"
+                   Background="{TemplateBinding PaneBackground}"
+                   ClipToBounds="True"
+                   HorizontalAlignment="Left"
+                   ZIndex="100">
+              <ContentPresenter x:Name="PART_PanePresenter"
+                                Content="{TemplateBinding Pane}"
+                                ContentTemplate="{TemplateBinding PaneTemplate}" />
+              <Rectangle Name="HCPaneBorder"
+                         Fill="{DynamicResource SystemControlForegroundTransparentBrush}"
+                         Width="1"
+                         HorizontalAlignment="Right"  />
+            </Panel>
+
+            <Panel Name="ContentRoot">
+              <ContentPresenter x:Name="PART_ContentPresenter"
+                                Content="{TemplateBinding Content}"
+                                ContentTemplate="{TemplateBinding ContentTemplate}" />
+              <Rectangle Name="LightDismissLayer"
+                         Fill="Transparent"
+                         IsVisible="False"/>
+            </Panel>
+
+          </Grid>
+        </ControlTemplate>
+      </Setter>
+
+      <Style Selector="^:overlay">
+        <Style Selector="^ /template/ Panel#PART_PaneRoot">
+          <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
+          <Setter Property="Grid.ColumnSpan" Value="1"/>
+          <Setter Property="Grid.Column" Value="0"/>
+        </Style>
+        <Style Selector="^ /template/ Panel#ContentRoot">
+          <Setter Property="Grid.Column" Value="1"/>
+          <Setter Property="Grid.ColumnSpan" Value="2"/>
+        </Style>
+      </Style>
+
+      <Style Selector="^:compactinline">
+        <Style Selector="^ /template/ Panel#PART_PaneRoot">
+          <Setter Property="Grid.ColumnSpan" Value="1"/>
+          <Setter Property="Grid.Column" Value="0"/>
+          <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
+        </Style>
+        <Style Selector="^ /template/ Panel#ContentRoot">
+          <Setter Property="Grid.Column" Value="1"/>
+          <Setter Property="Grid.ColumnSpan" Value="1"/>
+        </Style>
+      </Style>
+
+      <Style Selector="^:compactoverlay">
+        <Style Selector="^ /template/ Panel#PART_PaneRoot">
+          <!-- ColumnSpan should be 2 -->
+          <Setter Property="Grid.ColumnSpan" Value="1"/>
+          <Setter Property="Grid.Column" Value="0"/>
+          <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
+        </Style>
+        <Style Selector="^ /template/ Panel#ContentRoot">
+          <Setter Property="Grid.Column" Value="1"/>
+          <Setter Property="Grid.ColumnSpan" Value="1"/>
+        </Style>
+      </Style>
+
+      <Style Selector="^:inline">
+        <Style Selector="^ /template/ Panel#PART_PaneRoot">
+          <Setter Property="Grid.ColumnSpan" Value="1"/>
+          <Setter Property="Grid.Column" Value="0"/>
+          <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
+        </Style>
+        <Style Selector="^ /template/ Panel#ContentRoot">
+          <Setter Property="Grid.Column" Value="1"/>
+          <Setter Property="Grid.ColumnSpan" Value="1"/>
+        </Style>
+      </Style>
+    </Style>
+
+    <Style Selector="^:right">
+      <Setter Property="Template">
+        <ControlTemplate>
+          <Grid Name="Container" Background="{TemplateBinding Background}">
+            <Grid.ColumnDefinitions>
+              <ColumnDefinition Width="*"/>
+              <ColumnDefinition Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.PaneColumnGridLength}"/>
+            </Grid.ColumnDefinitions>
+
+            <Panel Name="PART_PaneRoot" Background="{TemplateBinding PaneBackground}"
+                   ClipToBounds="True"
+                   HorizontalAlignment="Right"
+                   ZIndex="100">
+              <ContentPresenter x:Name="PART_PanePresenter"
+                                Content="{TemplateBinding Pane}"
+                                ContentTemplate="{TemplateBinding PaneTemplate}"/>
+              <Rectangle Name="HCPaneBorder"
+                         Fill="{DynamicResource SystemControlForegroundTransparentBrush}"
+                         Width="1" HorizontalAlignment="Left"  />
+            </Panel>
+
+            <Panel Name="ContentRoot">
+              <ContentPresenter x:Name="PART_ContentPresenter"
+                                Content="{TemplateBinding Content}"
+                                ContentTemplate="{TemplateBinding ContentTemplate}" />
+              <Rectangle Name="LightDismissLayer"/>
+            </Panel>
+
+          </Grid>
+        </ControlTemplate>
+      </Setter>
+
+      <Style Selector="^:overlay">
+        <Style Selector="^ /template/ Panel#PART_PaneRoot">
+          <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
+          <Setter Property="Grid.ColumnSpan" Value="2"/>
+          <Setter Property="Grid.Column" Value="1"/>
+        </Style>
+        <Style Selector="^ /template/ Panel#ContentRoot">
+          <Setter Property="Grid.Column" Value="0"/>
+          <Setter Property="Grid.ColumnSpan" Value="2"/>
+        </Style>
+      </Style>
+
+      <Style Selector="^:compactinline">
+        <Style Selector="^ /template/ Panel#PART_PaneRoot">
+          <Setter Property="Grid.ColumnSpan" Value="1"/>
+          <Setter Property="Grid.Column" Value="1"/>
+          <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
+        </Style>
+        <Style Selector="^ /template/ Panel#ContentRoot">
+          <Setter Property="Grid.Column" Value="0"/>
+          <Setter Property="Grid.ColumnSpan" Value="1"/>
+        </Style>
+      </Style>
+
+      <Style Selector="^:compactoverlay">
+        <Style Selector="^ /template/ Panel#PART_PaneRoot">
+          <Setter Property="Grid.ColumnSpan" Value="2"/>
+          <Setter Property="Grid.Column" Value="1"/>
+          <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
+        </Style>
+        <Style Selector="^ /template/ Panel#ContentRoot">
+          <Setter Property="Grid.Column" Value="0"/>
+          <Setter Property="Grid.ColumnSpan" Value="1"/>
+        </Style>
+      </Style>
+
+      <Style Selector="^:inline">
+        <Style Selector="^ /template/ Panel#PART_PaneRoot">
+          <Setter Property="Grid.ColumnSpan" Value="1"/>
+          <Setter Property="Grid.Column" Value="1"/>
+          <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
+        </Style>
+        <Style Selector="^ /template/ Panel#ContentRoot">
+          <Setter Property="Grid.Column" Value="0"/>
+          <Setter Property="Grid.ColumnSpan" Value="1"/>
+        </Style>
+      </Style>
+    </Style>
+
+    <Style Selector="^:open">
+      <Style Selector="^ /template/ Panel#PART_PaneRoot">
+        <Setter Property="Transitions">
+          <Transitions>
+            <DoubleTransition Property="Width"
+                              Duration="{StaticResource SplitViewPaneAnimationOpenDuration}"
+                              Easing="{StaticResource SplitViewPaneAnimationEasing}" />
+          </Transitions>
+        </Setter>
+        <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=OpenPaneLength}" />
+      </Style>
+      <Style Selector="^ /template/ Rectangle#LightDismissLayer">
+        <Setter Property="Transitions">
+          <Transitions>
+            <DoubleTransition Property="Opacity"
+                              Duration="{StaticResource SplitViewPaneAnimationOpenDuration}"
+                              Easing="{StaticResource SplitViewPaneAnimationEasing}" />
+          </Transitions>
+        </Setter>
+        <Setter Property="Opacity" Value="1.0"/>
+      </Style>
+    </Style>
+
+    <Style Selector="^:closed">
+      <Style Selector="^ /template/ Panel#PART_PaneRoot">
+        <Setter Property="Transitions">
+          <Transitions>
+            <DoubleTransition Property="Width" Duration="{StaticResource SplitViewPaneAnimationCloseDuration}" Easing="{StaticResource SplitViewPaneAnimationEasing}" />
+          </Transitions>
+        </Setter>
+        <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
+      </Style>
+      <Style Selector="^ /template/ Rectangle#LightDismissLayer">
+        <Setter Property="Transitions">
+          <Transitions>
+            <DoubleTransition Property="Opacity" Duration="{StaticResource SplitViewPaneAnimationCloseDuration}" Easing="{StaticResource SplitViewPaneAnimationEasing}" />
+          </Transitions>
+        </Setter>
+        <Setter Property="Opacity" Value="0.0"/>
+      </Style>
+    </Style>
+
+    <Style Selector="^:lightdismiss /template/ Rectangle#LightDismissLayer">
+      <Setter Property="Fill" Value="{DynamicResource SplitViewLightDismissOverlayBackground}" />
+    </Style>
+    <Style Selector="^:overlay:open /template/ Rectangle#LightDismissLayer">
+      <Setter Property="IsVisible" Value="True"/>
+    </Style>
+    <Style Selector="^:compactoverlay:open /template/ Rectangle#LightDismissLayer">
+      <Setter Property="IsVisible" Value="True"/>
+    </Style>
+  </ControlTheme>
+</ResourceDictionary>

From b1038f115b8abdc48ae884ec531a3ae385731010 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Sun, 10 Jul 2022 01:31:23 +0200
Subject: [PATCH 56/70] Ported TreeViewItem to ControlTheme.

---
 .../Controls/FluentControls.xaml              |   4 +-
 .../Controls/TreeViewItem.xaml                | 178 +++++++++---------
 2 files changed, 87 insertions(+), 95 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
index fc89d7c21e..58c33bf26f 100644
--- a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
@@ -51,6 +51,7 @@
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TitleBar.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TransitioningContentControl.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TreeView.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TreeViewItem.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/WindowNotificationManager.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Window.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ComboBox.xaml" />
@@ -68,10 +69,7 @@
         </ResourceDictionary>
     </Styles.Resources>
 
-    <!--  Define ToolTip first so its styles can be overriden by other controls (e.g. TextBox)  -->
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/FocusAdorner.xaml" />
-    <!--  TabControl needs to come after TabStrip as it redefines the inner TabStrip.ItemsPanel  -->
-    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TreeViewItem.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitButton.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/UserControl.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TimePicker.xaml" />
diff --git a/src/Avalonia.Themes.Fluent/Controls/TreeViewItem.xaml b/src/Avalonia.Themes.Fluent/Controls/TreeViewItem.xaml
index 6510832eb3..83abe7848c 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TreeViewItem.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TreeViewItem.xaml
@@ -1,4 +1,4 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:converters="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls">
 
@@ -6,32 +6,29 @@
     <Border Padding="20"
             MinWidth="300">
       <TreeView>
-        <TreeViewItem Header="Level 1">
-          <TreeViewItem Header="Level 2.1">
+        <TreeViewItem Header="Level 1" IsExpanded="True">
+          <TreeViewItem Header="Level 2.1" IsSelected="True" IsExpanded="True">
             <TreeViewItem Header="Level 3.1" />
-            <TreeViewItem Header="Level 3.2">
+            <TreeViewItem Header="Level 3.2" IsSelected="True">
               <TreeViewItem Header="Level 4" />
             </TreeViewItem>
           </TreeViewItem>
-          <TreeViewItem Header="Level 2.2"
-                        IsEnabled="False" />
+          <TreeViewItem Header="Level 2.2" IsEnabled="False" />
         </TreeViewItem>
       </TreeView>
     </Border>
   </Design.PreviewWith>
 
-  <Styles.Resources>
-    <x:Double x:Key="TreeViewItemIndent">16</x:Double>
-    <x:Double x:Key="TreeViewItemExpandCollapseChevronSize">12</x:Double>
-    <Thickness x:Key="TreeViewItemExpandCollapseChevronMargin">12, 0, 12, 0</Thickness>
-    <StreamGeometry x:Key="TreeViewItemCollapsedChevronPathData">M 1,0 10,10 l -9,10 -1,-1 L 8,10 -0,1 Z</StreamGeometry>
-    <StreamGeometry x:Key="TreeViewItemExpandedChevronPathData">M0,1 L10,10 20,1 19,0 10,8 1,0 Z</StreamGeometry>
-    <converters:MarginMultiplierConverter Indent="{StaticResource TreeViewItemIndent}"
-                                          Left="True"
-                                          x:Key="TreeViewItemLeftMarginConverter" />
-  </Styles.Resources>
+  <x:Double x:Key="TreeViewItemIndent">16</x:Double>
+  <x:Double x:Key="TreeViewItemExpandCollapseChevronSize">12</x:Double>
+  <Thickness x:Key="TreeViewItemExpandCollapseChevronMargin">12, 0, 12, 0</Thickness>
+  <StreamGeometry x:Key="TreeViewItemCollapsedChevronPathData">M 1,0 10,10 l -9,10 -1,-1 L 8,10 -0,1 Z</StreamGeometry>
+  <StreamGeometry x:Key="TreeViewItemExpandedChevronPathData">M0,1 L10,10 20,1 19,0 10,8 1,0 Z</StreamGeometry>
+  <converters:MarginMultiplierConverter Indent="{StaticResource TreeViewItemIndent}"
+                                        Left="True"
+                                        x:Key="TreeViewItemLeftMarginConverter" />
 
-  <Style Selector="ToggleButton.ExpandCollapseChevron">
+  <ControlTheme x:Key="FluentTreeViewExpandCollapseChevron" TargetType="ToggleButton">
     <Setter Property="Margin" Value="0" />
     <Setter Property="Width" Value="{StaticResource TreeViewItemExpandCollapseChevronSize}" />
     <Setter Property="Height" Value="{StaticResource TreeViewItemExpandCollapseChevronSize}" />
@@ -43,6 +40,7 @@
                 HorizontalAlignment="Center"
                 VerticalAlignment="Center">
           <Path x:Name="ChevronPath"
+                Data="{StaticResource TreeViewItemCollapsedChevronPathData}"
                 Fill="{DynamicResource TreeViewItemForeground}"
                 Stretch="Uniform"
                 HorizontalAlignment="Center"
@@ -50,9 +48,13 @@
         </Border>
       </ControlTemplate>
     </Setter>
-  </Style>
 
-  <Style Selector="TreeViewItem">
+    <Style Selector="^:checked /template/ Path#ChevronPath">
+      <Setter Property="Data" Value="{StaticResource TreeViewItemExpandedChevronPathData}" />
+    </Style>
+  </ControlTheme>
+
+  <ControlTheme x:Key="{x:Type TreeViewItem}" TargetType="TreeViewItem">
     <Setter Property="Padding" Value="0" />
     <Setter Property="Background" Value="{DynamicResource TreeViewItemBackground}" />
     <Setter Property="BorderBrush" Value="{DynamicResource TreeViewItemBorderBrush}" />
@@ -78,7 +80,7 @@
               <Panel Name="PART_ExpandCollapseChevronContainer"
                      Margin="{StaticResource TreeViewItemExpandCollapseChevronMargin}">
                 <ToggleButton Name="PART_ExpandCollapseChevron"
-                              Classes="ExpandCollapseChevron"
+                              Theme="{StaticResource FluentTreeViewExpandCollapseChevron}"
                               Focusable="False"
                               IsChecked="{TemplateBinding IsExpanded, Mode=TwoWay}" />
               </Panel>
@@ -98,83 +100,75 @@
         </StackPanel>
       </ControlTemplate>
     </Setter>
-  </Style>
-
-  <!--  PointerOver state  -->
-  <Style Selector="TreeViewItem /template/ Border#PART_LayoutRoot:pointerover">
-    <Setter Property="Background" Value="{DynamicResource TreeViewItemBackgroundPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource TreeViewItemBorderBrushPointerOver}" />
-  </Style>
-  <Style Selector="TreeViewItem /template/ Border#PART_LayoutRoot:pointerover > ContentPresenter#PART_HeaderPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource TreeViewItemForegroundPointerOver}" />
-  </Style>
 
-  <!--  Pressed state  -->
-  <Style Selector="TreeViewItem:pressed /template/ Border#PART_LayoutRoot:pointerover">
-    <Setter Property="Background" Value="{DynamicResource TreeViewItemBackgroundPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource TreeViewItemBorderBrushPressed}" />
-  </Style>
-  <Style Selector="TreeViewItem:pressed /template/ Border#PART_LayoutRoot:pointerover > ContentPresenter#PART_HeaderPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource TreeViewItemForegroundPressed}" />
-  </Style>
+    <!--  PointerOver state  -->
+    <Style Selector="^ /template/ Border#PART_LayoutRoot:pointerover">
+      <Setter Property="Background" Value="{DynamicResource TreeViewItemBackgroundPointerOver}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource TreeViewItemBorderBrushPointerOver}" />
+    </Style>
+    <Style Selector="^ /template/ Border#PART_LayoutRoot:pointerover > ContentPresenter#PART_HeaderPresenter">
+      <Setter Property="Foreground" Value="{DynamicResource TreeViewItemForegroundPointerOver}" />
+    </Style>
 
-  <!--  Disabled state  -->
-  <Style Selector="TreeViewItem:disabled /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TreeViewItemBackgroundDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource TreeViewItemBorderBrushDisabled}" />
-  </Style>
-  <Style Selector="TreeViewItem:disabled /template/ Border#PART_LayoutRoot > ContentPresenter#PART_HeaderPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource TreeViewItemForegroundDisabled}" />
-  </Style>
+    <!--  Pressed state  -->
+    <Style Selector="^:pressed /template/ Border#PART_LayoutRoot:pointerover">
+      <Setter Property="Background" Value="{DynamicResource TreeViewItemBackgroundPressed}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource TreeViewItemBorderBrushPressed}" />
+    </Style>
+    <Style Selector="^:pressed /template/ Border#PART_LayoutRoot:pointerover > ContentPresenter#PART_HeaderPresenter">
+      <Setter Property="Foreground" Value="{DynamicResource TreeViewItemForegroundPressed}" />
+    </Style>
 
-  <!--  Selected state  -->
-  <Style Selector="TreeViewItem:selected /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TreeViewItemBackgroundSelected}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource TreeViewItemBorderBrushSelected}" />
-  </Style>
-  <Style Selector="TreeViewItem:selected /template/ Border#PART_LayoutRoot > ContentPresenter#PART_HeaderPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource TreeViewItemForegroundSelected}" />
-  </Style>
+    <!--  Disabled state  -->
+    <Style Selector="^:disabled /template/ Border#PART_LayoutRoot">
+      <Setter Property="Background" Value="{DynamicResource TreeViewItemBackgroundDisabled}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource TreeViewItemBorderBrushDisabled}" />
+    </Style>
+    <Style Selector="^:disabled /template/ ContentPresenter#PART_HeaderPresenter">
+      <Setter Property="Foreground" Value="{DynamicResource TreeViewItemForegroundDisabled}" />
+    </Style>
 
-  <!--  Selected PointerOver state  -->
-  <Style Selector="TreeViewItem:selected /template/ Border#PART_LayoutRoot:pointerover">
-    <Setter Property="Background" Value="{DynamicResource TreeViewItemBackgroundSelectedPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource TreeViewItemBorderBrushSelectedPointerOver}" />
-  </Style>
-  <Style Selector="TreeViewItem:selected /template/ Border#PART_LayoutRoot:pointerover > ContentPresenter#PART_HeaderPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource TreeViewItemForegroundSelectedPointerOver}" />
-  </Style>
+    <!--  Selected state  -->
+    <Style Selector="^:selected /template/ Border#PART_LayoutRoot">
+      <Setter Property="Background" Value="{DynamicResource TreeViewItemBackgroundSelected}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource TreeViewItemBorderBrushSelected}" />
+    </Style>
+    <Style Selector="^:selected /template/ Border#PART_LayoutRoot > ContentPresenter#PART_HeaderPresenter">
+      <Setter Property="Foreground" Value="{DynamicResource TreeViewItemForegroundSelected}" />
+    </Style>
 
-  <!--  Selected Pressed state  -->
-  <Style Selector="TreeViewItem:pressed:selected /template/ Border#PART_LayoutRoot:pointerover">
-    <Setter Property="Background" Value="{DynamicResource TreeViewItemBackgroundSelectedPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource TreeViewItemBorderBrushSelectedPressed}" />
-  </Style>
-  <Style Selector="TreeViewItem:pressed:selected /template/ Border#PART_LayoutRoot:pointerover > ContentPresenter#PART_HeaderPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource TreeViewItemForegroundSelectedPressed}" />
-  </Style>
+    <!--  Selected PointerOver state  -->
+    <Style Selector="^:selected /template/ Border#PART_LayoutRoot:pointerover">
+      <Setter Property="Background" Value="{DynamicResource TreeViewItemBackgroundSelectedPointerOver}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource TreeViewItemBorderBrushSelectedPointerOver}" />
+    </Style>
+    <Style Selector="^:selected /template/ Border#PART_LayoutRoot:pointerover > ContentPresenter#PART_HeaderPresenter">
+      <Setter Property="Foreground" Value="{DynamicResource TreeViewItemForegroundSelectedPointerOver}" />
+    </Style>
 
-  <!--  Disabled Selected state  -->
-  <Style Selector="TreeViewItem:disabled:selected /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TreeViewItemBackgroundSelectedDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource TreeViewItemBorderBrushSelectedDisabled}" />
-  </Style>
-  <Style Selector="TreeViewItem:disabled:selected /template/ Border#PART_LayoutRoot > ContentPresenter#PART_HeaderPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource TreeViewItemForegroundSelectedDisabled}" />
-  </Style>
+    <!--  Selected Pressed state  -->
+    <Style Selector="^:pressed:selected /template/ Border#PART_LayoutRoot:pointerover">
+      <Setter Property="Background" Value="{DynamicResource TreeViewItemBackgroundSelectedPressed}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource TreeViewItemBorderBrushSelectedPressed}" />
+    </Style>
+    <Style Selector="^:pressed:selected /template/ Border#PART_LayoutRoot:pointerover > ContentPresenter#PART_HeaderPresenter">
+      <Setter Property="Foreground" Value="{DynamicResource TreeViewItemForegroundSelectedPressed}" />
+    </Style>
 
-  <!--  ExpandCollapseChevron Group states  -->
-  <Style Selector="ToggleButton.ExpandCollapseChevron /template/ Path#ChevronPath">
-    <Setter Property="Data" Value="{StaticResource TreeViewItemCollapsedChevronPathData}" />
-  </Style>
-  <Style Selector="ToggleButton.ExpandCollapseChevron:checked /template/ Path#ChevronPath">
-    <Setter Property="Data" Value="{StaticResource TreeViewItemExpandedChevronPathData}" />
-  </Style>
-  <Style Selector="TreeViewItem:empty /template/ ToggleButton#PART_ExpandCollapseChevron">
-    <Setter Property="IsVisible" Value="False" />
-  </Style>
-  <Style Selector="TreeViewItem:empty /template/ Panel#PART_ExpandCollapseChevronContainer">
-    <Setter Property="Width" Value="{StaticResource TreeViewItemExpandCollapseChevronSize}" />
-  </Style>
+    <!--  Disabled Selected state  -->
+    <Style Selector="^:disabled:selected /template/ Border#PART_LayoutRoot">
+      <Setter Property="Background" Value="{DynamicResource TreeViewItemBackgroundSelectedDisabled}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource TreeViewItemBorderBrushSelectedDisabled}" />
+    </Style>
+    <Style Selector="^:disabled:selected /template/ Border#PART_LayoutRoot > ContentPresenter#PART_HeaderPresenter">
+      <Setter Property="Foreground" Value="{DynamicResource TreeViewItemForegroundSelectedDisabled}" />
+    </Style>
 
-</Styles>
+    <Style Selector="^:empty /template/ ToggleButton#PART_ExpandCollapseChevron">
+      <Setter Property="IsVisible" Value="False" />
+    </Style>
+    <Style Selector="^:empty /template/ Panel#PART_ExpandCollapseChevronContainer">
+      <Setter Property="Width" Value="{StaticResource TreeViewItemExpandCollapseChevronSize}" />
+    </Style>
+  </ControlTheme>
+</ResourceDictionary>

From 7fcd73836940e0bf3654fe4e0a86493eb75e8386 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Sun, 10 Jul 2022 02:12:56 +0200
Subject: [PATCH 57/70] Tweaked TitleBar ControlTheme.

---
 src/Avalonia.Controls/Chrome/TitleBar.cs      | 15 ++++++------
 .../Controls/TitleBar.xaml                    | 24 +++++++++++--------
 2 files changed, 22 insertions(+), 17 deletions(-)

diff --git a/src/Avalonia.Controls/Chrome/TitleBar.cs b/src/Avalonia.Controls/Chrome/TitleBar.cs
index b152a31587..428bf8f9b0 100644
--- a/src/Avalonia.Controls/Chrome/TitleBar.cs
+++ b/src/Avalonia.Controls/Chrome/TitleBar.cs
@@ -35,7 +35,8 @@ namespace Avalonia.Controls.Chrome
                     }
                 }
 
-                IsVisible = window.PlatformImpl?.NeedsManagedDecorations ?? false;
+                if (!Design.IsDesignMode)
+                    IsVisible = window.PlatformImpl?.NeedsManagedDecorations ?? false;
             }
         }
 
@@ -44,13 +45,13 @@ namespace Avalonia.Controls.Chrome
             base.OnApplyTemplate(e);
 
             _captionButtons?.Detach();
-            
+
             _captionButtons = e.NameScope.Get<CaptionButtons>("PART_CaptionButtons");
 
-            if (VisualRoot is Window window)
+            if (VisualRoot is Window window && !Design.IsDesignMode)
             {
-                _captionButtons?.Attach(window);   
-                
+                _captionButtons?.Attach(window);
+
                 UpdateSize(window);
             }
         }
@@ -59,7 +60,7 @@ namespace Avalonia.Controls.Chrome
         {
             base.OnAttachedToVisualTree(e);
 
-            if (VisualRoot is Window window)
+            if (VisualRoot is Window window && !Design.IsDesignMode)
             {
                 _disposables = new CompositeDisposable
                 {
@@ -90,7 +91,7 @@ namespace Avalonia.Controls.Chrome
             base.OnDetachedFromVisualTree(e);
 
             _disposables?.Dispose();
-            
+
             _captionButtons?.Detach();
             _captionButtons = null;
         }
diff --git a/src/Avalonia.Themes.Fluent/Controls/TitleBar.xaml b/src/Avalonia.Themes.Fluent/Controls/TitleBar.xaml
index 2b97df020f..5730b19e78 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TitleBar.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TitleBar.xaml
@@ -1,8 +1,8 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <Design.PreviewWith>
-      <Border>
-        <TitleBar Background="SkyBlue" Height="30" Width="300" Foreground="Black" />
+      <Border Height="30" Width="300">
+        <TitleBar Background="SkyBlue" Foreground="Black" />
       </Border>
     </Design.PreviewWith>
 
@@ -13,11 +13,19 @@
       <Setter Property="Background" Value="Transparent" />
       <Setter Property="Template">
         <ControlTemplate>
-          <Panel HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="Stretch">
-            <Panel x:Name="PART_MouseTracker" Height="1" VerticalAlignment="Top" />
+          <Panel HorizontalAlignment="{TemplateBinding HorizontalAlignment}" 
+                 VerticalAlignment="Stretch">
+            <Panel x:Name="PART_MouseTracker" 
+                   Height="1" 
+                   VerticalAlignment="Top" />
             <Panel x:Name="PART_Container">
-              <Border x:Name="PART_Background" Background="{TemplateBinding Background}" />
-              <CaptionButtons x:Name="PART_CaptionButtons" VerticalAlignment="Top" HorizontalAlignment="Right" Foreground="{TemplateBinding Foreground}" />
+              <Border x:Name="PART_Background"
+                      Background="{TemplateBinding Background}"
+                      IsHitTestVisible="False"/>
+              <CaptionButtons x:Name="PART_CaptionButtons"
+                              VerticalAlignment="Top" 
+                              HorizontalAlignment="Right"
+                              Foreground="{TemplateBinding Foreground}" />
             </Panel>
           </Panel>
         </ControlTemplate>
@@ -27,10 +35,6 @@
         <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
       </Style>
 
-      <Style Selector="^ /template/ Border#PART_Background">
-        <Setter Property="IsHitTestVisible" Value="False" />
-      </Style>
-
       <Style Selector="^:fullscreen /template/ Border#PART_Background">
         <Setter Property="IsHitTestVisible" Value="True" />
       </Style>

From 5864452d75a596bdd7bd0d0cdd6de8f3805d8159 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Sun, 10 Jul 2022 15:19:40 +0200
Subject: [PATCH 58/70] Undo changed to TitleBar.

It was causing the title bar to be shown in all designer previews.
---
 src/Avalonia.Controls/Chrome/TitleBar.cs | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/src/Avalonia.Controls/Chrome/TitleBar.cs b/src/Avalonia.Controls/Chrome/TitleBar.cs
index 428bf8f9b0..1bf13111a9 100644
--- a/src/Avalonia.Controls/Chrome/TitleBar.cs
+++ b/src/Avalonia.Controls/Chrome/TitleBar.cs
@@ -35,8 +35,7 @@ namespace Avalonia.Controls.Chrome
                     }
                 }
 
-                if (!Design.IsDesignMode)
-                    IsVisible = window.PlatformImpl?.NeedsManagedDecorations ?? false;
+                IsVisible = window.PlatformImpl?.NeedsManagedDecorations ?? false;
             }
         }
 
@@ -48,7 +47,7 @@ namespace Avalonia.Controls.Chrome
 
             _captionButtons = e.NameScope.Get<CaptionButtons>("PART_CaptionButtons");
 
-            if (VisualRoot is Window window && !Design.IsDesignMode)
+            if (VisualRoot is Window window)
             {
                 _captionButtons?.Attach(window);
 
@@ -60,7 +59,7 @@ namespace Avalonia.Controls.Chrome
         {
             base.OnAttachedToVisualTree(e);
 
-            if (VisualRoot is Window window && !Design.IsDesignMode)
+            if (VisualRoot is Window window)
             {
                 _disposables = new CompositeDisposable
                 {

From 07cce63b8bd4b009bd384e727caaab16d339bc4a Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Sun, 10 Jul 2022 16:57:55 +0200
Subject: [PATCH 59/70] Ported TimePicker to ControlTheme.

And refactored shared date/time picker components into a separate file.
---
 .../Controls/DatePicker.xaml                  | 207 +++-----
 .../Controls/DateTimePickerShared.xaml        | 116 +++++
 .../Controls/FluentControls.xaml              |   3 +-
 .../Controls/TimePicker.xaml                  | 465 ++++++++++++------
 4 files changed, 501 insertions(+), 290 deletions(-)
 create mode 100644 src/Avalonia.Themes.Fluent/Controls/DateTimePickerShared.xaml

diff --git a/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml b/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml
index 0537feb60b..0441415128 100644
--- a/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml
@@ -10,8 +10,21 @@
         xmlns:sys="clr-namespace:System;assembly=netstandard"
         x:CompileBindings="True">
   <Design.PreviewWith>
-    <Border Padding="20">
-      <DatePicker CornerRadius="10" />
+    <Border Padding="20" Height="500">
+      <StackPanel Spacing="20" VerticalAlignment="Center">
+        <DatePicker />
+        <DatePicker CornerRadius="10" />
+        <DatePicker IsEnabled="False" />
+        <DatePicker>
+          <DataValidationErrors.Error>
+            <sys:Exception>
+              <x:Arguments>
+                <x:String>Error</x:String>
+              </x:Arguments>
+            </sys:Exception>
+          </DataValidationErrors.Error>
+        </DatePicker>
+      </StackPanel>
     </Border>
   </Design.PreviewWith>
 
@@ -27,105 +40,45 @@
   <Thickness x:Key="DatePickerHostMonthPadding">9,3,0,6</Thickness>
   <x:Double x:Key="DatePickerSpacerThemeWidth">1</x:Double>
 
-  <!-- Theme for the items displayed in the selectors -->
-  <ControlTheme x:Key="FluentDateTimePickerItem" TargetType="ListBoxItem" BasedOn="{StaticResource {x:Type ListBoxItem}}">
-    <Setter Property="Padding" Value="{DynamicResource DatePickerFlyoutPresenterItemPadding}"/>
-    <Setter Property="VerticalContentAlignment" Value="Center" />
-    <Setter Property="HorizontalContentAlignment" Value="Center" />
-
-    <Style Selector="^:selected">
-      <Setter Property="IsHitTestVisible" Value="False"/>
-      <Style Selector="^/template/ Rectangle#PressedBackground">
-        <Setter Property="Fill" Value="Transparent"/>
-      </Style>
-      <Style Selector="^/template/ ContentPresenter">
-        <Setter Property="Background" Value="Transparent" />
-        <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>
-      </Style>
-    </Style>
-    <Style Selector="^.MonthItem">
-      <Setter Property="Padding" Value="{DynamicResource DatePickerFlyoutPresenterMonthPadding}"/>
-      <Setter Property="VerticalContentAlignment" Value="Center" />
-      <Setter Property="HorizontalContentAlignment" Value="Left" />
-    </Style>
-  </ControlTheme>
-
-  <!-- This is used for both the accept/dismiss & repeatbuttons in the presenter-->
-  <ControlTheme x:Key="FluentDateTimePickerButton" TargetType="Button">
-    <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackground}" />
-    <Setter Property="HorizontalContentAlignment" Value="Center"/>
-    <Setter Property="VerticalContentAlignment" Value="Center"/>
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+  <ControlTheme x:Key="FluentDatePickerFlyoutButton" TargetType="Button">
     <Setter Property="RenderTransform" Value="none" />
     <Setter Property="Template">
       <ControlTemplate>
-        <!-- 
-                The background is doubled here for the loopingselector up/down repeat buttons 
-                that appear opaque. Not sure how MS does it though I suspect this is it
-                but source isn't MIT yet, so this is my solution -->
-        <Border Background="{TemplateBinding Background}">
-          <ContentPresenter x:Name="ContentPresenter"
-                  Background="{TemplateBinding Background}"
-                  BorderBrush="{DynamicResource DateTimePickerFlyoutButtonBorderBrush}"
-                  BorderThickness="{DynamicResource DateTimeFlyoutButtonBorderThickness}"
-                  Content="{TemplateBinding Content}"
-                  Foreground="{DynamicResource SystemControlHighlightAltBaseHighBrush}"
-                  ContentTemplate="{TemplateBinding ContentTemplate}"
-                  Padding="{TemplateBinding Padding}"
-                  HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                  VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                  CornerRadius="{TemplateBinding CornerRadius}"/>
-        </Border>
+        <ContentPresenter Name="PART_ContentPresenter"
+                          BorderBrush="{TemplateBinding BorderBrush}"
+                          Background="{TemplateBinding Background}"
+                          BorderThickness="{TemplateBinding BorderThickness}"
+                          Content="{TemplateBinding Content}"
+                          Foreground="{TemplateBinding Foreground}"
+                          HorizontalContentAlignment="Stretch"
+                          VerticalContentAlignment="Stretch"
+                          CornerRadius="{TemplateBinding CornerRadius}"/>
       </ControlTemplate>
     </Setter>
-
-    <Style Selector="^:pointerover /template/ ContentPresenter">
-      <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackgroundPointerOver}"/>
-      <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerFlyoutButtonBorderBrushPointerOver}"/>
-      <Setter Property="Foreground" Value="{DynamicResource DateTimePickerFlyoutButtonForegroundPointerOver}"/>
+    
+    <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushPointerOver}"/>
+      <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundPointerOver}"/>
+      <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundPointerOver}"/>
     </Style>
-
+    
     <Style Selector="^:pressed">
       <Setter Property="RenderTransform" Value="scale(0.98)" />
     </Style>
-
-    <Style Selector="^:pressed /template/ ContentPresenter">
-      <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackgroundPressed}"/>
-      <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerFlyoutButtonBorderBrushPressed}"/>
-      <Setter Property="Foreground" Value="{DynamicResource DateTimePickerFlyoutButtonForegroundPressed}"/>
+    
+    <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushPressed}"/>
+      <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundPressed}"/>
+      <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundPressed}"/>
     </Style>
-  </ControlTheme>
 
-  <ControlTheme x:Key="FluentDateTimePickerUpButton" TargetType="RepeatButton" BasedOn="{StaticResource FluentDateTimePickerButton}">
-    <Setter Property="VerticalAlignment" Value="Top"/>
-    <Setter Property="Height" Value="22" />
-    <Setter Property="HorizontalAlignment" Value="Stretch" />
-    <Setter Property="Focusable" Value="False" />
-    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
-    <Setter Property="Content">
-      <Template>
-        <Viewbox Height="10" Width="10" HorizontalAlignment="Center" VerticalAlignment="Center">
-          <Path Stroke="{Binding $parent[RepeatButton].Foreground}" StrokeThickness="1" Data="M 0,9 L 9,0 L 18,9"/>
-        </Viewbox>
-      </Template>
-    </Setter>
-  </ControlTheme>
-
-  <ControlTheme x:Key="FluentDateTimePickerDownButton" TargetType="RepeatButton" BasedOn="{StaticResource FluentDateTimePickerButton}">
-    <Setter Property="VerticalAlignment" Value="Bottom"/>
-    <Setter Property="Height" Value="22" />
-    <Setter Property="HorizontalAlignment" Value="Stretch" />
-    <Setter Property="Focusable" Value="False" />
-    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
-    <Setter Property="Content">
-      <Template>
-        <Viewbox Height="10" Width="10" HorizontalAlignment="Center" VerticalAlignment="Center">
-          <Path Stroke="{Binding $parent[RepeatButton].Foreground}" StrokeThickness="1" Data="M 0,0 L 9,9 L 18,0"/>
-        </Viewbox>
-      </Template>
-    </Setter>
+    <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushDisabled}"/>
+      <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundDisabled}"/>
+      <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundDisabled}"/>
+    </Style>
   </ControlTheme>
-
+  
   <ControlTheme x:Key="{x:Type DatePicker}" TargetType="DatePicker">
     <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
     <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForeground}" />
@@ -148,7 +101,9 @@
                               HorizontalAlignment="Stretch"
                               VerticalAlignment="Top"/>
 
-            <Button Name="FlyoutButton" Grid.Row="1"
+            <Button Name="FlyoutButton"
+                    Grid.Row="1"
+                    Theme="{StaticResource FluentDatePickerFlyoutButton}"
                     Foreground="{TemplateBinding Foreground}"
                     Background="{TemplateBinding Background}"
                     BorderBrush="{TemplateBinding BorderBrush}"
@@ -159,22 +114,7 @@
                     MaxWidth="{DynamicResource DatePickerThemeMaxWidth}"
                     HorizontalAlignment="Stretch"
                     VerticalAlignment="Stretch"
-                    HorizontalContentAlignment="Stretch"
-                    VerticalContentAlignment="Stretch"
                     TemplatedControl.IsTemplateFocusTarget="True">
-              <Button.Template>
-                <ControlTemplate>
-                  <ContentPresenter Name="ContentPresenter"
-                                    BorderBrush="{TemplateBinding BorderBrush}"
-                                    Background="{TemplateBinding Background}"
-                                    BorderThickness="{TemplateBinding BorderThickness}"
-                                    Content="{TemplateBinding Content}"
-                                    Foreground="{TemplateBinding Foreground}"
-                                    HorizontalContentAlignment="Stretch"
-                                    VerticalContentAlignment="Stretch"
-                                    CornerRadius="{TemplateBinding CornerRadius}"/>
-                </ControlTemplate>
-              </Button.Template>
               <Grid Name="ButtonContentGrid" ColumnDefinitions="78*,Auto,132*,Auto,78*">
                 <TextBlock Name="DayText" Text="day" HorizontalAlignment="Center"
                            Padding="{DynamicResource DatePickerHostPadding}"
@@ -223,25 +163,7 @@
     <Style Selector="^:hasnodate /template/ Button#FlyoutButton TextBlock">
       <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForeground}"/>
     </Style>
-    <Style Selector="^/template/ Button#FlyoutButton">
-      <Style Selector="^:pointerover">
-        <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushPointerOver}"/>
-        <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundPointerOver}"/>
-        <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundPointerOver}"/>
-      </Style>
-
-      <Style Selector="^:pressed">
-        <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushPressed}"/>
-        <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundPressed}"/>
-        <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundPressed}"/>
-      </Style>
-
-      <Style Selector="^:disabled">
-        <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushDisabled}"/>
-        <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundDisabled}"/>
-        <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundDisabled}"/>
-      </Style>
-    </Style>
+    
     <Style Selector="^:error /template/ Button#FlyoutButton">
       <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
     </Style>
@@ -321,20 +243,35 @@
                          Width="{DynamicResource DatePickerSpacerThemeWidth}"
                          Grid.Column="3" />
             </Grid>
-            <Grid Grid.Row="1" Height="{DynamicResource DatePickerFlyoutPresenterAcceptDismissHostGridHeight}"
-                  Name="AcceptDismissGrid" ColumnDefinitions="*,*">
-              <Rectangle Height="{DynamicResource DatePickerSpacerThemeWidth}" VerticalAlignment="Top"
+            
+            <Grid Name="AcceptDismissGrid"
+                  Grid.Row="1"
+                  ColumnDefinitions="*,*">
+              <Rectangle Height="{DynamicResource DatePickerSpacerThemeWidth}" 
+                         VerticalAlignment="Top"
                          Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
                          Grid.ColumnSpan="2"/>
-              <Button Name="AcceptButton" Grid.Column="0" Theme="{StaticResource FluentDateTimePickerButton}"
-                      HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
-                      StrokeThickness="0.75" Data="M0.5,8.5 5,13.5 15.5,3" />
+              <Button Name="AcceptButton"
+                      Grid.Column="0"
+                      Theme="{StaticResource FluentDateTimePickerButton}"
+                      Height="{DynamicResource DatePickerFlyoutPresenterAcceptDismissHostGridHeight}"
+                      HorizontalAlignment="Stretch"
+                      VerticalAlignment="Stretch">
+                <Path Stroke="{Binding $parent[Button].Foreground}"
+                      StrokeLineCap="Round"
+                      StrokeThickness="0.75"
+                      Data="M0.5,8.5 5,13.5 15.5,3" />
               </Button>
-              <Button Name="DismissButton" Grid.Column="1" Theme="{StaticResource FluentDateTimePickerButton}"
-                      FontSize="16" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
-                      StrokeThickness="0.75" Data="M2,2 14,14 M2,14 14 2" />
+              <Button Name="DismissButton" 
+                      Grid.Column="1" 
+                      Theme="{StaticResource FluentDateTimePickerButton}"
+                      Height="{DynamicResource DatePickerFlyoutPresenterAcceptDismissHostGridHeight}"
+                      HorizontalAlignment="Stretch" 
+                      VerticalAlignment="Stretch">
+                <Path Stroke="{Binding $parent[Button].Foreground}" 
+                      StrokeLineCap="Round"
+                      StrokeThickness="0.75" 
+                      Data="M2,2 14,14 M2,14 14 2" />
               </Button>
             </Grid>
           </Grid>
diff --git a/src/Avalonia.Themes.Fluent/Controls/DateTimePickerShared.xaml b/src/Avalonia.Themes.Fluent/Controls/DateTimePickerShared.xaml
new file mode 100644
index 0000000000..77271a149f
--- /dev/null
+++ b/src/Avalonia.Themes.Fluent/Controls/DateTimePickerShared.xaml
@@ -0,0 +1,116 @@
+<!--
+// (c) Copyright Microsoft Corporation.
+// This source is subject to the Microsoft Public License (Ms-PL).
+// Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
+// All other rights reserved.
+-->
+
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+        xmlns:sys="clr-namespace:System;assembly=netstandard"
+        x:CompileBindings="True">
+  <Design.PreviewWith>
+    <Border Padding="20" Width="200">
+      <StackPanel Spacing="20">
+        <ListBoxItem Theme="{DynamicResource FluentDateTimePickerItem}">Standard Item</ListBoxItem>
+        <ListBoxItem Theme="{DynamicResource FluentDateTimePickerItem}" Classes="MonthItem">Month Item</ListBoxItem>
+        <RepeatButton Theme="{DynamicResource FluentDateTimePickerButton}">Button</RepeatButton>
+        <RepeatButton Theme="{DynamicResource FluentDateTimePickerUpButton}"/>
+        <RepeatButton Theme="{DynamicResource FluentDateTimePickerDownButton}"/>
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
+
+  <!-- Theme for the items displayed in the selectors -->
+  <ControlTheme x:Key="FluentDateTimePickerItem" TargetType="ListBoxItem" BasedOn="{StaticResource {x:Type ListBoxItem}}">
+    <Setter Property="Padding" Value="{DynamicResource DatePickerFlyoutPresenterItemPadding}"/>
+    <Setter Property="VerticalContentAlignment" Value="Center" />
+    <Setter Property="HorizontalContentAlignment" Value="Center" />
+
+    <Style Selector="^:selected">
+      <Setter Property="IsHitTestVisible" Value="False"/>
+      <Style Selector="^/template/ Rectangle#PressedBackground">
+        <Setter Property="Fill" Value="Transparent"/>
+      </Style>
+      <Style Selector="^/template/ ContentPresenter">
+        <Setter Property="Background" Value="Transparent" />
+        <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>
+      </Style>
+    </Style>
+    <Style Selector="^.MonthItem">
+      <Setter Property="Padding" Value="{DynamicResource DatePickerFlyoutPresenterMonthPadding}"/>
+      <Setter Property="HorizontalContentAlignment" Value="Left" />
+    </Style>
+  </ControlTheme>
+
+  <!-- This is used for both the accept/dismiss & repeatbuttons in the presenter-->
+  <ControlTheme x:Key="FluentDateTimePickerButton" TargetType="Button">
+    <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackground}" />
+    <Setter Property="Height" Value="22" />
+    <Setter Property="HorizontalContentAlignment" Value="Center"/>
+    <Setter Property="VerticalContentAlignment" Value="Center"/>
+    <Setter Property="Template">
+      <ControlTemplate>
+        <!-- 
+                The background is doubled here for the loopingselector up/down repeat buttons 
+                that appear opaque. Not sure how MS does it though I suspect this is it
+                but source isn't MIT yet, so this is my solution -->
+        <Border Background="{TemplateBinding Background}">
+          <ContentPresenter x:Name="ContentPresenter"
+                  Background="{TemplateBinding Background}"
+                  BorderBrush="{DynamicResource DateTimePickerFlyoutButtonBorderBrush}"
+                  BorderThickness="{DynamicResource DateTimeFlyoutButtonBorderThickness}"
+                  Content="{TemplateBinding Content}"
+                  Foreground="{DynamicResource SystemControlHighlightAltBaseHighBrush}"
+                  ContentTemplate="{TemplateBinding ContentTemplate}"
+                  Padding="{TemplateBinding Padding}"
+                  HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                  VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                  CornerRadius="{TemplateBinding CornerRadius}"/>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+
+    <Style Selector="^:pointerover /template/ ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackgroundPointerOver}"/>
+      <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerFlyoutButtonBorderBrushPointerOver}"/>
+      <Setter Property="Foreground" Value="{DynamicResource DateTimePickerFlyoutButtonForegroundPointerOver}"/>
+    </Style>
+
+    <Style Selector="^:pressed /template/ ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackgroundPressed}"/>
+      <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerFlyoutButtonBorderBrushPressed}"/>
+      <Setter Property="Foreground" Value="{DynamicResource DateTimePickerFlyoutButtonForegroundPressed}"/>
+    </Style>
+  </ControlTheme>
+
+  <ControlTheme x:Key="FluentDateTimePickerUpButton" TargetType="RepeatButton" BasedOn="{StaticResource FluentDateTimePickerButton}">
+    <Setter Property="VerticalAlignment" Value="Top"/>
+    <Setter Property="Height" Value="22" />
+    <Setter Property="HorizontalAlignment" Value="Stretch" />
+    <Setter Property="Focusable" Value="False" />
+    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
+    <Setter Property="Content">
+      <Template>
+        <Viewbox Height="10" Width="10" HorizontalAlignment="Center" VerticalAlignment="Center">
+          <Path Stroke="{Binding $parent[RepeatButton].Foreground}" StrokeThickness="1" Data="M 0,9 L 9,0 L 18,9"/>
+        </Viewbox>
+      </Template>
+    </Setter>
+  </ControlTheme>
+
+  <ControlTheme x:Key="FluentDateTimePickerDownButton" TargetType="RepeatButton" BasedOn="{StaticResource FluentDateTimePickerButton}">
+    <Setter Property="VerticalAlignment" Value="Bottom"/>
+    <Setter Property="Height" Value="22" />
+    <Setter Property="HorizontalAlignment" Value="Stretch" />
+    <Setter Property="Focusable" Value="False" />
+    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
+    <Setter Property="Content">
+      <Template>
+        <Viewbox Height="10" Width="10" HorizontalAlignment="Center" VerticalAlignment="Center">
+          <Path Stroke="{Binding $parent[RepeatButton].Foreground}" StrokeThickness="1" Data="M 0,0 L 9,9 L 18,0"/>
+        </Viewbox>
+      </Template>
+    </Setter>
+  </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
index 58c33bf26f..262007082f 100644
--- a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
@@ -59,7 +59,9 @@
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ContentControl.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ContextMenu.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/DataValidationErrors.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/DateTimePickerShared.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/DatePicker.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TimePicker.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/DropDownButton.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/EmbeddableControlRoot.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Slider.xaml" />
@@ -72,6 +74,5 @@
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/FocusAdorner.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitButton.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/UserControl.xaml" />
-    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TimePicker.xaml" />
     <Styles.Resources />
 </Styles>
diff --git a/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml b/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml
index dc09032a36..b5f177b985 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml
@@ -1,163 +1,320 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!--
+<!--
 // (c) Copyright Microsoft Corporation.
 // This source is subject to the Microsoft Public License (Ms-PL).
 // Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
 // All other rights reserved.
 -->
-<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:sys="clr-namespace:System;assembly=netstandard" x:CompileBindings="True">
-  <Styles.Resources>
-    <x:Double x:Key="TimePickerFlyoutPresenterItemHeight">40</x:Double>
-    <x:Double x:Key="TimePickerSpacerThemeWidth">1</x:Double>
-    <Thickness x:Key="TimePickerBorderThemeThickness">1</Thickness>
-    <Thickness x:Key="TimePickerTopHeaderMargin">0,0,0,4</Thickness>
-    <x:Double x:Key="TimePickerFlyoutPresenterHighlightHeight">40</x:Double>
-    <x:Double x:Key="TimePickerFlyoutPresenterAcceptDismissHostGridHeight">41</x:Double>
-    <x:Double x:Key="TimePickerThemeMinWidth">242</x:Double>
-    <x:Double x:Key="TimePickerThemeMaxWidth">456</x:Double>
-    <Thickness x:Key="TimePickerFlyoutPresenterItemPadding">0,3,0,6</Thickness>
-    <Thickness x:Key="TimePickerHostPadding">0,3,0,6</Thickness>
-    <ControlTheme x:Key="FluentTimePicker" TargetType="TimePicker">
-      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-      <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForeground}" />
-      <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackground}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrush}" />
-      <Setter Property="BorderThickness" Value="{DynamicResource TimePickerBorderThemeThickness}" />
-      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-      <Setter Property="HorizontalAlignment" Value="Left" />
-      <Setter Property="VerticalAlignment" Value="Center" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <DataValidationErrors>
-            <Grid Name="LayoutRoot" Margin="{TemplateBinding Padding}" RowDefinitions="Auto,*">
-              <ContentPresenter x:Name="HeaderContentPresenter" Grid.Row="0" Content="{TemplateBinding Header}" ContentTemplate="{TemplateBinding HeaderTemplate}" Margin="{DynamicResource TimePickerTopHeaderMargin}" MaxWidth="{DynamicResource TimePickerThemeMaxWidth}" Foreground="{DynamicResource TimePickerHeaderForeground}" HorizontalAlignment="Stretch" VerticalAlignment="Top" />
-              <Button x:Name="FlyoutButton" Grid.Row="1" Foreground="{TemplateBinding Foreground}" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}" IsEnabled="{TemplateBinding IsEnabled}" MinWidth="{DynamicResource TimePickerThemeMinWidth}" MaxWidth="{DynamicResource TimePickerThemeMaxWidth}" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" VerticalAlignment="Top" VerticalContentAlignment="Stretch">
-                <Button.Template>
-                  <ControlTemplate>
-                    <ContentPresenter Name="ContentPresenter" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" />
-                  </ControlTemplate>
-                </Button.Template>
-                <Grid Name="FlyoutButtonContentGrid">
-                  <!--Ignore col defs here, set in code-->
-                  <Border x:Name="FirstPickerHost" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                    <TextBlock x:Name="HourTextBlock" HorizontalAlignment="Center" Padding="{DynamicResource TimePickerHostPadding}" FontFamily="{TemplateBinding FontFamily}" FontWeight="{TemplateBinding FontWeight}" FontSize="{TemplateBinding FontSize}" />
-                  </Border>
-                  <Rectangle Name="FirstColumnDivider" Fill="{DynamicResource TimePickerSpacerFill}" HorizontalAlignment="Center" Width="{DynamicResource TimePickerSpacerThemeWidth}" Grid.Column="1" />
-                  <Border x:Name="SecondPickerHost" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                    <TextBlock x:Name="MinuteTextBlock" HorizontalAlignment="Center" Padding="{DynamicResource TimePickerHostPadding}" FontFamily="{TemplateBinding FontFamily}" FontWeight="{TemplateBinding FontWeight}" FontSize="{TemplateBinding FontSize}" />
-                  </Border>
-                  <Rectangle Name="SecondColumnDivider" Fill="{DynamicResource TimePickerSpacerFill}" HorizontalAlignment="Center" Width="{DynamicResource TimePickerSpacerThemeWidth}" Grid.Column="3" />
-                  <Border x:Name="ThirdPickerHost" Grid.Column="4" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                    <TextBlock x:Name="PeriodTextBlock" HorizontalAlignment="Center" Padding="{DynamicResource TimePickerHostPadding}" FontFamily="{TemplateBinding FontFamily}" FontWeight="{TemplateBinding FontWeight}" FontSize="{TemplateBinding FontSize}" />
-                  </Border>
-                </Grid>
-              </Button>
-              <Popup Name="Popup" WindowManagerAddShadowHint="False" IsLightDismissEnabled="True" PlacementTarget="{TemplateBinding}" PlacementMode="Bottom">
-                <TimePickerPresenter Name="PickerPresenter" />
-              </Popup>
-            </Grid>
-          </DataValidationErrors>
-        </ControlTemplate>
-      </Setter>
-      <Style Selector="^:hasnotime /template/ Button#FlyoutButton TextBlock">
-        <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForeground}" />
-      </Style>
-      <!--<Style Selector="^:error /template/ Button#FlyoutButton /template/ ContentPresenter">
-        <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
-      </Style>
-      <Style Selector="^ /template/ Button">
-        <Style Selector="^#FlyoutButton:pointerover /template/ ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackgroundPointerOver}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrushPointerOver}" />
-          <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForegroundPointerOver}" />
-        </Style>
-        <Style Selector="^:pressed /template/ ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackgroundPressed}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrushPressed}" />
-          <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForegroundPressed}" />
-        </Style>
-        <Style Selector="^:disabled /template/ ContentPresenter">
-          <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackgroundDisabled}" />
-          <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrushDisabled}" />
-          <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForegroundDisabled}" />
-        </Style>
-      </Style>-->
-      <Style Selector="^:disabled">
-        <Style Selector="^ /template/ ContentPresenter#HeaderContentPresenter">
-          <Setter Property="Foreground" Value="{DynamicResource TimePickerHeaderForegroundDisabled}" />
-        </Style>
-        <Style Selector="^ /template/ Rectangle">
-          <Setter Property="Fill" Value="{DynamicResource TimePickerSpacerFillDisabled}" />
-        </Style>
-      </Style>
-    </ControlTheme>
-    <ControlTheme x:Key="FluentTimePickerPresenter" TargetType="TimePickerPresenter">
-      <Setter Property="Width" Value="242" />
-      <Setter Property="MinWidth" Value="242" />
-      <Setter Property="MaxHeight" Value="398" />
-      <Setter Property="FontWeight" Value="Normal" />
-      <Setter Property="Background" Value="{DynamicResource TimePickerFlyoutPresenterBackground}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource TimePickerFlyoutPresenterBorderBrush}" />
-      <Setter Property="BorderThickness" Value="{DynamicResource DateTimeFlyoutBorderThickness}" />
-      <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
-      <Setter Property="Template">
-        <ControlTemplate>
-          <Border Name="Background" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}" Padding="{DynamicResource DateTimeFlyoutBorderPadding}" MaxHeight="398">
-            <Grid Name="ContentPanel" RowDefinitions="*,Auto">
-              <Grid Name="PickerContainer">
+
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+        xmlns:sys="clr-namespace:System;assembly=netstandard"
+        x:CompileBindings="True">
+  <Design.PreviewWith>
+    <Border Padding="20" Height="500">
+      <StackPanel Spacing="20" VerticalAlignment="Center">
+        <TimePicker />
+        <TimePicker CornerRadius="10" />
+        <TimePicker IsEnabled="False"/>
+        <TimePicker>
+          <DataValidationErrors.Error>
+            <sys:Exception>
+              <x:Arguments>
+                <x:String>Error</x:String>
+              </x:Arguments>
+            </sys:Exception>
+          </DataValidationErrors.Error>
+        </TimePicker>
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
+
+  <x:Double x:Key="TimePickerFlyoutPresenterItemHeight">40</x:Double>
+  <x:Double x:Key="TimePickerSpacerThemeWidth">1</x:Double>
+  <Thickness x:Key="TimePickerBorderThemeThickness">1</Thickness>
+  <Thickness x:Key="TimePickerTopHeaderMargin">0,0,0,4</Thickness>
+  <x:Double x:Key="TimePickerFlyoutPresenterHighlightHeight">40</x:Double>
+  <x:Double x:Key="TimePickerFlyoutPresenterAcceptDismissHostGridHeight">41</x:Double>
+  <x:Double x:Key="TimePickerThemeMinWidth">242</x:Double>
+  <x:Double x:Key="TimePickerThemeMaxWidth">456</x:Double>
+  <Thickness x:Key="TimePickerFlyoutPresenterItemPadding">0,3,0,6</Thickness>
+  <Thickness x:Key="TimePickerHostPadding">0,3,0,6</Thickness>
+
+  <ControlTheme x:Key="FluentTimePickerFlyoutButton" TargetType="Button">
+    <Setter Property="RenderTransform" Value="none" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <ContentPresenter Name="PART_ContentPresenter"
+                          BorderBrush="{TemplateBinding BorderBrush}"
+                          Background="{TemplateBinding Background}"
+                          BorderThickness="{TemplateBinding BorderThickness}"
+                          Content="{TemplateBinding Content}"
+                          Foreground="{TemplateBinding Foreground}"
+                          HorizontalContentAlignment="Stretch"
+                          VerticalContentAlignment="Stretch"
+                          CornerRadius="{TemplateBinding CornerRadius}"/>
+      </ControlTemplate>
+    </Setter>
+
+    <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrushPointerOver}"/>
+      <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackgroundPointerOver}"/>
+      <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForegroundPointerOver}"/>
+    </Style>
+
+    <Style Selector="^:pressed">
+      <Setter Property="RenderTransform" Value="scale(0.98)" />
+    </Style>
+
+    <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrushPressed}"/>
+      <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackgroundPressed}"/>
+      <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForegroundPressed}"/>
+    </Style>
+
+    <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrushDisabled}"/>
+      <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackgroundDisabled}"/>
+      <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForegroundDisabled}"/>
+    </Style>
+  </ControlTheme>
+
+  <ControlTheme x:Key="{x:Type TimePicker}" TargetType="TimePicker">
+    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForeground}" />
+    <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackground}"/>
+    <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrush}"/>
+    <Setter Property="BorderThickness" Value="{DynamicResource TimePickerBorderThemeThickness}"/>
+    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+    <Setter Property="HorizontalAlignment" Value="Left" />
+    <Setter Property="VerticalAlignment" Value="Center" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <DataValidationErrors>
+          <Grid Name="LayoutRoot" Margin="{TemplateBinding Padding}" RowDefinitions="Auto,*">
+            <ContentPresenter x:Name="HeaderContentPresenter"
+                              Grid.Row="0"
+                              Content="{TemplateBinding Header}"
+                              ContentTemplate="{TemplateBinding HeaderTemplate}"
+                              Margin="{DynamicResource TimePickerTopHeaderMargin}"
+                              MaxWidth="{DynamicResource TimePickerThemeMaxWidth}"
+                              Foreground="{DynamicResource TimePickerHeaderForeground}"
+                              HorizontalAlignment="Stretch"
+                              VerticalAlignment="Top" />
+
+            <Button x:Name="FlyoutButton"
+                    Grid.Row="1"
+                    Theme="{StaticResource FluentTimePickerFlyoutButton}"
+                    Foreground="{TemplateBinding Foreground}"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    CornerRadius="{TemplateBinding CornerRadius}"
+                    IsEnabled="{TemplateBinding IsEnabled}"
+                    MinWidth="{DynamicResource TimePickerThemeMinWidth}"
+                    MaxWidth="{DynamicResource TimePickerThemeMaxWidth}"
+                    HorizontalAlignment="Stretch"
+                    VerticalAlignment="Top">
+
+              <Grid Name="FlyoutButtonContentGrid">
                 <!--Ignore col defs here, set in code-->
-                <Panel Name="HourHost" Grid.Column="0">
-                  <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Hidden">
-                    <DateTimePickerPanel Name="HourSelector" PanelType="Hour" ShouldLoop="True" ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}" />
-                  </ScrollViewer>
-                  <RepeatButton Name="HourUpButton" Classes="DateTimeFlyoutButtonStyle UpButton" />
-                  <RepeatButton Name="HourDownButton" Classes="DateTimeFlyoutButtonStyle DownButton" />
-                </Panel>
-                <Panel Name="MinuteHost" Grid.Column="2">
-                  <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Hidden">
-                    <DateTimePickerPanel Name="MinuteSelector" PanelType="Minute" ShouldLoop="True" ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}" />
-                  </ScrollViewer>
-                  <RepeatButton Name="MinuteUpButton" Classes="DateTimeFlyoutButtonStyle UpButton" />
-                  <RepeatButton Name="MinuteDownButton" Classes="DateTimeFlyoutButtonStyle DownButton" />
-                </Panel>
-                <Panel Name="PeriodHost" Grid.Column="4">
-                  <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Hidden">
-                    <DateTimePickerPanel Name="PeriodSelector" PanelType="TimePeriod" ShouldLoop="False" ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}" />
-                  </ScrollViewer>
-                  <RepeatButton Name="PeriodUpButton" Classes="DateTimeFlyoutButtonStyle UpButton" />
-                  <RepeatButton Name="PeriodDownButton" Classes="DateTimeFlyoutButtonStyle DownButton" />
-                </Panel>
-                <Rectangle x:Name="HighlightRect" ZIndex="-1" Fill="{DynamicResource TimePickerFlyoutPresenterHighlightFill}" Grid.Column="0" Grid.ColumnSpan="5" VerticalAlignment="Center" Height="{DynamicResource TimePickerFlyoutPresenterHighlightHeight}" />
-                <Rectangle Name="FirstSpacer" Fill="{DynamicResource TimePickerFlyoutPresenterSpacerFill}" HorizontalAlignment="Center" Width="{DynamicResource TimePickerSpacerThemeWidth}" Grid.Column="1" />
-                <Rectangle Name="SecondSpacer" Fill="{DynamicResource TimePickerFlyoutPresenterSpacerFill}" HorizontalAlignment="Center" Width="{DynamicResource TimePickerSpacerThemeWidth}" Grid.Column="3" />
-              </Grid>
-              <Grid Grid.Row="1" Height="{DynamicResource TimePickerFlyoutPresenterAcceptDismissHostGridHeight}" Name="AcceptDismissHostGrid" ColumnDefinitions="*,*">
-                <Rectangle Height="{DynamicResource TimePickerSpacerThemeWidth}" VerticalAlignment="Top" Fill="{DynamicResource TimePickerFlyoutPresenterSpacerFill}" Grid.ColumnSpan="2" />
-                <Button Name="AcceptButton" Grid.Column="0" Classes="DateTimeFlyoutButtonStyle" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                  <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round" StrokeThickness="0.75" Data="M0.5,8.5 5,13.5 15.5,3" />
-                </Button>
-                <Button Name="DismissButton" Grid.Column="1" Classes="DateTimeFlyoutButtonStyle" FontSize="16" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                  <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round" StrokeThickness="0.75" Data="M2,2 14,14 M2,14 14 2" />
-                </Button>
+                <Border x:Name="FirstPickerHost"
+                        Grid.Column="0"
+                        HorizontalAlignment="Stretch"
+                        VerticalAlignment="Stretch">
+                  <TextBlock x:Name="HourTextBlock"
+                      HorizontalAlignment="Center"
+                      Padding="{DynamicResource TimePickerHostPadding}"
+                      FontFamily="{TemplateBinding FontFamily}"
+                      FontWeight="{TemplateBinding FontWeight}"
+                      FontSize="{TemplateBinding FontSize}" />
+                </Border>
+
+                <Rectangle Name="FirstColumnDivider"
+                           Fill="{DynamicResource TimePickerSpacerFill}"
+                           HorizontalAlignment="Center"
+                           Width="{DynamicResource TimePickerSpacerThemeWidth}"
+                           Grid.Column="1" />
+
+                <Border x:Name="SecondPickerHost"
+                        Grid.Column="2"
+                        HorizontalAlignment="Stretch"
+                        VerticalAlignment="Stretch">
+                  <TextBlock x:Name="MinuteTextBlock"
+                             HorizontalAlignment="Center"
+                             Padding="{DynamicResource TimePickerHostPadding}"
+                             FontFamily="{TemplateBinding FontFamily}"
+                             FontWeight="{TemplateBinding FontWeight}"
+                             FontSize="{TemplateBinding FontSize}"/>
+                </Border>
+
+                <Rectangle Name="SecondColumnDivider"
+                           Fill="{DynamicResource TimePickerSpacerFill}"
+                           HorizontalAlignment="Center"
+                           Width="{DynamicResource TimePickerSpacerThemeWidth}"
+                           Grid.Column="3" />
+
+                <Border x:Name="ThirdPickerHost"
+                        Grid.Column="4"
+                        HorizontalAlignment="Stretch"
+                        VerticalAlignment="Stretch">
+                  <TextBlock x:Name="PeriodTextBlock"
+                             HorizontalAlignment="Center"
+                             Padding="{DynamicResource TimePickerHostPadding}"
+                             FontFamily="{TemplateBinding FontFamily}"
+                             FontWeight="{TemplateBinding FontWeight}"
+                             FontSize="{TemplateBinding FontSize}" />
+                </Border>
               </Grid>
+            </Button>
+
+            <Popup Name="Popup"
+                   WindowManagerAddShadowHint="False"
+                   IsLightDismissEnabled="True"
+                   PlacementTarget="{TemplateBinding}"
+                   PlacementMode="Bottom">
+              <TimePickerPresenter Name="PickerPresenter" />
+            </Popup>
+
+          </Grid>
+        </DataValidationErrors>
+      </ControlTemplate>
+    </Setter>
+
+    <Style Selector="^:disabled /template/ ContentPresenter#HeaderContentPresenter">
+      <Setter Property="Foreground" Value="{DynamicResource TimePickerHeaderForegroundDisabled}"/>
+    </Style>
+
+    <Style Selector="^:disabled /template/ Rectangle">
+      <Setter Property="Fill" Value="{DynamicResource TimePickerSpacerFillDisabled}"/>
+    </Style>
+
+    <Style Selector="^:hasnotime /template/ Button#FlyoutButton TextBlock">
+      <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForeground}"/>
+    </Style>
+
+    <Style Selector="^:error /template/ Button#FlyoutButton">
+      <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
+    </Style>
+  </ControlTheme>
+
+  <ControlTheme x:Key="{x:Type TimePickerPresenter}" TargetType="TimePickerPresenter">
+    <Setter Property="Width" Value="242" />
+    <Setter Property="MinWidth" Value="242" />
+    <Setter Property="MaxHeight" Value="398" />
+    <Setter Property="FontWeight" Value="Normal" />
+    <Setter Property="Background" Value="{DynamicResource TimePickerFlyoutPresenterBackground}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource TimePickerFlyoutPresenterBorderBrush}" />
+    <Setter Property="BorderThickness" Value="{DynamicResource DateTimeFlyoutBorderThickness}" />
+    <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Name="Background"
+                Background="{TemplateBinding Background}"
+                BorderBrush="{TemplateBinding BorderBrush}"
+                BorderThickness="{TemplateBinding BorderThickness}"
+                CornerRadius="{TemplateBinding CornerRadius}"
+                Padding="{DynamicResource DateTimeFlyoutBorderPadding}"
+                MaxHeight="398">
+          <Grid Name="ContentPanel" RowDefinitions="*,Auto">
+            <Grid Name="PickerContainer">
+              <!--Ignore col defs here, set in code-->
+              <Panel Name="HourHost" Grid.Column="0">
+                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
+                              VerticalScrollBarVisibility="Hidden">
+                  <DateTimePickerPanel Name="HourSelector"
+                                       PanelType="Hour"
+                                       ShouldLoop="True"
+                                       ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}"/>
+                </ScrollViewer>
+                <RepeatButton Name="HourUpButton" Theme="{StaticResource FluentDateTimePickerUpButton}"/>
+                <RepeatButton Name="HourDownButton" Theme="{StaticResource FluentDateTimePickerDownButton}"/>
+              </Panel>
+
+              <Panel Name="MinuteHost" Grid.Column="2">
+                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
+                              VerticalScrollBarVisibility="Hidden">
+                  <DateTimePickerPanel Name="MinuteSelector"
+                                       PanelType="Minute"
+                                       ShouldLoop="True"
+                                       ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}"/>
+                </ScrollViewer>
+                <RepeatButton Name="MinuteUpButton" Theme="{StaticResource FluentDateTimePickerUpButton}"/>
+                <RepeatButton Name="MinuteDownButton" Theme="{StaticResource FluentDateTimePickerDownButton}"/>
+              </Panel>
+
+              <Panel Name="PeriodHost" Grid.Column="4">
+                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
+                              VerticalScrollBarVisibility="Hidden">
+                  <DateTimePickerPanel Name="PeriodSelector"
+                                       PanelType="TimePeriod"
+                                       ShouldLoop="False"
+                                       ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}"/>
+                </ScrollViewer>
+                <RepeatButton Name="PeriodUpButton" Theme="{StaticResource FluentDateTimePickerUpButton}"/>
+                <RepeatButton Name="PeriodDownButton" Theme="{StaticResource FluentDateTimePickerDownButton}"/>
+              </Panel>
+
+              <Rectangle x:Name="HighlightRect" ZIndex="-1"
+                         Fill="{DynamicResource TimePickerFlyoutPresenterHighlightFill}"
+                         Grid.Column="0"
+                         Grid.ColumnSpan="5"
+                         VerticalAlignment="Center"
+                         Height="{DynamicResource TimePickerFlyoutPresenterHighlightHeight}" />
+              <Rectangle Name="FirstSpacer"
+                         Fill="{DynamicResource TimePickerFlyoutPresenterSpacerFill}"
+                         HorizontalAlignment="Center"
+                         Width="{DynamicResource TimePickerSpacerThemeWidth}"
+                         Grid.Column="1" />
+              <Rectangle Name="SecondSpacer"
+                         Fill="{DynamicResource TimePickerFlyoutPresenterSpacerFill}"
+                         HorizontalAlignment="Center"
+                         Width="{DynamicResource TimePickerSpacerThemeWidth}"
+                         Grid.Column="3" />
             </Grid>
-          </Border>
-        </ControlTemplate>
-      </Setter>
-      <Style Selector="^ /template/ Panel">
-        <Style Selector="^ RepeatButton">
-          <Setter Property="IsVisible" Value="False" />
-        </Style>
-        <Style Selector="^:pointerover RepeatButton">
-          <Setter Property="IsVisible" Value="True" />
-        </Style>
+
+            <Grid Name="AcceptDismissGrid"
+                  Grid.Row="1"
+                  ColumnDefinitions="*,*">
+              <Rectangle Height="{DynamicResource TimePickerSpacerThemeWidth}" 
+                         VerticalAlignment="Top"
+                         Fill="{DynamicResource TimePickerFlyoutPresenterSpacerFill}"
+                         Grid.ColumnSpan="2"/>
+              <Button Name="AcceptButton"
+                      Grid.Column="0"
+                      Theme="{StaticResource FluentDateTimePickerButton}"
+                      Height="{DynamicResource TimePickerFlyoutPresenterAcceptDismissHostGridHeight}"
+                      HorizontalAlignment="Stretch"
+                      VerticalAlignment="Stretch">
+                <Path Stroke="{Binding $parent[Button].Foreground}"
+                      StrokeLineCap="Round"
+                      StrokeThickness="0.75"
+                      Data="M0.5,8.5 5,13.5 15.5,3" />
+              </Button>
+              <Button Name="DismissButton" 
+                      Grid.Column="1" 
+                      Theme="{StaticResource FluentDateTimePickerButton}"
+                      Height="{DynamicResource TimePickerFlyoutPresenterAcceptDismissHostGridHeight}"
+                      FontSize="16" 
+                      HorizontalAlignment="Stretch" 
+                      VerticalAlignment="Stretch">
+                <Path Stroke="{Binding $parent[Button].Foreground}" 
+                      StrokeLineCap="Round"
+                      StrokeThickness="0.75" 
+                      Data="M2,2 14,14 M2,14 14 2" />
+              </Button>
+            </Grid>
+          </Grid>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+    
+    <Style Selector="^ /template/ Panel">
+      <Style Selector="^ RepeatButton">
+        <Setter Property="IsVisible" Value="False" />
+      </Style>
+
+      <Style Selector="^:pointerover RepeatButton">
+        <Setter Property="IsVisible" Value="True" />
       </Style>
-    </ControlTheme>
-  </Styles.Resources>
-  <Style Selector="TimePicker">
-    <Setter Property="Theme" Value="{StaticResource FluentTimePicker}" />
-  </Style>
-  <Style Selector="TimePickerPresenter">
-    <Setter Property="Theme" Value="{StaticResource FluentTimePickerPresenter}" />
-  </Style>
-</Styles>
+    </Style>  </ControlTheme>
+</ResourceDictionary>

From 2dda677fc8099a484806be21574e1a5bbbf721b8 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Sun, 10 Jul 2022 22:26:28 +0200
Subject: [PATCH 60/70] Ported SplitButton to ControlTheme.

Not happy with the Tag hack but no better way to add additional states to a control currently.
---
 .../Controls/FluentControls.xaml              |   2 +-
 .../Controls/SplitButton.xaml                 | 388 ++++++++----------
 2 files changed, 173 insertions(+), 217 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
index 262007082f..bc2352d5d0 100644
--- a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
@@ -39,6 +39,7 @@
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ScrollBar.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Separator.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitButton.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitView.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabControl.xaml" />
                 <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabItem.xaml" />
@@ -72,7 +73,6 @@
     </Styles.Resources>
 
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/FocusAdorner.xaml" />
-    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitButton.xaml" />
     <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/UserControl.xaml" />
     <Styles.Resources />
 </Styles>
diff --git a/src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml b/src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml
index fb0460d9a1..9a93b2625b 100644
--- a/src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml
@@ -1,36 +1,120 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         x:CompileBindings="True"
         xmlns:converters="using:Avalonia.Controls.Converters">
   <Design.PreviewWith>
     <Border Padding="60">
-      <StackPanel>
-        <SplitButton Content="Hello World">
+      <StackPanel Spacing="20">
+        <SplitButton Content="SplitButton">
           <SplitButton.Flyout>
             <Flyout>Hello</Flyout>
           </SplitButton.Flyout>
         </SplitButton>
-        <ToggleSplitButton Content="Hello World">
+        <SplitButton CornerRadius="16" Content="Rounded">
+          <SplitButton.Flyout>
+            <Flyout>Hello</Flyout>
+          </SplitButton.Flyout>
+        </SplitButton>
+        <SplitButton IsEnabled="False">Disabled</SplitButton>
+        <ToggleSplitButton Content="ToggleSplitButton">
+          <ToggleSplitButton.Flyout>
+            <Flyout>Hello</Flyout>
+          </ToggleSplitButton.Flyout>
+        </ToggleSplitButton>
+        <ToggleSplitButton Content="Checked" IsChecked="True">
           <ToggleSplitButton.Flyout>
             <Flyout>Hello</Flyout>
           </ToggleSplitButton.Flyout>
         </ToggleSplitButton>
+        <ToggleSplitButton Content="Checked Disabled" IsChecked="True" IsEnabled="False"/>
       </StackPanel>
     </Border>
   </Design.PreviewWith>
 
-  <Styles.Resources>
-    <x:Double x:Key="SplitButtonPrimaryButtonSize">32</x:Double>
-    <x:Double x:Key="SplitButtonSecondaryButtonSize">32</x:Double>
-    <x:Double x:Key="SplitButtonSeparatorWidth">1</x:Double>
-    <x:Double x:Key="SplitButtonMinHeight">32</x:Double>
+  <x:Double x:Key="SplitButtonPrimaryButtonSize">32</x:Double>
+  <x:Double x:Key="SplitButtonSecondaryButtonSize">32</x:Double>
+  <x:Double x:Key="SplitButtonSeparatorWidth">1</x:Double>
+  <x:Double x:Key="SplitButtonMinHeight">32</x:Double>
 
-    <converters:MarginMultiplierConverter x:Key="PrimaryButtonBorderMultiplier" Left="True" Top="True" Bottom="True" Indent="1" />
-    <converters:MarginMultiplierConverter x:Key="SecondaryButtonBorderMultiplier" Right="True" Top="True" Bottom="True" Indent="1" />
-    <converters:MarginMultiplierConverter x:Key="SeparatorBorderMultiplier" Top="True" Bottom="True" Indent="1" />
-  </Styles.Resources>
+  <converters:MarginMultiplierConverter x:Key="PrimaryButtonBorderMultiplier" Left="True" Top="True" Bottom="True" Indent="1" />
+  <converters:MarginMultiplierConverter x:Key="SecondaryButtonBorderMultiplier" Right="True" Top="True" Bottom="True" Indent="1" />
+  <converters:MarginMultiplierConverter x:Key="SeparatorBorderMultiplier" Top="True" Bottom="True" Indent="1" />
 
-  <Style Selector="SplitButton">
+  <ControlTheme x:Key="FluentSplitButtonComponent" TargetType="Button">
+    <Setter Property="Template">
+      <ControlTemplate>
+        <ContentPresenter x:Name="PART_ContentPresenter"
+                          Background="{TemplateBinding Background}"
+                          BorderBrush="{TemplateBinding BorderBrush}"
+                          BorderThickness="{TemplateBinding BorderThickness}"
+                          CornerRadius="{TemplateBinding CornerRadius}"
+                          Content="{TemplateBinding Content}"
+                          ContentTemplate="{TemplateBinding ContentTemplate}"
+                          Padding="{TemplateBinding Padding}"
+                          RecognizesAccessKey="True"
+                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
+      </ControlTemplate>
+    </Setter>
+
+    <Style Selector="^:pointerover /template/ ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundPointerOver}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPointerOver}" />
+      <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundPointerOver}" />
+    </Style>
+
+    <Style Selector="^:pressed /template/ ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundPressed}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPressed}" />
+      <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" />
+    </Style>
+
+    <Style Selector="^:disabled /template/ ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundDisabled}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushDisabled}" />
+      <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundDisabled}" />
+    </Style>
+
+    <Style Selector="^[Tag=flyout-open] /template/ ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundPressed}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPressed}" />
+      <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" />
+    </Style>
+
+    <Style Selector="^[Tag=checked]">
+      <Style Selector="^ /template/ ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundChecked}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushChecked}" />
+        <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundChecked}" />
+      </Style>
+
+      <Style Selector="^:pointerover /template/ ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundCheckedPointerOver}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPointerOver}" />
+        <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPointerOver}" />
+      </Style>
+
+      <Style Selector="^:pressed /template/ ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundCheckedPressed}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPressed}" />
+        <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" />
+      </Style>
+
+      <Style Selector="^:disabled /template/ ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundCheckedDisabled}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedDisabled}" />
+        <Setter Property="TextElement.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedDisabled}" />
+      </Style>
+    </Style>
+
+    <Style Selector="^[Tag=checked-flyout-open] /template/ ContentPresenter">
+      <Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundCheckedPressed}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPressed}" />
+      <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" />
+    </Style>
+  </ControlTheme>
+
+  <ControlTheme x:Key="{x:Type SplitButton}" TargetType="SplitButton">
     <Setter Property="Background" Value="{DynamicResource SplitButtonBackground}" />
     <Setter Property="Foreground" Value="{DynamicResource SplitButtonForeground}" />
     <Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrush}" />
@@ -40,211 +124,83 @@
     <Setter Property="VerticalAlignment" Value="Center" />
     <Setter Property="HorizontalContentAlignment" Value="Stretch" />
     <Setter Property="VerticalContentAlignment" Value="Center" />
-    <!--<Setter Property="UseSystemFocusVisuals" Value="True" />
-    <Setter Property="FocusVisualMargin" Value="-3" />-->
     <Setter Property="KeyboardNavigation.IsTabStop" Value="True" />
     <Setter Property="Focusable" Value="True" />
     <Setter Property="Padding" Value="{DynamicResource ButtonPadding}" />
     <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
     <Setter Property="Template">
-      <Setter.Value>
-        <ControlTemplate>
-          <Grid>
-            <Grid.ColumnDefinitions>
-              <ColumnDefinition Width="*" />
-              <ColumnDefinition Width="Auto" />
-              <ColumnDefinition Width="Auto" />
-            </Grid.ColumnDefinitions>
-
-            <Button x:Name="PART_PrimaryButton"
-                    Grid.Column="0"
-                    MinWidth="{DynamicResource SplitButtonPrimaryButtonSize}"
-                    Foreground="{TemplateBinding Foreground}"
-                    Background="{TemplateBinding Background}"
-                    BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource PrimaryButtonBorderMultiplier}}"
-                    BorderBrush="{TemplateBinding BorderBrush}"
-                    Content="{TemplateBinding Content}"
-                    ContentTemplate="{TemplateBinding ContentTemplate}"
-                    Command="{TemplateBinding Command}"
-                    CommandParameter="{TemplateBinding CommandParameter}"
-                    FontFamily="{TemplateBinding FontFamily}"
-                    FontSize="{TemplateBinding FontSize}"
-                    FontWeight="{TemplateBinding FontWeight}"
-                    HorizontalAlignment="Stretch"
-                    VerticalAlignment="Stretch"
-                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                    Padding="{TemplateBinding Padding}"
-                    Focusable="False"
-                    KeyboardNavigation.IsTabStop="False" />
-
-            <Border x:Name="SeparatorBorder"
-                    Grid.Column="1"
-                    Background="Transparent"
-                    Width="{DynamicResource SplitButtonSeparatorWidth}"
-                    BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource SeparatorBorderMultiplier}}"
-                    BorderBrush="{TemplateBinding BorderBrush}" />
-
-            <Button x:Name="PART_SecondaryButton"
-                    Grid.Column="2"
-                    MinWidth="{DynamicResource SplitButtonSecondaryButtonSize}"
-                    BorderBrush="{TemplateBinding BorderBrush}"
-                    Foreground="{TemplateBinding Foreground}"
-                    Background="{TemplateBinding Background}"
-                    BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource SecondaryButtonBorderMultiplier}}"
-                    Padding="0"
-                    HorizontalContentAlignment="Center"
-                    VerticalContentAlignment="Center"
-                    HorizontalAlignment="Stretch"
-                    VerticalAlignment="Stretch"
-                    Focusable="False"
-                    KeyboardNavigation.IsTabStop="False" />
-          </Grid>
-        </ControlTemplate>
-      </Setter.Value>
-    </Setter>
-  </Style>
-
-  <!-- Default overridable styles -->
-  <Style Selector="SplitButton /template/ Button#PART_PrimaryButton">
-    <Setter Property="CornerRadius" Value="{TemplateBinding CornerRadius, Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
-  </Style>
-  <Style Selector="SplitButton /template/ Button#PART_SecondaryButton">
-    <Setter Property="CornerRadius" Value="{TemplateBinding CornerRadius, Converter={StaticResource RightCornerRadiusFilterConverter}}" />
-    <Setter Property="Content">
-      <Template>
-        <PathIcon Height="12"
-                  Width="12"
-                  Data="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" />
-      </Template>
+      <ControlTemplate>
+        <Grid>
+          <Grid.ColumnDefinitions>
+            <ColumnDefinition Width="*" />
+            <ColumnDefinition Width="Auto" />
+            <ColumnDefinition Width="Auto" />
+          </Grid.ColumnDefinitions>
+
+          <Button x:Name="PART_PrimaryButton"
+                  Grid.Column="0"
+                  Theme="{StaticResource FluentSplitButtonComponent}"
+                  MinWidth="{DynamicResource SplitButtonPrimaryButtonSize}"
+                  Foreground="{TemplateBinding Foreground}"
+                  Background="{TemplateBinding Background}"
+                  BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource PrimaryButtonBorderMultiplier}}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
+                  Content="{TemplateBinding Content}"
+                  ContentTemplate="{TemplateBinding ContentTemplate}"
+                  Command="{TemplateBinding Command}"
+                  CommandParameter="{TemplateBinding CommandParameter}"
+                  CornerRadius="{TemplateBinding CornerRadius, Converter={StaticResource LeftCornerRadiusFilterConverter}}"
+                  FontFamily="{TemplateBinding FontFamily}"
+                  FontSize="{TemplateBinding FontSize}"
+                  FontWeight="{TemplateBinding FontWeight}"
+                  HorizontalAlignment="Stretch"
+                  VerticalAlignment="Stretch"
+                  HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                  VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                  Padding="{TemplateBinding Padding}"
+                  Focusable="False"
+                  KeyboardNavigation.IsTabStop="False" />
+
+          <Border x:Name="SeparatorBorder"
+                  Grid.Column="1"
+                  Background="Transparent"
+                  Width="{DynamicResource SplitButtonSeparatorWidth}"
+                  BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource SeparatorBorderMultiplier}}"
+                  BorderBrush="{TemplateBinding BorderBrush}" />
+
+          <Button x:Name="PART_SecondaryButton"
+                  Grid.Column="2"
+                  Theme="{StaticResource FluentSplitButtonComponent}"
+                  MinWidth="{DynamicResource SplitButtonSecondaryButtonSize}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
+                  Foreground="{TemplateBinding Foreground}"
+                  Background="{TemplateBinding Background}"
+                  BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource SecondaryButtonBorderMultiplier}}"
+                  CornerRadius="{TemplateBinding CornerRadius, Converter={StaticResource RightCornerRadiusFilterConverter}}"
+                  Padding="0"
+                  HorizontalContentAlignment="Center"
+                  VerticalContentAlignment="Center"
+                  HorizontalAlignment="Stretch"
+                  VerticalAlignment="Stretch"
+                  Focusable="False"
+                  KeyboardNavigation.IsTabStop="False">
+            <PathIcon Height="12" Width="12"
+                      Data="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" />
+          </Button>
+        </Grid>
+      </ControlTemplate>
     </Setter>
-  </Style>
-
-  <!-- Primary and Secondary buttons PointerOver State -->
-  <Style Selector="SplitButton /template/ Button#PART_PrimaryButton:pointerover /template/ ContentPresenter,
-         SplitButton /template/ Button#PART_SecondaryButton:pointerover /template/ ContentPresenter">
-    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundPointerOver}" />
-    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPointerOver}" />
-    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundPointerOver}" />
-  </Style>
-  <Style Selector="SplitButton /template/ Button#PART_SecondaryButton:pointerover PathIcon">
-    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundPointerOver}" />
-  </Style>
-
-  <!-- Primary and Secondary buttons Pressed State -->
-  <Style Selector="SplitButton /template/ Button#PART_PrimaryButton:pressed /template/ ContentPresenter,
-         SplitButton /template/ Button#PART_SecondaryButton:pressed /template/ ContentPresenter">
-    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundPressed}" />
-    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPressed}" />
-    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" />
-  </Style>
-  <Style Selector="SplitButton /template/ Button#PART_SecondaryButton:pressed PathIcon">
-    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" />
-  </Style>
-
-  <!-- SplitButton Pressed State -->
-  <Style Selector="SplitButton:pressed /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
-         SplitButton:pressed /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
-         SplitButton:pressed /template/ Border#SeparatorBorder">
-    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundPressed}" />
-    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPressed}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" />
-  </Style>
-  <Style Selector="SplitButton:pressed /template/ Button#PART_SecondaryButton PathIcon">
-    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" />
-  </Style>
-
-  <!-- Primary and Secondary buttons Flyout Open State -->
-  <Style Selector="SplitButton:flyout-open /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
-         SplitButton:flyout-open /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
-         SplitButton:flyout-open /template/ Border#SeparatorBorder">
-    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundPressed}" />
-    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPressed}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" />
-  </Style>
-  <Style Selector="SplitButton:flyout-open /template/ Button#PART_SecondaryButton PathIcon">
-    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" />
-  </Style>
-
-  <!-- Disabled State -->
-  <Style Selector="SplitButton:disabled /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
-         SplitButton:disabled /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
-         SplitButton:disabled /template/ Border#SeparatorBorder">
-    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundDisabled}" />
-    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushDisabled}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource SplitButtonForegroundDisabled}" />
-  </Style>
-  <Style Selector="SplitButton:disabled /template/ Button#PART_SecondaryButton PathIcon">
-    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundDisabled}" />
-  </Style>
-
-  <!-- Checked State -->
-  <Style Selector="SplitButton:checked /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
-         SplitButton:checked /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
-         SplitButton:checked /template/ Border#SeparatorBorder">
-    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundChecked}" />
-    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushChecked}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource SplitButtonForegroundChecked}" />
-  </Style>
-  <Style Selector="SplitButton:checked /template/ Button#PART_SecondaryButton PathIcon">
-    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundChecked}" />
-  </Style>
-
-  <!-- Checked PointerOver State -->
-  <Style Selector="SplitButton:checked /template/ Button#PART_PrimaryButton:pointerover /template/ ContentPresenter,
-         SplitButton:checked /template/ Button#PART_SecondaryButton:pointerover /template/ ContentPresenter">
-    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundCheckedPointerOver}" />
-    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPointerOver}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPointerOver}" />
-  </Style>
-  <Style Selector="SplitButton:checked /template/ Button#PART_SecondaryButton:pointerover PathIcon">
-    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPointerOver}" />
-  </Style>
-
-  <!-- Checked Pressed State -->
-  <Style Selector="SplitButton:checked /template/ Button#PART_PrimaryButton:pressed /template/ ContentPresenter,
-         SplitButton:checked /template/ Button#PART_SecondaryButton:pressed /template/ ContentPresenter">
-    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundCheckedPressed}" />
-    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPressed}" />
-    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" />
-  </Style>
-  <Style Selector="SplitButton:checked /template/ Button#PART_SecondaryButton:pressed PathIcon">
-    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" />
-  </Style>
-
-  <!-- SplitButton Checked Pressed State -->
-  <Style Selector="SplitButton:pressed:checked /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
-         SplitButton:pressed:checked /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
-         SplitButton:pressed:checked /template/ Border#SeparatorBorder">
-    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundCheckedPressed}" />
-    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPressed}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" />
-  </Style>
-  <Style Selector="SplitButton:pressed:checked /template/ Button#PART_SecondaryButton PathIcon">
-    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" />
-  </Style>
-
-  <!-- Checked Flyout Open State -->
-  <Style Selector="SplitButton:checked:flyout-open /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
-         SplitButton:checked:flyout-open /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
-         SplitButton:checked:flyout-open /template/ Border#SeparatorBorder">
-    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundCheckedPressed}" />
-    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPressed}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" />
-  </Style>
-  <Style Selector="SplitButton:checked:flyout-open /template/ Button#PART_SecondaryButton PathIcon">
-    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" />
-  </Style>
-
-  <!-- Disabled Checked State -->
-  <Style Selector="SplitButton:checked:disabled /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
-         SplitButton:checked:disabled /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
-         SplitButton:checked:disabled /template/ Border#SeparatorBorder">
-    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundCheckedDisabled}" />
-    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedDisabled}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedDisabled}" />
-  </Style>
-  <Style Selector="SplitButton:checked:disabled /template/ Button#PART_SecondaryButton PathIcon">
-    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundCheckedDisabled}" />
-  </Style>
-</Styles>
+
+    <Style Selector="^:flyout-open /template/ Button">
+      <Setter Property="Tag" Value="flyout-open" />
+    </Style>
+
+    <Style Selector="^:checked /template/ Button">
+      <Setter Property="Tag" Value="checked" />
+    </Style>
+
+    <Style Selector="^:checked:flyout-open /template/ Button">
+      <Setter Property="Tag" Value="checked-flyout-open" />
+    </Style>
+  </ControlTheme>
+</ResourceDictionary>

From 534ccd8c13f51d51d61ffbaa10a952d3b28ce6c2 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Sun, 10 Jul 2022 23:05:49 +0200
Subject: [PATCH 61/70] Removed a few unneeded styles I missed.

And tweak some designer previews.
---
 .../Controls/CalendarItem.xaml                | 15 ++++--
 .../Controls/DatePicker.xaml                  |  4 --
 .../Controls/DateTimePickerShared.xaml        |  6 ++-
 .../Controls/ScrollViewer.xaml                | 17 ++++---
 .../Controls/Slider.xaml                      | 47 +++++++++++--------
 .../Controls/TimePicker.xaml                  |  4 --
 6 files changed, 49 insertions(+), 44 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/CalendarItem.xaml b/src/Avalonia.Themes.Fluent/Controls/CalendarItem.xaml
index 6914a0db08..79c872c640 100644
--- a/src/Avalonia.Themes.Fluent/Controls/CalendarItem.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/CalendarItem.xaml
@@ -91,7 +91,11 @@
                       Padding="1"
                       HorizontalContentAlignment="Left">
                 <!--Path mimics Segoe MDL2 Assets font glyph used in WinUI-->
-                <Path StrokeThickness="1.5" Data="M 0,9 L 9,0 L 18,9" HorizontalAlignment="Center" VerticalAlignment="Center" />
+                <Path Stroke="{DynamicResource CalendarViewForeground}"
+                      StrokeThickness="1.5" 
+                      Data="M 0,9 L 9,0 L 18,9" 
+                      HorizontalAlignment="Center" 
+                      VerticalAlignment="Center" />
               </Button>
               <Button Name="NextButton"
                       Grid.Column="2"
@@ -100,7 +104,11 @@
                       Padding="1"
                       HorizontalContentAlignment="Left">
                 <!--Path mimics Segoe MDL2 Assets font glyph used in WinUI-->
-                <Path StrokeThickness="1.5" Data="M 0,0 L 9,9 L 18,0" HorizontalAlignment="Center" VerticalAlignment="Center" />
+                <Path Stroke="{DynamicResource CalendarViewForeground}"
+                      StrokeThickness="1.5" 
+                      Data="M 0,0 L 9,9 L 18,0" 
+                      HorizontalAlignment="Center" 
+                      VerticalAlignment="Center" />
               </Button>
             </Grid>
             <!--Border below is used only for MonthView but it can't be moved inside of Grid because CalendarItem expects it to be empty and it will cause side-effects-->
@@ -147,9 +155,6 @@
         </Border>
       </ControlTemplate>
     </Setter>
-    <Style Selector="^ /template/ Button > Path">
-      <Setter Property="Stroke" Value="{DynamicResource CalendarViewForeground}" />
-    </Style>
     <Style Selector="^ /template/ Button:pointerover > Path">
       <Setter Property="Stroke" Value="{DynamicResource CalendarViewNavigationButtonForegroundPointerOver}" />
     </Style>
diff --git a/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml b/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml
index 0441415128..bc47f3892e 100644
--- a/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml
@@ -280,10 +280,6 @@
     </Setter>
 
     <Style Selector="^ /template/ Panel">
-      <Style Selector="^ RepeatButton">
-        <Setter Property="IsVisible" Value="False" />
-      </Style>
-
       <Style Selector="^:pointerover RepeatButton">
         <Setter Property="IsVisible" Value="True" />
       </Style>
diff --git a/src/Avalonia.Themes.Fluent/Controls/DateTimePickerShared.xaml b/src/Avalonia.Themes.Fluent/Controls/DateTimePickerShared.xaml
index 77271a149f..be664b375d 100644
--- a/src/Avalonia.Themes.Fluent/Controls/DateTimePickerShared.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/DateTimePickerShared.xaml
@@ -15,8 +15,8 @@
         <ListBoxItem Theme="{DynamicResource FluentDateTimePickerItem}">Standard Item</ListBoxItem>
         <ListBoxItem Theme="{DynamicResource FluentDateTimePickerItem}" Classes="MonthItem">Month Item</ListBoxItem>
         <RepeatButton Theme="{DynamicResource FluentDateTimePickerButton}">Button</RepeatButton>
-        <RepeatButton Theme="{DynamicResource FluentDateTimePickerUpButton}"/>
-        <RepeatButton Theme="{DynamicResource FluentDateTimePickerDownButton}"/>
+        <RepeatButton Theme="{DynamicResource FluentDateTimePickerUpButton}" IsVisible="True"/>
+        <RepeatButton Theme="{DynamicResource FluentDateTimePickerDownButton}" IsVisible="True"/>
       </StackPanel>
     </Border>
   </Design.PreviewWith>
@@ -90,6 +90,7 @@
     <Setter Property="HorizontalAlignment" Value="Stretch" />
     <Setter Property="Focusable" Value="False" />
     <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
+    <Setter Property="IsVisible" Value="False"/>
     <Setter Property="Content">
       <Template>
         <Viewbox Height="10" Width="10" HorizontalAlignment="Center" VerticalAlignment="Center">
@@ -105,6 +106,7 @@
     <Setter Property="HorizontalAlignment" Value="Stretch" />
     <Setter Property="Focusable" Value="False" />
     <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
+    <Setter Property="IsVisible" Value="False"/>
     <Setter Property="Content">
       <Template>
         <Viewbox Height="10" Width="10" HorizontalAlignment="Center" VerticalAlignment="Center">
diff --git a/src/Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml b/src/Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml
index 55adb54d9b..2c727b4435 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml
@@ -68,18 +68,17 @@
           <Panel x:Name="PART_ScrollBarsSeparator"
                  Grid.Row="1"
                  Grid.Column="1"
-                 Background="{DynamicResource ScrollViewerScrollBarsSeparatorBackground}" />
+                 Background="{DynamicResource ScrollViewerScrollBarsSeparatorBackground}"
+                 Opacity="0">
+            <Panel.Transitions>
+              <Transitions>
+                <DoubleTransition Property="Opacity" Duration="0:0:0.1" />
+              </Transitions>
+            </Panel.Transitions>
+          </Panel>
         </Grid>
       </ControlTemplate>
     </Setter>
-    <Style Selector="^ /template/ Panel#PART_ScrollBarsSeparator">
-      <Setter Property="Opacity" Value="0" />
-      <Setter Property="Transitions">
-        <Transitions>
-          <DoubleTransition Property="Opacity" Duration="0:0:0.1" />
-        </Transitions>
-      </Setter>
-    </Style>
     <Style Selector="^[IsExpanded=true] /template/ Panel#PART_ScrollBarsSeparator">
       <Setter Property="Opacity" Value="1" />
     </Style>
diff --git a/src/Avalonia.Themes.Fluent/Controls/Slider.xaml b/src/Avalonia.Themes.Fluent/Controls/Slider.xaml
index 9378640d64..1e4a7ac097 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Slider.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Slider.xaml
@@ -2,11 +2,14 @@
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                     xmlns:sys="clr-namespace:System;assembly=netstandard">
   <Design.PreviewWith>
-    <Border Margin="20" Width="200" Height="400">
+    <Border Margin="20" Width="400" Height="600">
       <DockPanel LastChildFill="True">
         <StackPanel Spacing="10" DockPanel.Dock="Top">
           <Slider Value="50" />
           <Slider IsDirectionReversed="True" Value="50" />
+          <Slider Value="50" TickPlacement="TopLeft" TickFrequency="10"/>
+          <Slider Value="50" TickPlacement="BottomRight" TickFrequency="10"/>
+          <Slider Value="50" TickPlacement="Outside" TickFrequency="10"/>
           <Slider IsEnabled="False" Value="50" />
           <Slider Value="50">
             <DataValidationErrors.Error>
@@ -22,6 +25,9 @@
           <Slider Value="50" Orientation="Vertical" />
           <Slider IsDirectionReversed="True" Value="50" Orientation="Vertical" />
           <Slider IsEnabled="False" Orientation="Vertical" Value="50" />
+          <Slider Value="50" TickPlacement="TopLeft" TickFrequency="10" Orientation="Vertical" />
+          <Slider Value="50" TickPlacement="BottomRight" TickFrequency="10" Orientation="Vertical" />
+          <Slider Value="50" TickPlacement="Outside" TickFrequency="10" Orientation="Vertical" />
         </StackPanel>
       </DockPanel>
     </Border>
@@ -103,7 +109,9 @@
                     Margin="{DynamicResource SliderTopHeaderMargin}"
                     TextElement.FontWeight="{DynamicResource SliderHeaderThemeFontWeight}"
                     TextElement.Foreground="{DynamicResource SliderHeaderForeground}" />
-                <Grid x:Name="SliderContainer" Grid.Row="1">
+                <Grid x:Name="SliderContainer"
+                      Grid.Row="1"
+                      Background="{DynamicResource SliderContainerBackground}">
                   <Grid.Styles>
                     <Style Selector="TickBar">
                       <Setter Property="ReservedSpace" Value="{Binding #PART_Track.Thumb.Bounds}" />
@@ -129,7 +137,9 @@
                         Height="{DynamicResource SliderOutsideTickBarThemeHeight}"
                         Margin="0,0,0,4"
                         VerticalAlignment="Bottom"
-                        Placement="Top" />
+                        Placement="Top" 
+                        IsVisible="False"
+                        Fill="{DynamicResource SliderTickBarFill}"/>
                     <TickBar
                         Name="BottomTickBar"
                         Grid.Row="2"
@@ -142,7 +152,9 @@
                         Height="{DynamicResource SliderOutsideTickBarThemeHeight}"
                         Margin="0,4,0,0"
                         VerticalAlignment="Top"
-                        Placement="Bottom" />
+                        Placement="Bottom"
+                        IsVisible="False"
+                        Fill="{DynamicResource SliderTickBarFill}" />
                     <Track
                         Name="PART_Track"
                         Grid.Row="1"
@@ -172,6 +184,7 @@
                           Height="{DynamicResource SliderHorizontalThumbHeight}"
                           Margin="0"
                           Padding="0"
+                          Background="{DynamicResource SliderThumbBackground}"
                           BorderThickness="0"
                           Theme="{StaticResource FluentSliderThumbTheme}"
                           DataContext="{TemplateBinding Value}"/>
@@ -202,7 +215,9 @@
                     Margin="{DynamicResource SliderTopHeaderMargin}"
                     TextElement.FontWeight="{DynamicResource SliderHeaderThemeFontWeight}"
                     TextElement.Foreground="{DynamicResource SliderHeaderForeground}" />
-                <Grid x:Name="SliderContainer" Grid.Row="1">
+                <Grid x:Name="SliderContainer"
+                      Grid.Row="1"
+                      Background="{DynamicResource SliderContainerBackground}">
                   <Grid.Styles>
                     <Style Selector="TickBar">
                       <Setter Property="ReservedSpace" Value="{Binding #PART_Track.Thumb.Bounds}" />
@@ -228,7 +243,9 @@
                         Width="{DynamicResource SliderOutsideTickBarThemeHeight}"
                         Margin="0,0,4,0"
                         HorizontalAlignment="Right"
-                        Placement="Left" />
+                        Placement="Left"
+                        IsVisible="False"
+                        Fill="{DynamicResource SliderTickBarFill}"/>
                     <TickBar
                         Name="RightTickBar"
                         Grid.RowSpan="3"
@@ -241,7 +258,9 @@
                         Width="{DynamicResource SliderOutsideTickBarThemeHeight}"
                         Margin="4,0,0,0"
                         HorizontalAlignment="Left"
-                        Placement="Right" />
+                        Placement="Right" 
+                        IsVisible="False"
+                        Fill="{DynamicResource SliderTickBarFill}"/>
                     <Track
                         Name="PART_Track"
                         Grid.RowSpan="3"
@@ -272,6 +291,7 @@
                           Height="{DynamicResource SliderVerticalThumbHeight}"
                           Margin="0"
                           Padding="0"
+                          Background="{DynamicResource SliderThumbBackground}"
                           BorderThickness="0"
                           Theme="{StaticResource FluentSliderThumbTheme}"
                           DataContext="{TemplateBinding Value}" />
@@ -285,19 +305,6 @@
       </Setter>
     </Style>
 
-    <!--  Normal State  -->
-
-    <Style Selector="^ /template/ Thumb">
-      <Setter Property="Background" Value="{DynamicResource SliderThumbBackground}" />
-    </Style>
-    <Style Selector="^ /template/ Grid#SliderContainer">
-      <Setter Property="Background" Value="{DynamicResource SliderContainerBackground}" />
-    </Style>
-    <Style Selector="^/template/ TickBar">
-      <Setter Property="IsVisible" Value="False" />
-      <Setter Property="Fill" Value="{DynamicResource SliderTickBarFill}" />
-    </Style>
-
     <!--  TickBar Placement States  -->
 
     <Style Selector="^[TickPlacement=TopLeft] /template/ TickBar#LeftTickBar, ^[TickPlacement=Outside] /template/ TickBar#LeftTickBar">
diff --git a/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml b/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml
index b5f177b985..0d1b416d7a 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml
@@ -309,10 +309,6 @@
     </Setter>
     
     <Style Selector="^ /template/ Panel">
-      <Style Selector="^ RepeatButton">
-        <Setter Property="IsVisible" Value="False" />
-      </Style>
-
       <Style Selector="^:pointerover RepeatButton">
         <Setter Property="IsVisible" Value="True" />
       </Style>

From 20b2bc21b6542fa6461e9a8c5b83a0c8caf8c9ba Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Mon, 11 Jul 2022 09:53:53 +0200
Subject: [PATCH 62/70] Prevent ComboBox borders getting cut off.

---
 src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml b/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
index ec78bf6ab4..af3b5bc51e 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
@@ -136,7 +136,6 @@
                       Background="{DynamicResource ComboBoxDropDownBackground}"
                       BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}"
                       BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}"
-                      Margin="0,-1,0,-1"
                       Padding="{DynamicResource ComboBoxDropdownBorderPadding}"
                       HorizontalAlignment="Stretch"
                       CornerRadius="{DynamicResource OverlayCornerRadius}">

From 51469dcd585b3c4bc773612a7788dbfa36ebb2ce Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Mon, 11 Jul 2022 17:20:05 +0200
Subject: [PATCH 63/70] Fix ButtonSpinner borders.

---
 .../Controls/ButtonSpinner.xaml               | 24 +++++++++----------
 1 file changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml b/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml
index 980ea02a73..44cedd175a 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml
@@ -23,8 +23,7 @@
                        AllowSpin="False"/>
         <ButtonSpinner ShowButtonSpinner="False"
                        Content="Hide spinner" />
-        <ButtonSpinner Content="Error"
-                       AllowSpin="False">
+        <ButtonSpinner Content="Error">
           <DataValidationErrors.Error>
             <sys:Exception>
               <x:Arguments>
@@ -46,6 +45,9 @@
     <Setter Property="CornerRadius" Value="0"/>
     <Setter Property="MinWidth" Value="34" />
     <Setter Property="VerticalAlignment" Value="Stretch" />
+    <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
+      <Setter Property="BorderBrush" Value="{TemplateBinding BorderBrush}" />
+    </Style>
   </ControlTheme>
 
   <ControlTheme x:Key="{x:Type ButtonSpinner}" TargetType="ButtonSpinner">
@@ -76,8 +78,10 @@
                           Orientation="Horizontal"
                           IsVisible="{TemplateBinding ShowButtonSpinner}">
                 <RepeatButton Name="PART_IncreaseButton"
+                              Theme="{StaticResource FluentButtonSpinnerRepeatButton}"
                               Background="{TemplateBinding Background}"
-                              BorderThickness="0"
+                              BorderBrush="{TemplateBinding BorderBrush}"
+                              BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource ButtonSpinnerLeftThickness}}"
                               CornerRadius="0"
                               VerticalAlignment="Stretch"
                               VerticalContentAlignment="Center"
@@ -93,13 +97,11 @@
                         Data="{StaticResource ButtonSpinnerIncreaseButtonIcon}" />
                 </RepeatButton>
 
-                <Border BorderBrush="{TemplateBinding BorderBrush}"
-                        BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource ButtonSpinnerRightThickness}}"
-                        VerticalAlignment="Stretch"/>
-
                 <RepeatButton Name="PART_DecreaseButton"
+                              Theme="{StaticResource FluentButtonSpinnerRepeatButton}"
                               Background="{TemplateBinding Background}"
-                              BorderThickness="0"
+                              BorderBrush="{TemplateBinding BorderBrush}"
+                              BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource ButtonSpinnerLeftThickness}}"
                               CornerRadius="0"
                               VerticalAlignment="Stretch"
                               VerticalContentAlignment="Center"
@@ -118,8 +120,6 @@
 
               <ContentPresenter Name="PART_ContentPresenter"
                                 Grid.Column="1"
-                                BorderBrush="{TemplateBinding BorderBrush}"
-                                BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource ButtonSpinnerRightThickness}}"
                                 ContentTemplate="{TemplateBinding ContentTemplate}"
                                 Content="{TemplateBinding Content}"
                                 HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
@@ -134,8 +134,8 @@
       <Style Selector="^ /template/ StackPanel#PART_SpinnerPanel">
         <Setter Property="DockPanel.Dock" Value="Left"/>
       </Style>
-      <Style Selector="^ /template/ ContentPresenter">
-        <Setter Property="BorderThickness" Value="{TemplateBinding BorderThickness, Converter={StaticResource ButtonSpinnerLeftThickness}}" />
+      <Style Selector="^ /template/ RepeatButton">
+        <Setter Property="BorderThickness" Value="{TemplateBinding BorderThickness, Converter={StaticResource ButtonSpinnerRightThickness}}"/>
       </Style>
     </Style>
     <Style Selector="^:error">

From 84a3d9ca1f609d50b53f7878fbe327399ee21d92 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Mon, 11 Jul 2022 17:29:13 +0200
Subject: [PATCH 64/70] Use theme default CornerRadius.

When "Rounded" checkbox isn't checked.
---
 samples/ControlCatalog/ViewModels/ExpanderPageViewModel.cs | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/samples/ControlCatalog/ViewModels/ExpanderPageViewModel.cs b/samples/ControlCatalog/ViewModels/ExpanderPageViewModel.cs
index 18511a6071..aa7f710ee0 100644
--- a/samples/ControlCatalog/ViewModels/ExpanderPageViewModel.cs
+++ b/samples/ControlCatalog/ViewModels/ExpanderPageViewModel.cs
@@ -5,10 +5,10 @@ namespace ControlCatalog.ViewModels
 {
     public class ExpanderPageViewModel : ViewModelBase
     {
-        private CornerRadius _cornerRadius;
+        private object _cornerRadius = AvaloniaProperty.UnsetValue;
         private bool _rounded;
 
-        public CornerRadius CornerRadius
+        public object CornerRadius
         {
             get => _cornerRadius;
             private set => RaiseAndSetIfChanged(ref _cornerRadius, value);
@@ -20,7 +20,7 @@ namespace ControlCatalog.ViewModels
             set
             {
                 if (RaiseAndSetIfChanged(ref _rounded, value))
-                    CornerRadius = _rounded ? new CornerRadius(25) : default;
+                    CornerRadius = _rounded ? new CornerRadius(25) : AvaloniaProperty.UnsetValue;
             }
         }
     }

From a9925f928c7cfd817b1aac542a2242e0e6fa5238 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Mon, 11 Jul 2022 23:11:44 +0200
Subject: [PATCH 65/70] Make Separator look correct.

Previously there was a `MenuItem > Separator` selector, but I don't really see any reason to just apply this style directly to `Separator` itself. It's mainly used in menus and if one wants to use it elsewhere then they'd need to set these properties anyway.
---
 src/Avalonia.Themes.Fluent/Controls/MenuItem.xaml  | 5 ++---
 src/Avalonia.Themes.Fluent/Controls/Separator.xaml | 4 ++++
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/MenuItem.xaml b/src/Avalonia.Themes.Fluent/Controls/MenuItem.xaml
index 8f77d1bc1b..ed29addbc2 100644
--- a/src/Avalonia.Themes.Fluent/Controls/MenuItem.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/MenuItem.xaml
@@ -26,6 +26,7 @@
           <MenuItem Header="Child 1"/>
           <MenuItem Header="Child 2"/>
           <MenuItem Header="Child 3"/>
+          <Separator/>
           <MenuItem Header="Child 4"/>
           <MenuItem Header="Child 5"/>
           <MenuItem Header="Child 6"/>
@@ -204,9 +205,7 @@
     <Style Selector="^:separator">
       <Setter Property="Template">
         <ControlTemplate>
-          <Separator Background="{DynamicResource SystemControlForegroundBaseMediumLowBrush}"
-                     Margin="{DynamicResource MenuFlyoutSeparatorThemePadding}"
-                     Height="{DynamicResource MenuFlyoutSeparatorThemeHeight}"/>
+          <Separator/>
         </ControlTemplate>
       </Setter>
     </Style>
diff --git a/src/Avalonia.Themes.Fluent/Controls/Separator.xaml b/src/Avalonia.Themes.Fluent/Controls/Separator.xaml
index afbc3770c1..d13bffe5e1 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Separator.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Separator.xaml
@@ -1,7 +1,11 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
   <ControlTheme x:Key="{x:Type Separator}" TargetType="Separator">
+    <Setter Property="Background" Value="{DynamicResource SystemControlForegroundBaseMediumLowBrush}" />
     <Setter Property="Focusable" Value="False" />
+    <Setter Property="Height" Value="{DynamicResource MenuFlyoutSeparatorThemeHeight}" />
+    <Setter Property="HorizontalAlignment" Value="Stretch" />
+    <Setter Property="Margin" Value="{DynamicResource MenuFlyoutSeparatorThemePadding}" />
     <Setter Property="Template">
       <ControlTemplate>
         <Border Padding="{TemplateBinding Margin}"

From 90a562c1f8b79431ad2bc66755a41078b6890056 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Wed, 13 Jul 2022 01:05:03 +0200
Subject: [PATCH 66/70] Fix ButtonSpinner disabled icon color.

---
 .../Controls/ButtonSpinner.xaml               | 21 +++++++------------
 1 file changed, 7 insertions(+), 14 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml b/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml
index 44cedd175a..855dc5363e 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml
@@ -47,6 +47,7 @@
     <Setter Property="VerticalAlignment" Value="Stretch" />
     <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
       <Setter Property="BorderBrush" Value="{TemplateBinding BorderBrush}" />
+      <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundDisabled}"/>
     </Style>
   </ControlTheme>
 
@@ -88,13 +89,9 @@
                               Foreground="{TemplateBinding Foreground}"
                               FontSize="{TemplateBinding FontSize}"
                               MinWidth="34">
-                  <Path Fill="{TemplateBinding Foreground}"
-                        Width="16"
-                        Height="8"
-                        Stretch="Uniform"
-                        HorizontalAlignment="Center"
-                        VerticalAlignment="Center"
-                        Data="{StaticResource ButtonSpinnerIncreaseButtonIcon}" />
+                  <PathIcon Width="16"
+                            Height="8"
+                            Data="{StaticResource ButtonSpinnerIncreaseButtonIcon}" />
                 </RepeatButton>
 
                 <RepeatButton Name="PART_DecreaseButton"
@@ -108,13 +105,9 @@
                               Foreground="{TemplateBinding Foreground}"
                               FontSize="{TemplateBinding FontSize}"
                               MinWidth="34">
-                  <Path Fill="{TemplateBinding Foreground}"
-                        Width="16"
-                        Height="8"
-                        Stretch="Uniform"
-                        HorizontalAlignment="Center"
-                        VerticalAlignment="Center"
-                        Data="{StaticResource ButtonSpinnerDecreaseButtonIcon}" />
+                  <PathIcon Width="16"
+                            Height="8"
+                            Data="{StaticResource ButtonSpinnerDecreaseButtonIcon}" />
                 </RepeatButton>
               </StackPanel>
 

From 68ac06d3a740f7ffef488e7b4aa69607fd880f99 Mon Sep 17 00:00:00 2001
From: Max Katz <maxkatz6@outlook.com>
Date: Tue, 12 Jul 2022 21:21:09 -0400
Subject: [PATCH 67/70] Remove duplicated ItemsPanel on hamburger menu

---
 samples/SampleControls/HamburgerMenu/HamburgerMenu.xaml | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/samples/SampleControls/HamburgerMenu/HamburgerMenu.xaml b/samples/SampleControls/HamburgerMenu/HamburgerMenu.xaml
index 73f8e480f5..fbc51414e3 100644
--- a/samples/SampleControls/HamburgerMenu/HamburgerMenu.xaml
+++ b/samples/SampleControls/HamburgerMenu/HamburgerMenu.xaml
@@ -170,8 +170,7 @@
                   <ItemsPresenter Name="PART_ItemsPresenter"
                                   HorizontalAlignment="Stretch"
                                   ItemTemplate="{TemplateBinding ItemTemplate}"
-                                  Items="{TemplateBinding Items}"
-                                  ItemsPanel="{TemplateBinding ItemsPanel}">
+                                  Items="{TemplateBinding Items}">
                     <ItemsPresenter.ItemsPanel>
                       <ItemsPanelTemplate>
                         <StackPanel x:Name="HamburgerItemsPanel"

From 1eaf6cc607b54b87f691fb2d396c0f2cb13d9744 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Wed, 13 Jul 2022 10:24:47 +0200
Subject: [PATCH 68/70] Prevent crash when switching themes.

---
 src/Avalonia.Base/StyledElement.cs | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/Avalonia.Base/StyledElement.cs b/src/Avalonia.Base/StyledElement.cs
index ecf5d95ffc..3a42e9bdfe 100644
--- a/src/Avalonia.Base/StyledElement.cs
+++ b/src/Avalonia.Base/StyledElement.cs
@@ -873,9 +873,12 @@ namespace Avalonia
 
                     if (applied.Source == styles[i])
                     {
-                        applied.Dispose();
                         _appliedStyles.RemoveAt(j);
+                        applied.Dispose();
                     }
+
+                    if (j > _appliedStyles.Count)
+                        j = _appliedStyles.Count;
                 }
             }
         }

From f0f69f1b5efa0365d607a3b93c18490960f59c77 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Wies=C5=82aw=20S=CC=8Colte=CC=81s?=
 <wieslaw.soltes@gmail.com>
Date: Sun, 24 Jul 2022 17:53:56 +0200
Subject: [PATCH 69/70] Fix render demo theme

---
 samples/RenderDemo/App.xaml | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/samples/RenderDemo/App.xaml b/samples/RenderDemo/App.xaml
index 66d97a6444..8ea792de19 100644
--- a/samples/RenderDemo/App.xaml
+++ b/samples/RenderDemo/App.xaml
@@ -3,6 +3,12 @@
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
   <Application.Styles>
     <FluentTheme />
-    <StyleInclude Source="avares://ControlSamples/HamburgerMenu/HamburgerMenu.xaml" />
   </Application.Styles>
+  <Application.Resources>
+    <ResourceDictionary>
+      <ResourceDictionary.MergedDictionaries>
+        <ResourceInclude Source="avares://ControlSamples/HamburgerMenu/HamburgerMenu.xaml" />
+      </ResourceDictionary.MergedDictionaries>
+    </ResourceDictionary>
+  </Application.Resources>
 </Application>

From 11e3691b83d9bd3309b405fe485aa249fa8a471f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Wies=C5=82aw=20S=CC=8Colte=CC=81s?=
 <wieslaw.soltes@gmail.com>
Date: Sun, 24 Jul 2022 18:00:18 +0200
Subject: [PATCH 70/70] Use fluent theme for BindingDemo

---
 samples/BindingDemo/App.xaml           | 4 ++--
 samples/BindingDemo/BindingDemo.csproj | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/samples/BindingDemo/App.xaml b/samples/BindingDemo/App.xaml
index 9260dd280f..3e312c8685 100644
--- a/samples/BindingDemo/App.xaml
+++ b/samples/BindingDemo/App.xaml
@@ -3,7 +3,7 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     x:Class="BindingDemo.App">
     <Application.Styles>
-        <StyleInclude Source="avares://Avalonia.Themes.Default/DefaultTheme.xaml"/>
+        <FluentTheme />
         <StyleInclude Source="avares://Avalonia.Themes.Default/Accents/BaseLight.xaml"/>
     </Application.Styles>
-</Application>
\ No newline at end of file
+</Application>
diff --git a/samples/BindingDemo/BindingDemo.csproj b/samples/BindingDemo/BindingDemo.csproj
index bd6054327f..056d3bf552 100644
--- a/samples/BindingDemo/BindingDemo.csproj
+++ b/samples/BindingDemo/BindingDemo.csproj
@@ -5,7 +5,7 @@
   </PropertyGroup>
   <ItemGroup>
     <ProjectReference Include="..\..\src\Avalonia.Diagnostics\Avalonia.Diagnostics.csproj" />
-    <ProjectReference Include="..\..\src\Avalonia.Themes.Default\Avalonia.Themes.Default.csproj" />
+    <ProjectReference Include="..\..\src\Avalonia.Themes.Fluent\Avalonia.Themes.Fluent.csproj" />
     <ProjectReference Include="..\..\src\Linux\Avalonia.LinuxFramebuffer\Avalonia.LinuxFramebuffer.csproj" />
     <ProjectReference Include="..\MiniMvvm\MiniMvvm.csproj" />
   </ItemGroup>