WIP: Porting fluent theme to use control themes.

Co-Authored-By: Takoooooo <tako0qq@gmail.com>

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
                 });

src/Avalonia.Themes.Fluent/Controls/AutoCompleteBox.xaml

@@ -1,5 +1,5 @@
-<Styles xmlns="https://github.com/avaloniaui" 
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+                    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">
+    <ControlTheme x:Key="{x:Type AutoCompleteBox}" TargetType="AutoCompleteBox">
-    <Setter Property="VerticalAlignment" Value="Top" />
+      <Setter Property="VerticalAlignment" Value="Top" />
-    <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
+      <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
-    <Setter Property="Background" Value="{DynamicResource TextControlBackground}" />
+      <Setter Property="Background" Value="{DynamicResource TextControlBackground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrush}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrush}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThickness}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThickness}" />
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-    <Setter Property="Padding" Value="{DynamicResource TextControlThemePadding}" />
+      <Setter Property="Padding" Value="{DynamicResource TextControlThemePadding}" />
-    <Setter Property="MaxDropDownHeight" Value="{DynamicResource AutoCompleteListMaxHeight}" />
+      <Setter Property="MaxDropDownHeight" Value="{DynamicResource AutoCompleteListMaxHeight}" />
-    <Setter Property="Template">
+      <Setter Property="Template">
-      <ControlTemplate>
+        <ControlTemplate>
-        <Grid Name="PART_LayoutRoot">
+          <Grid Name="PART_LayoutRoot">
-          <TextBox Name="PART_TextBox"
+            <TextBox Name="PART_TextBox"
-                   Watermark="{TemplateBinding Watermark}"
+                     Watermark="{TemplateBinding Watermark}"
-                   Width="{TemplateBinding Width}"
+                     Width="{TemplateBinding Width}"
-                   Foreground="{TemplateBinding Foreground}"
+                     Foreground="{TemplateBinding Foreground}"
-                   Background="{TemplateBinding Background}"
+                     Background="{TemplateBinding Background}"
-                   BorderBrush="{TemplateBinding BorderBrush}"
+                     BorderBrush="{TemplateBinding BorderBrush}"
-                   BorderThickness="{TemplateBinding BorderThickness}"
+                     BorderThickness="{TemplateBinding BorderThickness}"
-                   CornerRadius="{TemplateBinding CornerRadius}"
+                     CornerRadius="{TemplateBinding CornerRadius}"
-                   FontSize="{TemplateBinding FontSize}"
+                     FontSize="{TemplateBinding FontSize}"
-                   FontFamily="{TemplateBinding FontFamily}"
+                     FontFamily="{TemplateBinding FontFamily}"
-                   FontWeight="{TemplateBinding FontWeight}"
+                     FontWeight="{TemplateBinding FontWeight}"
-                   Padding="{TemplateBinding Padding}"
+                     Padding="{TemplateBinding Padding}"
-                   Margin="0"
+                     Margin="0"
-                   DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}" />
+                     DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}" />
-          
+            <Popup Name="PART_Popup" 
-          <Popup Name="PART_Popup"
+                   WindowManagerAddShadowHint="False"
-                 WindowManagerAddShadowHint="False"
+                   MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}" 
-                 MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
+                   MaxHeight="{TemplateBinding MaxDropDownHeight}"
-                 MaxHeight="{TemplateBinding MaxDropDownHeight}"
+                   IsLightDismissEnabled="True"
-                 IsLightDismissEnabled="True"
+                   PlacementTarget="{TemplateBinding}">
-                 PlacementTarget="{TemplateBinding}">            
+              <Border Name="PART_SuggestionsContainer"
-            <Border Name="PART_SuggestionsContainer"
+                      Padding="{DynamicResource AutoCompleteListMargin}"
-                    Padding="{DynamicResource AutoCompleteListMargin}"
+                      BorderThickness="{DynamicResource AutoCompleteListBorderThemeThickness}"
-                    BorderThickness="{DynamicResource AutoCompleteListBorderThemeThickness}"
+                      BorderBrush="{DynamicResource AutoCompleteBoxSuggestionsListBorderBrush}"
-                    BorderBrush="{DynamicResource AutoCompleteBoxSuggestionsListBorderBrush}"
+                      Background="{DynamicResource AutoCompleteBoxSuggestionsListBackground}"
-                    Background="{DynamicResource AutoCompleteBoxSuggestionsListBackground}"
+                      CornerRadius="{DynamicResource OverlayCornerRadius}">
-                    CornerRadius="{DynamicResource OverlayCornerRadius}">
+                <ListBox Name="PART_SelectingItemsControl"
-              <ListBox Name="PART_SelectingItemsControl"
+                         BorderThickness="0"
-                       BorderThickness="0"
+                         Background="Transparent"
-                       Background="Transparent"
+                         ItemTemplate="{TemplateBinding ItemTemplate}"
-                       ItemTemplate="{TemplateBinding ItemTemplate}"
+                         Margin="{DynamicResource AutoCompleteListPadding}" />
-                       Margin="{DynamicResource AutoCompleteListPadding}" />
+              </Border>
-            </Border>
+            </Popup>
-          </Popup>
+          </Grid>
-        </Grid>
+        </ControlTemplate>
-      </ControlTemplate>
+      </Setter>
-    </Setter>
+    </ControlTheme>
-  </Style>
+  
-</Styles>
+</ResourceDictionary>

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="RenderTransform" Value="none" />
-    <Setter Property="FocusVisualMargin" Value="-3" />-->
+    <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">
+    <Style Selector="^:pressed">
-    <Setter Property="RenderTransform" Value="none" />
+      <Setter Property="RenderTransform" Value="scale(0.98)" />
-    <Setter Property="Transitions">
+    </Style>
-      <Transitions>
+  </ControlTheme>
-        <TransformOperationsTransition Property="RenderTransform" Duration="0:0:.075" />
+</ResourceDictionary>
-      </Transitions>
-    </Setter>
-  </Style>
-
-  <Style Selector="Button:pressed, RepeatButton:pressed, ToggleButton:pressed, DropDownButton:pressed">
-    <Setter Property="RenderTransform" Value="scale(0.98)" />    
-  </Style>
-
-</Styles>

src/Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml

@@ -1,28 +1,26 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        xmlns:sys="clr-namespace:System;assembly=netstandard"
+                    xmlns:sys="clr-namespace:System;assembly=netstandard"
-        xmlns:converters="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls"
+                    xmlns:converters="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls"
-        x:CompileBindings="True">
+                    x:CompileBindings="True">
-  <Design.PreviewWith>
+    <Design.PreviewWith>
-    <Border Padding="20"
+      <Border Padding="20" Background="Black">
-            Background="Black">
+        <StackPanel Spacing="20">
-      <StackPanel Spacing="20">
+          <ButtonSpinner ButtonSpinnerLocation="Right"
-        <ButtonSpinner ButtonSpinnerLocation="Right"
+                         Content="Right disabled inline spinner"
-                       Content="Right disabled inline spinner"
+                         AllowSpin="False">
-                       AllowSpin="False">
+            <DataValidationErrors.Error>
-          <DataValidationErrors.Error>
+              <sys:Exception />
-            <sys:Exception />
+            </DataValidationErrors.Error>
-          </DataValidationErrors.Error>
+          </ButtonSpinner>
-        </ButtonSpinner>
+          <ButtonSpinner ButtonSpinnerLocation="Left"
-        <ButtonSpinner ButtonSpinnerLocation="Left"
+                         Content="Left spinner" />
-                       Content="Left spinner" />
+          <ButtonSpinner ShowButtonSpinner="False"
-        <ButtonSpinner ShowButtonSpinner="False"
+                         Content="Hide spinner" />
-                       Content="Hide spinner" />
+        </StackPanel>
-      </StackPanel>
+      </Border>
-    </Border>
+    </Design.PreviewWith>
-  </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  -->
+    <ControlTheme x:Key="{x:Type ButtonSpinner}" TargetType="ButtonSpinner">
-  <Style Selector="RepeatButton.ButtonSpinnerRepeatButton">
+      <Setter Property="Background" Value="Transparent" />
-    <Setter Property="MinWidth" Value="34" />
+      <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
-    <Setter Property="VerticalAlignment" Value="Stretch" />
+      <Setter Property="Padding" Value="10, 0" />
-  </Style>
+      <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">
+      <Style Selector="^:error">
-    <Setter Property="CornerRadius" Value="0" />
+        <Setter Property="BorderBrush" Value="{DynamicResource SystemErrorTextColor}" />
-    <Setter Property="BorderBrush" Value="{TemplateBinding BorderBrush}" />
+      </Style>
-  </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>
 
-  <!--  ButtonSpinner  -->
+      <Style Selector="^:left /template/">
-  <Style Selector="ButtonSpinner">
+        <Style Selector="^ StackPanel#PART_SpinnerPanel">
-    <Setter Property="Background" Value="Transparent" />
+          <Setter Property="Grid.Column" Value="0" />
-    <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
+        </Style>
-    <Setter Property="Padding" Value="10, 0" />
+        <Style Selector="^ RepeatButton.ButtonSpinnerRepeatButton">
-    <Setter Property="Background" Value="{DynamicResource TextControlBackground}" />
+          <Setter Property="BorderThickness" Value="{Binding $parent[ButtonSpinner].BorderThickness, Converter={StaticResource ButtonSpinner_OnlyRightThinknessConverter}}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrush}" />
+        </Style>
-    <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThickness}" />
+      </Style>
-    <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"
+      <Style Selector="^:right /template/">
-                          Orientation="Horizontal"
+        <Style Selector="^ StackPanel#PART_SpinnerPanel">
-                          IsVisible="{TemplateBinding ShowButtonSpinner}">
+          <Setter Property="Grid.Column" Value="2" />
-                <RepeatButton Name="PART_IncreaseButton"
+        </Style>
-                              Classes="ButtonSpinnerRepeatButton"
+        <Style Selector="^ RepeatButton.ButtonSpinnerRepeatButton">
-                              VerticalContentAlignment="Center"
+          <Setter Property="BorderThickness" Value="{Binding $parent[ButtonSpinner].BorderThickness, Converter={StaticResource ButtonSpinner_OnlyLeftThinknessConverter}}" />
-                              Foreground="{TemplateBinding Foreground}"
+        </Style>
-                              BorderBrush="{TemplateBinding BorderBrush}"
+      </Style>
-                              Background="{TemplateBinding Background}"
+    </ControlTheme>
-                              FontSize="{TemplateBinding FontSize}">
+</ResourceDictionary>
-                  <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>

src/Avalonia.Themes.Fluent/Controls/Calendar.xaml

@@ -1,38 +1,40 @@
-<!--
+<!--
-// (c) Copyright Microsoft Corporation.
+    // (c) Copyright Microsoft Corporation.
-// This source is subject to the Microsoft Public License (Ms-PL).
+    // This source is subject to the Microsoft Public License (Ms-PL).
-// Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
+    // Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
-// All other rights reserved.
+    // All other rights reserved.
 -->
 
-<Styles xmlns="https://github.com/avaloniaui">
+<ResourceDictionary xmlns="https://github.com/avaloniaui" 
-  <Design.PreviewWith>
+                    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}" />
+    <ControlTheme x:Key="{x:Type Calendar}" TargetType="Calendar">
-    <Setter Property="Background" Value="{DynamicResource CalendarViewBackground}" />
+        <Setter Property="Foreground" Value="{DynamicResource CalendarViewForeground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewBorderBrush}" />
+        <Setter Property="Background" Value="{DynamicResource CalendarViewBackground}" />
-    <Setter Property="BorderThickness" Value="1" />
+        <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewBorderBrush}" />
-    <Setter Property="HorizontalAlignment" Value="Left" />
+        <Setter Property="BorderThickness" Value="1" />
-    <Setter Property="VerticalAlignment" Value="Center" />
+        <Setter Property="HorizontalAlignment" Value="Left" />
-    <Setter Property="Template">
+        <Setter Property="VerticalAlignment" Value="Center" />
-      <ControlTemplate>
+        <Setter Property="Template">
-        <StackPanel Name="Root"
+            <ControlTemplate>
+                <StackPanel
+                    Name="Root"
                     HorizontalAlignment="Center"
                     ClipToBounds="True">
-
+                    <CalendarItem
-                    <CalendarItem Name="CalendarItem"
+                        Name="CalendarItem"
                         Background="{TemplateBinding Background}"
                         BorderBrush="{TemplateBinding BorderBrush}"
                         BorderThickness="{TemplateBinding BorderThickness}"
-                        HeaderBackground="{TemplateBinding HeaderBackground}"
+                        CornerRadius="{TemplateBinding CornerRadius}"
-                        CornerRadius="{TemplateBinding CornerRadius}"/>
+                        HeaderBackground="{TemplateBinding HeaderBackground}" />
-
+                </StackPanel>
-        </StackPanel>
+            </ControlTemplate>
-      </ControlTemplate>
+        </Setter>
-    </Setter>
+    </ControlTheme>
-  </Style>
+</ResourceDictionary>
-</Styles>

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="^:pointerover /template/ Border#Border">
-  <Style Selector="CalendarButton">
+        <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewHoverBorderBrush}" />
-    <Setter Property="ClickMode" Value="Release"/>
+      </Style>
-    <Setter Property="MinWidth" Value="40"/>
+      
-    <Setter Property="MinHeight" Value="40"/>
+      <Style Selector="^:pressed /template/ Border#Border">
-    <Setter Property="Margin" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark2}" />
-    <Setter Property="Padding" Value="0,0,0,0"/>
+      </Style>
-    <!--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"
+      <!-- Adjusted :selected to look like :today from DayItem -->
-                  ContentTemplate="{TemplateBinding ContentTemplate}"
+      <Style Selector="^:selected">
-                  Content="{TemplateBinding Content}"
+        <Style Selector="^ /template/ Border#Root">
-                  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+          <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
-                  VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+        </Style>
-                  FontSize="{TemplateBinding FontSize}"
+        
-                  Margin="{TemplateBinding Padding}"/>
+        <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
+        <Style Selector="^:pointerover">
-                        margin between items-->
+          <Style Selector="^ /template/ Border#Border">
-          <Border Name="Border"
+            <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark1}" />
-                  BorderThickness="2"
+          </Style>
-                  BorderBrush="{TemplateBinding BorderBrush}"/>
+          <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 
+        <Style Selector="^:pressed">
-              focus visual w/ keyboard focus
+          <Style Selector="^ /template/ Border#Border">
-          <Border Name="FocusVisual" BorderThickness="2"
+            <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark2}" />
-                     BorderBrush="{DynamicResource SystemControlHighlightBaseHighBrush}"
+          </Style>
-                     IsHitTestVisible="False"
+          
-                     Margin="-2"  CornerRadius="{DynamicResource ControlCornerRadius}"/>-->
+          <Style Selector="^ /template/ Border#Root">
-        </Panel>
+            <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
-      </ControlTemplate>
+          </Style>
-    </Setter>
+        </Style>
-  </Style>
+      </Style>
-  <!--<Style Selector="CalendarButton /template/ Border#FocusVisual">
-    <Setter Property="IsVisible" Value="False"/>
-  </Style>-->
 
-  <Style Selector="CalendarButton:pointerover /template/ Border#Border">
+      <!-- WinUI calls this OutOfFocus -->
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewHoverBorderBrush}"/>
+      <Style Selector="^:inactive">
-  </Style>
+        <Style Selector="^ /template/ Border#Root">
-  <Style Selector="CalendarButton:pressed /template/ Border#Border">
+          <!-- These are probably set in code, but consistent -->
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewPressedBorderBrush}"/>
+          <Setter Property="Background" Value="{DynamicResource CalendarViewOutOfScopeBackground}"/>
-  </Style>
+        </Style>
+        <Style Selector="^ /template/ ContentControl#Content">
+          <Setter Property="Foreground" Value="{DynamicResource CalendarViewOutOfScopeForeground}"/>
+        </Style>
+      </Style>
 
-  <!-- Adjusted :selected to look like :today from DayItem -->
+      <Style Selector="^:blackout /template/ ContentControl#Content">
-  <Style Selector="CalendarButton:selected /template/ Border#Root">
+        <Setter Property="Foreground" Value="{DynamicResource CalendarViewBlackoutForeground}" />
-    <Setter Property="Background" Value="{DynamicResource SystemAccentColor}"/>
+      </Style>
-  </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="CalendarButton:selected /template/ ContentControl#Content">
+      <Style Selector="^:disabled /template/ ContentControl#Content">
-    <Setter Property="Foreground" Value="{DynamicResource CalendarViewTodayForeground}"/>
+        <Setter Property="Foreground" Value="{DynamicResource CalendarViewWeekDayForegroundDisabled}" />
-    <Setter Property="FontWeight" Value="SemiBold"/>
+      </Style>
-  </Style>
+    </ControlTheme>
-
+</ResourceDictionary>
-  <!-- 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>

src/Avalonia.Themes.Fluent/Controls/CalendarDatePicker.xaml

@@ -1,182 +1,180 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        xmlns:sys="clr-namespace:System;assembly=netstandard"
+                    xmlns:sys="clr-namespace:System;assembly=netstandard"
-        x:CompileBindings="True">
+                    x:CompileBindings="True">
-  <Design.PreviewWith>
+    <Design.PreviewWith>
-    <Border Margin="20, 20, 20, 200">
+      <Border Margin="20, 20, 20, 200">
-      <CalendarDatePicker Width="200"
+        <CalendarDatePicker Width="200" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" />
-                          VerticalContentAlignment="Center"
+      </Border>
-                          HorizontalContentAlignment="Center" />
+    </Design.PreviewWith>
-    </Border>
+  
-  </Design.PreviewWith>
-
-  <Styles.Resources>
     <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 -->
+    <ControlTheme x:Key="FluentCalendarDatePickerButton" TargetType="Button">
-  <Style Selector="CalendarDatePicker /template/ Button#PART_Button">
+      <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerCalendarGlyphForeground}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerCalendarGlyphForeground}" />
+      <Setter Property="Margin" Value="2,0,4,0" />
-    <Setter Property="Background" Value="Transparent" />
+      <Setter Property="Width" Value="20" />
-    <Setter Property="BorderThickness" Value="0" />
+      <Setter Property="Template">
-    <Setter Property="Margin" Value="2,0,4,0" />
+        <ControlTemplate>
-    <Setter Property="Padding" Value="0" />
+          <Grid Height="24"
-    <Setter Property="Width" Value="20" />
+                Width="20"
-    <Setter Property="Template">
+                HorizontalAlignment="Center"
-      <ControlTemplate>
+                VerticalAlignment="Center"
-        <Grid Height="24"
+                Margin="0"
-              Width="20"
+                ColumnDefinitions="*,*,*,*"
-              HorizontalAlignment="Center"
+                RowDefinitions="23*,19*,19*,19*"
-              VerticalAlignment="Center"
+                ClipToBounds="False">
-              Margin="0"
+            <Border Name="Background"
-              ColumnDefinitions="*,*,*,*"
+                    Margin="0,-1,0,0"
-              RowDefinitions="23*,19*,19*,19*"
+                    Grid.ColumnSpan="4"
-              ClipToBounds="False">
+                    Grid.Row="1"
-          <Border Name="Background"
+                    Grid.RowSpan="3"
-                  Margin="0,-1,0,0"
+                    BorderThickness="0.5,0,0.5,0.5"
-                  Grid.ColumnSpan="4"
+                    BorderBrush="{TemplateBinding Foreground}"
-                  Grid.Row="1"
+                    CornerRadius="0,0,2,2" />
-                  Grid.RowSpan="3"
+            <Border Grid.ColumnSpan="4"
-                  BorderThickness="0.5,0,0.5,0.5"
+                    Grid.RowSpan="1"
-                  BorderBrush="{TemplateBinding Foreground}"
+                    BorderBrush="{TemplateBinding Foreground}"
-                  CornerRadius="0,0,2,2" />
+                    BorderThickness="0.5"
-          <Border Grid.ColumnSpan="4"
+                    CornerRadius="2,2,0,0" />
-                  Grid.RowSpan="1"
+            <TextBlock Margin="0,-1,0,0"
-                  BorderBrush="{TemplateBinding Foreground}"
+                       VerticalAlignment="Center"
-                  BorderThickness="0.5"
+                       HorizontalAlignment="Center"
-                  CornerRadius="2,2,0,0" />
+                       Grid.Column="0"
-          <TextBlock Margin="0,-1,0,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"
+                     Fill="{TemplateBinding Foreground}"
-                     Grid.Column="0"
+                     StrokeThickness="0"
-                     Grid.Row="1"
                      Grid.ColumnSpan="4"
-                     Grid.RowSpan="3"
+                     Width="3"
-                     Foreground="{TemplateBinding Foreground}"
+                     Height="3" />
-                     FontSize="{DynamicResource CalendarDatePickerCurrentDayFontSize}"
+          </Grid>
-                     Text="{Binding Source={x:Static sys:DateTime.Today}, Path=Day}" />
+        </ControlTemplate>
-          <Ellipse HorizontalAlignment="Center"
+      </Setter>
-                   VerticalAlignment="Center"
+    </ControlTheme>
-                   Fill="{TemplateBinding Foreground}"
+    
-                   StrokeThickness="0"
+    <ControlTheme x:Key="{x:Type CalendarDatePicker}" TargetType="CalendarDatePicker">
-                   Grid.ColumnSpan="4"
+      <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackground}" />
-                   Width="3"
+      <Setter Property="Foreground" Value="{DynamicResource CalendarDatePickerForeground}" />
-                   Height="3" />
+      <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrush}" />
-        </Grid>
+      <Setter Property="BorderThickness" Value="{DynamicResource CalendarDatePickerBorderThemeThickness}" />
-      </ControlTemplate>
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    </Setter>
+      <Setter Property="MinHeight" Value="{DynamicResource CalendarDatePickerMinHeight}" />
-  </Style>
+      <Setter Property="HorizontalAlignment" Value="Left" />
-
+      <Setter Property="VerticalAlignment" Value="Center" />
-  <!-- Pressed State -->
+      <Setter Property="HorizontalContentAlignment" Value="Left" />
-  <Style Selector="CalendarDatePicker:pressed /template/ Border#Background">
+      <Setter Property="VerticalContentAlignment" Value="Center" />
-    <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackgroundPressed}" />
+      <Setter Property="Padding" Value="4" />
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrushPressed}" />
+      <Setter Property="Template">
-  </Style>
+        <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 -->
+      <!-- Disabled State -->
-  <Style Selector="CalendarDatePicker:pointerover /template/ Border#Background">
+      <Style Selector="^:disabled /template/">
-    <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackgroundPointerOver}" />
+        <Style Selector="^ Border#Background">
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrushPointerOver}" />
+          <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackgroundDisabled}" />
-  </Style>
+          <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrushDisabled}" />
+        </Style>
+        
+        <Style Selector="^ Button#PART_Button">
+          <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerCalendarGlyphForegroundDisabled}" />
+        </Style>
 
-  <!-- Disabled State -->
+      </Style>
-  <Style Selector="CalendarDatePicker:disabled /template/ Border#Background">
-    <Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackgroundDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrushDisabled}" />
-  </Style>
 
-  <Style Selector="CalendarDatePicker:disabled /template/ Button#PART_Button">
+      <!-- Focused State -->
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerCalendarGlyphForegroundDisabled}" />
+      <Style Selector="^:focus-within:not(CalendarDatePicker:focus) /template/ Border#Background">
-  </Style>
+        <Setter Property="Background" Value="{DynamicResource TextControlBackgroundFocused}" />
-
+        <Setter Property="BorderBrush" Value="{DynamicResource TextControlBorderBrushFocused}" />
-  <Style Selector="CalendarDatePicker:disabled /template/ TextBox#PART_TextBox:disabled /template/ Border#PART_BorderElement">
+        <Setter Property="BorderThickness" Value="{DynamicResource TextControlBorderThemeThicknessFocused}" />
-    <!-- By default the TextBox has its own disabled state, override this to make the border background show through -->
+      </Style>
-    <Setter Property="Background" Value="Transparent" />
+      
-    <Setter Property="BorderBrush" Value="Transparent" />
+      <!-- Error State -->
-  </Style>
+      <Style Selector="^:error /template/ Border#Background">
-
+        <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
-  <Style Selector="CalendarDatePicker:disabled /template/ TextBox#PART_TextBox:disabled /template/ TextBlock#PART_Watermark,
+      </Style>
-                   CalendarDatePicker:disabled /template/ TextBox#PART_TextBox:disabled /template/ TextBlock#PART_FloatingWatermark">
+    </ControlTheme>
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerTextForegroundDisabled}" />
+  
-  </Style>
+</ResourceDictionary>
-
-  <!-- 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>

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">
+              <ContentControl Name="Content"
-  <Style Selector="CalendarDayButton">
+                              ContentTemplate="{TemplateBinding ContentTemplate}"
-    <Setter Property="ClickMode" Value="Release"/>
+                              Content="{TemplateBinding Content}"
-    <Setter Property="MinWidth" Value="40"/>
+                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-    <Setter Property="MinHeight" Value="40"/>
+                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-    <Setter Property="Margin" Value="1"/>
+                              FontSize="{TemplateBinding FontSize}"
-    <Setter Property="Padding" Value="0,0,0,0"/>
+                              Margin="{TemplateBinding Padding}" />
-    <!--These are actually set on the CalendarView in WinUI-->
+              
-    <Setter Property="Foreground" Value="{DynamicResource CalendarViewCalendarItemForeground}"/>
+            </Border>
-    <Setter Property="Background" Value="{DynamicResource CalendarViewCalendarItemRevealBackground}"/>
+            
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewCalendarItemRevealBorderBrush}"/>
+            <!-- Drawn Border should render on top of background to preserve the 1px margin between items-->
-    <Setter Property="BorderThickness" Value="2"/>
+            <Border Name="Border"
-    <Setter Property="FontSize" Value="20"/>
+                    BorderThickness="2"
-    <Setter Property="ClipToBounds" Value="False"/>
+                    BorderBrush="{TemplateBinding BorderBrush}" />
-    <Setter Property="HorizontalContentAlignment" Value="Center"/>
+          </Panel>
-    <Setter Property="VerticalContentAlignment" Value="Center"/>
+        </ControlTemplate>
-    <Setter Property="Template">
+      </Setter>
-      <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"
+      <Style Selector="^:pointerover /template/ Border#Border">
-                  ContentTemplate="{TemplateBinding ContentTemplate}"
+        <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewHoverBorderBrush}" />
-                  Content="{TemplateBinding Content}"
+      </Style>
-                  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                  VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                  FontSize="{TemplateBinding FontSize}"
-                  Margin="{TemplateBinding Padding}"/>
 
-          </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
+      <Style Selector="^:selected">
-                        margin between items-->
+        <Style Selector="^ /template/ Border#Border">
-          <Border Name="Border"
+          <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedBorderBrush}" />
-                  BorderThickness="2"
+        </Style>
-                  BorderBrush="{TemplateBinding BorderBrush}"/>
+        <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 
+      <Style Selector="^:today">
-              focus visual w/ keyboard focus
+        <Style Selector="^ /template/ Border#Root">
-                <Border Name="FocusVisual" BorderThickness="2"
+          <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
-                            BorderBrush="{DynamicResource SystemControlHighlightBaseHighBrush}"
+        </Style>
-                            IsHitTestVisible="False"
+        <!-- These are probably set in code, but consistent -->
-                            Margin="-2"  CornerRadius="2"/>-->
+        <Style Selector="^:pointerover /template/ Border#Border">
-        </Panel>
+          <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark1}" />
-      </ControlTemplate>
+        </Style>
-    </Setter>
+        <Style Selector="^:pressed /template/ Border#Border">
-  </Style>
+          <Setter Property="BorderBrush" Value="{DynamicResource SystemAccentColorDark2}" />
-  <!--<Style Selector="CalendarDayButton /template/ Border#FocusVisual">
+        </Style>
-    <Setter Property="IsVisible" Value="False"/>
+        <Style Selector="^ ContentControl#Content">
-  </Style>-->
+          <Setter Property="Foreground" Value="{DynamicResource CalendarViewTodayForeground}" />
+          <Setter Property="FontWeight" Value="SemiBold" />
+        </Style>
+      </Style>
 
-  <Style Selector="CalendarDayButton:pointerover /template/ Border#Border">
+      <!-- WinUI calls this OutOfFocus -->
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewHoverBorderBrush}"/>
+      <Style Selector="^:inactive /template/">
-  </Style>
+        <Style Selector="^ Border#Root">
-  <Style Selector="CalendarDayButton:pressed /template/ Border#Border">
+          <Setter Property="Background" Value="{DynamicResource CalendarViewOutOfScopeBackground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewPressedBorderBrush}"/>
+        </Style>
-  </Style>
+        <Style Selector="^ ContentControl#Content">
-  <Style Selector="CalendarDayButton:selected /template/ Border#Border">
+          <Setter Property="Foreground" Value="{DynamicResource CalendarViewOutOfScopeForeground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource CalendarViewSelectedBorderBrush}"/>
+        </Style>
-  </Style>
+      </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>
 
-  <Style Selector="CalendarDayButton:today /template/ Border#Root">
+      <Style Selector="^:blackout /template/ ContentControl#Content">
-    <!-- These are probably set in code, but consistent -->
+        <Setter Property="Foreground" Value="{DynamicResource CalendarViewBlackoutForeground}" />
-    <Setter Property="Background">
+      </Style>
-      <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>
 
-  <!-- WinUI calls this OutOfFocus -->
+      <Style Selector="^:disabled /template/ ContentControl#Content">
-  <Style Selector="CalendarDayButton:inactive /template/ Border#Root">
+        <Setter Property="Foreground" Value="{DynamicResource CalendarViewWeekDayForegroundDisabled}" />
-    <Setter Property="Background" Value="{DynamicResource CalendarViewOutOfScopeBackground}"/>
+      </Style>
-  </Style>
+    </ControlTheme>
-  <Style Selector="CalendarDayButton:inactive /template/ ContentControl#Content">
+</ResourceDictionary>
-    <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>

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.
 -->
-
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-<Styles xmlns="https://github.com/avaloniaui"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         x:CompileBindings="True"
         x:DataType="CalendarItem">
-  <Design.PreviewWith>
+    <Design.PreviewWith>
-    <Border Padding="20">
+      <Border Padding="20">
-      <Calendar />
+        <Calendar />
-    </Border>
+      </Border>
-  </Design.PreviewWith>
+    </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>
   
-</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>

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">
+<ResourceDictionary 
-  <Style Selector="CaptionButtons">    
+  xmlns="https://github.com/avaloniaui" 
-    <Setter Property="MaxHeight" Value="30" />
+  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Setter Property="Template">
+    <ControlTheme x:Key="{x:Type CaptionButtons}" TargetType="CaptionButtons">
-      <ControlTemplate>
+      <Setter Property="MaxHeight" Value="30" />
-        <StackPanel Spacing="2" VerticalAlignment="Stretch" TextElement.FontSize="10" Orientation="Horizontal">
+      <Setter Property="Template">
-          <StackPanel.Styles>
+        <ControlTemplate>
-            <Style Selector="Panel">
+          <StackPanel Spacing="2" VerticalAlignment="Stretch" TextElement.FontSize="10" Orientation="Horizontal">
-              <Setter Property="Width" Value="45" />
+            <StackPanel.Styles>
-              <Setter Property="Background" Value="Transparent" />
+              <Style Selector="Panel:pointerover">
-            </Style>
+                <Setter Property="Background" Value="#7F7f7f7f" />
-            <Style Selector="Panel:pointerover">
+              </Style>
-              <Setter Property="Background" Value="#7F7f7f7f" />
+              <Style Selector="Panel#PART_CloseButton:pointerover">
-            </Style>
+                <Setter Property="Background" Value="#7FFF0000" />
-            <Style Selector="Panel#PART_CloseButton:pointerover">
+              </Style>
-              <Setter Property="Background" Value="#7FFF0000" />
+            </StackPanel.Styles>
-            </Style>
+            <Panel x:Name="PART_FullScreenButton" IsVisible="False" Width="45" Background="Transparent">
-            <Style Selector="Viewbox">
+              <Viewbox Width="11" Margin="2">
-              <Setter Property="Width" Value="11" />
+                <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}" Data="M2048 2048v-819h-205v469l-1493 -1493h469v-205h-819v819h205v-469l1493 1493h-469v205h819z" />
-              <Setter Property="Margin" Value="2" />
+              </Viewbox>
-            </Style>
+            </Panel>
-          </StackPanel.Styles>
+            <Panel x:Name="PART_MinimiseButton" Width="45" Background="Transparent">
-          <Panel x:Name="PART_FullScreenButton">
+              <Viewbox Width="11" Margin="2">
-            <Viewbox>
+                <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}" Data="M2048 1229v-205h-2048v205h2048z" />
-              <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}" />
+              </Viewbox>
-            </Viewbox>
+            </Panel>
-          </Panel>
+            <Panel x:Name="PART_RestoreButton" Width="45" Background="Transparent">
-
+              <Viewbox Width="11" Margin="2">
-          <Panel x:Name="PART_MinimiseButton">
+                <Viewbox.RenderTransform>
-            <Viewbox>
+                  <RotateTransform Angle="-90" />
-              <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}" Data="M2048 1229v-205h-2048v205h2048z" />
+                </Viewbox.RenderTransform>
-            </Viewbox>
+                <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}" Data="M2048 2048v-2048h-2048v2048h2048zM1843 1843h-1638v-1638h1638v1638z"/>
-          </Panel>
+              </Viewbox>
-
+            </Panel>
-          <Panel x:Name="PART_RestoreButton">
+            <Panel x:Name="PART_CloseButton" Width="45" Background="Transparent">
-            <Viewbox>
+              <Viewbox Width="11" Margin="2">
-              <Viewbox.RenderTransform>
+                <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" />
-                <RotateTransform Angle="-90" />
+              </Viewbox>
-              </Viewbox.RenderTransform>
+            </Panel>
-              <Path Stretch="UniformToFill" Fill="{TemplateBinding Foreground}"/>
+          </StackPanel>
-            </Viewbox>
+        </ControlTemplate>
-          </Panel>
+      </Setter>
-
+      <Style Selector="^:maximized /template/ Panel#PART_RestoreButton Path">
-          <Panel x:Name="PART_CloseButton">
+        <Setter Property="Data" Value="M2048 410h-410v-410h-1638v1638h410v410h1638v-1638zM1434 1434h-1229v-1229h1229v1229zM1843 1843h-1229v-205h1024v-1024h205v1229z" />
-            <Viewbox>
+      </Style>
-              <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" />
+      <Style Selector="^:fullscreen /template/ Panel#PART_FullScreenButton Path">
-            </Viewbox>
+        <Setter Property="IsVisible" Value="True" />
-          </Panel>
+        <Setter Property="Data" Value="M205 1024h819v-819h-205v469l-674 -674l-145 145l674 674h-469v205zM1374 1229h469v-205h-819v819h205v-469l674 674l145 -145z" />
-        </StackPanel>
+      </Style>
-      </ControlTemplate>
+      <Style Selector="^:fullscreen /template/ Panel#PART_RestoreButton">
-    </Setter>
+        <Setter Property="IsVisible" Value="False" />
-  </Style>
+      </Style>
-  <Style Selector="CaptionButtons Panel#PART_RestoreButton Path">
+      <Style Selector="^:fullscreen /template/ Panel#PART_MinimiseButton">
-    <Setter Property="Data" Value="M2048 2048v-2048h-2048v2048h2048zM1843 1843h-1638v-1638h1638v1638z" />
+        <Setter Property="IsVisible" Value="False" />
-  </Style>
+      </Style>
-  <Style Selector="CaptionButtons:maximized Panel#PART_RestoreButton Path">
+    </ControlTheme>
-    <Setter Property="Data" Value="M2048 410h-410v-410h-1638v1638h410v410h1638v-1638zM1434 1434h-1229v-1229h1229v1229zM1843 1843h-1229v-205h1024v-1024h205v1229z" />
+</ResourceDictionary>
-  </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>

src/Avalonia.Themes.Fluent/Controls/Carousel.xaml

@@ -1,17 +1,20 @@
-<Style xmlns="https://github.com/avaloniaui" Selector="Carousel">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-  <Setter Property="Template">
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTemplate>
+    <ControlTheme x:Key="{x:Type Carousel}" TargetType="Carousel">
-      <Border Background="{TemplateBinding Background}"
+      <Setter Property="Template">
-              BorderBrush="{TemplateBinding BorderBrush}"
+        <ControlTemplate>
-              BorderThickness="{TemplateBinding BorderThickness}"
+          <Border Background="{TemplateBinding Background}"
-              CornerRadius="{TemplateBinding CornerRadius}">
+                  BorderBrush="{TemplateBinding BorderBrush}"
-        <CarouselPresenter IsVirtualized="{TemplateBinding IsVirtualized}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
-                           Items="{TemplateBinding Items}"
+                  CornerRadius="{TemplateBinding CornerRadius}">
-                           ItemsPanel="{TemplateBinding ItemsPanel}"
+            <CarouselPresenter IsVirtualized="{TemplateBinding IsVirtualized}"
-                           Margin="{TemplateBinding Padding}"
+                               Items="{TemplateBinding Items}"
-                           SelectedIndex="{TemplateBinding SelectedIndex}"
+                               ItemsPanel="{TemplateBinding ItemsPanel}"
-                           PageTransition="{TemplateBinding PageTransition}"/>
+                               Margin="{TemplateBinding Padding}"
-      </Border>
+                               SelectedIndex="{TemplateBinding SelectedIndex}"
-    </ControlTemplate>
+                               PageTransition="{TemplateBinding PageTransition}"/>
-  </Setter>
+          </Border>
-</Style>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>

src/Avalonia.Themes.Fluent/Controls/CheckBox.xaml

@@ -1,297 +1,293 @@
-<Style xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-       Selector="CheckBox">
+    <Design.PreviewWith>
-  <Design.PreviewWith>
+      <Border Padding="20">
-    <Border Padding="20">
+        <CheckBox IsThreeState="True" IsChecked="True" Content="Content" Foreground="Gold" />
-      <CheckBox IsThreeState="True" IsChecked="True" Content="Content" Foreground="Gold" />
+      </Border>
-    </Border>
+    </Design.PreviewWith>
-  </Design.PreviewWith>
+
-  
+    <ControlTheme x:Key="{x:Type CheckBox}" TargetType="CheckBox">
-  <Setter Property="Padding" Value="8,0,0,0" />
+      <Setter Property="Padding" Value="8,0,0,0" />
-  <Setter Property="HorizontalAlignment" Value="Left" />
+      <Setter Property="HorizontalAlignment" Value="Left" />
-  <Setter Property="VerticalAlignment" Value="Center" />
+      <Setter Property="VerticalAlignment" Value="Center" />
-  <Setter Property="HorizontalContentAlignment" Value="Left" />
+      <Setter Property="HorizontalContentAlignment" Value="Left" />
-  <Setter Property="VerticalContentAlignment" Value="Center" />    
+      <Setter Property="VerticalContentAlignment" Value="Center" />
-  <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-  <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-  <Setter Property="MinHeight" Value="32" />
+      <Setter Property="MinHeight" Value="32" />
-  <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUnchecked}" />
+      <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUnchecked}" />
-  <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUnchecked}" />
+      <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUnchecked}" />
-  <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUnchecked}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUnchecked}" />
-  <Setter Property="Template">
+      <Setter Property="Template">
-    <ControlTemplate>
+        <ControlTemplate>
-      <Grid x:Name="RootGrid" ColumnDefinitions="20,*">
+          <Grid x:Name="RootGrid" ColumnDefinitions="20,*">
-        <Border x:Name="PART_Border"
+            <Border x:Name="PART_Border"
-                Grid.ColumnSpan="2"
+                    Grid.ColumnSpan="2"
-                Background="{TemplateBinding Background}"
+                    Background="{TemplateBinding Background}"
-                BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
-                BorderThickness="{TemplateBinding BorderThickness}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
-                CornerRadius="{TemplateBinding CornerRadius}" />
+                    CornerRadius="{TemplateBinding CornerRadius}" />
-
+
-        <Grid VerticalAlignment="Top" Height="32">
+            <Grid VerticalAlignment="Top" Height="32">
-          <Border x:Name="NormalRectangle"
+              <Border x:Name="NormalRectangle"
-              BorderThickness="{DynamicResource CheckBoxBorderThemeThickness}"
+                      BorderBrush="{DynamicResource CheckBoxCheckBackgroundStrokeUnchecked}"
-              CornerRadius="{TemplateBinding CornerRadius}"
+                      Background="{DynamicResource CheckBoxCheckBackgroundFillUnchecked}"
-              UseLayoutRounding="False"
+                      BorderThickness="{DynamicResource CheckBoxBorderThemeThickness}"
-              Height="20"
+                      CornerRadius="{TemplateBinding CornerRadius}"
-              Width="20" />
+                      UseLayoutRounding="False"
-
+                      Height="20"
-          <Viewbox UseLayoutRounding="False">
+                      Width="20" />
-            <Panel>
+
-              <Panel Height="16" Width="16" />
+              <Viewbox UseLayoutRounding="False">
-              <Path x:Name="CheckGlyph" Stretch="Uniform" VerticalAlignment="Center" />
+                <Panel>
-            </Panel>
+                  <Panel Height="16" Width="16" />
-          </Viewbox>
+                  <Path x:Name="CheckGlyph" 
-        </Grid>
+                        Opacity="0" 
-        <ContentPresenter x:Name="ContentPresenter"
+                        Fill="{DynamicResource CheckBoxCheckGlyphForegroundUnchecked}" 
-                        ContentTemplate="{TemplateBinding ContentTemplate}"
+                        Stretch="Uniform" 
-                        Content="{TemplateBinding Content}"
+                        VerticalAlignment="Center" />
-                        Margin="{TemplateBinding Padding}"
+                </Panel>
-                        RecognizesAccessKey="True"
+              </Viewbox>
-                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+            </Grid>
-                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+            <ContentPresenter x:Name="ContentPresenter"
-                        Grid.Column="1" />
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
-        <!-- TODO: TextWrapping="Wrap" on contentpresenter -->
+                            Content="{TemplateBinding Content}"
-      </Grid>
+                            Margin="{TemplateBinding Padding}"
-    </ControlTemplate>
+                            RecognizesAccessKey="True"
-  </Setter>
+                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-
+                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-  <!-- Unchecked Normal State -->
+                            Grid.Column="1" />
-  <Style Selector="^ /template/ Border#NormalRectangle">
+            <!-- TODO: TextWrapping="Wrap" on contentpresenter -->
-    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUnchecked}" />
+          </Grid>
-    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUnchecked}" />
+        </ControlTemplate>
-  </Style>
+      </Setter>
-
+
-  <Style Selector="^ /template/ Path#CheckGlyph">
+      <!-- Unchecked PointerOver State -->
-    <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUnchecked}" />
+      <Style Selector="^:pointerover /template/">
-    <Setter Property="Opacity" Value="0" />
+        <Style Selector="^ ContentPresenter#ContentPresenter">
-  </Style>
+          <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUncheckedPointerOver}" />
-
+        </Style>
-  <!-- Unchecked PointerOver State -->
+
-  <Style Selector="^:pointerover">
+        <Style Selector="^ Border#PART_Border">
-    <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUncheckedPointerOver}" />
-      <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundUncheckedPointerOver}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUncheckedPointerOver}" />
-    </Style>
+        </Style>
-
+
-    <Style Selector="^ /template/ Border#PART_Border">
+        <Style Selector="^ Border#NormalRectangle">
-      <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundUncheckedPointerOver}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUncheckedPointerOver}" />
-      <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushUncheckedPointerOver}" />
+          <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUncheckedPointerOver}" />
-    </Style>
+        </Style>
-
+
-    <Style Selector="^ /template/ Border#NormalRectangle">
+        <Style Selector="^ Path#CheckGlyph">
-      <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeUncheckedPointerOver}" />
+          <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundUncheckedPointerOver}" />
-      <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillUncheckedPointerOver}" />
+        </Style>
-    </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}" />
       </Style>
 
-      <Style Selector="^ /template/ Border#PART_Border">
+      <!-- Unchecked Pressed State -->
-        <Setter Property="Background" Value="{DynamicResource CheckBoxBackgroundCheckedPointerOver}" />
+      <Style Selector="^:pressed /template/">
-        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxBorderBrushCheckedPointerOver}" />
+        <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">
+      <!-- Unchecked Disabled state -->
-        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckBackgroundStrokeCheckedPointerOver}" />
+      <Style Selector="^:disabled /template/">
-        <Setter Property="Background" Value="{DynamicResource CheckBoxCheckBackgroundFillCheckedPointerOver}" />
+        <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">
+      <Style Selector="^:checked">
-        <Setter Property="Fill" Value="{DynamicResource CheckBoxCheckGlyphForegroundCheckedPointerOver}" />
+        <!-- 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="^:indeterminate">
-    <Style Selector="^:pressed">
+        <!-- Indeterminate Normal State -->
-      <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
+        <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundIndeterminate}" />
-        <Setter Property="Foreground" Value="{DynamicResource CheckBoxForegroundCheckedPressed}" />
+        <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>
-
+    </ControlTheme>
-      <Style Selector="^ /template/ Border#PART_Border">
+</ResourceDictionary>
-        <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>

src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml

@@ -1,232 +1,228 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Design.PreviewWith>
+    <Design.PreviewWith>
-    <Border Padding="20">
+      <Border Padding="20">
-      <StackPanel Spacing="10">
+        <StackPanel Spacing="10">
-        <ComboBox PlaceholderText="Select an item">
+          <ComboBox PlaceholderText="Select an item">
-          <ComboBoxItem>Item 1</ComboBoxItem>
+            <ComboBoxItem>Item 1</ComboBoxItem>
-          <ComboBoxItem>Item 2</ComboBoxItem>
+            <ComboBoxItem>Item 2</ComboBoxItem>
-        </ComboBox>
+          </ComboBox>
-        <ComboBox IsEnabled="False"
+          <ComboBox IsEnabled="False" 
-                  Width="200"
+                    Width="200" 
-                  SelectedIndex="1"
+                    SelectedIndex="1" 
-                  HorizontalContentAlignment="Center">
+                    HorizontalContentAlignment="Center">
-          <ComboBoxItem>Item 1</ComboBoxItem>
+            <ComboBoxItem>Item 1</ComboBoxItem>
-          <ComboBoxItem>Item 2</ComboBoxItem>
+            <ComboBoxItem>Item 2</ComboBoxItem>
-        </ComboBox>
+          </ComboBox>
-      </StackPanel>
+        </StackPanel>
-    </Border>
+      </Border>
-  </Design.PreviewWith>
+    </Design.PreviewWith>
-  <Styles.Resources>
+  
     <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">
+    <ControlTheme x:Key="{x:Type ComboBox}" TargetType="ComboBox">
-    <Setter Property="Padding" Value="{DynamicResource ComboBoxPadding}" />
+      <Setter Property="Padding" Value="{DynamicResource ComboBoxPadding}" />
-    <Setter Property="FocusAdorner" Value="{x:Null}" />
+      <Setter Property="FocusAdorner" Value="{x:Null}" />
-    <Setter Property="MaxDropDownHeight" Value="504" />
+      <Setter Property="MaxDropDownHeight" Value="504" />
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxForeground}" />
+      <Setter Property="Foreground" Value="{DynamicResource ComboBoxForeground}" />
-    <Setter Property="Background" Value="{DynamicResource ComboBoxBackground}" />
+      <Setter Property="Background" Value="{DynamicResource ComboBoxBackground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrush}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrush}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource ComboBoxBorderThemeThickness}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource ComboBoxBorderThemeThickness}" />
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
+      <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
-    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
+      <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
-    <Setter Property="MinHeight" Value="{DynamicResource ComboBoxMinHeight}" />
+      <Setter Property="MinHeight" Value="{DynamicResource ComboBoxMinHeight}" />
-    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
+      <Setter Property="HorizontalContentAlignment" Value="Stretch" />
-    <Setter Property="VerticalContentAlignment" Value="Center" />
+      <Setter Property="VerticalContentAlignment" Value="Center" />
-    <Setter Property="HorizontalAlignment" Value="Left" />
+      <Setter Property="HorizontalAlignment" Value="Left" />
-    <Setter Property="VerticalAlignment" Value="Top" />    
+      <Setter Property="VerticalAlignment" Value="Top" />
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-    <Setter Property="PlaceholderForeground" Value="{DynamicResource ComboBoxPlaceHolderForeground}" />
+      <Setter Property="PlaceholderForeground" Value="{DynamicResource ComboBoxPlaceHolderForeground}" />
-    <Setter Property="Template">
+      <Setter Property="Template">
-      <ControlTemplate>
+        <ControlTemplate>
-        <DataValidationErrors>
+          <DataValidationErrors>
-          <Grid RowDefinitions="Auto, *, Auto"
+            <Grid RowDefinitions="Auto, *, Auto" ColumnDefinitions="*,32">
-                ColumnDefinitions="*,32">
+              <ContentPresenter x:Name="HeaderContentPresenter"
-            <ContentPresenter x:Name="HeaderContentPresenter"
+                                Grid.Row="0"
-                              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"
+                              Margin="{TemplateBinding Padding}"
-                              IsVisible="False"
+                              HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                              FontWeight="{DynamicResource ComboBoxHeaderThemeFontWeight}"
+                              VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
-                              Margin="{DynamicResource ComboBoxTopHeaderMargin}"
+              
-                              VerticalAlignment="Top" />
+              <Border x:Name="DropDownOverlay"
-            <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"
                       Grid.Row="1"
                       Grid.Column="1"
-                      UseLayoutRounding="False"
+                      Background="Transparent"
-                      IsHitTestVisible="False"
+                      Margin="0,1,1,1" 
-                      Height="12"
+                      Width="30" 
-                      Width="12"
+                      IsVisible="False" 
-                      Margin="0,0,10,0"
+                      HorizontalAlignment="Right" />
-                      HorizontalAlignment="Right"
+              
-                      VerticalAlignment="Center" />
+              <PathIcon x:Name="DropDownGlyph"
-
+                        Grid.Row="1"
-            <Popup Name="PART_Popup"
+                        Grid.Column="1"
-                   WindowManagerAddShadowHint="False"
+                        UseLayoutRounding="False"
-                   IsOpen="{TemplateBinding IsDropDownOpen, Mode=TwoWay}"
+                        IsHitTestVisible="False"
-                   MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
+                        Height="12"
-                   MaxHeight="{TemplateBinding MaxDropDownHeight}"
+                        Width="12"
-                   PlacementTarget="Background"
+                        Margin="0,0,10,0" 
-                   IsLightDismissEnabled="True"
+                        HorizontalAlignment="Right"
-                   InheritsTransform="True">
+                        VerticalAlignment="Center" />
-              <Border x:Name="PopupBorder"
+              
-                      Background="{DynamicResource ComboBoxDropDownBackground}"
+              <Popup Name="PART_Popup" 
-                      BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}"
+                     WindowManagerAddShadowHint="False"
-                      BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}"
+                     IsOpen="{TemplateBinding IsDropDownOpen, Mode=TwoWay}" 
-                      Margin="0,-1,0,-1"
+                     MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}" 
-                      Padding="{DynamicResource ComboBoxDropdownBorderPadding}"
+                     MaxHeight="{TemplateBinding MaxDropDownHeight}"
-                      HorizontalAlignment="Stretch"
+                     PlacementTarget="Background" 
-                      CornerRadius="{DynamicResource OverlayCornerRadius}">
+                     IsLightDismissEnabled="True" 
-                <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
+                     InheritsTransform="True">
-                              VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
+                <Border x:Name="PopupBorder"
-                  <ItemsPresenter Name="PART_ItemsPresenter"
+                        Background="{DynamicResource ComboBoxDropDownBackground}"
-                                  Items="{TemplateBinding Items}"
+                        BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}" 
-                                  Margin="{DynamicResource ComboBoxDropdownContentMargin}"
+                        BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}"
-                                  ItemsPanel="{TemplateBinding ItemsPanel}"
+                        Margin="0,-1,0,-1"
-                                  ItemTemplate="{TemplateBinding ItemTemplate}"
+                        Padding="{DynamicResource ComboBoxDropdownBorderPadding}"
-                                  VirtualizationMode="{TemplateBinding VirtualizationMode}" />
+                        HorizontalAlignment="Stretch"
-                </ScrollViewer>
+                        CornerRadius="{DynamicResource OverlayCornerRadius}">
-              </Border>
+                  <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
-            </Popup>
+                                VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
-          </Grid>
+                    <ItemsPresenter Name="PART_ItemsPresenter"
-        </DataValidationErrors>
+                                    Items="{TemplateBinding Items}" 
-      </ControlTemplate>
+                                    Margin="{DynamicResource ComboBoxDropdownContentMargin}" 
-    </Setter>
+                                    ItemsPanel="{TemplateBinding ItemsPanel}"
-  </Style>
+                                    ItemTemplate="{TemplateBinding ItemTemplate}" 
-
+                                    VirtualizationMode="{TemplateBinding VirtualizationMode}" />
-  <!--  Normal State  -->
+                  </ScrollViewer>
-  <Style Selector="ComboBox /template/ TextBlock#PlaceholderTextBlock">
+                </Border>
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxPlaceHolderForeground}" />
+              </Popup>
-  </Style>
+            </Grid>
-
+          </DataValidationErrors>
-  <Style Selector="ComboBox /template/ Border#HighlightBackground">
+        </ControlTemplate>
-    <Setter Property="IsVisible" Value="False" />
+      </Setter>
-  </Style>
+
-
+      <!--  Normal State  -->
-  <Style Selector="ComboBox /template/ PathIcon#DropDownGlyph">
+      <Style Selector="^ /template/">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForeground}" />
+        <Style Selector="^ TextBlock#PlaceholderTextBlock">
-    <Setter Property="Data" Value="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" />
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxPlaceHolderForeground}" />
-  </Style>
+        </Style>
-
+        <Style Selector="^ Border#HighlightBackground">
-  <!--  PointerOver State  -->
+          <Setter Property="IsVisible" Value="False" />
-  <Style Selector="ComboBox:pointerover /template/ Border#Background">
+        </Style>
-    <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundPointerOver}" />
+        <Style Selector="^ PathIcon#DropDownGlyph">
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushPointerOver}" />
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForeground}" />
-  </Style>
+          <Setter Property="Data" Value="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" />
-
+        </Style>
-  <!--  Pressed State  -->
+      </Style>
-  <Style Selector="ComboBox:pressed /template/ Border#Background">
+
-    <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundPressed}" />
+      <!--  PointerOver State  -->
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushPressed}" />
+      <Style Selector="^:pointerover /template/ Border#Background">
-  </Style>
+        <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundPointerOver}" />
-
+        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushPointerOver}" />
-  <!--  Disabled State  -->
+      </Style>
-  <Style Selector="ComboBox:disabled /template/ Border#Background">
+      
-    <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundDisabled}" />
+      <!--  Pressed State  -->
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushDisabled}" />
+      <Style Selector="^:pressed /template/ Border#Background">
-  </Style>
+        <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundPressed}" />
-
+        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushPressed}" />
-  <Style Selector="ComboBox:disabled /template/ ContentPresenter#HeaderContentPresenter">
+      </Style>
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
+      
-  </Style>
+      <!-- Error State -->
-
+      <Style Selector="^:error /template/ Border#Background">
-  <Style Selector="ComboBox:disabled /template/ ContentControl#ContentPresenter">
+        <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
+      </Style>
-  </Style>
+
-
+      <!--  Focus Pressed State  -->
-  <Style Selector="ComboBox:disabled /template/ TextBlock#PlaceholderTextBlock">
+      <Style Selector="^:focused:pressed /template/">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
+        <Style Selector="^ ContentControl#ContentPresenter">
-  </Style>
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocusedPressed}" />
-
+        </Style>
-  <Style Selector="ComboBox:disabled /template/ PathIcon#DropDownGlyph">
+        <Style Selector="^ TextBlock#PlaceholderTextBlock">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundDisabled}" />
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxPlaceHolderForegroundFocusedPressed}" />
-  </Style>
+        </Style>
-
+        <Style Selector="^ PathIcon#DropDownGlyph">
-  <!--  Focused State  -->
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundFocusedPressed}" />
-  <Style Selector="ComboBox:focus-visible /template/ Border#HighlightBackground">
+        </Style>
-    <Setter Property="IsVisible" Value="True" />
+      </Style>
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBackgroundBorderBrushFocused}" />
+
-  </Style>
+      <!--  Focused State  -->
-
+      <Style Selector="^:focus-visible /template/">
-  <Style Selector="ComboBox:focus-visible /template/ ContentControl#ContentPresenter">
+        <Style Selector="^ Border#HighlightBackground">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocused}" />
+          <Setter Property="IsVisible" Value="True" />
-  </Style>
+          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBackgroundBorderBrushFocused}" />
-
+        </Style>
-  <Style Selector="ComboBox:focus-visible /template/ TextBlock#PlaceholderTextBlock">
+        <Style Selector="^ ContentControl#ContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocused}" />
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocused}" />
-  </Style>
+        </Style>
-
+        <Style Selector="^ TextBlock#PlaceholderTextBlock">
-  <Style Selector="ComboBox:focus-visible /template/ PathIcon#DropDownGlyph">
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocused}" />
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundFocused}" />
+        </Style>
-  </Style>
+        <Style Selector="^ PathIcon#DropDownGlyph">
-
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundFocused}" />
-  <!--  Focus Pressed State  -->
+        </Style>
-  <Style Selector="ComboBox:focused:pressed /template/ ContentControl#ContentPresenter">
+      </Style>
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundFocusedPressed}" />
+
-  </Style>
+      <!--  Disabled State  -->
-
+      <Style Selector="^:disabled /template/">
-  <Style Selector="ComboBox:focused:pressed /template/ TextBlock#PlaceholderTextBlock">
+        <Style Selector="^ Border#Background">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxPlaceHolderForegroundFocusedPressed}" />
+          <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundDisabled}" />
-  </Style>
+          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushDisabled}" />
-
+        </Style>
-  <Style Selector="ComboBox:focused:pressed /template/ PathIcon#DropDownGlyph">
+        <Style Selector="^ ContentPresenter#HeaderContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForegroundFocusedPressed}" />
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
-  </Style>
+        </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 -->
+</ResourceDictionary>
-  <Style Selector="ComboBox:error /template/ Border#Background">
-    <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
-  </Style>
-</Styles>

src/Avalonia.Themes.Fluent/Controls/ComboBoxItem.xaml

@@ -1,90 +1,85 @@
-<Styles xmlns="https://github.com/avaloniaui">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-  <Design.PreviewWith>
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Border Padding="20">
+    <Design.PreviewWith>
-      <Border Background="{DynamicResource ComboBoxDropDownBackground}"
+      <Border Padding="20">
-              BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}"
+        <Border Background="{DynamicResource ComboBoxDropDownBackground}" BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}" BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}" Margin="0,-1,0,-1" Padding="{DynamicResource ComboBoxDropdownBorderPadding}" CornerRadius="{DynamicResource OverlayCornerRadius}">
-              BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}"
+          <StackPanel HorizontalAlignment="Stretch">
-              Margin="0,-1,0,-1"
+            <ComboBoxItem>Item 1</ComboBoxItem>
-              Padding="{DynamicResource ComboBoxDropdownBorderPadding}"
+            <ComboBoxItem>Item 2 long</ComboBoxItem>
-              CornerRadius="{DynamicResource OverlayCornerRadius}">
+            <ComboBoxItem IsSelected="True">Item 3</ComboBoxItem>
-        <StackPanel HorizontalAlignment="Stretch">
+            <ComboBoxItem IsEnabled="False">Item 4</ComboBoxItem>
-          <ComboBoxItem>Item 1</ComboBoxItem>
+          </StackPanel>
-          <ComboBoxItem>Item 2 long</ComboBoxItem>
+        </Border>
-          <ComboBoxItem IsSelected="True">Item 3</ComboBoxItem>
-          <ComboBoxItem IsEnabled="False">Item 4</ComboBoxItem>
-        </StackPanel>
       </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">
+      <!--  Selected state  -->
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForeground}" />
+      <Style Selector="^:selected">
-    <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackground}" />
+        <Style Selector="^ /template/ ContentPresenter">
-    <Setter Property="Padding" Value="{DynamicResource ComboBoxItemThemePadding}" />
+          <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelected}" />
-    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelected}" />
-    <Setter Property="Template">
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelected}" />
-      <ControlTemplate>
+        </Style>
-        <ContentPresenter Name="PART_ContentPresenter"
+        <!--  Selected Disabled state  -->
-                          Foreground="{TemplateBinding Foreground}"
+        <Style Selector="^:disabled /template/ ContentPresenter">
-                          Background="{TemplateBinding Background}"
+          <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedDisabled}" />
-                          BorderBrush="{TemplateBinding BorderBrush}"
+          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedDisabled}" />
-                          BorderThickness="{TemplateBinding BorderThickness}"
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedDisabled}" />
-                          CornerRadius="{TemplateBinding CornerRadius}"
+        </Style>
-                          ContentTemplate="{TemplateBinding ContentTemplate}"
+        <!--  Selected PointerOver state  -->
-                          Content="{TemplateBinding Content}"
+        <Style Selector="^:pointerover /template/ ContentPresenter">
-                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+          <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedPointerOver}" />
-                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedPointerOver}" />
-                          Padding="{TemplateBinding Padding}" />
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedPointerOver}" />
-      </ControlTemplate>
+        </Style>
-    </Setter>
+        <!--  Selected Pressed state  -->
-  </Style>
+        <Style Selector="^:pressed /template/ ContentPresenter">
-
+          <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedPressed}" />
-  <!--  PointerOver state  -->
+          <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedPressed}" />
-  <Style Selector="ComboBoxItem:pointerover /template/ ContentPresenter">
+          <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedPressed}" />
-    <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundPointerOver}" />
+        </Style>
-    <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushPointerOver}" />
+      </Style>
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxItemForegroundPointerOver}" />
+    </ControlTheme>
-  </Style>
+</ResourceDictionary>
-
-  <!--  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>

src/Avalonia.Themes.Fluent/Controls/Common.xaml

@@ -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>

src/Avalonia.Themes.Fluent/Controls/ContentControl.xaml

@@ -1,16 +1,19 @@
-<Style xmlns="https://github.com/avaloniaui" Selector="ContentControl">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-  <Setter Property="Template">
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTemplate>
+    <ControlTheme x:Key="{x:Type ContentControl}" TargetType="ContentControl">
-      <ContentPresenter Name="PART_ContentPresenter"
+      <Setter Property="Template">
-                        Background="{TemplateBinding Background}"
+        <ControlTemplate>
-                        BorderBrush="{TemplateBinding BorderBrush}"
+          <ContentPresenter Name="PART_ContentPresenter"
-                        BorderThickness="{TemplateBinding BorderThickness}"
+                            Background="{TemplateBinding Background}"
-                        CornerRadius="{TemplateBinding CornerRadius}"
+                            BorderBrush="{TemplateBinding BorderBrush}"
-                        ContentTemplate="{TemplateBinding ContentTemplate}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
-                        Content="{TemplateBinding Content}"
+                            CornerRadius="{TemplateBinding CornerRadius}"
-                        Padding="{TemplateBinding Padding}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
-                        VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                            Content="{TemplateBinding Content}"
-                        HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
+                            Padding="{TemplateBinding Padding}"
-    </ControlTemplate>
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-  </Setter>
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
-</Style>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>

src/Avalonia.Themes.Fluent/Controls/ContextMenu.xaml

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

src/Avalonia.Themes.Fluent/Controls/DataValidationErrors.xaml

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

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>
+    <Design.PreviewWith>
-    <Border Padding="20">
+      <Border Padding="20">
-      <DatePicker CornerRadius="10" />
+        <DatePicker CornerRadius="10" />
-    </Border>
+      </Border>
-  </Design.PreviewWith>
+    </Design.PreviewWith>
-  
+
-  <Styles.Resources>
     <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-->
+    <!-- This is used for both the accept/dismiss & repeatbuttons in the presenter-->
-  <Style Selector=":is(Button).DateTimeFlyoutButtonStyle">
+    <ControlTheme x:Key="FluentDateTimePickerButton" TargetType="Button">
-    <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackground}" />
+      <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackground}" />
-    <Setter Property="HorizontalContentAlignment" Value="Center"/>
+      <Setter Property="HorizontalContentAlignment" Value="Center"/>
-    <Setter Property="VerticalContentAlignment" Value="Center"/>
+      <Setter Property="VerticalContentAlignment" Value="Center"/>
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="Template">
+      <Setter Property="Template">
-      <ControlTemplate>
+        <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}">
+          <Border Background="{TemplateBinding Background}">
-          <ContentPresenter x:Name="ContentPresenter"
+            <ContentPresenter x:Name="ContentPresenter"
-                  Background="{TemplateBinding Background}"
+                    Background="{TemplateBinding Background}"
-                  BorderBrush="{DynamicResource DateTimePickerFlyoutButtonBorderBrush}"
+                    BorderBrush="{DynamicResource DateTimePickerFlyoutButtonBorderBrush}"
-                  BorderThickness="{DynamicResource DateTimeFlyoutButtonBorderThickness}"
+                    BorderThickness="{DynamicResource DateTimeFlyoutButtonBorderThickness}"
-                  Content="{TemplateBinding Content}"
+                    Content="{TemplateBinding Content}"
-                  Foreground="{DynamicResource SystemControlHighlightAltBaseHighBrush}"
+                    Foreground="{DynamicResource SystemControlHighlightAltBaseHighBrush}"
-                  ContentTemplate="{TemplateBinding ContentTemplate}"
+                    ContentTemplate="{TemplateBinding ContentTemplate}"
-                  Padding="{TemplateBinding Padding}"
+                    Padding="{TemplateBinding Padding}"
-                  HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                  VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                  CornerRadius="{TemplateBinding CornerRadius}"/>
+                    CornerRadius="{TemplateBinding CornerRadius}"/>
-        </Border>
+          </Border>
-      </ControlTemplate>
+        </ControlTemplate>
-    </Setter>
+      </Setter>
-  </Style>
 
-  <Style Selector=":is(Button).DateTimeFlyoutButtonStyle:pointerover /template/ ContentPresenter">
+      <Style Selector="^:pointerover /template/ ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackgroundPointerOver}"/>
+        <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackgroundPointerOver}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerFlyoutButtonBorderBrushPointerOver}"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerFlyoutButtonBorderBrushPointerOver}"/>
-    <Setter Property="Foreground" Value="{DynamicResource DateTimePickerFlyoutButtonForegroundPointerOver}"/>
+        <Setter Property="Foreground" Value="{DynamicResource DateTimePickerFlyoutButtonForegroundPointerOver}"/>
-  </Style>
+      </Style>
 
-  <Style Selector=":is(Button).DateTimeFlyoutButtonStyle:pressed /template/ ContentPresenter">
+      <Style Selector="^:pressed /template/ ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackgroundPressed}"/>
+        <Setter Property="Background" Value="{DynamicResource DateTimePickerFlyoutButtonBackgroundPressed}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerFlyoutButtonBorderBrushPressed}"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerFlyoutButtonBorderBrushPressed}"/>
-    <Setter Property="Foreground" Value="{DynamicResource DateTimePickerFlyoutButtonForegroundPressed}"/>
+        <Setter Property="Foreground" Value="{DynamicResource DateTimePickerFlyoutButtonForegroundPressed}"/>
-  </Style>
+      </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">
+    <ControlTheme x:Key="FluentDateTimePickerDownButton" TargetType="RepeatButton" BasedOn="{StaticResource FluentDateTimePickerButton}">
-    <Setter Property="VerticalAlignment" Value="Top"/>
+      <Setter Property="VerticalAlignment" Value="Bottom"/>
-    <Setter Property="Height" Value="22" />
+      <Setter Property="Height" Value="22" />
-    <Setter Property="HorizontalAlignment" Value="Stretch" />
+      <Setter Property="HorizontalAlignment" Value="Stretch" />
-    <Setter Property="Focusable" Value="False" />
+      <Setter Property="Focusable" Value="False" />
-    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
+      <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
-    <Setter Property="Content">
+      <Setter Property="Content">
-      <Template>
+        <Template>
-        <Viewbox Height="10" Width="10" HorizontalAlignment="Center" VerticalAlignment="Center">
+          <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"/>
+            <Path Stroke="{Binding $parent[RepeatButton].Foreground}" StrokeThickness="1" Data="M 0,0 L 9,9 L 18,0"/>
-        </Viewbox>
+          </Viewbox>
-      </Template>
+        </Template>
-    </Setter>
+      </Setter>
-  </Style>
+    </ControlTheme>
-  <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>
 
-  <Style Selector="DatePicker">    
+    <ControlTheme x:Key="{x:Type DatePicker}" TargetType="DatePicker">
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-    <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForeground}" />
+      <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForeground}" />
-    <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackground}"/>
+      <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackground}"/>
-    <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrush}"/>
+      <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrush}"/>
-    <Setter Property="BorderThickness" Value="1"/>
+      <Setter Property="BorderThickness" Value="1"/>
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="HorizontalAlignment" Value="Left" />
+      <Setter Property="HorizontalAlignment" Value="Left" />
-    <Setter Property="VerticalAlignment" Value="Center" />
+      <Setter Property="VerticalAlignment" Value="Center" />
-    <Setter Property="Template">
+      <Setter Property="Template">
-      <ControlTemplate>
+        <ControlTemplate>
-        <DataValidationErrors>
+          <DataValidationErrors>
-          <Grid Name="LayoutRoot" Margin="{TemplateBinding Padding}" RowDefinitions="Auto,*">
+            <Grid Name="LayoutRoot" Margin="{TemplateBinding Padding}" RowDefinitions="Auto,*">
-            <ContentPresenter Name="HeaderContentPresenter" Grid.Row="0"
+              <ContentPresenter Name="HeaderContentPresenter" Grid.Row="0"
-                              Content="{TemplateBinding Header}"
+                                Content="{TemplateBinding Header}"
-                              ContentTemplate="{TemplateBinding HeaderTemplate}"
+                                Foreground="{DynamicResource DatePickerHeaderForeground}"
-                              Margin="{DynamicResource DatePickerTopHeaderMargin}"
+                                ContentTemplate="{TemplateBinding HeaderTemplate}"
-                              MaxWidth="{DynamicResource DatePickerThemeMaxWidth}"
+                                Margin="{DynamicResource DatePickerTopHeaderMargin}"
-                              HorizontalAlignment="Stretch"
+                                MaxWidth="{DynamicResource DatePickerThemeMaxWidth}"
-                              VerticalAlignment="Top"/>
+                                HorizontalAlignment="Stretch"
+                                VerticalAlignment="Top"/>
 
-            <Button Name="FlyoutButton" Grid.Row="1"
+              <Button Name="FlyoutButton" Grid.Row="1"
-                    Foreground="{TemplateBinding Foreground}"
+                      Foreground="{TemplateBinding Foreground}"
-                    Background="{TemplateBinding Background}"
+                      Background="{TemplateBinding Background}"
-                    BorderBrush="{TemplateBinding BorderBrush}"
+                      BorderBrush="{TemplateBinding BorderBrush}"
-                    BorderThickness="{TemplateBinding BorderThickness}"
+                      BorderThickness="{TemplateBinding BorderThickness}"
-                    CornerRadius="{TemplateBinding CornerRadius}"
+                      CornerRadius="{TemplateBinding CornerRadius}"
-                    IsEnabled="{TemplateBinding IsEnabled}"
+                      IsEnabled="{TemplateBinding IsEnabled}"
-                    MinWidth="{DynamicResource DatePickerThemeMinWidth}"
+                      MinWidth="{DynamicResource DatePickerThemeMinWidth}"
-                    MaxWidth="{DynamicResource DatePickerThemeMaxWidth}"
+                      MaxWidth="{DynamicResource DatePickerThemeMaxWidth}"
-                    HorizontalAlignment="Stretch"
+                      HorizontalAlignment="Stretch"
-                    VerticalAlignment="Stretch"
+                      VerticalAlignment="Stretch"
-                    HorizontalContentAlignment="Stretch"
+                      HorizontalContentAlignment="Stretch"
-                    VerticalContentAlignment="Stretch"
+                      VerticalContentAlignment="Stretch"
-                    TemplatedControl.IsTemplateFocusTarget="True">
+                      TemplatedControl.IsTemplateFocusTarget="True">
-              <Button.Template>
+                <Button.Template>
-                <ControlTemplate>
+                  <ControlTemplate>
-                  <ContentPresenter Name="ContentPresenter"
+                    <ContentPresenter Name="ContentPresenter"
-                                    BorderBrush="{TemplateBinding BorderBrush}"
+                                      BorderBrush="{TemplateBinding BorderBrush}"
-                                    Background="{TemplateBinding Background}"
+                                      Background="{TemplateBinding Background}"
-                                    BorderThickness="{TemplateBinding BorderThickness}"
+                                      BorderThickness="{TemplateBinding BorderThickness}"
-                                    Content="{TemplateBinding Content}"
+                                      Content="{TemplateBinding Content}"
-                                    Foreground="{TemplateBinding Foreground}"
+                                      Foreground="{TemplateBinding Foreground}"
-                                    HorizontalContentAlignment="Stretch"
+                                      HorizontalContentAlignment="Stretch"
-                                    VerticalContentAlignment="Stretch"
+                                      VerticalContentAlignment="Stretch"
-                                    CornerRadius="{TemplateBinding CornerRadius}"/>
+                                      CornerRadius="{TemplateBinding CornerRadius}"/>
-                </ControlTemplate>
+                  </ControlTemplate>
-              </Button.Template>
+                </Button.Template>
-              <Grid Name="ButtonContentGrid" ColumnDefinitions="78*,Auto,132*,Auto,78*">
+                <Grid Name="ButtonContentGrid" ColumnDefinitions="78*,Auto,132*,Auto,78*">
-                <TextBlock Name="DayText" Text="day" HorizontalAlignment="Center"
+                  <TextBlock Name="DayText" Text="day" HorizontalAlignment="Center"
-                           Padding="{DynamicResource DatePickerHostPadding}"
+                             Padding="{DynamicResource DatePickerHostPadding}"
-                           FontFamily="{TemplateBinding FontFamily}"
+                             FontFamily="{TemplateBinding FontFamily}"
-                           FontWeight="{TemplateBinding FontWeight}"
+                             FontWeight="{TemplateBinding FontWeight}"
-                           FontSize="{TemplateBinding FontSize}"/>
+                             FontSize="{TemplateBinding FontSize}"/>
-                <TextBlock Name="MonthText" Text="month" TextAlignment="Left"
+                  <TextBlock Name="MonthText" Text="month" TextAlignment="Left"
-                           Padding="{DynamicResource DatePickerHostMonthPadding}"
+                             Padding="{DynamicResource DatePickerHostMonthPadding}"
-                           FontFamily="{TemplateBinding FontFamily}"
+                             FontFamily="{TemplateBinding FontFamily}"
-                           FontWeight="{TemplateBinding FontWeight}"
+                             FontWeight="{TemplateBinding FontWeight}"
-                           FontSize="{TemplateBinding FontSize}"/>
+                             FontSize="{TemplateBinding FontSize}"/>
-                <TextBlock Name="YearText" Text="year" HorizontalAlignment="Center"
+                  <TextBlock Name="YearText" Text="year" HorizontalAlignment="Center"
-                           Padding="{DynamicResource DatePickerHostPadding}"
+                             Padding="{DynamicResource DatePickerHostPadding}"
-                           FontFamily="{TemplateBinding FontFamily}"
+                             FontFamily="{TemplateBinding FontFamily}"
-                           FontWeight="{TemplateBinding FontWeight}"
+                             FontWeight="{TemplateBinding FontWeight}"
-                           FontSize="{TemplateBinding FontSize}"/>
+                             FontSize="{TemplateBinding FontSize}"/>
-                <Rectangle x:Name="FirstSpacer"
+                  <Rectangle x:Name="FirstSpacer"
-                      Fill="{DynamicResource DatePickerSpacerFill}"
+                        Fill="{DynamicResource DatePickerSpacerFill}"
-                      HorizontalAlignment="Center"
+                        HorizontalAlignment="Center"
-                      Width="1"
+                        Width="1"
-                      Grid.Column="1" />
+                        Grid.Column="1" />
-                <Rectangle x:Name="SecondSpacer"
+                  <Rectangle x:Name="SecondSpacer"
-                      Fill="{DynamicResource DatePickerSpacerFill}"
+                        Fill="{DynamicResource DatePickerSpacerFill}"
-                      HorizontalAlignment="Center"
+                        HorizontalAlignment="Center"
-                      Width="1"
+                        Width="1"
-                      Grid.Column="3" />
+                        Grid.Column="3" />
-              </Grid>
+                </Grid>
-            </Button>
+              </Button>
 
-            <Popup Name="Popup" WindowManagerAddShadowHint="False"
+              <Popup Name="Popup" WindowManagerAddShadowHint="False"
-                   IsLightDismissEnabled="True" PlacementTarget="{TemplateBinding}"
+                     IsLightDismissEnabled="True" PlacementTarget="{TemplateBinding}"
-                   PlacementMode="Bottom">
+                     PlacementMode="Bottom">
-              <DatePickerPresenter Name="PickerPresenter" />
+                <DatePickerPresenter Name="PickerPresenter" />
-            </Popup>
+              </Popup>
 
-          </Grid>
+            </Grid>
-        </DataValidationErrors>
+          </DataValidationErrors>
-      </ControlTemplate>
+        </ControlTemplate>
-    </Setter>
+      </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>
 
-  <Style Selector="DatePicker /template/ Button#FlyoutButton:pointerover /template/ ContentPresenter">
+      <Style Selector="^:disabled /template/ Rectangle">
-    <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushPointerOver}"/>
+        <Setter Property="Fill" Value="{DynamicResource DatePickerSpacerFillDisabled}"/>
-    <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundPointerOver}"/>
+      </Style>
-    <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundPointerOver}"/>
-  </Style>
 
-  <Style Selector="DatePicker /template/ Button#FlyoutButton:pressed /template/ ContentPresenter">
+      <!-- Changes foreground for watermark text when SelectedDate is null-->
-    <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushPressed}"/>
+      <Style Selector="^:hasnodate /template/ Button#FlyoutButton TextBlock">
-    <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundPressed}"/>
+        <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForeground}"/>
-    <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundPressed}"/>
+      </Style>
-  </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">
+        <Style Selector="^:pressed">
-    <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushDisabled}"/>
+          <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushPressed}"/>
-    <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundDisabled}"/>
+          <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundPressed}"/>
-    <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundDisabled}"/>
+          <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundPressed}"/>
-  </Style>
+        </Style>
 
-  <!-- Changes foreground for watermark text when SelectedDate is null-->
+        <Style Selector="^:disabled">
-  <Style Selector="DatePicker:hasnodate /template/ Button#FlyoutButton TextBlock">
+          <Setter Property="BorderBrush" Value="{DynamicResource DatePickerButtonBorderBrushDisabled}"/>
-    <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForeground}"/>
+          <Setter Property="Background" Value="{DynamicResource DatePickerButtonBackgroundDisabled}"/>
-  </Style>
+          <Setter Property="Foreground" Value="{DynamicResource DatePickerButtonForegroundDisabled}"/>
-  
+        </Style>
-  <Style Selector="DatePicker:error /template/ Button#FlyoutButton /template/ ContentPresenter">
+      </Style>
-    <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
+      <Style Selector="^:error /template/ Button#FlyoutButton">
-  </Style>
+        <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
-  
+      </Style>
+    </ControlTheme>
 
-  <!--WinUI: DatePickerFlyoutPresenter-->
+    <!--WinUI: DatePickerFlyoutPresenter-->
-  <Style Selector="DatePickerPresenter">
+    <ControlTheme x:Key="{x:Type DatePickerPresenter}" TargetType="DatePickerPresenter">
-    <Setter Property="Width" Value="296" />
+      <Setter Property="Width" Value="296" />
-    <Setter Property="MinWidth" Value="296" />
+      <Setter Property="MinWidth" Value="296" />
-    <Setter Property="MaxHeight" Value="398" />    
+      <Setter Property="MaxHeight" Value="398" />
-    <Setter Property="FontWeight" Value="Normal" />
+      <Setter Property="FontWeight" Value="Normal" />
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-    <Setter Property="Background" Value="{DynamicResource DatePickerFlyoutPresenterBackground}" />
+      <Setter Property="Background" Value="{DynamicResource DatePickerFlyoutPresenterBackground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource DatePickerFlyoutPresenterBorderBrush}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource DatePickerFlyoutPresenterBorderBrush}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource DateTimeFlyoutBorderThickness}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource DateTimeFlyoutBorderThickness}" />
-    <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
-    <Setter Property="Template">
+      <Setter Property="Template">
-      <ControlTemplate>
+        <ControlTemplate>
-        <Border Name="Background" Background="{TemplateBinding Background}"
+          <Border Name="Background" Background="{TemplateBinding Background}"
-                BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
-                BorderThickness="{TemplateBinding BorderThickness}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
-                Padding="{DynamicResource DateTimeFlyoutBorderPadding}"
+                  Padding="{DynamicResource DateTimeFlyoutBorderPadding}"
-                MaxHeight="398" CornerRadius="{TemplateBinding CornerRadius}">
+                  MaxHeight="398" CornerRadius="{TemplateBinding CornerRadius}">
-          <Grid Name="ContentRoot" RowDefinitions="*,Auto">
+            <Grid Name="ContentRoot" RowDefinitions="*,Auto">
-            <Grid Name="PickerContainer">
+              <Grid Name="PickerContainer">
-              <!--Column Definitions set in code, ignore here-->
+                <Grid.Styles>
-              <Panel Name="MonthHost">
+                  <Style Selector="DateTimePickerPanel > ListBoxItem">
-                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
+                    <Setter Property="Theme" Value="{StaticResource FluentDateTimePickerItem}" />
-                              VerticalScrollBarVisibility="Hidden">
+                  </Style>
-                  <DateTimePickerPanel Name="MonthSelector"
+                </Grid.Styles>
-                                      PanelType="Month"
+                <!--Column Definitions set in code, ignore here-->
-                                      ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
+                <Panel Name="MonthHost">
-                                      ShouldLoop="True" />
+                  <ScrollViewer HorizontalScrollBarVisibility="Disabled"
-                </ScrollViewer>
+                                VerticalScrollBarVisibility="Hidden">
-                <RepeatButton Name="MonthUpButton"
+                    <DateTimePickerPanel Name="MonthSelector"
-                              Classes="DateTimeFlyoutButtonStyle UpButton"/>
+                                         PanelType="Month"
-                <RepeatButton Name="MonthDownButton"
+                                         ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
-                              Classes="DateTimeFlyoutButtonStyle DownButton"/>
+                                         ShouldLoop="True" />
-              </Panel>
+                  </ScrollViewer>
-              <Panel Name="DayHost">
+                  <RepeatButton Name="MonthUpButton" Theme="{StaticResource FluentDateTimePickerUpButton}"/>
-                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
+                  <RepeatButton Name="MonthDownButton" Theme="{StaticResource FluentDateTimePickerDownButton}"/>
-                              VerticalScrollBarVisibility="Hidden">
+                </Panel>
-                  <DateTimePickerPanel Name="DaySelector"
+                <Panel Name="DayHost">
-                                      PanelType="Day"
+                  <ScrollViewer HorizontalScrollBarVisibility="Disabled"
-                                      ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
+                                VerticalScrollBarVisibility="Hidden">
-                                      ShouldLoop="True" />
+                    <DateTimePickerPanel Name="DaySelector"
-                </ScrollViewer>
+                                         PanelType="Day"
-                <RepeatButton Name="DayUpButton"
+                                         ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
-                              Classes="DateTimeFlyoutButtonStyle UpButton"/>
+                                         ShouldLoop="True" />
-                <RepeatButton Name="DayDownButton"
+                  </ScrollViewer>
-                              Classes="DateTimeFlyoutButtonStyle DownButton"/>
+                  <RepeatButton Name="DayUpButton" Theme="{StaticResource FluentDateTimePickerUpButton}"/>
-              </Panel>
+                  <RepeatButton Name="DayDownButton" Theme="{StaticResource FluentDateTimePickerDownButton}"/>
-              <Panel Name="YearHost">
+                </Panel>
-                <ScrollViewer HorizontalScrollBarVisibility="Disabled"
+                <Panel Name="YearHost">
-                              VerticalScrollBarVisibility="Hidden">
+                  <ScrollViewer HorizontalScrollBarVisibility="Disabled"
-                  <DateTimePickerPanel Name="YearSelector"
+                                VerticalScrollBarVisibility="Hidden">
-                                      PanelType="Year"
+                    <DateTimePickerPanel Name="YearSelector"
-                                      ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
+                                         PanelType="Year"
-                                      ShouldLoop="False" />
+                                         ItemHeight="{DynamicResource DatePickerFlyoutPresenterItemHeight}"
-                </ScrollViewer>
+                                         ShouldLoop="False" />
-                <RepeatButton Name="YearUpButton"
+                  </ScrollViewer>
-                              Classes="DateTimeFlyoutButtonStyle UpButton"/>
+                  <RepeatButton Name="YearUpButton" Theme="{StaticResource FluentDateTimePickerUpButton}"/>
-                <RepeatButton Name="YearDownButton"
+                  <RepeatButton Name="YearDownButton" Theme="{StaticResource FluentDateTimePickerDownButton}"/>
-                              Classes="DateTimeFlyoutButtonStyle DownButton"/>
+                </Panel>
-              </Panel>
+                <Rectangle Name="HighlightRect" IsHitTestVisible="False" ZIndex="-1"
-              <Rectangle Name="HighlightRect" IsHitTestVisible="False" ZIndex="-1"
+                           Fill="{DynamicResource DatePickerFlyoutPresenterHighlightFill}"
-                         Fill="{DynamicResource DatePickerFlyoutPresenterHighlightFill}"
+                           Grid.Column="0" Grid.ColumnSpan="5" VerticalAlignment="Center"
-                         Grid.Column="0" Grid.ColumnSpan="5" VerticalAlignment="Center"
+                           Height="{DynamicResource DatePickerFlyoutPresenterHighlightHeight}" />
-                         Height="{DynamicResource DatePickerFlyoutPresenterHighlightHeight}" />
+                <Rectangle Name="FirstSpacer"
-              <Rectangle Name="FirstSpacer"
+                           Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
-                         Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
+                           HorizontalAlignment="Center"
-                         HorizontalAlignment="Center"
+                           Width="{DynamicResource DatePickerSpacerThemeWidth}"
-                         Width="{DynamicResource DatePickerSpacerThemeWidth}"
+                           Grid.Column="1" />
-                         Grid.Column="1" />
+                <Rectangle Name="SecondSpacer"
-              <Rectangle Name="SecondSpacer"
+                           Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
-                         Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
+                           HorizontalAlignment="Center"
-                         HorizontalAlignment="Center"
+                           Width="{DynamicResource DatePickerSpacerThemeWidth}"
-                         Width="{DynamicResource DatePickerSpacerThemeWidth}"
+                           Grid.Column="3" />
-                         Grid.Column="3" />
+              </Grid>
-            </Grid>
+              <Grid Grid.Row="1" Height="{DynamicResource DatePickerFlyoutPresenterAcceptDismissHostGridHeight}"
-            <Grid Grid.Row="1" Height="{DynamicResource DatePickerFlyoutPresenterAcceptDismissHostGridHeight}"
+                    Name="AcceptDismissGrid" ColumnDefinitions="*,*">
-                  Name="AcceptDismissGrid" ColumnDefinitions="*,*">
+                <Rectangle Height="{DynamicResource DatePickerSpacerThemeWidth}" VerticalAlignment="Top"
-              <Rectangle Height="{DynamicResource DatePickerSpacerThemeWidth}" VerticalAlignment="Top"
+                           Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
-                         Fill="{DynamicResource DatePickerFlyoutPresenterSpacerFill}"
+                           Grid.ColumnSpan="2"/>
-                         Grid.ColumnSpan="2"/>
+                <Button Name="AcceptButton" Grid.Column="0" Theme="{StaticResource FluentDateTimePickerButton}"
-              <Button Name="AcceptButton" Grid.Column="0" Classes="DateTimeFlyoutButtonStyle"
+                        HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                          HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                  <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
-                <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
+                        StrokeThickness="0.75" Data="M0.5,8.5 5,13.5 15.5,3" />
-                      StrokeThickness="0.75" Data="M0.5,8.5 5,13.5 15.5,3" />
+                </Button>
-              </Button>
+                <Button Name="DismissButton" Grid.Column="1" Theme="{StaticResource FluentDateTimePickerButton}"
-              <Button Name="DismissButton" Grid.Column="1" Classes="DateTimeFlyoutButtonStyle"
+                        FontSize="16" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                         FontSize="16" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                  <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
-                <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round"
+                        StrokeThickness="0.75" Data="M2,2 14,14 M2,14 14 2" />
-                      StrokeThickness="0.75" Data="M2,2 14,14 M2,14 14 2" />
+                </Button>
-              </Button>
+              </Grid>
             </Grid>
-          </Grid>
+          </Border>
-        </Border>
+        </ControlTemplate>
-      </ControlTemplate>
+      </Setter>
-    </Setter>
+
-  </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="DatePickerPresenter /template/ Panel RepeatButton">
-    <Setter Property="IsVisible" Value="False" />
-  </Style>
 
-  <Style Selector="DatePickerPresenter /template/ Panel:pointerover RepeatButton">
+</ResourceDictionary>
-    <Setter Property="IsVisible" Value="True" />
-  </Style>
-  
-</Styles>

src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml

@@ -1,103 +1,101 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        x:CompileBindings="True">
+                    x:CompileBindings="True">
-
+    <Design.PreviewWith>
-  <Design.PreviewWith>
+      <Border Padding="20">
-    <Border Padding="20">
+        <StackPanel Spacing="20">
-      <StackPanel Spacing="20">
+          <DropDownButton Content="Click Me!" />
-        <DropDownButton Content="Click Me!" />
+          <DropDownButton Content="Disabled" IsEnabled="False" />
-        <DropDownButton Content="Disabled" IsEnabled="False" />
+        </StackPanel>
-      </StackPanel>
+      </Border>
-    </Border>
+    </Design.PreviewWith>
-  </Design.PreviewWith>
-
-  <Styles.Resources>
-    <x:Double x:Key="DropDownButtonMinHeight">32</x:Double>
-  </Styles.Resources>
   
-  <Style Selector="DropDownButton">
+    <x:Double x:Key="DropDownButtonMinHeight">32</x:Double>
-    <Setter Property="Background" Value="{DynamicResource ButtonBackground}" />
+    
-    <Setter Property="Foreground" Value="{DynamicResource ButtonForeground}" />
+    <ControlTheme x:Key="{x:Type DropDownButton}" TargetType="DropDownButton">
-    <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrush}" />
+      <Setter Property="Background" Value="{DynamicResource ButtonBackground}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThemeThickness}" />
+      <Setter Property="Foreground" Value="{DynamicResource ButtonForeground}" />
-    <Setter Property="Padding" Value="{DynamicResource ButtonPadding}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrush}" />
-    <Setter Property="MinHeight" Value="{DynamicResource DropDownButtonMinHeight}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThemeThickness}" />
-    <Setter Property="HorizontalAlignment" Value="Left" />
+      <Setter Property="Padding" Value="{DynamicResource ButtonPadding}" />
-    <Setter Property="VerticalAlignment" Value="Center" />
+      <Setter Property="MinHeight" Value="{DynamicResource DropDownButtonMinHeight}" />
-    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
+      <Setter Property="HorizontalAlignment" Value="Left" />
-    <Setter Property="VerticalContentAlignment" Value="Center" />
+      <Setter Property="VerticalAlignment" Value="Center" />
-    <!--<Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
+      <Setter Property="HorizontalContentAlignment" Value="Stretch" />
-    <Setter Property="FocusVisualMargin" Value="-3" />-->
+      <Setter Property="VerticalContentAlignment" Value="Center" />
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="Template">
+      <Setter Property="Template">
-      <Setter.Value>
+        <Setter.Value>
-        <ControlTemplate>
+          <ControlTemplate>
-          <Border x:Name="RootBorder"
+            <Border x:Name="RootBorder" 
-                  Background="{TemplateBinding Background}"
+                    Background="{TemplateBinding Background}" 
-                  BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
-                  BorderThickness="{TemplateBinding BorderThickness}"
+                    BorderThickness="{TemplateBinding BorderThickness}" 
-                  CornerRadius="{TemplateBinding CornerRadius}"
+                    CornerRadius="{TemplateBinding CornerRadius}"
-                  ClipToBounds="True">
+                    ClipToBounds="True">
-            <Grid x:Name="InnerGrid">
+              <Grid x:Name="InnerGrid">
-              <Grid.ColumnDefinitions>
+                <Grid.ColumnDefinitions>
-                <ColumnDefinition Width="*" />
+                  <ColumnDefinition Width="*" />
-                <ColumnDefinition Width="Auto" />
+                  <ColumnDefinition Width="Auto" />
-              </Grid.ColumnDefinitions>
+                </Grid.ColumnDefinitions>
-
+                
-              <ContentPresenter x:Name="PART_ContentPresenter"
+                <ContentPresenter x:Name="PART_ContentPresenter" 
-                                Grid.Column="0"
+                                  Grid.Column="0" 
-                                Content="{TemplateBinding Content}"
+                                  Content="{TemplateBinding Content}" 
-                                ContentTemplate="{TemplateBinding ContentTemplate}"
+                                  ContentTemplate="{TemplateBinding ContentTemplate}"
-                                Padding="{TemplateBinding Padding}"
+                                  Padding="{TemplateBinding Padding}" 
-                                RecognizesAccessKey="True"
+                                  RecognizesAccessKey="True" 
-                                HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                  HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
+                                  VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
-
+                
-              <PathIcon x:Name="DropDownGlyph"
+                <PathIcon x:Name="DropDownGlyph"
-                        Grid.Column="1"
+                          Grid.Column="1" 
-                        UseLayoutRounding="False"
+                          UseLayoutRounding="False"
-                        IsHitTestVisible="False"
+                          IsHitTestVisible="False" 
-                        Height="12"
+                          Height="12" 
-                        Width="12"
+                          Width="12"
-                        Margin="0,0,10,0"
+                          Margin="0,0,10,0"
-                        HorizontalAlignment="Right"
+                          Data="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z"
-                        VerticalAlignment="Center" />
+                          HorizontalAlignment="Right"
-
+                          VerticalAlignment="Center" />
-            </Grid>
+              </Grid>
-          </Border>
+            </Border>
-        </ControlTemplate>
+          </ControlTemplate>
-      </Setter.Value>
+        </Setter.Value>
-    </Setter>
+      </Setter>
-  </Style>
+      
-
+      <!--  Normal State  -->
-  <!--  Normal State  -->
+      <Style Selector="^ /template/ PathIcon#DropDownGlyph">
-  <Style Selector="DropDownButton /template/ PathIcon#DropDownGlyph">
+        <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForeground}" />
-    <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForeground}" />
+      </Style>
-    <Setter Property="Data" Value="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" />
+      
-  </Style>
+      <!--  PointerOver State  -->
-
+      <Style Selector="^:pointerover /template/ Border#RootBorder">
-  <!--  PointerOver State  -->
+        <Setter Property="Background" Value="{DynamicResource ButtonBackgroundPointerOver}" />
-  <Style Selector="DropDownButton:pointerover /template/ Border#RootBorder">
+        <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushPointerOver}" />
-    <Setter Property="Background" Value="{DynamicResource ButtonBackgroundPointerOver}" />
+        <Setter Property="TextElement.Foreground" Value="{DynamicResource ButtonForegroundPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushPointerOver}" />
+      </Style>
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource ButtonForegroundPointerOver}" />
+      
-  </Style>
+      <!--  Pressed State  -->
-
+      <Style Selector="^:pressed /template/ Border#RootBorder">
-  <!--  Pressed State  -->
+        <Setter Property="Background" Value="{DynamicResource ButtonBackgroundPressed}" />
-  <Style Selector="DropDownButton:pressed  /template/ Border#RootBorder">
+        <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushPressed}" />
-    <Setter Property="Background" Value="{DynamicResource ButtonBackgroundPressed}" />
+        <Setter Property="TextElement.Foreground" Value="{DynamicResource ButtonForegroundPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushPressed}" />
+      </Style>
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource ButtonForegroundPressed}" />
-  </Style>
 
-  <!--  Disabled State  -->
+      <!--  Disabled State  -->
-  <Style Selector="DropDownButton:disabled /template/ Border#RootBorder">
+      <Style Selector="^:disabled /template/ Border#RootBorder">
-    <Setter Property="Background" Value="{DynamicResource ButtonBackgroundDisabled}" />
+        <Setter Property="Background" Value="{DynamicResource ButtonBackgroundDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushDisabled}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushDisabled}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource ButtonForegroundDisabled}" />
+        <Setter Property="TextElement.Foreground" Value="{DynamicResource ButtonForegroundDisabled}" />
-  </Style>
+      </Style>
-  <Style Selector="DropDownButton:disabled /template/ PathIcon#DropDownGlyph">
+      <Style Selector="^:disabled /template/ PathIcon#DropDownGlyph">
-    <Setter Property="Foreground" Value="{DynamicResource ButtonForegroundDisabled}" />
+        <Setter Property="Foreground" Value="{DynamicResource ButtonForegroundDisabled}" />
-  </Style>
+      </Style>
 
-</Styles>
+      <Style Selector="^:pressed">
+        <Setter Property="RenderTransform" Value="scale(0.98)" />
+      </Style>
+    </ControlTheme>
+  
+</ResourceDictionary>

src/Avalonia.Themes.Fluent/Controls/EmbeddableControlRoot.xaml

@@ -1,19 +1,23 @@
-<Style xmlns="https://github.com/avaloniaui" Selector="EmbeddableControlRoot">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-  <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltHighBrush}"/>
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}"/>
+    <ControlTheme x:Key="{x:Type EmbeddableControlRoot}" TargetType="EmbeddableControlRoot">
-  <Setter Property="Template">
+      <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltHighBrush}"/>
-    <ControlTemplate>
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}"/>
-      <Panel>
+      <Setter Property="Template">
-        <Border Name="PART_TransparencyFallback" IsHitTestVisible="False" />
+        <ControlTemplate>
-        <Border Background="{TemplateBinding Background}">
+          <Panel>
-          <VisualLayerManager>
+            <Border Name="PART_TransparencyFallback" IsHitTestVisible="False" />
-            <ContentPresenter Name="PART_ContentPresenter"
+            <Border Background="{TemplateBinding Background}">
-                              ContentTemplate="{TemplateBinding ContentTemplate}"
+              <VisualLayerManager>
-                              Content="{TemplateBinding Content}"
+                <ContentPresenter Name="PART_ContentPresenter"
-                              Margin="{TemplateBinding Padding}"/>
+                                  ContentTemplate="{TemplateBinding ContentTemplate}"
-          </VisualLayerManager>
+                                  Content="{TemplateBinding Content}"
-        </Border>
+                                  Margin="{TemplateBinding Padding}"/>
-      </Panel>
+              </VisualLayerManager>
-    </ControlTemplate>
+            </Border>
-  </Setter>
+          </Panel>
-</Style>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+
+</ResourceDictionary>

src/Avalonia.Themes.Fluent/Controls/Expander.xaml

@@ -1,6 +1,6 @@
-<Styles xmlns="https://github.com/avaloniaui" 
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        x:CompileBindings="True">
+                    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="ExpanderHeaderPadding">16</Thickness>
+  <Thickness x:Key="ExpanderContentPadding">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="ExpanderDropdownLeftBorderThickness">1,1,0,1</Thickness>
-    <Thickness x:Key="ExpanderDropdownUpBorderThickness">1,1,1,0</Thickness>
+  <Thickness x:Key="ExpanderDropdownUpBorderThickness">1,1,1,0</Thickness>
-    <Thickness x:Key="ExpanderDropdownRightBorderThickness">0,1,1,1</Thickness>
+  <Thickness x:Key="ExpanderDropdownRightBorderThickness">0,1,1,1</Thickness>
-    <Thickness x:Key="ExpanderDropdownDownBorderThickness">1,0,1,1</Thickness>
+  <Thickness x:Key="ExpanderDropdownDownBorderThickness">1,0,1,1</Thickness>
 
-    <SolidColorBrush x:Key="ExpanderBackground" Color="{DynamicResource SystemAltMediumHighColor}" />
+  <SolidColorBrush x:Key="ExpanderBackground" Color="{DynamicResource SystemAltMediumHighColor}" />
-    <SolidColorBrush x:Key="ExpanderBorderBrush" Color="{DynamicResource SystemBaseLowColor}" />
+  <SolidColorBrush x:Key="ExpanderBorderBrush" Color="{DynamicResource SystemBaseLowColor}" />
 
-    <SolidColorBrush x:Key="ExpanderDropDownBackground" Color="{DynamicResource SystemChromeMediumLowColor}" />
+  <SolidColorBrush x:Key="ExpanderDropDownBackground" Color="{DynamicResource SystemChromeMediumLowColor}" />
-    <SolidColorBrush x:Key="ExpanderDropDownBorderBrush" Color="{DynamicResource SystemBaseLowColor}" />
+  <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}" />
+  <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>
 
-  <Style Selector="Expander /template/ ToggleButton#ExpanderHeader">
+  <ControlTheme x:Key="FluentExpanderToggleButtonTheme" TargetType="ToggleButton" BasedOn="{StaticResource {x:Type ToggleButton}}">
-    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
     <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="^[Tag=Expanded] /template/ Border#ExpandCollapseChevronBorder">
-  <Style Selector="Expander /template/ ToggleButton#ExpanderHeader:pressed">
+      <Style.Animations>
-    <Setter Property="RenderTransform" Value="{x:Null}" />
+        <Animation FillMode="Both" Duration="0:0:0.0625">
-  </Style>
+          <KeyFrame Cue="100%">
-
+            <Setter Property="RotateTransform.Angle" Value="180" />
-  <Style Selector="Expander:left /template/ ToggleButton#ExpanderHeader, Expander:right /template/ ToggleButton#ExpanderHeader">
+          </KeyFrame>
-    <Setter Property="VerticalAlignment" Value="Stretch" />
+        </Animation>
-  </Style>
+      </Style.Animations>
-
+    </Style>
-
+    <Style Selector="^[Tag=NotExpanded] /template/ Border#ExpandCollapseChevronBorder">
-  <Style Selector="Expander /template/ ToggleButton#ExpanderHeader /template/ Border#ToggleButtonBackground">
+      <Style.Animations>
-    <Setter Property="Background" Value="{TemplateBinding Background}" />
+        <Animation FillMode="Both" Duration="0:0:0.0625">
-    <Setter Property="BorderBrush" Value="{TemplateBinding BorderBrush}" />
+          <KeyFrame Cue="0%">
-    <Setter Property="BorderThickness" Value="{TemplateBinding BorderThickness}" />
+            <Setter Property="RotateTransform.Angle" Value="180" />
-  </Style>
+          </KeyFrame>
-
+          <KeyFrame Cue="100%">
-  <Style Selector="Expander:not(:expanded) /template/ ToggleButton#ExpanderHeader /template/ Border#ToggleButtonBackground">
+            <Setter Property="RotateTransform.Angle" Value="0" />
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius}" />
+          </KeyFrame>
-  </Style>
+        </Animation>
-  <Style Selector="Expander:expanded:up /template/ ToggleButton#ExpanderHeader /template/ Border#ToggleButtonBackground">
+      </Style.Animations>
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource BottomCornerRadiusFilterConverter}}" />
+    </Style>
-  </Style>
+  </ControlTheme>
-  <Style Selector="Expander:expanded:up /template/ Border#ExpanderContent">
+  <ControlTheme x:Key="FluentExpanderToggleButtonUpTheme" TargetType="ToggleButton" BasedOn="{StaticResource FluentExpanderToggleButtonTheme}">
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource TopCornerRadiusFilterConverter}}" />
+    <Style Selector="^ /template/ Path#ExpandCollapseChevron">
-  </Style>
+      <Setter Property="Data" Value="M 0 7 L 7 0 L 14 7" />
-  <Style Selector="Expander:expanded:down /template/ ToggleButton#ExpanderHeader /template/ Border#ToggleButtonBackground">
+    </Style>
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource TopCornerRadiusFilterConverter}}" />
+  </ControlTheme>
-  </Style>
+  <ControlTheme x:Key="FluentExpanderToggleButtonDownTheme" TargetType="ToggleButton" BasedOn="{StaticResource FluentExpanderToggleButtonTheme}">
-  <Style Selector="Expander:expanded:down /template/ Border#ExpanderContent">
+    <Style Selector="^ /template/ Path#ExpandCollapseChevron">
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource BottomCornerRadiusFilterConverter}}" />
+      <Setter Property="Data" Value="M 0 0 L 7 7 L 14 0" />
-  </Style>
+    </Style>
-  <Style Selector="Expander:expanded:left /template/ ToggleButton#ExpanderHeader /template/ Border#ToggleButtonBackground">
+  </ControlTheme>
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource RightCornerRadiusFilterConverter}}" />
+  <ControlTheme x:Key="FluentExpanderToggleButtonLeftTheme" TargetType="ToggleButton" BasedOn="{StaticResource FluentExpanderToggleButtonTheme}">
-  </Style>
+    <Style Selector="^ /template/ Path#ExpandCollapseChevron">
-  <Style Selector="Expander:expanded:left /template/ Border#ExpanderContent">
+      <Setter Property="Data" Value="M 7 0 L 0 7 L 7 14" />
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
+    </Style>
-  </Style>
+  </ControlTheme>
-  <Style Selector="Expander:expanded:right /template/ ToggleButton#ExpanderHeader /template/ Border#ToggleButtonBackground">
+  <ControlTheme x:Key="FluentExpanderToggleButtonRightTheme" TargetType="ToggleButton" BasedOn="{StaticResource FluentExpanderToggleButtonTheme}">
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
+    <Style Selector="^ /template/ Path#ExpandCollapseChevron">
-  </Style>
+      <Setter Property="Data" Value="M 0 0 L 7 7 L 0 14" />
-  <Style Selector="Expander:expanded:right /template/ Border#ExpanderContent">
+    </Style>
-    <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource RightCornerRadiusFilterConverter}}" />
+  </ControlTheme>
-  </Style>
+  <ControlTheme x:Key="{x:Type Expander}" TargetType="Expander">
-
+    <Setter Property="Background" Value="{DynamicResource ExpanderBackground}" />
-  <Style Selector="Expander:left /template/ ToggleButton#ExpanderHeader">
+    <Setter Property="BorderThickness" Value="{DynamicResource ExpanderBorderThickness}" />
-    <Setter Property="DockPanel.Dock" Value="Right" />
+    <Setter Property="BorderBrush" Value="{DynamicResource ExpanderBorderBrush}" />
-  </Style>
+    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-  <Style Selector="Expander:up /template/ ToggleButton#ExpanderHeader">
+    <Setter Property="Padding" Value="{DynamicResource ExpanderHeaderPadding}" />
-    <Setter Property="DockPanel.Dock" Value="Bottom" />
+    <Setter Property="HorizontalAlignment" Value="Stretch" />
-  </Style>
+    <Setter Property="HorizontalContentAlignment" Value="Left" />
-  <Style Selector="Expander:right /template/ ToggleButton#ExpanderHeader">
+    <Setter Property="VerticalContentAlignment" Value="Center" />
-    <Setter Property="DockPanel.Dock" Value="Left" />
+    <Setter Property="Template">
-  </Style>
+      <ControlTemplate>
-  <Style Selector="Expander:down /template/ ToggleButton#ExpanderHeader">
+        <DockPanel>
-    <Setter Property="DockPanel.Dock" Value="Top" />
+          <ToggleButton x:Name="ExpanderHeader"
-  </Style>
+                        Padding="{TemplateBinding Padding}"
-
+                        HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
-
+                        Background="{TemplateBinding Background}"
-  <Style Selector="Expander:expanded /template/ ToggleButton#ExpanderHeader /template/ Border#ExpandCollapseChevronBorder">
+                        BorderBrush="{TemplateBinding BorderBrush}"
-    <Style.Animations>
+                        BorderThickness="{TemplateBinding BorderThickness}"
-      <Animation FillMode="Both" Duration="0:0:0.0625">
+                        HorizontalContentAlignment="Stretch"
-        <KeyFrame Cue="100%">
+                        Content="{TemplateBinding Header}"
-          <Setter Property="RotateTransform.Angle" Value="180" />
+                        ContentTemplate="{TemplateBinding HeaderTemplate}"
-        </KeyFrame>
+                        IsChecked="{TemplateBinding IsExpanded, Mode=TwoWay}"
-      </Animation>
+                        IsEnabled="{TemplateBinding IsEnabled}"/>
-    </Style.Animations>
+          <Border x:Name="ExpanderContent"
-  </Style>
+                  Padding="{DynamicResource ExpanderContentPadding}"
-  <Style Selector="Expander:not(:expanded) /template/ ToggleButton#ExpanderHeader /template/ Border#ExpandCollapseChevronBorder">
+                  Background="{DynamicResource ExpanderDropDownBackground}"
-    <Style.Animations>
+                  BorderBrush="{DynamicResource ExpanderDropDownBorderBrush}"
-      <Animation FillMode="Both" Duration="0:0:0.0625">
+                  IsVisible="{TemplateBinding IsExpanded, Mode=TwoWay}">
-        <KeyFrame Cue="0%">
+            <ContentPresenter x:Name="PART_ContentPresenter"
-          <Setter Property="RotateTransform.Angle" Value="180" />
+                              HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-        </KeyFrame>
+                              VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-        <KeyFrame Cue="100%">
+                              Content="{TemplateBinding Content}"
-          <Setter Property="RotateTransform.Angle" Value="0" />
+                              ContentTemplate="{TemplateBinding ContentTemplate}" />
-        </KeyFrame>
+          </Border>
-      </Animation>
+        </DockPanel>
-    </Style.Animations>
+      </ControlTemplate>
-  </Style>
+    </Setter>
-
+ 
-  <Style Selector="Expander:left /template/ ToggleButton#ExpanderHeader /template/ Path#ExpandCollapseChevron">
+    <Style Selector="^ /template/ ToggleButton#ExpanderHeader:pressed">
-    <Setter Property="Data" Value="M 7 0 L 0 7 L 7 14" />
+      <Setter Property="RenderTransform" Value="{x:Null}" />
-  </Style>
+    </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 Selector="^:left /template/ ToggleButton#ExpanderHeader, ^:right /template/ ToggleButton#ExpanderHeader">
-  </Style>
+      <Setter Property="VerticalAlignment" Value="Stretch" />
-  <Style Selector="Expander:right /template/ ToggleButton#ExpanderHeader /template/ Path#ExpandCollapseChevron">
+    </Style>
-    <Setter Property="Data" Value="M 0 0 L 7 7 L 0 14" />
+
-  </Style>
+    <Style Selector="^:not(:expanded) /template/ ToggleButton#ExpanderHeader">
-  <Style Selector="Expander:down /template/ ToggleButton#ExpanderHeader /template/ Path#ExpandCollapseChevron">
+      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius}" />
-    <Setter Property="Data" Value="M 0 0 L 7 7 L 14 0" />
+    </Style>
-  </Style>
+    <Style Selector="^:expanded:up /template/ ToggleButton#ExpanderHeader">
-
+      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource BottomCornerRadiusFilterConverter}}" />
-
+    </Style>
-  <Style Selector="Expander:left /template/ Border#ExpanderContent">
+    <Style Selector="^:expanded:up /template/ Border#ExpanderContent">
-    <Setter Property="BorderThickness" Value="{DynamicResource ExpanderDropdownLeftBorderThickness}" />
+      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource TopCornerRadiusFilterConverter}}" />
-  </Style>
+    </Style>
-  <Style Selector="Expander:up /template/ Border#ExpanderContent">
+    <Style Selector="^:expanded:down /template/ ToggleButton#ExpanderHeader">
-    <Setter Property="BorderThickness" Value="{DynamicResource ExpanderDropdownUpBorderThickness}" />
+      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource TopCornerRadiusFilterConverter}}" />
-  </Style>
+    </Style>
-  <Style Selector="Expander:right /template/ Border#ExpanderContent">
+    <Style Selector="^:expanded:down /template/ Border#ExpanderContent">
-    <Setter Property="BorderThickness" Value="{DynamicResource ExpanderDropdownRightBorderThickness}" />
+      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource BottomCornerRadiusFilterConverter}}" />
-  </Style>
+    </Style>
-  <Style Selector="Expander:down /template/ Border#ExpanderContent">
+    <Style Selector="^:expanded:left /template/ ToggleButton#ExpanderHeader">
-    <Setter Property="BorderThickness" Value="{DynamicResource ExpanderDropdownDownBorderThickness}" />
+      <Setter Property="CornerRadius" Value="{Binding $parent[Expander].CornerRadius, Converter={StaticResource RightCornerRadiusFilterConverter}}" />
-  </Style>
+    </Style>
-</Styles>
+    <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>

src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml

@@ -1,70 +1,78 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<Styles
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:Class="Avalonia.Themes.Fluent.Controls.FluentControls"
-        x:Class="Avalonia.Themes.Fluent.Controls.FluentControls">
+    xmlns="https://github.com/avaloniaui"
-  <!-- Define ToolTip first so its styles can be overriden by other controls (e.g. TextBox) -->  
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ToolTip.xaml"/>
+    <Styles.Resources>
-  <!-- PathIcon also needs to be defined early so it can be overriden by other styles (e.g. ComboBox) -->
+        <ResourceDictionary>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/PathIcon.xaml" />
+            <ResourceDictionary.MergedDictionaries>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/DataValidationErrors.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Button.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/FocusAdorner.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/RadioButton.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Button.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Expander.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/CaptionButtons.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ProgressBar.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Carousel.xaml"/>  
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/AutoCompleteBox.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/CheckBox.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ComboBox.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Calendar.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ComboBoxItem.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/CalendarButton.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ContentControl.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/CalendarDatePicker.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/DropDownButton.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/CalendarDayButton.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Label.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/CalendarItem.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/GridSplitter.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/CaptionButtons.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ItemsControl.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Carousel.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ListBox.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/CheckBox.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ListBoxItem.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/FlyoutPresenter.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Menu.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/GridSplitter.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ContextMenu.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ItemsControl.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/MenuItem.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Label.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/OverlayPopupHost.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ListBox.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/PopupRoot.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ListBoxItem.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ProgressBar.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Menu.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/RadioButton.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/MenuFlyoutPresenter.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/RepeatButton.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/NativeMenuBar.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Separator.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/NotificationCard.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Slider.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/NumericUpDown.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ScrollBar.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/OverlayPopupHost.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/PopupRoot.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabStrip.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/PathIcon.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabStripItem.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/RepeatButton.xaml" />
-  <!-- TabControl needs to come after TabStrip as it redefines the inner TabStrip.ItemsPanel-->
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabControl.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Separator.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabItem.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabControl.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TextBox.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabItem.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ToggleButton.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabStrip.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TransitioningContentControl.xaml" />
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TabStripItem.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Expander.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ToggleButton.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TitleBar.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ToggleSwitch.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TreeView.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ToolTip.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TreeViewItem.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TitleBar.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/UserControl.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TransitioningContentControl.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Window.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/TreeView.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/EmbeddableControlRoot.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/WindowNotificationManager.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/CalendarButton.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Window.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/CalendarDayButton.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ComboBox.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/CalendarItem.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ComboBoxItem.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Calendar.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ContentControl.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/CalendarDatePicker.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/ContextMenu.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ButtonSpinner.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/DataValidationErrors.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/NumericUpDown.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/DatePicker.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/AutoCompleteBox.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/DropDownButton.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/WindowNotificationManager.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/EmbeddableControlRoot.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/NotificationCard.xaml"/>
+                <ResourceInclude Source="avares://Avalonia.Themes.Fluent/Controls/Slider.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/NativeMenuBar.xaml"/>
+            </ResourceDictionary.MergedDictionaries>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ToggleSwitch.xaml"/>
+        </ResourceDictionary>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitButton.xaml" />
+    </Styles.Resources>
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/SplitView.xaml"/>
+
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/DatePicker.xaml"/>
+    <!--  Define ToolTip first so its styles can be overriden by other controls (e.g. TextBox)  -->
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/TimePicker.xaml"/>
+    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/FocusAdorner.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/FlyoutPresenter.xaml"/>
+    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/MenuItem.xaml" />
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/MenuFlyoutPresenter.xaml"/>
+    <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ScrollBar.xaml" />
-  <!-- ManagedFileChooser comes last because it uses (and overrides) styles for a multitude of other controls...the dialogs were originally UserControls, after all-->
+    <!--  TabControl needs to come after TabStrip as it redefines the inner TabStrip.ItemsPanel  -->
-  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ManagedFileChooser.xaml"/>
+    <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>

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">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-  <Styles.Resources>
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Thickness x:Key="FlyoutBorderThemeThickness">1</Thickness>
+  <Thickness x:Key="FlyoutBorderThemeThickness">1</Thickness>
-  </Styles.Resources>
+  <ControlTheme x:Key="{x:Type FlyoutPresenter}" TargetType="FlyoutPresenter">
-  
-  <Style Selector="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>
+  </ControlTheme>
-</Styles>
+</ResourceDictionary>

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>

src/Avalonia.Themes.Fluent/Controls/GridSplitter.xaml

@@ -1,24 +1,22 @@
-<Styles xmlns="https://github.com/avaloniaui">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Style Selector="GridSplitter">
+    <ControlTheme x:Key="{x:Type GridSplitter}" TargetType="GridSplitter">
-    <Setter Property="Focusable" Value="True" />
+      <Setter Property="Focusable" Value="True" />
-    <Setter Property="MinWidth" Value="6" />
+      <Setter Property="MinWidth" Value="6" />
-    <Setter Property="MinHeight" Value="6" />
+      <Setter Property="MinHeight" Value="6" />
-    <Setter Property="Background" Value="{DynamicResource SystemAltMediumLowColor}" />
+      <Setter Property="Background" Value="{DynamicResource SystemAltMediumLowColor}" />
-    <Setter Property="PreviewContent">
+      <Setter Property="PreviewContent">
-      <Template>
+        <Template>
-        <Rectangle Fill="{DynamicResource SystemAccentColor}" />
+          <Rectangle Fill="{DynamicResource SystemAccentColor}" />
-      </Template>
+        </Template>
-    </Setter>
+      </Setter>
-    <Setter Property="Template">
+      <Setter Property="Template">
-      <ControlTemplate>
+        <ControlTemplate>
-        <Border 
+          <Border BorderBrush="{TemplateBinding BorderBrush}"
-          BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
-          BorderThickness="{TemplateBinding BorderThickness}"
+                  CornerRadius="{TemplateBinding CornerRadius}"
-          CornerRadius="{TemplateBinding CornerRadius}"
+                  Background="{TemplateBinding Background}" />
-          Background="{TemplateBinding Background}"/>
+        </ControlTemplate>
-      </ControlTemplate>
+      </Setter>
-    </Setter>
+    </ControlTheme>
-  </Style>
+</ResourceDictionary>
-
-</Styles>

src/Avalonia.Themes.Fluent/Controls/ItemsControl.xaml

@@ -1,16 +1,19 @@
-<Style xmlns="https://github.com/avaloniaui" Selector="ItemsControl">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-  <Setter Property="Template">
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTemplate>
+    <ControlTheme x:Key="{x:Type ItemsControl}" TargetType="ItemsControl">
-      <Border Background="{TemplateBinding Background}"
+      <Setter Property="Template">
-              BorderBrush="{TemplateBinding BorderBrush}"
+        <ControlTemplate>
-              BorderThickness="{TemplateBinding BorderThickness}"
+          <Border Background="{TemplateBinding Background}"
-              CornerRadius="{TemplateBinding CornerRadius}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
-              Padding="{TemplateBinding Padding}">
+                  BorderThickness="{TemplateBinding BorderThickness}"
-        <ItemsPresenter Name="PART_ItemsPresenter"
+                  CornerRadius="{TemplateBinding CornerRadius}"
-                        Items="{TemplateBinding Items}"
+                  Padding="{TemplateBinding Padding}">
-                        ItemsPanel="{TemplateBinding ItemsPanel}"
+            <ItemsPresenter Name="PART_ItemsPresenter"
-                        ItemTemplate="{TemplateBinding ItemTemplate}"/>
+                            Items="{TemplateBinding Items}"
-      </Border>
+                            ItemsPanel="{TemplateBinding ItemsPanel}"
-    </ControlTemplate>
+                            ItemTemplate="{TemplateBinding ItemTemplate}"/>
-  </Setter>
+          </Border>
-</Style>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>

src/Avalonia.Themes.Fluent/Controls/Label.xaml

@@ -1,18 +1,22 @@
-<Style xmlns="https://github.com/avaloniaui" Selector="Label">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-  <Setter Property="Padding" Value="3"/>
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Setter Property="Template">
+
-    <ControlTemplate>
+    <ControlTheme x:Key="{x:Type Label}" TargetType="Label">
-      <ContentPresenter Name="PART_ContentPresenter"
+      <Setter Property="Padding" Value="3"/>
-                        Background="{TemplateBinding Background}"
+      <Setter Property="Template">
-                        BorderBrush="{TemplateBinding BorderBrush}"
+        <ControlTemplate>
-                        BorderThickness="{TemplateBinding BorderThickness}"                        
+          <ContentPresenter Name="PART_ContentPresenter"
-                        CornerRadius="{TemplateBinding CornerRadius}"
+                            Background="{TemplateBinding Background}"
-                        ContentTemplate="{TemplateBinding ContentTemplate}"
+                            BorderBrush="{TemplateBinding BorderBrush}"
-                        Content="{TemplateBinding Content}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
-                        Padding="{TemplateBinding Padding}"
+                            CornerRadius="{TemplateBinding CornerRadius}"
-                        RecognizesAccessKey="True"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
-                        VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                            Content="{TemplateBinding Content}"
-                        HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
+                            Padding="{TemplateBinding Padding}"
-    </ControlTemplate>
+                            RecognizesAccessKey="True"
-  </Setter>
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-</Style>
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>

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">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-  <Design.PreviewWith>
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Border Padding="20">
+    <Design.PreviewWith>
-      <ListBox>
+      <Border Padding="20">
-        <ListBoxItem>Test</ListBoxItem>
+        <ListBox>
-        <ListBoxItem>Test</ListBoxItem>
+          <ListBoxItem>Test</ListBoxItem>
-        <ListBoxItem>Test</ListBoxItem>
+          <ListBoxItem>Test</ListBoxItem>
-        <ListBoxItem>Test</ListBoxItem>
+          <ListBoxItem>Test</ListBoxItem>
-      </ListBox>
+          <ListBoxItem>Test</ListBoxItem>
-    </Border>
+        </ListBox>
-  </Design.PreviewWith>
+      </Border>
-  <Style Selector="ListBox">
+    </Design.PreviewWith>
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}" />
+  
-    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
+    <ControlTheme x:Key="{x:Type ListBox}" TargetType="ListBox">
-    <Setter Property="BorderBrush" Value="{DynamicResource SystemControlForegroundBaseHighBrush}" />
+      <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource ListBoxBorderThemeThickness}" />
+      <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumLowBrush}" />
-    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
+      <Setter Property="BorderBrush" Value="{DynamicResource SystemControlForegroundBaseHighBrush}" />
-    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />        
+      <Setter Property="BorderThickness" Value="{DynamicResource ListBoxBorderThemeThickness}" />
-    <Setter Property="ScrollViewer.IsScrollChainingEnabled" Value="True" />        
+      <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />    
+      <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
-    <Setter Property="Template">
+      <Setter Property="ScrollViewer.IsScrollChainingEnabled" Value="True" />
-      <ControlTemplate>
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-        <Border Name="border"
+      <Setter Property="Template">
-                ClipToBounds="{TemplateBinding ClipToBounds}"
+        <ControlTemplate>
-                Background="{TemplateBinding Background}"
+          <Border Name="border"
-                BorderBrush="{TemplateBinding BorderBrush}"
+                  ClipToBounds="{TemplateBinding ClipToBounds}" 
-                BorderThickness="{TemplateBinding BorderThickness}"
+                  Background="{TemplateBinding Background}" 
-                CornerRadius="{TemplateBinding CornerRadius}">
+                  BorderBrush="{TemplateBinding BorderBrush}"
-          <ScrollViewer Name="PART_ScrollViewer"
+                  BorderThickness="{TemplateBinding BorderThickness}"
-                        HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}"
+                  CornerRadius="{TemplateBinding CornerRadius}">
-                        VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}"
+            <ScrollViewer Name="PART_ScrollViewer" 
-                        IsScrollChainingEnabled="{TemplateBinding (ScrollViewer.IsScrollChainingEnabled)}"
+                          HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}" 
-                        AllowAutoHide="{TemplateBinding (ScrollViewer.AllowAutoHide)}">
+                          VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}"
-            <ItemsPresenter Name="PART_ItemsPresenter"
+                          IsScrollChainingEnabled="{TemplateBinding (ScrollViewer.IsScrollChainingEnabled)}"
-                            Items="{TemplateBinding Items}"
+                          AllowAutoHide="{TemplateBinding (ScrollViewer.AllowAutoHide)}">
-                            ItemsPanel="{TemplateBinding ItemsPanel}"
+              <ItemsPresenter Name="PART_ItemsPresenter" 
-                            ItemTemplate="{TemplateBinding ItemTemplate}"
+                              Items="{TemplateBinding Items}" 
-                            Margin="{TemplateBinding Padding}"
+                              ItemsPanel="{TemplateBinding ItemsPanel}"
-                            VirtualizationMode="{TemplateBinding VirtualizationMode}"/>
+                              ItemTemplate="{TemplateBinding ItemTemplate}" 
-          </ScrollViewer>
+                              Margin="{TemplateBinding Padding}"
-        </Border>
+                              VirtualizationMode="{TemplateBinding VirtualizationMode}" />
-      </ControlTemplate>
+            </ScrollViewer>
-    </Setter>
+          </Border>
-  </Style>
+        </ControlTemplate>
-</Styles>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>

src/Avalonia.Themes.Fluent/Controls/ListBoxItem.xaml

@@ -1,94 +1,79 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Design.PreviewWith>
+    <Design.PreviewWith>
-    <Border Padding="0">
+      <Border Padding="0">
-      <ListBox>
+        <ListBox>
-        <ListBoxItem IsEnabled="False">Disabled</ListBoxItem>
+          <ListBoxItem IsEnabled="False">Disabled</ListBoxItem>
-        <ListBoxItem Background="#66000000"
+          <ListBoxItem Background="#66000000"
-                     Padding="20">
+                       Padding="20">
-          Test
+            Test
-        </ListBoxItem>
+          </ListBoxItem>
-        <ListBoxItem>Test</ListBoxItem>
+          <ListBoxItem>Test</ListBoxItem>
-      </ListBox>
+        </ListBox>
-    </Border>
+      </Border>
-  </Design.PreviewWith>
+    </Design.PreviewWith>
-  <Styles.Resources>
     <Thickness x:Key="ListBoxItemPadding">12,9,12,12</Thickness>
-  </Styles.Resources>
+    <ControlTheme x:Key="{x:Type ListBoxItem}" TargetType="ListBoxItem">
-  <Style Selector="ListBoxItem">
+      <Setter Property="Background" Value="Transparent" />
-    <Setter Property="Background" Value="Transparent" />
+      <Setter Property="Padding" Value="{DynamicResource ListBoxItemPadding}" />
-    <Setter Property="Padding" Value="{DynamicResource ListBoxItemPadding}" />
+      <Setter Property="Template">
-    <Setter Property="Template">
+        <ControlTemplate>
-      <ControlTemplate>
+          <ContentPresenter Name="PART_ContentPresenter"
-        <ContentPresenter Name="PART_ContentPresenter"
+                            Background="{TemplateBinding Background}"
-                          Background="{TemplateBinding Background}"
+                            BorderBrush="{TemplateBinding BorderBrush}"
-                          BorderBrush="{TemplateBinding BorderBrush}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
-                          BorderThickness="{TemplateBinding BorderThickness}"
+                            CornerRadius="{TemplateBinding CornerRadius}"
-                          CornerRadius="{TemplateBinding CornerRadius}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
-                          ContentTemplate="{TemplateBinding ContentTemplate}"
+                            Content="{TemplateBinding Content}"
-                          Content="{TemplateBinding Content}"
+                            FontWeight="Normal"
-                          Padding="{TemplateBinding Padding}"
+                            FontSize="{DynamicResource ControlContentThemeFontSize}"
-                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                            Padding="{TemplateBinding Padding}"
-                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" />
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-      </ControlTemplate>
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" />
-    </Setter>
+        </ControlTemplate>
-  </Style>
+      </Setter>
 
-  <Style Selector="ListBoxItem /template/ ContentPresenter#PART_ContentPresenter">
+      <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="FontWeight" Value="Normal" />
+        <Setter Property="Foreground" Value="{DynamicResource SystemControlDisabledBaseMediumLowBrush}" />
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+      </Style>
-  </Style>
 
-  <!--  Disabled State  -->
+      <!--  PointerOver State  -->
-  <Style Selector="ListBoxItem:disabled /template/ ContentPresenter#PART_ContentPresenter">
+      <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlDisabledBaseMediumLowBrush}" />
+        <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListLowBrush}" />
-  </Style>
+        <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
+      </Style>
 
-  <!--  PointerOver State  -->
+      <!--  Pressed State  -->
-  <Style Selector="ListBoxItem:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+      <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListLowBrush}" />
+        <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListMediumBrush}" />
-  </Style>
+        <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-  <Style Selector="ListBoxItem:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+      </Style>
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-  </Style>
 
-  <!--  Pressed State  -->
+      <!--  Selected State  -->
-  <Style Selector="ListBoxItem:pressed /template/ ContentPresenter#PART_ContentPresenter">
+      <Style Selector="^:selected">
-    <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListMediumBrush}" />
-  </Style>
-  <Style Selector="ListBoxItem:pressed /template/ ContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-  </Style>
 
-  <!--  Selected State  -->
+        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
-  <Style Selector="ListBoxItem:selected /template/ ContentPresenter#PART_ContentPresenter">
+          <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentLowBrush}" />
-    <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentLowBrush}" />
+          <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-  </Style>
+        </Style>
-  <Style Selector="ListBoxItem:selected /template/ ContentPresenter">
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-  </Style>
 
-  <!--  Selected Unfocused State  -->
+        <!--  Selected Unfocused State  -->
-  <Style Selector="ListBoxItem:selected:not(:focus) /template/ ContentPresenter#PART_ContentPresenter">
+        <Style Selector="^:not(:focus) /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentLowBrush}" />
+          <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentLowBrush}" />
-  </Style>
+          <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-  <Style Selector="ListBoxItem:selected:not(:focus) /template/ ContentPresenter#PART_ContentPresenter">
+        </Style>
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-  </Style>
 
-  <!--  Selected PointerOver State  -->
+        <!--  Selected PointerOver State  -->
-  <Style Selector="ListBoxItem:selected:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+        <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentMediumBrush}" />
+          <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentMediumBrush}" />
-  </Style>
+          <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-  <Style Selector="ListBoxItem:selected:pointerover /template/ ContentPresenter">
+        </Style>
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-  </Style>
 
-  <!--  Selected Pressed State  -->
+        <!--  Selected Pressed State  -->
-  <Style Selector="ListBoxItem:selected:pressed /template/ ContentPresenter#PART_ContentPresenter">
+        <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentHighBrush}" />
+          <Setter Property="Background" Value="{DynamicResource SystemControlHighlightListAccentHighBrush}" />
-  </Style>
+          <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
-  <Style Selector="ListBoxItem:selected:pressed /template/ ContentPresenter#PART_ContentPresenter">
+        </Style>
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}" />
+      </Style>
-  </Style>
+    </ControlTheme>
-</Styles>
+</ResourceDictionary>

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 Selector="dialogs|ManagedFileChooser">
-        <Style.Resources>
+    <Style.Resources>
-            <ResourceDictionary>
+      <ResourceDictionary>
-                <GradientStops x:Key="IconRes.FolderBackGradientStops">
+        <GradientStops x:Key="IconRes.FolderBackGradientStops">
-                </GradientStops>
+        </GradientStops>
-                <GradientStops x:Key="IconRes.FolderFrontGradientStops">
+        <GradientStops x:Key="IconRes.FolderFrontGradientStops">
-                    <GradientStop Offset="0" Color="#FFFFDA6F"/>
+          <GradientStop Offset="0" Color="#FFFFDA6F"/>
-                    <GradientStop Offset="1" Color="#FFFEC326"/>
+          <GradientStop Offset="1" Color="#FFFEC326"/>
-                </GradientStops>
+        </GradientStops>
-                <DrawingGroup x:Key="LevelUp">
+        <DrawingGroup x:Key="LevelUp">
-                    <GeometryDrawing Brush="#00FFFFFF" Geometry="F1M16,16L0,16 0,0 16,0z" />
+          <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="#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="#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="#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" />
+          <GeometryDrawing Brush="#FFF0EFF1" Geometry="F1M8.0001,1.9996L7.5001,3.0006 14.0001,3.0006 14.0001,1.9996z" />
-                </DrawingGroup>
+        </DrawingGroup>
-                <dialogs:ResourceSelectorConverter x:Key="Icons">
+        <dialogs:ResourceSelectorConverter x:Key="Icons">
-                    <DrawingGroup x:Key="Icon_Folder">
+          <DrawingGroup x:Key="Icon_Folder">
-                        <GeometryDrawing Geometry="M 0 0 L 16 16"/>
+            <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
+            <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>
+              <GeometryDrawing.Brush>
-                                <LinearGradientBrush StartPoint="1,4" EndPoint="23,20">
+                <LinearGradientBrush StartPoint="1,4" EndPoint="23,20">
-                                    <GradientStop Offset="0" Color="#FFFFC018"/>
+                  <GradientStop Offset="0" Color="#FFFFC018"/>
-                                    <GradientStop Offset="1" Color="#FFDFA32D"/>
+                  <GradientStop Offset="1" Color="#FFDFA32D"/>
-                                </LinearGradientBrush>
+                </LinearGradientBrush>
-                            </GeometryDrawing.Brush>
+              </GeometryDrawing.Brush>
-                        </GeometryDrawing>
+            </GeometryDrawing>
-                        <GeometryDrawing Geometry="M 0 4.5 L 8 4.5 L 8 9 L 0 9 Z">
+            <GeometryDrawing Geometry="M 0 4.5 L 8 4.5 L 8 9 L 0 9 Z">
-                            <GeometryDrawing.Brush>
+              <GeometryDrawing.Brush>
-                                <LinearGradientBrush StartPoint="0,4.5" EndPoint="0,5">
+                <LinearGradientBrush StartPoint="0,4.5" EndPoint="0,5">
-                                    <GradientStop Offset="0" Color="#00D7A018"/>
+                  <GradientStop Offset="0" Color="#00D7A018"/>
-                                    <GradientStop Offset="1" Color="#7FD7A018"/>
+                  <GradientStop Offset="1" Color="#7FD7A018"/>
-                                </LinearGradientBrush>
+                </LinearGradientBrush>
-                            </GeometryDrawing.Brush>
+              </GeometryDrawing.Brush>
-                        </GeometryDrawing>
+            </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 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>
+              <GeometryDrawing.Brush>
-                                <LinearGradientBrush StartPoint="1,6" EndPoint="23,19">
+                <LinearGradientBrush StartPoint="1,6" EndPoint="23,19">
-                                    <GradientStop Offset="0" Color="#FFFFE69D"/>
+                  <GradientStop Offset="0" Color="#FFFFE69D"/>
-                                    <GradientStop Offset="1" Color="#FFFFC937"/>
+                  <GradientStop Offset="1" Color="#FFFFC937"/>
-                                </LinearGradientBrush>
+                </LinearGradientBrush>
-                            </GeometryDrawing.Brush>
+              </GeometryDrawing.Brush>
-                        </GeometryDrawing>
+            </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 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>
-                    <DrawingGroup x:Key="Icon_File">
+          <DrawingGroup x:Key="Icon_File">
-                        <GeometryDrawing Geometry="M 0 0 L 16 16"/>
+            <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 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="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"/>
+            <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>
-                    <DrawingGroup x:Key="Icon_Volume">
+          <DrawingGroup x:Key="Icon_Volume">
-                        <GeometryDrawing Geometry="M 0 0 L 16 16"/>
+            <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 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 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>
+              <GeometryDrawing.Brush>
-                                <LinearGradientBrush StartPoint="12,5" EndPoint="11.5,5.5">
+                <LinearGradientBrush StartPoint="12,5" EndPoint="11.5,5.5">
-                                    <GradientStop Offset="0" Color="#FFCDCFD1"/>
+                  <GradientStop Offset="0" Color="#FFCDCFD1"/>
-                                    <GradientStop Offset="1" Color="#00CDCFD1"/>
+                  <GradientStop Offset="1" Color="#00CDCFD1"/>
-                                </LinearGradientBrush>
+                </LinearGradientBrush>
-                            </GeometryDrawing.Brush>
+              </GeometryDrawing.Brush>
-                        </GeometryDrawing>
+            </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 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>
+              <GeometryDrawing.Brush>
-                                <LinearGradientBrush StartPoint="4,5" EndPoint="4.5,5.5">
+                <LinearGradientBrush StartPoint="4,5" EndPoint="4.5,5.5">
-                                    <GradientStop Offset="0" Color="#FFCDCFD1"/>
+                  <GradientStop Offset="0" Color="#FFCDCFD1"/>
-                                    <GradientStop Offset="1" Color="#00CDCFD1"/>
+                  <GradientStop Offset="1" Color="#00CDCFD1"/>
-                                </LinearGradientBrush>
+                </LinearGradientBrush>
-                            </GeometryDrawing.Brush>
+              </GeometryDrawing.Brush>
-                        </GeometryDrawing>
+            </GeometryDrawing>
-                        <GeometryDrawing Geometry="M 1 9 C 1,8 1,8 2,8 L 14 8
+            <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>
+              <GeometryDrawing.Brush>
-                                <LinearGradientBrush StartPoint="0,8" EndPoint="0,12">
+                <LinearGradientBrush StartPoint="0,8" EndPoint="0,12">
-                                    <GradientStop Offset="0" Color="#FF737374"/>
+                  <GradientStop Offset="0" Color="#FF737374"/>
-                                    <GradientStop Offset="1" Color="#FFA8A8A8"/>
+                  <GradientStop Offset="1" Color="#FFA8A8A8"/>
-                                </LinearGradientBrush>
+                </LinearGradientBrush>
-                            </GeometryDrawing.Brush>
+              </GeometryDrawing.Brush>
-                        </GeometryDrawing>
+            </GeometryDrawing>
-                        <GeometryDrawing Geometry="M 2 9 C 2,8 2,8 3,8 L 13 8
+            <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>
+              <GeometryDrawing.Brush>
-                                <LinearGradientBrush StartPoint="0,8" EndPoint="0,11">
+                <LinearGradientBrush StartPoint="0,8" EndPoint="0,11">
-                                    <GradientStop Offset="0" Color="#FF333333"/>
+                  <GradientStop Offset="0" Color="#FF333333"/>
-                                    <GradientStop Offset="1" Color="#FF5A5A5A"/>
+                  <GradientStop Offset="1" Color="#FF5A5A5A"/>
-                                </LinearGradientBrush>
+                </LinearGradientBrush>
-                            </GeometryDrawing.Brush>
+              </GeometryDrawing.Brush>
-                        </GeometryDrawing>
+            </GeometryDrawing>
-                        <GeometryDrawing>
+            <GeometryDrawing>
-                            <GeometryDrawing.Geometry>
+              <GeometryDrawing.Geometry>
-                                <EllipseGeometry Rect="2.5,8.5,2,2"/>
+                <EllipseGeometry Rect="2.5,8.5,2,2"/>
-                            </GeometryDrawing.Geometry>
+              </GeometryDrawing.Geometry>
-                            <GeometryDrawing.Brush>
+              <GeometryDrawing.Brush>
-                                <RadialGradientBrush GradientOrigin="3.5,9.5" Center="3.5,9.5">
+                <RadialGradientBrush GradientOrigin="3.5,9.5" Center="3.5,9.5">
-                                    <GradientStop Offset="0.8" Color="#4001FF01"/>
+                  <GradientStop Offset="0.8" Color="#4001FF01"/>
-                                    <GradientStop Offset="1" Color="#0001FF01"/>
+                  <GradientStop Offset="1" Color="#0001FF01"/>
-                                </RadialGradientBrush>
+                </RadialGradientBrush>
-                            </GeometryDrawing.Brush>
+              </GeometryDrawing.Brush>
-                        </GeometryDrawing>
+            </GeometryDrawing>
-                        <GeometryDrawing>
+            <GeometryDrawing>
-                            <GeometryDrawing.Geometry>
+              <GeometryDrawing.Geometry>
-                                <EllipseGeometry Rect="3,9,1,1"/>
+                <EllipseGeometry Rect="3,9,1,1"/>
-                            </GeometryDrawing.Geometry>
+              </GeometryDrawing.Geometry>
-                            <GeometryDrawing.Brush>
+              <GeometryDrawing.Brush>
-                                <RadialGradientBrush GradientOrigin="3.5,9.5" Center="3.25,9.75">
+                <RadialGradientBrush GradientOrigin="3.5,9.5" Center="3.25,9.75">
-                                    <GradientStop Offset="0" Color="#FFB6FFB6"/>
+                  <GradientStop Offset="0" Color="#FFB6FFB6"/>
-                                    <GradientStop Offset="1" Color="#FF01FF01"/>
+                  <GradientStop Offset="1" Color="#FF01FF01"/>
-                                </RadialGradientBrush>
+                </RadialGradientBrush>
-                            </GeometryDrawing.Brush>
+              </GeometryDrawing.Brush>
-                        </GeometryDrawing>
+            </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"/>
+            <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>
+          </DrawingGroup>
-                </dialogs:ResourceSelectorConverter>
+        </dialogs:ResourceSelectorConverter>
-            </ResourceDictionary>
+      </ResourceDictionary>
-        </Style.Resources>
+    </Style.Resources>
-        <Setter Property="Template">
+    <Setter Property="Template">
-            <ControlTemplate>
+      <ControlTemplate>
-                <DockPanel>
+        <DockPanel>
-                    <ListBox x:Name="QuickLinks" DockPanel.Dock="Left" Items="{Binding QuickLinks}" SelectedIndex="{Binding QuickLinksSelectedIndex}" Focusable="False">
+          <ListBox x:Name="QuickLinks" DockPanel.Dock="Left" Items="{Binding QuickLinks}" SelectedIndex="{Binding QuickLinksSelectedIndex}" Focusable="False">
-                        <ListBox.ItemTemplate>
+            <ListBox.ItemTemplate>
-                            <DataTemplate>
+              <DataTemplate>
-                                <StackPanel Spacing="4" Orientation="Horizontal" Background="Transparent">
+                <StackPanel Spacing="4" Orientation="Horizontal" Background="Transparent">
-                                    <DrawingPresenter Width="16" Height="16" Drawing="{Binding IconKey, Converter={StaticResource Icons}}"/>
+                  <DrawingPresenter Width="16" Height="16" Drawing="{Binding IconKey, Converter={StaticResource Icons}}"/>
-                                    <TextBlock Text="{Binding DisplayName}"/>
+                  <TextBlock Text="{Binding DisplayName}"/>
-                                </StackPanel>
+                </StackPanel>
-                            </DataTemplate>
+              </DataTemplate>
-                        </ListBox.ItemTemplate>
+            </ListBox.ItemTemplate>
-                    </ListBox>
+          </ListBox>
-                    <DockPanel x:Name="NavBar" DockPanel.Dock="Top" Margin="8,5,8,0" VerticalAlignment="Center">
+          <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"/>
+            <Rectangle Fill="{DynamicResource SystemControlHighlightAltBaseMediumLowBrush}" Height="1" Margin="0,5,0,0" DockPanel.Dock="Bottom"/>
-                        <DockPanel Margin="4,0">
+            <DockPanel Margin="4,0">
-                            <Button Command="{Binding GoUp}" DockPanel.Dock="Left">
+              <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"/>
+                <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>
+              </Button>
-                            <TextBox x:Name="Location" Text="{Binding Location}">
+              <TextBox x:Name="Location" Text="{Binding Location}">
-                                <TextBox.KeyBindings>
+                <TextBox.KeyBindings>
-                                    <KeyBinding Command="{Binding EnterPressed}" Gesture="Enter"/>
+                  <KeyBinding Command="{Binding EnterPressed}" Gesture="Enter"/>
-                                </TextBox.KeyBindings>
+                </TextBox.KeyBindings>
-                            </TextBox>
+              </TextBox>
-                        </DockPanel>
+            </DockPanel>
-                    </DockPanel>
+          </DockPanel>
-                    <DockPanel Margin="8,0,8,5" DockPanel.Dock="Bottom">
+          <DockPanel Margin="8,0,8,5" DockPanel.Dock="Bottom">
-                        <Rectangle Fill="{DynamicResource SystemControlHighlightAltBaseMediumLowBrush}" Height="1" Margin="0,0,0,5" DockPanel.Dock="Top"/>
+            <Rectangle Fill="{DynamicResource SystemControlHighlightAltBaseMediumLowBrush}" Height="1" Margin="0,0,0,5" DockPanel.Dock="Top"/>
-                        <DockPanel Margin="4,0">
+            <DockPanel Margin="4,0">
-                            <DockPanel DockPanel.Dock="Top" Margin="0,0,0,4">
+              <DockPanel DockPanel.Dock="Top" Margin="0,0,0,4">
-                                <ComboBox DockPanel.Dock="Right"
+                <ComboBox DockPanel.Dock="Right"
-                                    IsVisible="{Binding ShowFilters}" 
+                    IsVisible="{Binding ShowFilters}"
-                                    Items="{Binding Filters}"
+                    Items="{Binding Filters}"
-                                    SelectedItem="{Binding SelectedFilter}" />
+                    SelectedItem="{Binding SelectedFilter}" />
-                                <TextBox Text="{Binding FileName}" Watermark="File name" IsVisible="{Binding !SelectingFolder}" />
+                <TextBox Text="{Binding FileName}" Watermark="File name" IsVisible="{Binding !SelectingFolder}" />
-                            </DockPanel>
+              </DockPanel>
-                            <CheckBox IsChecked="{Binding ShowHiddenFiles}" Content="Show hidden files" DockPanel.Dock="Left"/>
+              <CheckBox IsChecked="{Binding ShowHiddenFiles}" Content="Show hidden files" DockPanel.Dock="Left"/>
-                            <UniformGrid x:Name="Finalize" HorizontalAlignment="Right" Rows="1">
+              <UniformGrid x:Name="Finalize" HorizontalAlignment="Right" Rows="1">
-                                <Button Command="{Binding Ok}">OK</Button>
+                <Button Command="{Binding Ok}">OK</Button>
-                                <Button Command="{Binding Cancel}">Cancel</Button>
+                <Button Command="{Binding Cancel}">Cancel</Button>
-                            </UniformGrid>
+              </UniformGrid>
-                        </DockPanel>
+            </DockPanel>
-                    </DockPanel>
+          </DockPanel>
 
-                    <DockPanel Grid.IsSharedSizeScope="True">
+          <DockPanel Grid.IsSharedSizeScope="True">
-                        <Grid DockPanel.Dock="Top" Margin="15 5 0 0" HorizontalAlignment="Stretch">
+            <Grid DockPanel.Dock="Top" Margin="15 5 0 0" HorizontalAlignment="Stretch">
-                            <Grid.ColumnDefinitions>
+              <Grid.ColumnDefinitions>
-                                <ColumnDefinition Width="20" SharedSizeGroup="Icon" />
+                <ColumnDefinition Width="20" SharedSizeGroup="Icon" />
-                                <ColumnDefinition Width="16" SharedSizeGroup="Splitter"  />
+                <ColumnDefinition Width="16" SharedSizeGroup="Splitter"  />
-                                <ColumnDefinition Width="275" SharedSizeGroup="Name" />
+                <ColumnDefinition Width="275" SharedSizeGroup="Name" />
-                                <ColumnDefinition Width="16" SharedSizeGroup="Splitter" />
+                <ColumnDefinition Width="16" SharedSizeGroup="Splitter" />
-                                <ColumnDefinition Width="200" SharedSizeGroup="Modified" />
+                <ColumnDefinition Width="200" SharedSizeGroup="Modified" />
-                                <ColumnDefinition Width="16" SharedSizeGroup="Splitter" />
+                <ColumnDefinition Width="16" SharedSizeGroup="Splitter" />
-                                <ColumnDefinition Width="150" SharedSizeGroup="Type" />
+                <ColumnDefinition Width="150" SharedSizeGroup="Type" />
-                                <ColumnDefinition Width="16" SharedSizeGroup="Splitter" />
+                <ColumnDefinition Width="16" SharedSizeGroup="Splitter" />
-                                <ColumnDefinition Width="200" SharedSizeGroup="Size" />
+                <ColumnDefinition Width="200" SharedSizeGroup="Size" />
-                            </Grid.ColumnDefinitions>
+              </Grid.ColumnDefinitions>
-                            <Grid.Styles>
+              <Grid.Styles>
-                                <Style Selector="GridSplitter">
+                <Style Selector="GridSplitter">
-                                    <Setter Property="Background" Value="{DynamicResource SystemControlHighlightAltBaseMediumLowBrush}"/>
+                  <Setter Property="Background" Value="{DynamicResource SystemControlHighlightAltBaseMediumLowBrush}"/>
-                                    <Setter Property="Template">
+                  <Setter Property="Template">
-                                        <ControlTemplate>
+                    <ControlTemplate>
-                                            <Border VerticalAlignment="Stretch" BorderThickness="0" Background="#01000000">
+                      <Border VerticalAlignment="Stretch" BorderThickness="0" Background="#01000000">
-                                                <Rectangle Width="1" VerticalAlignment="Stretch" Fill="{TemplateBinding Background}"/>
+                        <Rectangle Width="1" VerticalAlignment="Stretch" Fill="{TemplateBinding Background}"/>
-                                            </Border>
+                      </Border>
-                                        </ControlTemplate>
+                    </ControlTemplate>
-                                    </Setter>
+                  </Setter>
-                                </Style>
+                </Style>
-                            </Grid.Styles>
+              </Grid.Styles>
-                            <GridSplitter Grid.Column="1" />
+              <GridSplitter Grid.Column="1" />
-                            <TextBlock Grid.Column="2" Text="Name" />
+              <TextBlock Grid.Column="2" Text="Name" />
-                            <GridSplitter Grid.Column="3" />
+              <GridSplitter Grid.Column="3" />
-                            <TextBlock Grid.Column="4" Text="Date Modified" />
+              <TextBlock Grid.Column="4" Text="Date Modified" />
-                            <GridSplitter Grid.Column="5" />
+              <GridSplitter Grid.Column="5" />
-                            <TextBlock Grid.Column="6" Text="Type" />
+              <TextBlock Grid.Column="6" Text="Type" />
-                            <GridSplitter Grid.Column="7" />
+              <GridSplitter Grid.Column="7" />
-                            <TextBlock Grid.Column="8" Text="Size" />
+              <TextBlock Grid.Column="8" Text="Size" />
-                        </Grid>
+            </Grid>
-                        <ListBox x:Name="Files"
+            <ListBox x:Name="Files"
-                            VirtualizationMode="Simple"
+                VirtualizationMode="Simple"
-                            Items="{Binding Items}"
+                Items="{Binding Items}"
-                            Margin="0 5"
+                Margin="0 5"
-                            SelectionMode="{Binding SelectionMode}"
+                SelectionMode="{Binding SelectionMode}"
-                            SelectedItems="{Binding SelectedItems}"
+                SelectedItems="{Binding SelectedItems}"
-                            Background="Transparent"
+                Background="Transparent"
-                            ScrollViewer.HorizontalScrollBarVisibility="Disabled">
+                ScrollViewer.HorizontalScrollBarVisibility="Disabled">
-                            <ListBox.ItemTemplate>
+              <ListBox.ItemTemplate>
-                                <DataTemplate>
+                <DataTemplate>
-                                    <Grid Background="Transparent">
+                  <Grid Background="Transparent">
-                                        <Grid.ColumnDefinitions>
+                    <Grid.ColumnDefinitions>
-                                            <ColumnDefinition SharedSizeGroup="Icon" />
+                      <ColumnDefinition SharedSizeGroup="Icon" />
-                                            <ColumnDefinition SharedSizeGroup="Splitter"  />
+                      <ColumnDefinition SharedSizeGroup="Splitter"  />
-                                            <ColumnDefinition SharedSizeGroup="Name" />
+                      <ColumnDefinition SharedSizeGroup="Name" />
-                                            <ColumnDefinition SharedSizeGroup="Splitter" />
+                      <ColumnDefinition SharedSizeGroup="Splitter" />
-                                            <ColumnDefinition SharedSizeGroup="Modified" />
+                      <ColumnDefinition SharedSizeGroup="Modified" />
-                                            <ColumnDefinition SharedSizeGroup="Splitter" />
+                      <ColumnDefinition SharedSizeGroup="Splitter" />
-                                            <ColumnDefinition SharedSizeGroup="Type" />
+                      <ColumnDefinition SharedSizeGroup="Type" />
-                                            <ColumnDefinition SharedSizeGroup="Splitter" />
+                      <ColumnDefinition SharedSizeGroup="Splitter" />
-                                            <ColumnDefinition SharedSizeGroup="Size" />
+                      <ColumnDefinition SharedSizeGroup="Size" />
-                                        </Grid.ColumnDefinitions>
+                    </Grid.ColumnDefinitions>
-                                        <DrawingPresenter Width="16" Height="16" Drawing="{Binding IconKey, Converter={StaticResource Icons}}"/>
+                    <DrawingPresenter Width="16" Height="16" Drawing="{Binding IconKey, Converter={StaticResource Icons}}"/>
-                                        <TextBlock Grid.Column="2" Text="{Binding DisplayName}"/>
+                    <TextBlock Grid.Column="2" Text="{Binding DisplayName}"/>
-                                        <TextBlock Grid.Column="4" Text="{Binding Modified}" />
+                    <TextBlock Grid.Column="4" Text="{Binding Modified}" />
-                                        <TextBlock Grid.Column="6" Text="{Binding Type}" />
+                    <TextBlock Grid.Column="6" Text="{Binding Type}" />
-                                        <TextBlock Grid.Column="8">
+                    <TextBlock Grid.Column="8">
-                                            <TextBlock.Text>
+                      <TextBlock.Text>
-                                                <Binding Path="Size">
+                        <Binding Path="Size">
-                                                    <Binding.Converter>
+                          <Binding.Converter>
-                                                        <dialogs:FileSizeStringConverter/>
+                            <dialogs:FileSizeStringConverter/>
-                                                    </Binding.Converter>
+                          </Binding.Converter>
-                                                </Binding>
+                        </Binding>
-                                            </TextBlock.Text>
+                      </TextBlock.Text>
-                                        </TextBlock>
+                    </TextBlock>
-                                    </Grid>
+                  </Grid>
-                                </DataTemplate>
+                </DataTemplate>
-                            </ListBox.ItemTemplate>
+              </ListBox.ItemTemplate>
-                        </ListBox>
+            </ListBox>
-                    </DockPanel>
+          </DockPanel>
-                </DockPanel>
+        </DockPanel>
-            </ControlTemplate>
+      </ControlTemplate>
-        </Setter>
+    </Setter>
-    </Style>
+  </Style>
 
 
-    <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks">
+  <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks">
-        <Setter Property="Margin" Value="0"/>
+    <Setter Property="Margin" Value="0"/>
-        <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumBrush}"/>
+    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundChromeMediumBrush}"/>
-        <Setter Property="BorderThickness" Value="0"/>
+    <Setter Property="BorderThickness" Value="0"/>
-        <Setter Property="Width" Value="240"/>
+    <Setter Property="Width" Value="240"/>
-        <Setter Property="Padding" Value="0,20"/>
+    <Setter Property="Padding" Value="0,20"/>
-        <Setter Property="Template">
+    <Setter Property="Template">
-            <ControlTemplate>
+      <ControlTemplate>
-                <Border Name="border" BoxShadow="inset -6 0 3 -3 #20000000" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
+        <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)}">
+          <ScrollViewer Name="PART_ScrollViewer" HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}" VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}">
-                        <ItemsPresenter Name="PART_ItemsPresenter"
+            <ItemsPresenter Name="PART_ItemsPresenter"
-                                        Items="{TemplateBinding Items}"
+                            Items="{TemplateBinding Items}"
-                                        ItemsPanel="{TemplateBinding ItemsPanel}"
+                            ItemsPanel="{TemplateBinding ItemsPanel}"
-                                        ItemTemplate="{TemplateBinding ItemTemplate}"
+                            ItemTemplate="{TemplateBinding ItemTemplate}"
-                                        Margin="{TemplateBinding Padding}"
+                            Margin="{TemplateBinding Padding}"
-                                        VirtualizationMode="{TemplateBinding VirtualizationMode}"/>
+                            VirtualizationMode="{TemplateBinding VirtualizationMode}"/>
-                    </ScrollViewer>
+          </ScrollViewer>
-                </Border>
+        </Border>
-            </ControlTemplate>
+      </ControlTemplate>
-        </Setter>
+    </Setter>
-    </Style>
+  </Style>
-    <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks ListBoxItem">
+  <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks ListBoxItem">
-        <Setter Property="Height" Value="32"/>
+    <Setter Property="Height" Value="32"/>
-        <Setter Property="Padding" Value="30,6"/>
+    <Setter Property="Padding" Value="30,6"/>
-        <Setter Property="Template">
+    <Setter Property="Template">
-            <ControlTemplate>
+      <ControlTemplate>
-                <Border x:Name="LayoutRoot" CornerRadius="2" Margin="10,0">
+        <Border x:Name="LayoutRoot" CornerRadius="2" Margin="10,0">
-                    <Panel>
+          <Panel>
-                        <Border x:Name="SelectedLine" HorizontalAlignment="Left" Margin="2,6" CornerRadius="0.5" Width="3" Background="{DynamicResource SystemControlHighlightAccentBrush}" IsVisible="{TemplateBinding IsSelected}"/>
+            <Border x:Name="SelectedLine" HorizontalAlignment="Left" Margin="2,6" CornerRadius="0.5" Width="3" Background="{DynamicResource SystemControlHighlightAccentBrush}" IsVisible="{TemplateBinding IsSelected}"/>
-                        <ContentPresenter Name="PART_ContentPresenter"
+            <ContentPresenter Name="PART_ContentPresenter"
-                                    Background="Transparent"
+                        Background="Transparent"
-                                    BorderBrush="Transparent"
+                        BorderBrush="Transparent"
-                                    BorderThickness="0"
+                        BorderThickness="0"
-                                    ContentTemplate="{TemplateBinding ContentTemplate}"
+                        ContentTemplate="{TemplateBinding ContentTemplate}"
-                                    Content="{TemplateBinding Content}"
+                        Content="{TemplateBinding Content}"
-                                    Padding="{TemplateBinding Padding}"
+                        Padding="{TemplateBinding Padding}"
-                                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                        VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
+                        HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
 
-                    </Panel>
+          </Panel>
-                </Border>
+        </Border>
-            </ControlTemplate>
+      </ControlTemplate>
-        </Setter>
+    </Setter>
-    </Style>
+  </Style>
-    <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks ListBoxItem:pointerover /template/ Border#LayoutRoot">
+  <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks ListBoxItem:pointerover /template/ Border#LayoutRoot">
-        <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltMediumBrush}"/>
+    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltMediumBrush}"/>
-    </Style>
+  </Style>
-    <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks ListBoxItem:selected /template/ Border#LayoutRoot">
+  <Style Selector="dialogs|ManagedFileChooser /template/ ListBox#QuickLinks ListBoxItem:selected /template/ Border#LayoutRoot">
-        <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltMediumHighBrush}"/>
+    <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltMediumHighBrush}"/>
-    </Style>
+  </Style>
-    <Style Selector="dialogs|ManagedFileChooser /template/ DockPanel#NavBar Button,
+  <Style Selector="dialogs|ManagedFileChooser /template/ DockPanel#NavBar Button,
                     dialogs|ManagedFileChooser /template/ DockPanel#NavBar TextBox">
-        <Setter Property="Height" Value="30"/>
+    <Setter Property="Height" Value="30"/>
-    </Style>
+  </Style>
-    <Style Selector="dialogs|ManagedFileChooser /template/ DockPanel#NavBar Button">
+  <Style Selector="dialogs|ManagedFileChooser /template/ DockPanel#NavBar Button">
-        <Setter Property="VerticalAlignment" Value="Stretch"/>
+    <Setter Property="VerticalAlignment" Value="Stretch"/>
-        <Setter Property="Width" Value="40"/>
+    <Setter Property="Width" Value="40"/>
-        <Setter Property="Margin" Value="0,0,8,0"/>
+    <Setter Property="Margin" Value="0,0,8,0"/>
-        <Setter Property="BorderThickness" Value="0"/>
+    <Setter Property="BorderThickness" Value="0"/>
-    </Style>
+  </Style>
-    <Style Selector="dialogs|ManagedFileChooser /template/ DockPanel#NavBar Button:not(:pointerover):not(:pressed)">
+  <Style Selector="dialogs|ManagedFileChooser /template/ DockPanel#NavBar Button:not(:pointerover):not(:pressed)">
-        <Setter Property="Background" Value="Transparent"/>
+    <Setter Property="Background" Value="Transparent"/>
-    </Style>
+  </Style>
 
-    <Style Selector="dialogs|ManagedFileChooser /template/ UniformGrid#Finalize > Button">
+  <Style Selector="dialogs|ManagedFileChooser /template/ UniformGrid#Finalize > Button">
-            <Setter Property="HorizontalContentAlignment" Value="Center"/>
+    <Setter Property="HorizontalContentAlignment" Value="Center"/>
-            <Setter Property="HorizontalAlignment" Value="Stretch"/>
+    <Setter Property="HorizontalAlignment" Value="Stretch"/>
-            <Setter Property="Margin" Value="4,0,0,0"/>
+    <Setter Property="Margin" Value="4,0,0,0"/>
-    </Style>
+  </Style>
-    <Style Selector="dialogs|ManagedFileChooser /template/ UniformGrid#Finalize > Button /template/ ContentPresenter#PART_ContentPresenter">
+  <Style Selector="dialogs|ManagedFileChooser /template/ UniformGrid#Finalize > Button /template/ ContentPresenter#PART_ContentPresenter">
-            <Setter Property="HorizontalAlignment" Value="Stretch"/>
+    <Setter Property="HorizontalAlignment" Value="Stretch"/>
-    </Style>
+  </Style>
 </Styles>

src/Avalonia.Themes.Fluent/Controls/Menu.xaml

@@ -1,36 +1,35 @@
-<Style xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-       Selector="Menu">
+    <Design.PreviewWith>
-  <Design.PreviewWith>
+      <Border Padding="20">
-    <Border Padding="20">
+        <Menu>
-      <Menu>
+          <MenuItem Header="New" />
-        <MenuItem Header="New" />
+          <MenuItem Header="Open" />
-        <MenuItem Header="Open" />
+        </Menu>
-      </Menu>
+      </Border>
-    </Border>
+    </Design.PreviewWith>
-  </Design.PreviewWith>
 
-  <Style.Resources>
     <x:Double x:Key="MenuBarHeight">32</x:Double>
-  </Style.Resources>
 
-  <Setter Property="Background" Value="Transparent" />
+    <ControlTheme x:Key="{x:Type Menu}" TargetType="Menu">
-  <Setter Property="Height" Value="{DynamicResource MenuBarHeight}" />
+      <Setter Property="Background" Value="Transparent" />
-  <Setter Property="Template">
+      <Setter Property="Height" Value="{DynamicResource MenuBarHeight}" />
-    <ControlTemplate>
+      <Setter Property="Template">
-      <Border Background="{TemplateBinding Background}"
+        <ControlTemplate>
-              BorderBrush="{TemplateBinding BorderBrush}"
+          <Border Background="{TemplateBinding Background}"
-              BorderThickness="{TemplateBinding BorderThickness}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
-              CornerRadius="{TemplateBinding CornerRadius}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
-              HorizontalAlignment="Stretch"
+                  CornerRadius="{TemplateBinding CornerRadius}"
-              Padding="{TemplateBinding Padding}">
+                  HorizontalAlignment="Stretch"
-        <ItemsPresenter Name="PART_ItemsPresenter"
+                  Padding="{TemplateBinding Padding}">
-                        Items="{TemplateBinding Items}"
+            <ItemsPresenter Name="PART_ItemsPresenter"
-                        ItemsPanel="{TemplateBinding ItemsPanel}"
+                            Items="{TemplateBinding Items}"
-                        ItemTemplate="{TemplateBinding ItemTemplate}"
+                            ItemsPanel="{TemplateBinding ItemsPanel}"
-                        VerticalAlignment="Stretch"
+                            ItemTemplate="{TemplateBinding ItemTemplate}"
-                        KeyboardNavigation.TabNavigation="Continue" />
+                            VerticalAlignment="Stretch"
-      </Border>
+                            KeyboardNavigation.TabNavigation="Continue" />
-    </ControlTemplate>
+          </Border>
-  </Setter>
+        </ControlTemplate>
-</Style>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>

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">
+<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  
+    <ControlTheme x:Key="{x:Type MenuFlyoutPresenter}" TargetType="MenuFlyoutPresenter">
-  <Style Selector="MenuFlyoutPresenter">
+      <Setter Property="Background" Value="{DynamicResource MenuFlyoutPresenterBackground}" />
-    <Setter Property="Background" Value="{DynamicResource MenuFlyoutPresenterBackground}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource MenuFlyoutPresenterBorderBrush}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource MenuFlyoutPresenterBorderBrush}" />
+      <Setter Property="BorderThickness" Value="{DynamicResource MenuFlyoutPresenterBorderThemeThickness}" />
-    <Setter Property="BorderThickness" Value="{DynamicResource MenuFlyoutPresenterBorderThemeThickness}" />
+      <Setter Property="Padding" Value="{DynamicResource MenuFlyoutPresenterThemePadding}" />
-    <Setter Property="Padding" Value="{DynamicResource MenuFlyoutPresenterThemePadding}" />
+      <Setter Property="MaxWidth" Value="{DynamicResource FlyoutThemeMaxWidth}" />
-    <Setter Property="MaxWidth" Value="{DynamicResource FlyoutThemeMaxWidth}" />
+      <Setter Property="MinHeight" Value="{DynamicResource MenuFlyoutThemeMinHeight}" />
-    <Setter Property="MinHeight" Value="{DynamicResource MenuFlyoutThemeMinHeight}" />
+      <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
-    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
+      <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
-    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
+      <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
-    <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
+      <Setter Property="Template">
-    <Setter Property="Template">
+        <ControlTemplate>
-      <ControlTemplate>
+          <Border Name="LayoutRoot"
-        <Border Name="LayoutRoot"
+                  Background="{TemplateBinding Background}"
-                Background="{TemplateBinding Background}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
-                BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
-                BorderThickness="{TemplateBinding BorderThickness}"
+                  Padding="{DynamicResource FlyoutBorderThemePadding}"
-                Padding="{DynamicResource FlyoutBorderThemePadding}"
+                  CornerRadius="{TemplateBinding CornerRadius}">
-                CornerRadius="{TemplateBinding CornerRadius}">
+            <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
-          <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
+                          VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
-                        VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
+              <ItemsPresenter Name="PART_ItemsPresenter"
-            <ItemsPresenter Name="PART_ItemsPresenter"
+                              Items="{TemplateBinding Items}"
-                            Items="{TemplateBinding Items}"
+                              ItemsPanel="{TemplateBinding ItemsPanel}"
-                            ItemsPanel="{TemplateBinding ItemsPanel}"
+                              ItemTemplate="{TemplateBinding ItemTemplate}"
-                            ItemTemplate="{TemplateBinding ItemTemplate}"
+                              Margin="{DynamicResource MenuFlyoutScrollerMargin}"
-                            Margin="{DynamicResource MenuFlyoutScrollerMargin}"
+                              KeyboardNavigation.TabNavigation="Continue"
-                            KeyboardNavigation.TabNavigation="Continue"
+                              Grid.IsSharedSizeScope="True" />
-                            Grid.IsSharedSizeScope="True" />
+            </ScrollViewer>
-          </ScrollViewer>
+          </Border>
-        </Border>
+        </ControlTemplate>
-      </ControlTemplate>
+      </Setter>
-    </Setter>
+    </ControlTheme>
-  </Style>
+</ResourceDictionary>
-</Styles>

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>

src/Avalonia.Themes.Fluent/Controls/NativeMenuBar.xaml

@@ -1,30 +1,29 @@
-<Style xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-       xmlns:local="clr-namespace:Avalonia.Themes.Fluent"
+                    xmlns:local="clr-namespace:Avalonia.Themes.Fluent"
-       x:CompileBindings="True"
+                    x:CompileBindings="True">
-       Selector="NativeMenuBar">
+  <local:InverseBooleanValueConverter x:Key="AvaloniaThemesFluentNativeMenuBarInverseBooleanValueConverter" Default="True"/>
-  <Style.Resources>
+  <local:IBitmapToImageConverter x:Key="AvaloniaThemesFluentNativeMenuBarIBitmapToImageConverter"/>
-    <local:InverseBooleanValueConverter x:Key="AvaloniaThemesFluentNativeMenuBarInverseBooleanValueConverter" Default="True"/>
+  <ControlTheme x:Key="{x:Type NativeMenuBar}" TargetType="NativeMenuBar">
-    <local:IBitmapToImageConverter x:Key="AvaloniaThemesFluentNativeMenuBarIBitmapToImageConverter"/>
+    <Setter Property="Template">
-  </Style.Resources>
+      <ControlTemplate>
-  <Setter Property="Template">
+        <Menu
-    <ControlTemplate>
+          IsVisible="{Binding $parent[TopLevel].(NativeMenu.IsNativeMenuExported), Converter={StaticResource AvaloniaThemesFluentNativeMenuBarInverseBooleanValueConverter}}"
-      <Menu
+          Items="{Binding $parent[TopLevel].(NativeMenu.Menu).Items}">
-        IsVisible="{Binding $parent[TopLevel].(NativeMenu.IsNativeMenuExported), Converter={StaticResource AvaloniaThemesFluentNativeMenuBarInverseBooleanValueConverter}}"
+          <Menu.Styles>
-        Items="{Binding $parent[TopLevel].(NativeMenu.Menu).Items}">
+            <Style x:CompileBindings="False" Selector="MenuItem">
-        <Menu.Styles>
+              <Setter Property="Header" Value="{Binding Header}"/>
-          <Style x:CompileBindings="False" Selector="MenuItem">
+              <Setter Property="InputGesture" Value="{Binding Gesture}"/>
-            <Setter Property="Header" Value="{Binding Header}"/>
+              <Setter Property="Items" Value="{Binding Menu.Items}"/>
-            <Setter Property="InputGesture" Value="{Binding Gesture}"/>
+              <Setter Property="Command" Value="{Binding Command}"/>
-            <Setter Property="Items" Value="{Binding Menu.Items}"/>
+              <Setter Property="CommandParameter" Value="{Binding CommandParameter}"/>
-            <Setter Property="Command" Value="{Binding Command}"/>
+              <Setter Property="(NativeMenuBar.EnableMenuItemClickForwarding)" Value="True"/>
-            <Setter Property="CommandParameter" Value="{Binding CommandParameter}"/>
+              <!--NativeMenuItem is IBitmap and MenuItem is Image-->
-            <Setter Property="(NativeMenuBar.EnableMenuItemClickForwarding)" Value="True"/>
+              <Setter Property="Icon" Value="{Binding Icon , Converter={StaticResource AvaloniaThemesFluentNativeMenuBarIBitmapToImageConverter}}"/>
-            <!--NativeMenuItem is IBitmap and MenuItem is Image-->
+            </Style>
-            <Setter Property="Icon" Value="{Binding Icon , Converter={StaticResource AvaloniaThemesFluentNativeMenuBarIBitmapToImageConverter}}"/>
+          </Menu.Styles>
-          </Style>
+        </Menu>
-        </Menu.Styles>
+      </ControlTemplate>
-      </Menu>
+    </Setter>
-    </ControlTemplate>
+   </ControlTheme>
-  </Setter>
+</ResourceDictionary>
-</Style>

src/Avalonia.Themes.Fluent/Controls/NotificationCard.xaml

@@ -1,11 +1,11 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+                    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" />
+                <Panel x:Name="PART_HeaderBar" Height="4" Background="{DynamicResource NotificationCardProgressBackgroundBrush}" DockPanel.Dock="Top" />
-                <ContentControl Name="PART_Content" Content="{TemplateBinding Content}" />
+                <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>
+    </ControlTheme.Animations>
-  </Style>
 
-  <Style Selector="NotificationCard/template/ ContentControl#PART_Content">
+  <Style Selector="^[IsClosing=true] /template/ LayoutTransformControl#PART_LayoutTransformControl">
-    <Setter Property="MinHeight" Value="64" />
-  </Style>
-
-  <Style Selector="NotificationCard[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">
+  <Style Selector="^:information /template/ Panel#PART_HeaderBar">
-    <Setter Property="Background" Value="{DynamicResource NotificationCardProgressBackgroundBrush}"/>
-  </Style>
-  <Style Selector="NotificationCard: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>

src/Avalonia.Themes.Fluent/Controls/NumericUpDown.xaml

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

src/Avalonia.Themes.Fluent/Controls/OverlayPopupHost.xaml

@@ -1,20 +1,23 @@
-<Style xmlns="https://github.com/avaloniaui" Selector="OverlayPopupHost">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-  <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}"/>
+    <ControlTheme x:Key="{x:Type OverlayPopupHost}" TargetType="OverlayPopupHost">
-  <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
+      <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>
-  <Setter Property="FontWeight" Value="400" />
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}"/>
-  <Setter Property="FontStyle" Value="Normal" />
+      <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
-  <Setter Property="Template">
+      <Setter Property="FontWeight" Value="400" />
-    <ControlTemplate>
+      <Setter Property="FontStyle" Value="Normal" />
-      <LayoutTransformControl LayoutTransform="{TemplateBinding Transform}">
+      <Setter Property="Template">
-        <VisualLayerManager IsPopup="True">
+        <ControlTemplate>
-          <ContentPresenter Name="PART_ContentPresenter"
+          <LayoutTransformControl LayoutTransform="{TemplateBinding Transform}">
-                            Background="{TemplateBinding Background}"
+            <VisualLayerManager IsPopup="True">
-                            ContentTemplate="{TemplateBinding ContentTemplate}"
+              <ContentPresenter Name="PART_ContentPresenter"
-                            Content="{TemplateBinding Content}"
+                                Background="{TemplateBinding Background}"
-                            Padding="{TemplateBinding Padding}"/>
+                                ContentTemplate="{TemplateBinding ContentTemplate}"
-        </VisualLayerManager>
+                                Content="{TemplateBinding Content}"
-      </LayoutTransformControl>
+                                Padding="{TemplateBinding Padding}"/>
-    </ControlTemplate>
+            </VisualLayerManager>
-  </Setter>
+          </LayoutTransformControl>
-</Style>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>

src/Avalonia.Themes.Fluent/Controls/PathIcon.xaml

@@ -1,29 +1,26 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Design.PreviewWith>
+    <Design.PreviewWith>
-    <StackPanel>
+      <StackPanel>
-      <StackPanel.Resources>
+        <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>
+          <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>
+        </StackPanel.Resources>
-      <PathIcon Data="{StaticResource settings_regular}" />
+        <PathIcon Data="{StaticResource settings_regular}" />
-    </StackPanel>
+      </StackPanel>
-  </Design.PreviewWith>
+    </Design.PreviewWith>
-  <Style Selector="PathIcon">
+    <ControlTheme x:Key="{x:Type PathIcon}" TargetType="PathIcon">
-    <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
+      <Setter Property="Foreground" Value="{DynamicResource TextControlForeground}" />
-    <Setter Property="Background" Value="Transparent" />
+      <Setter Property="Background" Value="Transparent" />
-    <Setter Property="Height" Value="{DynamicResource IconElementThemeHeight}" />
+      <Setter Property="Height" Value="{DynamicResource IconElementThemeHeight}" />
-    <Setter Property="Width" Value="{DynamicResource IconElementThemeWidth}" />
+      <Setter Property="Width" Value="{DynamicResource IconElementThemeWidth}" />
-    <Setter Property="Template">
+      <Setter Property="Template">
-      <ControlTemplate>
+        <ControlTemplate>
-        <Border Background="{TemplateBinding Background}">
+          <Border Background="{TemplateBinding Background}">
-          <Viewbox Height="{TemplateBinding Height}"
+            <Viewbox Height="{TemplateBinding Height}" Width="{TemplateBinding Width}">
-                   Width="{TemplateBinding Width}">
+              <Path Fill="{TemplateBinding Foreground}" Data="{TemplateBinding Data}" Stretch="Uniform" />
-            <Path Fill="{TemplateBinding Foreground}"
+            </Viewbox>
-                  Data="{TemplateBinding Data}"
+          </Border>
-                  Stretch="Uniform" />
+        </ControlTemplate>
-          </Viewbox>
+      </Setter>
-        </Border>
+    </ControlTheme>
-      </ControlTemplate>
+</ResourceDictionary>
-    </Setter>
-  </Style>
-</Styles>

src/Avalonia.Themes.Fluent/Controls/PopupRoot.xaml

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

src/Avalonia.Themes.Fluent/Controls/ProgressBar.xaml

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

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"
+        <Border
-                Background="{TemplateBinding Background}"
+            Name="RootBorder"
-                BorderBrush="{TemplateBinding BorderBrush}"
+            Background="{TemplateBinding Background}"
-                BorderThickness="{TemplateBinding BorderThickness}"
+            BorderBrush="{TemplateBinding BorderBrush}"
-                CornerRadius="{TemplateBinding CornerRadius}">
+            BorderThickness="{TemplateBinding BorderThickness}"
+            CornerRadius="{TemplateBinding CornerRadius}">
           <Grid ColumnDefinitions="20,*">
-            <Grid VerticalAlignment="Top"
+            <Grid Height="32" VerticalAlignment="Top">
-              Height="32">
+
-
+              <Ellipse
-              <Ellipse Name="OuterEllipse"
+                  Name="OuterEllipse"
-                       Width="20" Height="20"
+                  Width="20"
-                       UseLayoutRounding="False"
+                  Height="20"
-                       StrokeThickness="{DynamicResource RadioButtonBorderThemeThickness}" />
+                  Fill="{DynamicResource RadioButtonOuterEllipseFill}"
-
+                  Stroke="{DynamicResource RadioButtonOuterEllipseStroke}"
-              <Ellipse Name="CheckOuterEllipse"
+                  StrokeThickness="{DynamicResource RadioButtonBorderThemeThickness}"
-                       Width="20" Height="20"
+                  UseLayoutRounding="False" />
-                       UseLayoutRounding="False"
+
-                       StrokeThickness="{DynamicResource RadioButtonBorderThemeThickness}" />
+              <Ellipse
-
+                  Name="CheckOuterEllipse"
-              <Ellipse Name="CheckGlyph"
+                  Width="20"
-                       Width="8" Height="8"
+                  Height="20"
-                       UseLayoutRounding="False" />
+                  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"
+            <ContentPresenter
-                              Content="{TemplateBinding Content}"
+                Name="PART_ContentPresenter"
-                              ContentTemplate="{TemplateBinding ContentTemplate}"
+                Grid.Column="1"
-                              Foreground="{TemplateBinding Foreground}"
+                Margin="{TemplateBinding Padding}"
-                              Margin="{TemplateBinding Padding}"
+                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                              RecognizesAccessKey="True"
+                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                Content="{TemplateBinding Content}"
-                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                ContentTemplate="{TemplateBinding ContentTemplate}"
-                              Grid.Column="1" />
+                Foreground="{TemplateBinding Foreground}"
+                RecognizesAccessKey="True" />
           </Grid>
         </Border>
       </ControlTemplate>
     </Setter>
-  </Style>
+
-
+    <!--  PointerOver State  -->
-  <!-- Normal State -->
+    <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-  <Style Selector="RadioButton /template/ Ellipse#OuterEllipse">
+      <Setter Property="Foreground" Value="{DynamicResource RadioButtonForegroundPointerOver}" />
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseStroke}" />
+    </Style>
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFill}" />
+
-  </Style>
+    <Style Selector="^:pointerover /template/ Border#RootBorder">
-
+      <Setter Property="Background" Value="{DynamicResource RadioButtonBackgroundPointerOver}" />
-  <Style Selector="RadioButton /template/ Ellipse#CheckOuterEllipse">
+      <Setter Property="BorderBrush" Value="{DynamicResource RadioButtonBorderBrushPointerOver}" />
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseCheckedStroke}" />
+    </Style>
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseCheckedFill}" />
+
-    <Setter Property="Opacity" Value="0" />
+    <Style Selector="^:pointerover /template/ Ellipse#OuterEllipse">
-  </Style>
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseStrokePointerOver}" />
-
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFillPointerOver}" />
-  <Style Selector="RadioButton /template/ Ellipse#CheckGlyph">
+    </Style>
-    <Setter Property="Opacity" Value="0" />
+
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckGlyphStroke}" />
+    <Style Selector="^:pointerover /template/ Ellipse#CheckOuterEllipse">
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckGlyphFill}" />
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseCheckedStrokePointerOver}" />
-  </Style>
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseCheckedFillPointerOver}" />
-
+    </Style>
-  <!-- PointerOver State -->
+
-  <Style Selector="RadioButton:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+    <Style Selector="^:pointerover /template/ Ellipse#CheckGlyph">
-    <Setter Property="Foreground" Value="{DynamicResource RadioButtonForegroundPointerOver}" />
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckGlyphStrokePointerOver}" />
-  </Style>
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckGlyphFillPointerOver}" />
-
+    </Style>
-  <Style Selector="RadioButton:pointerover /template/ Border#RootBorder">
+
-    <Setter Property="Background" Value="{DynamicResource RadioButtonBackgroundPointerOver}" />
+
-    <Setter Property="BorderBrush" Value="{DynamicResource RadioButtonBorderBrushPointerOver}" />
+    <!--  Pressed State  -->
-  </Style>
+    <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
-
+      <Setter Property="Foreground" Value="{DynamicResource RadioButtonForegroundPressed}" />
-  <Style Selector="RadioButton:pointerover /template/ Ellipse#OuterEllipse">
+    </Style>
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseStrokePointerOver}" />
+
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFillPointerOver}" />
+    <Style Selector="^:pressed /template/ Border#RootBorder">
-  </Style>
+      <Setter Property="Background" Value="{DynamicResource RadioButtonBackgroundPressed}" />
-
+      <Setter Property="BorderBrush" Value="{DynamicResource RadioButtonBorderBrushPressed}" />
-  <Style Selector="RadioButton:pointerover /template/ Ellipse#CheckOuterEllipse">
+    </Style>
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseCheckedStrokePointerOver}" />
+
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseCheckedFillPointerOver}" />
+    <Style Selector="^:pressed /template/ Ellipse#OuterEllipse">
-  </Style>
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseStrokePressed}" />
-
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFillPressed}" />
-  <Style Selector="RadioButton:pointerover /template/ Ellipse#CheckGlyph">
+    </Style>
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckGlyphStrokePointerOver}" />
+
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckGlyphFillPointerOver}" />
+    <Style Selector="^:pressed /template/ Ellipse#CheckOuterEllipse">
-  </Style>
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseCheckedStrokePressed}" />
-
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseCheckedFillPressed}" />
-
+    </Style>
-  <!-- Pressed State -->
+
-  <Style Selector="RadioButton:pressed /template/ ContentPresenter#PART_ContentPresenter">
+    <Style Selector="^:pressed /template/ Ellipse#CheckGlyph">
-    <Setter Property="Foreground" Value="{DynamicResource RadioButtonForegroundPressed}" />
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckGlyphStrokePressed}" />
-  </Style>
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckGlyphFillPressed}" />
-
+    </Style>
-  <Style Selector="RadioButton:pressed /template/ Border#RootBorder">
+
-    <Setter Property="Background" Value="{DynamicResource RadioButtonBackgroundPressed}" />
+
-    <Setter Property="BorderBrush" Value="{DynamicResource RadioButtonBorderBrushPressed}" />
+    <!--  Disabled State  -->
-  </Style>
+    <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
-
+      <Setter Property="Foreground" Value="{DynamicResource RadioButtonForegroundDisabled}" />
-  <Style Selector="RadioButton:pressed /template/ Ellipse#OuterEllipse">
+    </Style>
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseStrokePressed}" />
+
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFillPressed}" />
+    <Style Selector="^:disabled /template/ Border#RootBorder">
-  </Style>
+      <Setter Property="Background" Value="{DynamicResource RadioButtonBackgroundDisabled}" />
-
+      <Setter Property="BorderBrush" Value="{DynamicResource RadioButtonBorderBrushDisabled}" />
-  <Style Selector="RadioButton:pressed /template/ Ellipse#CheckOuterEllipse">
+    </Style>
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseCheckedStrokePressed}" />
+
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseCheckedFillPressed}" />
+    <Style Selector="^:disabled /template/ Ellipse#OuterEllipse">
-  </Style>
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseStrokeDisabled}" />
-
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFillDisabled}" />
-  <Style Selector="RadioButton:pressed /template/ Ellipse#CheckGlyph">
+    </Style>
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckGlyphStrokePressed}" />
+
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckGlyphFillPressed}" />
+    <Style Selector="^:disabled /template/ Ellipse#CheckOuterEllipse">
-  </Style>
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseCheckedStrokeDisabled}" />
-
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseCheckedFillDisabled}" />
-
+    </Style>
-  <!-- Disabled State -->
+
-  <Style Selector="RadioButton:disabled /template/ ContentPresenter#PART_ContentPresenter">
+    <Style Selector="^:disabled /template/ Ellipse#CheckGlyph">
-    <Setter Property="Foreground" Value="{DynamicResource RadioButtonForegroundDisabled}" />
+      <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckGlyphFillDisabled}" />
-  </Style>
+      <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckGlyphStrokeDisabled}" />
-
+    </Style>
-  <Style Selector="RadioButton:disabled /template/ Border#RootBorder">
+
-    <Setter Property="Background" Value="{DynamicResource RadioButtonBackgroundDisabled}" />
+
-    <Setter Property="BorderBrush" Value="{DynamicResource RadioButtonBorderBrushDisabled}" />
+    <!--  Checked State  -->
-  </Style>
+    <Style Selector="^:checked /template/ Ellipse#CheckGlyph">
-
+      <Setter Property="Opacity" Value="1" />
-  <Style Selector="RadioButton:disabled /template/ Ellipse#OuterEllipse">
+    </Style>
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseStrokeDisabled}" />
+
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFillDisabled}" />
+    <Style Selector="^:checked /template/ Ellipse#OuterEllipse">
-  </Style>
+      <Setter Property="Opacity" Value="0" />
-
+    </Style>
-  <Style Selector="RadioButton:disabled /template/ Ellipse#CheckOuterEllipse">
+
-    <Setter Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseCheckedStrokeDisabled}" />
+    <Style Selector="^:checked /template/ Ellipse#CheckOuterEllipse">
-    <Setter Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseCheckedFillDisabled}" />
+      <Setter Property="Opacity" Value="1" />
-  </Style>
+    </Style>
-
+  </ControlTheme>
-  <Style Selector="RadioButton:disabled /template/ Ellipse#CheckGlyph">
+</ResourceDictionary>
-    <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>

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">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-  <Design.PreviewWith>
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Border Padding="20">
+    <Design.PreviewWith>
-      <StackPanel Spacing="20">
+      <Border Padding="20">
-        <RepeatButton Content="Click Me!" />
+        <StackPanel Spacing="20">
-      </StackPanel>
+          <RepeatButton Content="Click Me!" />
-    </Border>
+        </StackPanel>
-  </Design.PreviewWith>
+      </Border>
-  <Styles.Resources>
+    </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">
+    <ControlTheme x:Key="{x:Type RepeatButton}" TargetType="RepeatButton">
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+      <Setter Property="Background" Value="{DynamicResource RepeatButtonBackground}" />
-  </Style>
+      <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">
+      <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource RepeatButtonBackgroundPointerOver}" />
+        <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrushPointerOver}" />
+      </Style>
-    <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundPointerOver}" />
-  </Style>
 
-  <Style Selector="RepeatButton:pressed  /template/ ContentPresenter#PART_ContentPresenter">
+      <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource RepeatButtonBackgroundPressed}" />
+        <Setter Property="Background" Value="{DynamicResource RepeatButtonBackgroundPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrushPressed}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrushPointerOver}" />
-    <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundPressed}" />
+        <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundPointerOver}" />
-  </Style>
+      </Style>
 
-  <Style Selector="RepeatButton:disabled /template/ ContentPresenter#PART_ContentPresenter">
+      <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource RepeatButtonBackgroundDisabled}" />
+        <Setter Property="Background" Value="{DynamicResource RepeatButtonBackgroundPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrushDisabled}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource RepeatButtonBorderBrushPressed}" />
-    <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundDisabled}" />
+        <Setter Property="Foreground" Value="{DynamicResource RepeatButtonForegroundPressed}" />
-  </Style>
+      </Style>
-</Styles>
+
+      <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>

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}" />

src/Avalonia.Themes.Fluent/Controls/ScrollViewer.xaml

@@ -1,160 +1,87 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary 
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+  xmlns="https://github.com/avaloniaui"
-        xmlns:converters="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls">
+  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-
+  xmlns:converters="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls">
-  <Design.PreviewWith>
+    <Design.PreviewWith>
-    <Grid ColumnDefinitions="*,20,*"
+      <Grid ColumnDefinitions="*,20,*" Height="300" Width="200" Margin="20">
-          Height="300"
+        <ScrollViewer>
-          Width="200"
+          <Border Height="1000" Background="#ccc" />
-          Margin="20">
+        </ScrollViewer>
-      <ScrollViewer>
+        <ScrollViewer Grid.Column="2" Classes="menuscroller">
-        <Border Height="1000" Background="#ccc"/>
+          <Border Height="1000" Background="#ccc" />
-      </ScrollViewer>
+        </ScrollViewer>
-      <ScrollViewer Grid.Column="2" Classes="menuscroller">
+      </Grid>
-        <Border Height="1000" Background="#ccc"/>
+    </Design.PreviewWith>
-      </ScrollViewer>
-    </Grid>
-  </Design.PreviewWith>
   
-  <Style Selector="ScrollViewer">
+    <ControlTheme x:Key="{x:Type ScrollViewer}" TargetType="ScrollViewer">
-    <Setter Property="Background"
+      <Setter Property="Background" Value="Transparent" />
-            Value="Transparent" />
+      <Setter Property="Template">
-    <Setter Property="Template">
+        <ControlTemplate>
-      <ControlTemplate>
+          <Grid ColumnDefinitions="*,Auto" RowDefinitions="*,Auto">
-        <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 Name="PART_ContentPresenter"
+              <ScrollContentPresenter.GestureRecognizers>
-                                  Grid.Row="0"
+                <ScrollGestureRecognizer CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}" CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}" />
-                                  Grid.Column="0"
+              </ScrollContentPresenter.GestureRecognizers>
-                                  Grid.RowSpan="2"
+            </ScrollContentPresenter>
-                                  Grid.ColumnSpan="2"
+            <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" />
-                                  Background="{TemplateBinding Background}"
+            <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" />
-                                  CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}"
+            <Panel x:Name="PART_ScrollBarsSeparator" Grid.Row="1" Grid.Column="1" Background="{DynamicResource ScrollViewerScrollBarsSeparatorBackground}" />
-                                  CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}"
+          </Grid>
-                                  Content="{TemplateBinding Content}"
+        </ControlTemplate>
-                                  Extent="{TemplateBinding Extent, Mode=TwoWay}"
+      </Setter>
-                                  Padding="{TemplateBinding Padding}"
+      <Style Selector="^ /template/ Panel#PART_ScrollBarsSeparator">
-                                  Offset="{TemplateBinding Offset, Mode=TwoWay}"
+        <Setter Property="Opacity" Value="0" />
-                                  Viewport="{TemplateBinding Viewport, Mode=TwoWay}"
+        <Setter Property="Transitions">
-                                  IsScrollChainingEnabled="{TemplateBinding IsScrollChainingEnabled}">
+          <Transitions>
-            <ScrollContentPresenter.GestureRecognizers>
+            <DoubleTransition Property="Opacity" Duration="0:0:0.1" />
-              <ScrollGestureRecognizer
+          </Transitions>
-                CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}"
+        </Setter>
-                CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}" />
+      </Style>
-            </ScrollContentPresenter.GestureRecognizers>
+      <Style Selector="^[IsExpanded=true] /template/ Panel#PART_ScrollBarsSeparator">
-          </ScrollContentPresenter>
+        <Setter Property="Opacity" Value="1" />
-          <ScrollBar Name="PART_HorizontalScrollBar"
+      </Style>
-                     AllowAutoHide="{TemplateBinding AllowAutoHide}"
+      <Style Selector="^.menuscroller">
-                     Orientation="Horizontal"
+        <Setter Property="Template">
-                     LargeChange="{Binding LargeChange.Width, RelativeSource={RelativeSource TemplatedParent}}"
+          <ControlTemplate>
-                     SmallChange="{Binding SmallChange.Width, RelativeSource={RelativeSource TemplatedParent}}"
+            <DockPanel>
-                     Maximum="{TemplateBinding HorizontalScrollBarMaximum}"
+              <RepeatButton DockPanel.Dock="Top" BorderThickness="0" Background="Transparent" HorizontalAlignment="Stretch" HorizontalContentAlignment="Center" RenderTransform="{x:Null}" Command="{Binding LineUp, RelativeSource={RelativeSource TemplatedParent}}">
-                     Value="{TemplateBinding HorizontalScrollBarValue, Mode=TwoWay}"
+                <RepeatButton.IsVisible>
-                     ViewportSize="{TemplateBinding HorizontalScrollBarViewportSize}"
+                  <MultiBinding Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}" ConverterParameter="0">
-                     Visibility="{TemplateBinding HorizontalScrollBarVisibility}"
+                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="VerticalScrollBarVisibility" />
-                     Grid.Row="1"
+                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Offset.Y" />
-                     Focusable="False" />
+                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Extent.Height" />
-          <ScrollBar Name="PART_VerticalScrollBar"
+                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Viewport.Height" />
-                     AllowAutoHide="{TemplateBinding AllowAutoHide}"
+                  </MultiBinding>
-                     Orientation="Vertical"
+                </RepeatButton.IsVisible>
-                     LargeChange="{Binding LargeChange.Height, RelativeSource={RelativeSource TemplatedParent}}"
+                <Viewbox Width="{DynamicResource ScrollBarButtonArrowIconFontSize}" Height="{DynamicResource ScrollBarButtonArrowIconFontSize}">
-                     SmallChange="{Binding SmallChange.Height, RelativeSource={RelativeSource TemplatedParent}}"
+                  <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" />
-                     Maximum="{TemplateBinding VerticalScrollBarMaximum}"
+                </Viewbox>
-                     Value="{TemplateBinding VerticalScrollBarValue, Mode=TwoWay}"
+              </RepeatButton>
-                     ViewportSize="{TemplateBinding VerticalScrollBarViewportSize}"
+              <RepeatButton DockPanel.Dock="Bottom" BorderThickness="0" Background="Transparent" HorizontalAlignment="Stretch" HorizontalContentAlignment="Center" RenderTransform="{x:Null}" Command="{Binding LineDown, RelativeSource={RelativeSource TemplatedParent}}">
-                     Visibility="{TemplateBinding VerticalScrollBarVisibility}"
+                <RepeatButton.IsVisible>
-                     Grid.Column="1"
+                  <MultiBinding Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}" ConverterParameter="100">
-                     Focusable="False" />
+                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="VerticalScrollBarVisibility" />
-          <Panel x:Name="PART_ScrollBarsSeparator" Grid.Row="1" Grid.Column="1" Background="{DynamicResource ScrollViewerScrollBarsSeparatorBackground}" />
+                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Offset.Y" />
-        </Grid>
+                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Extent.Height" />
-      </ControlTemplate>
+                    <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Viewport.Height" />
-    </Setter>
+                  </MultiBinding>
-  </Style>
+                </RepeatButton.IsVisible>
-
+                <Viewbox Width="{DynamicResource ScrollBarButtonArrowIconFontSize}" Height="{DynamicResource ScrollBarButtonArrowIconFontSize}">
-  <Style Selector="ScrollViewer /template/ Panel#PART_ScrollBarsSeparator">
+                  <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" />
-    <Setter Property="Opacity" Value="0" />
+                </Viewbox>
-    <Setter Property="Transitions">
+              </RepeatButton>
-      <Transitions>
+              <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}" />
-        <DoubleTransition Property="Opacity" Duration="0:0:0.1" />
+            </DockPanel>
-      </Transitions>
+          </ControlTemplate>
-    </Setter>
+        </Setter>
-  </Style>
+        <Style Selector="^ /template/ RepeatButton">
-
+          <Style Selector="^ > Viewbox > Path">
-  <Style Selector="ScrollViewer[IsExpanded=true] /template/ Panel#PART_ScrollBarsSeparator">
+            <Setter Property="Fill" Value="{DynamicResource ScrollBarButtonArrowForeground}" />
-    <Setter Property="Opacity" Value="1" />
+          </Style>
-  </Style>
+          <Style Selector="^:pointerover > Viewbox > Path">
-
+            <Setter Property="Fill" Value="{DynamicResource ScrollBarButtonArrowForegroundPointerOver}" />
-  <Style Selector="ScrollViewer.menuscroller">
+          </Style>
-    <Setter Property="Template">
+        </Style>
-      <ControlTemplate>
+      </Style>
-        <DockPanel>
+    </ControlTheme>
-          <RepeatButton DockPanel.Dock="Top"
+</ResourceDictionary>
-                        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>

src/Avalonia.Themes.Fluent/Controls/Separator.xaml

@@ -1,7 +1,7 @@
-<Styles xmlns="https://github.com/avaloniaui">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Style Selector="Separator">
+  <ControlTheme x:Key="{x:Type Separator}" TargetType="Separator">
-    <Setter Property="Focusable" Value="False"/>
+    <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>
+  </ControlTheme>
-
+</ResourceDictionary>
-</Styles>

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">
+<ResourceDictionary 
-  <Design.PreviewWith>
+  xmlns="https://github.com/avaloniaui" 
-    <Border Margin="20" Width="200" Height="200">
+  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-      <DockPanel LastChildFill="True">
+     <Design.PreviewWith>
-        <StackPanel Spacing="10" DockPanel.Dock="Top">
+      <Border Margin="20" Width="200" Height="200">
-          <Slider Value="50" />
+        <DockPanel LastChildFill="True">
-          <Slider IsEnabled="False" Value="50" />
+          <StackPanel Spacing="10" DockPanel.Dock="Top">
-        </StackPanel>
+            <Slider Value="50" />
-        <StackPanel Spacing="10" Orientation="Horizontal">
+            <Slider IsEnabled="False" Value="50" />
-          <Slider Value="50" Orientation="Vertical" />
+          </StackPanel>
-          <Slider IsEnabled="False" Orientation="Vertical" Value="50" />
+          <StackPanel Spacing="10" Orientation="Horizontal">
-        </StackPanel>
+            <Slider Value="50" Orientation="Vertical" />
-      </DockPanel>
+            <Slider IsEnabled="False" Orientation="Vertical" Value="50" />
-    </Border>
+          </StackPanel>
-  </Design.PreviewWith>
+        </DockPanel>
-  <Styles.Resources>
+      </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>
-        <ControlTemplate>
+        <Grid>
-          <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{DynamicResource SliderThumbCornerRadius}" />
+          <Border
-        </ControlTemplate>
+              Name="FocusTarget"
-      </Setter.Value>
+              Margin="0,-10"
+              Background="Transparent" />
+          <Border
+              Name="TrackBackground"
+              Background="{TemplateBinding Background}"
+              CornerRadius="{DynamicResource ControlCornerRadius}" />
+        </Grid>
+      </ControlTemplate>
     </Setter>
-  </Style>
+  </ControlTheme>
-  <Style Selector="Slider:horizontal">
+  
-    <Setter Property="Background" Value="{DynamicResource SliderTrackFill}" />
+  <ControlTheme x:Key="FluentHorizontalSliderDecreaseIncreaseRepeatButtonTheme" TargetType="RepeatButton" BasedOn="{StaticResource FluentBaseSliderDecreaseIncreaseRepeatButtonTheme}">
-    <Setter Property="BorderThickness" Value="{DynamicResource SliderBorderThemeThickness}" />
+    <Setter Property="Height" Value="{DynamicResource SliderTrackThemeHeight}"/>
-    <Setter Property="Foreground" Value="{DynamicResource SliderTrackValueFill}" />    
+    <Setter Property="VerticalAlignment" Value="Center"/>
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+  </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
-          <Border BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="{TemplateBinding CornerRadius}">
+            Background="{TemplateBinding Background}"
-            <Grid Name="grid" Margin="{TemplateBinding Padding}" RowDefinitions="Auto, *">
+            BorderBrush="{TemplateBinding BorderBrush}"
-              <ContentPresenter x:Name="HeaderContentPresenter" Grid.Row="0" TextElement.FontWeight="{DynamicResource SliderHeaderThemeFontWeight}" TextElement.Foreground="{DynamicResource SliderHeaderForeground}"
+            BorderThickness="{TemplateBinding BorderThickness}"
-              Margin="{DynamicResource SliderTopHeaderMargin}" />
+            CornerRadius="{DynamicResource SliderThumbCornerRadius}" />
-              <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>
       </ControlTemplate>
     </Setter>
-  </Style>
+  </ControlTheme>
-  <Style Selector="Slider:vertical">
+  
+  <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">
+    <Style Selector="^:horizontal">
-      <ControlTemplate>
+        <Setter Property="Template">
-        <DataValidationErrors>
+            <ControlTemplate>
-          <Border BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="{TemplateBinding CornerRadius}">
+                <DataValidationErrors>
-            <Grid Name="grid" Margin="{TemplateBinding Padding}" RowDefinitions="Auto, *">
+                    <Border
-              <ContentPresenter x:Name="HeaderContentPresenter" Grid.Row="0" TextElement.FontWeight="{DynamicResource SliderHeaderThemeFontWeight}" TextElement.Foreground="{DynamicResource SliderHeaderForeground}"
+                        BorderBrush="{TemplateBinding BorderBrush}"
-              Margin="{DynamicResource SliderTopHeaderMargin}" />
+                        BorderThickness="{TemplateBinding BorderThickness}"
-              <Grid x:Name="SliderContainer" Grid.Row="1">
+                        CornerRadius="{TemplateBinding CornerRadius}">
-                <Grid.Styles>
+                        <Grid
-                  <Style Selector="TickBar">
+                            Name="grid"
-                    <Setter Property="ReservedSpace" Value="{Binding #PART_Track.Thumb.Bounds}" />
+                            Margin="{TemplateBinding Padding}"
-                  </Style>
+                            RowDefinitions="Auto, *">
-                </Grid.Styles>
+                            <ContentPresenter
-                <Grid x:Name="VerticalTemplate" RowDefinitions="*,Auto,Auto" MinWidth="{DynamicResource SliderVerticalWidth}">
+                                x:Name="HeaderContentPresenter"
-                  <Grid.ColumnDefinitions>
+                                Grid.Row="0"
-                    <ColumnDefinition Width="{DynamicResource SliderPreContentMargin}" />
+                                Margin="{DynamicResource SliderTopHeaderMargin}"
-                    <ColumnDefinition Width="Auto" />
+                                TextElement.FontWeight="{DynamicResource SliderHeaderThemeFontWeight}"
-                    <ColumnDefinition Width="{DynamicResource SliderPostContentMargin}" />
+                                TextElement.Foreground="{DynamicResource SliderHeaderForeground}" />
-                  </Grid.ColumnDefinitions>
+                            <Grid x:Name="SliderContainer" Grid.Row="1">
-                  <TickBar Name="LeftTickBar" Placement="Left" Width="{DynamicResource SliderOutsideTickBarThemeHeight}" HorizontalAlignment="Right" Margin="0,0,4,0" Grid.RowSpan="3" />
+                                <Grid.Styles>
-                  <!-- <TickBar Name="VerticalInlineTickBar" Placement="Inline" Fill="{DynamicResource SliderInlineTickBarFill}" Width="{DynamicResource SliderTrackThemeHeight}" Grid.Column="1" Grid.RowSpan="3" /> -->
+                                    <Style Selector="TickBar">
-                  <TickBar Name="RightTickBar" Placement="Right" Width="{DynamicResource SliderOutsideTickBarThemeHeight}" HorizontalAlignment="Left" Margin="4,0,0,0" Grid.Column="2" Grid.RowSpan="3" />
+                                        <Setter Property="ReservedSpace" Value="{Binding #PART_Track.Thumb.Bounds}" />
-                  <Track Name="PART_Track" Grid.Column="1" Grid.ColumnSpan="1" Grid.RowSpan="3" IsDirectionReversed="{TemplateBinding IsDirectionReversed}" Orientation="Vertical">
+                                    </Style>
-                    <Track.DecreaseButton>
+                                </Grid.Styles>
-                      <RepeatButton Name="PART_DecreaseButton" Background="{TemplateBinding Foreground}" Focusable="False" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
+                                <Grid
-                        <RepeatButton.Template>
+                                    x:Name="HorizontalTemplate"
-                          <ControlTemplate>
+                                    MinHeight="{DynamicResource SliderHorizontalHeight}"
-                            <Grid>
+                                    ColumnDefinitions="Auto,Auto,*">
-                              <Border Name="FocusTarget" Background="Transparent" Margin="0,-10" />
+                                    <Grid.RowDefinitions>
-                              <Border Name="TrackBackground" Background="{TemplateBinding Background}" CornerRadius="{DynamicResource ControlCornerRadius}" Width="{DynamicResource SliderTrackThemeHeight}" HorizontalAlignment="Center" />
+                                        <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>
+                        </Grid>
-                        </RepeatButton.Template>
+                    </Border>
-                      </RepeatButton>
+                </DataValidationErrors>
-                    </Track.DecreaseButton>
+            </ControlTemplate>
-                    <Track.IncreaseButton>
+        </Setter>
-                      <RepeatButton Name="PART_IncreaseButton" Background="{TemplateBinding Background}" Focusable="False" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
+    </Style>
-                        <RepeatButton.Template>
+    <Style Selector="^:vertical">
-                          <ControlTemplate>
+        <Setter Property="Template">
-                            <Grid>
+            <ControlTemplate>
-                              <Border Name="FocusTarget" Background="Transparent" Margin="0,-10" />
+                <DataValidationErrors>
-                              <Border Name="TrackBackground" Background="{TemplateBinding Background}" CornerRadius="{DynamicResource ControlCornerRadius}" Width="{DynamicResource SliderTrackThemeHeight}" HorizontalAlignment="Center" />
+                    <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>
+                        </Grid>
-                        </RepeatButton.Template>
+                    </Border>
-                      </RepeatButton>
+                </DataValidationErrors>
-                    </Track.IncreaseButton>
+            </ControlTemplate>
-                    <Thumb Classes="SliderThumbStyle" Name="SliderThumb" Margin="0" Padding="0" DataContext="{TemplateBinding Value}" Height="{DynamicResource SliderVerticalThumbHeight}" Width="{DynamicResource SliderVerticalThumbWidth}" />
+        </Setter>
-                  </Track>
+    </Style>
-                </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>
 
-  <Style Selector="Slider /template/ Grid#SliderContainer">
+    <!--  Normal State  -->
-    <Setter Property="Background" Value="{DynamicResource SliderContainerBackground}" />
-  </Style>
 
-  <Style Selector="Slider /template/ TickBar">
+    <Style Selector="^ /template/">
-    <Setter Property="IsVisible" Value="False" />
+      <Style Selector="^Thumb.SliderThumbStyle">
-    <Setter Property="Ticks" Value="{TemplateBinding Ticks}" />
+        <Setter Property="Background" Value="{DynamicResource SliderThumbBackground}" />
-  </Style>
+      </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">
+    <Style Selector="^[TickPlacement=TopLeft] /template/ TickBar#LeftTickBar, ^[TickPlacement=Outside] /template/ TickBar#LeftTickBar">
-    <Setter Property="IsVisible" Value="True" />
+        <Setter Property="IsVisible" Value="True" />
-  </Style>
+    </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="Slider:disabled /template/ ContentPresenter#HeaderContentPresenter">
+    <Style Selector="^[TickPlacement=TopLeft] /template/ TickBar#TopTickBar, ^[TickPlacement=Outside] /template/ TickBar#TopTickBar">
-    <Setter Property="Foreground" Value="{DynamicResource SliderHeaderForegroundDisabled}" />
+        <Setter Property="IsVisible" Value="True" />
-  </Style>
+    </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>
 
-  <!-- PointerOver State -->
+    <Style Selector="^[TickPlacement=BottomRight] /template/ TickBar#BottomTickBar, ^[TickPlacement=Outside] /template/ TickBar#BottomTickBar">
-  <Style Selector="Slider:pointerover /template/ RepeatButton#PART_IncreaseButton">
+        <Setter Property="IsVisible" Value="True" />
-    <Setter Property="Background" Value="{DynamicResource SliderTrackFillPointerOver}" />
+    </Style>
-  </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>
 
-  <!-- Pressed State -->
+    <Style Selector="^[TickPlacement=BottomRight] /template/ TickBar#RightTickBar, ^[TickPlacement=Outside] /template/ TickBar#RightTickBar">
-  <Style Selector="Slider:pressed /template/ RepeatButton#PART_IncreaseButton">
+        <Setter Property="IsVisible" Value="True" />
-    <Setter Property="Background" Value="{DynamicResource SliderTrackFillPressed}" />
+    </Style>
-  </Style>
 
-  <Style Selector="Slider:pressed /template/ Thumb.SliderThumbStyle">
+    <!--  Disabled State  -->
-    <Setter Property="Background" Value="{DynamicResource SliderThumbBackgroundPressed}" />
+
-  </Style>
+    <Style Selector="^:disabled /template/">
-  
+      <Style Selector="^ContentPresenter#HeaderContentPresenter">
-  <Style Selector="Slider:pointerover /template/ Grid#SliderContainer">
+        <Setter Property="Foreground" Value="{DynamicResource SliderHeaderForegroundDisabled}" />
-    <Setter Property="Background" Value="{DynamicResource SliderContainerBackgroundPressed}" />
+      </Style>
-  </Style>
+      <Style Selector="^RepeatButton#PART_DecreaseButton">
-  
+        <Setter Property="Background" Value="{DynamicResource SliderTrackValueFillDisabled}" />
-  <Style Selector="Slider:pointerover /template/ RepeatButton#PART_DecreaseButton">
+      </Style>
-    <Setter Property="Background" Value="{DynamicResource SliderTrackValueFillPressed}" />
+
-  </Style>
+      <Style Selector="^RepeatButton#PART_IncreaseButton">
-  
+        <Setter Property="Background" Value="{DynamicResource SliderTrackFillDisabled}" />
-  <Style Selector="Slider:error /template/ Thumb.SliderThumbStyle">
+      </Style>
-    <Setter Property="Background" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
+
-  </Style>
+      <Style Selector="^Thumb.SliderThumbStyle">
-  
+        <Setter Property="Background" Value="{DynamicResource SliderThumbBackgroundDisabled}" />
-  <Style Selector="Slider:error">
+      </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>
+      <Style Selector="^/template/ Thumb.SliderThumbStyle">
-</Styles>
+        <Setter Property="Background" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
+      </Style>
+    </Style>
+
+  </ControlTheme>
+</ResourceDictionary>

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>

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>

src/Avalonia.Themes.Fluent/Controls/TabControl.xaml

@@ -1,65 +1,63 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Design.PreviewWith>
+    <Design.PreviewWith>
-    <Border Width="400">
+      <Border Width="400">
-      <TabControl>
+        <TabControl>
-        <TabItem Header="Arch">
+          <TabItem Header="Arch">
-          <Border Background="AntiqueWhite"
+            <Border Background="AntiqueWhite"
-                  Height="100">
+                    Height="100">
-            <TextBlock Text="Content" Foreground="Black" FontSize="20"/>
+              <TextBlock Text="Content" Foreground="Black" FontSize="20"/>
-          </Border>
+            </Border>
-        </TabItem>
+          </TabItem>
-        <TabItem Header="Leaf">
+          <TabItem Header="Leaf">
-          <Border Background="Green"
+            <Border Background="Green"
-                  Height="100" />
+                    Height="100" />
-        </TabItem>
+          </TabItem>
-        <TabItem Header="Disabled"
+          <TabItem Header="Disabled"
-                 IsEnabled="False" />
+                   IsEnabled="False" />
-      </TabControl>
+        </TabControl>
-    </Border>
+      </Border>
-  </Design.PreviewWith>
+    </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">
+    <ControlTheme x:Key="{x:Type TabControl}" TargetType="TabControl">
-    <Setter Property="Orientation" Value="Vertical" />
+      <Setter Property="Margin" Value="0" />
-  </Style>
+      <Setter Property="Padding" Value="{DynamicResource TabItemMargin}" />
-  <Style Selector="TabControl[TabStripPlacement=Right] /template/ ItemsPresenter#PART_ItemsPresenter > WrapPanel">
+      <Setter Property="Background" Value="{DynamicResource TabControlBackground}" />
-    <Setter Property="Orientation" Value="Vertical" />
+      <Setter Property="Template">
-  </Style>
+        <ControlTemplate>
-  <Style Selector="TabControl[TabStripPlacement=Top] /template/ ItemsPresenter#PART_ItemsPresenter">
+          <Border BorderBrush="{TemplateBinding BorderBrush}"
-    <Setter Property="Margin" Value="{DynamicResource TabControlTopPlacementItemMargin}" />
+                  BorderThickness="{TemplateBinding BorderThickness}"
-  </Style>
+                  CornerRadius="{TemplateBinding CornerRadius}"
-</Styles>
+                  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>

src/Avalonia.Themes.Fluent/Controls/TabItem.xaml

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

src/Avalonia.Themes.Fluent/Controls/TabStrip.xaml

@@ -1,32 +1,34 @@
-<Styles xmlns="https://github.com/avaloniaui">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-  <Design.PreviewWith>
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Border Padding="20">
+    <Design.PreviewWith>
-      <TabStrip>
+      <Border Padding="20">
-        <TabStripItem>Item 1</TabStripItem>
+        <TabStrip>
-        <TabStripItem>Item 2</TabStripItem>
+          <TabStripItem>Item 1</TabStripItem>
-        <TabStripItem IsEnabled="False">Disabled</TabStripItem>
+          <TabStripItem>Item 2</TabStripItem>
-      </TabStrip>
+          <TabStripItem IsEnabled="False">Disabled</TabStripItem>
-    </Border>
+        </TabStrip>
-  </Design.PreviewWith>
+      </Border>
-  <Style Selector="TabStrip">
+    </Design.PreviewWith>
-    <Setter Property="Template">
+  
-      <ControlTemplate>
+    <ControlTheme x:Key="{x:Type TabStrip}" TargetType="TabStrip">
-        <Border Background="{TemplateBinding Background}"
+      <Setter Property="Template">
-                BorderBrush="{TemplateBinding BorderBrush}"
+        <ControlTemplate>
-                BorderThickness="{TemplateBinding BorderThickness}"
+          <Border Background="{TemplateBinding Background}"
-                CornerRadius="{TemplateBinding CornerRadius}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
-                Padding="{TemplateBinding Padding}">
+                  BorderThickness="{TemplateBinding BorderThickness}"
-          <ItemsPresenter Name="PART_ItemsPresenter"
+                  CornerRadius="{TemplateBinding CornerRadius}"
-                          Items="{TemplateBinding Items}"
+                  Padding="{TemplateBinding Padding}">
-                          ItemsPanel="{TemplateBinding ItemsPanel}"
+            <ItemsPresenter Name="PART_ItemsPresenter"
-                          ItemTemplate="{TemplateBinding ItemTemplate}" />
+                            Items="{TemplateBinding Items}"
-        </Border>
+                            ItemsPanel="{TemplateBinding ItemsPanel}"
-      </ControlTemplate>
+                            ItemTemplate="{TemplateBinding ItemTemplate}" />
-    </Setter>
+          </Border>
-    <Setter Property="ItemsPanel">
+        </ControlTemplate>
-      <ItemsPanelTemplate>
+      </Setter>
-        <WrapPanel />
+      <Setter Property="ItemsPanel">
-      </ItemsPanelTemplate>
+        <ItemsPanelTemplate>
-    </Setter>
+          <WrapPanel />
-  </Style>
+        </ItemsPanelTemplate>
-</Styles>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>

src/Avalonia.Themes.Fluent/Controls/TabStripItem.xaml

@@ -1,107 +1,108 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns="https://github.com/avaloniaui"
-        x:CompileBindings="True">
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-  <Design.PreviewWith>
+    x:CompileBindings="True">
-    <Border Padding="20">
+     <Design.PreviewWith>
-      <StackPanel Spacing="20">
+      <Border Padding="20">
-        <TabStripItem>Leaf</TabStripItem>
+        <StackPanel Spacing="20">
-        <TabStripItem IsSelected="True">Arch</TabStripItem>
+          <TabStripItem>Leaf</TabStripItem>
-      </StackPanel>
+          <TabStripItem IsSelected="True">Arch</TabStripItem>
-    </Border>
+        </StackPanel>
-  </Design.PreviewWith>
+      </Border>
-  <Styles.Resources>
+    </Design.PreviewWith>
+  
     <x:Double x:Key="TabStripItemMinHeight">48</x:Double>
     <x:Double x:Key="TabStripItemPipeThickness">2</x:Double>
-  </Styles.Resources>
 
-  <Style Selector="TabStripItem">
+    <ControlTheme x:Key="{x:Type TabStripItem}" TargetType="TabStripItem">
-    <Setter Property="FontSize" Value="{DynamicResource TabItemHeaderFontSize}" />
+        <Setter Property="FontSize" Value="{DynamicResource TabItemHeaderFontSize}" />
-    <Setter Property="FontWeight" Value="{DynamicResource TabItemHeaderThemeFontWeight}" />
+        <Setter Property="FontWeight" Value="{DynamicResource TabItemHeaderThemeFontWeight}" />
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselected}" />
+        <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselected}" />
-    <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselected}" />
+        <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselected}" />
-    <Setter Property="Padding" Value="{DynamicResource TabItemHeaderMargin}" />
+        <Setter Property="Padding" Value="{DynamicResource TabItemHeaderMargin}" />
-    <Setter Property="Margin" Value="0" />
+        <Setter Property="Margin" Value="0" />
-    <Setter Property="MinHeight" Value="{DynamicResource TabStripItemMinHeight}" />
+        <Setter Property="MinHeight" Value="{DynamicResource TabStripItemMinHeight}" />
-    <Setter Property="VerticalContentAlignment" Value="Center" />
+        <Setter Property="VerticalContentAlignment" Value="Center" />
-    <Setter Property="Template">
+        <Setter Property="Template">
-      <ControlTemplate>
+            <ControlTemplate>
-        <Border Name="PART_LayoutRoot"
+                <Border
-                BorderBrush="{TemplateBinding BorderBrush}"
+                    Name="PART_LayoutRoot"
-                BorderThickness="{TemplateBinding BorderThickness}"
+                    Padding="{TemplateBinding Padding}"
-                CornerRadius="{TemplateBinding CornerRadius}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
-                Padding="{TemplateBinding Padding}">
+                    BorderThickness="{TemplateBinding BorderThickness}"
-          <Panel>
+                    CornerRadius="{TemplateBinding CornerRadius}">
-            <ContentPresenter Name="PART_ContentPresenter"
+                    <Panel>
-                              ContentTemplate="{TemplateBinding ContentTemplate}"
+                        <ContentPresenter
-                              Content="{TemplateBinding Content}"
+                            Name="PART_ContentPresenter"
-                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                              FontFamily="{TemplateBinding FontFamily}"
+                            Content="{TemplateBinding Content}"
-                              FontSize="{TemplateBinding FontSize}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
-                              FontWeight="{TemplateBinding FontWeight}" />
+                            FontFamily="{TemplateBinding FontFamily}"
-            <Border Name="PART_SelectedPipe"
+                            FontSize="{TemplateBinding FontSize}"
-                    Background="{DynamicResource TabItemHeaderSelectedPipeFill}" />
+                            FontWeight="{TemplateBinding FontWeight}" />
-          </Panel>
+                        <Border Name="PART_SelectedPipe" Background="{DynamicResource TabItemHeaderSelectedPipeFill}" />
-        </Border>
+                    </Panel>
-      </ControlTemplate>
+                </Border>
-    </Setter>
+            </ControlTemplate>
-  </Style>
+        </Setter>
 
-  <Style Selector="TabStripItem /template/ Border#PART_SelectedPipe">
+        <Style Selector="^ /template/ Border#PART_SelectedPipe">
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+            <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-  </Style>
+        </Style>
 
-  <!--  Nornal state  -->
+        <!--  Nornal state  -->
-  <Style Selector="TabStripItem /template/ Border#PART_LayoutRoot">
+        <Style Selector="^ /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{Binding $parent[TabStripItem].Background}" />
+            <Setter Property="Background" Value="{Binding $parent[TabStripItem].Background}" />
-  </Style>
+        </Style>
-  <Style Selector="TabStripItem /template/ Border#PART_SelectedPipe">
+        <Style Selector="^ /template/ Border#PART_SelectedPipe">
-    <Setter Property="IsVisible" Value="False" />
+            <Setter Property="IsVisible" Value="False" />
-  </Style>
+        </Style>
-  <Style Selector="TabStripItem /template/ Border#PART_SelectedPipe, TabItem[TabStripPlacement=Bottom] /template/ Border#PART_SelectedPipe">
+        <Style Selector="^ /template/ Border#PART_SelectedPipe">
-    <Setter Property="Height" Value="{DynamicResource TabStripItemPipeThickness}" />
+            <Setter Property="Height" Value="{DynamicResource TabStripItemPipeThickness}" />
-    <Setter Property="Margin" Value="0,0,0,2" />
+            <Setter Property="Margin" Value="0,0,0,2" />
-    <Setter Property="HorizontalAlignment" Value="Stretch" />
+            <Setter Property="HorizontalAlignment" Value="Stretch" />
-    <Setter Property="VerticalAlignment" Value="Bottom" />
+            <Setter Property="VerticalAlignment" Value="Bottom" />
-  </Style>
+        </Style>
 
-  <!--  Selected state  -->
+        <!--  Selected state  -->
-  <!--  We don't use selector to PART_LayoutRoot, so developer can override selected item background with TabStripItem.Background  -->
+        <!--  We don't use selector to PART_LayoutRoot, so developer can override selected item background with TabStripItem.Background  -->
-  <Style Selector="TabStripItem:selected">
+        <Style Selector="^:selected">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelected}" />
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelected}" />
-    <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundSelected}" />
+            <Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundSelected}" />
-  </Style>
+        </Style>
-  <Style Selector="TabStripItem:selected /template/ Border#PART_SelectedPipe">
+        <Style Selector="^:selected /template/ Border#PART_SelectedPipe">
-    <Setter Property="IsVisible" Value="True" />
+            <Setter Property="IsVisible" Value="True" />
-  </Style>
+        </Style>
 
-  <!--  PointerOver state  -->
+        <!--  PointerOver state  -->
-  <Style Selector="TabStripItem:pointerover /template/ Border#PART_LayoutRoot">
+        <Style Selector="^:pointerover /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPointerOver}" />
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPointerOver}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPointerOver}" />
+            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPointerOver}" />
-  </Style>
+        </Style>
 
-  <!--  Selected PointerOver state  -->
+        <!--  Selected PointerOver state  -->
-  <Style Selector="TabStripItem:selected:pointerover /template/ Border#PART_LayoutRoot">
+        <Style Selector="^:selected:pointerover /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPointerOver}" />
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPointerOver}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPointerOver}" />
+            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPointerOver}" />
-  </Style>
+        </Style>
 
-  <!--  Pressed state  -->
+        <!--  Pressed state  -->
-  <Style Selector="TabStripItem:pressed /template/ Border#PART_LayoutRoot">
+        <Style Selector="^:pressed /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPressed}" />
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPressed}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPressed}" />
+            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPressed}" />
-  </Style>
+        </Style>
 
-  <!--  Selected Pressed state  -->
+        <!--  Selected Pressed state  -->
-  <Style Selector="TabStripItem:selected:pressed /template/ Border#PART_LayoutRoot">
+        <Style Selector="^:selected:pressed /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPressed}" />
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundSelectedPressed}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPressed}" />
+            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundSelectedPressed}" />
-  </Style>
+        </Style>
 
-  <!--  Disabled state  -->
+        <!--  Disabled state  -->
-  <Style Selector="TabStripItem:disabled /template/ Border#PART_LayoutRoot">
+        <Style Selector="^:disabled /template/ Border#PART_LayoutRoot">
-    <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundDisabled}" />
+            <Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundDisabled}" />
-    <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundDisabled}" />
+            <Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundDisabled}" />
-  </Style>
+        </Style>
-</Styles>
+    </ControlTheme>
+</ResourceDictionary>

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>
+                    <Panel>
-                        <TextBlock Name="PART_Watermark"
+                      <TextBlock Name="PART_Watermark"
-                                Opacity="0.5"
+                              Opacity="0.5"
-                                Text="{TemplateBinding Watermark}"
+                              Text="{TemplateBinding Watermark}"
-                                TextAlignment="{TemplateBinding TextAlignment}"
+                              TextAlignment="{TemplateBinding TextAlignment}"
-                                TextWrapping="{TemplateBinding TextWrapping}"
+                              TextWrapping="{TemplateBinding TextWrapping}"
-                                IsVisible="{TemplateBinding Text, Converter={x:Static StringConverters.IsNullOrEmpty}}"
+                              IsVisible="{TemplateBinding Text, Converter={x:Static StringConverters.IsNullOrEmpty}}"
-                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
+                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
+                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
-                        <TextPresenter Name="PART_TextPresenter"
+                      <TextPresenter Name="PART_TextPresenter"
-                                      Text="{TemplateBinding Text, Mode=TwoWay}"
+                                    Text="{TemplateBinding Text, Mode=TwoWay}"
-                                      CaretIndex="{TemplateBinding CaretIndex}"
+                                    CaretIndex="{TemplateBinding CaretIndex}"
-                                      SelectionStart="{TemplateBinding SelectionStart}"
+                                    SelectionStart="{TemplateBinding SelectionStart}"
-                                      SelectionEnd="{TemplateBinding SelectionEnd}"
+                                    SelectionEnd="{TemplateBinding SelectionEnd}"
-                                      TextAlignment="{TemplateBinding TextAlignment}"
+                                    TextAlignment="{TemplateBinding TextAlignment}"
-                                      TextWrapping="{TemplateBinding TextWrapping}"
+                                    TextWrapping="{TemplateBinding TextWrapping}"
-                                      LineHeight="{TemplateBinding LineHeight}"
+                                    LineHeight="{TemplateBinding LineHeight}"
-                                      PasswordChar="{TemplateBinding PasswordChar}"
+                                    PasswordChar="{TemplateBinding PasswordChar}"
-                                      RevealPassword="{TemplateBinding RevealPassword}"
+                                    RevealPassword="{TemplateBinding RevealPassword}"
-                                      SelectionBrush="{TemplateBinding SelectionBrush}"
+                                    SelectionBrush="{TemplateBinding SelectionBrush}"
-                                      SelectionForegroundBrush="{TemplateBinding SelectionForegroundBrush}"
+                                    SelectionForegroundBrush="{TemplateBinding SelectionForegroundBrush}"
-                                      CaretBrush="{TemplateBinding CaretBrush}"
+                                    CaretBrush="{TemplateBinding CaretBrush}"
-                                      HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
+                                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
+                                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
-                      </Panel>
+                    </Panel>
-                    </ScrollViewer>
+                  </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">

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>
+    <ControlTheme x:Key="FluentTimePicker" TargetType="TimePicker">
-
+      <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-  <Style Selector="ListBoxItem.DateTimePickerItem.HourItem">
+      <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForeground}" />
-    <Setter Property="Padding" Value="{DynamicResource TimePickerFlyoutPresenterItemPadding}" />
+      <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackground}" />
-  </Style>
+      <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrush}" />
-  <Style Selector="ListBoxItem.DateTimePickerItem.MinuteItem">
+      <Setter Property="BorderThickness" Value="{DynamicResource TimePickerBorderThemeThickness}" />
-    <Setter Property="Padding" Value="{DynamicResource TimePickerFlyoutPresenterItemPadding}" />
+      <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-  </Style>
+      <Setter Property="HorizontalAlignment" Value="Left" />
-  <Style Selector="ListBoxItem.DateTimePickerItem.TimePeriodItem">
+      <Setter Property="VerticalAlignment" Value="Center" />
-    <Setter Property="Padding" Value="{DynamicResource TimePickerFlyoutPresenterItemPadding}" />
+      <Setter Property="Template">
-  </Style>
+        <ControlTemplate>
-
+          <DataValidationErrors>
-  <Style Selector="TimePicker">    
+            <Grid Name="LayoutRoot" Margin="{TemplateBinding Padding}" RowDefinitions="Auto,*">
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+              <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" />
-    <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForeground}" />
+              <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">
-    <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackground}"/>
+                <Button.Template>
-    <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrush}"/>
+                  <ControlTemplate>
-    <Setter Property="BorderThickness" Value="{DynamicResource TimePickerBorderThemeThickness}"/>
+                    <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" />
-    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+                  </ControlTemplate>
-    <Setter Property="HorizontalAlignment" Value="Left" />
+                </Button.Template>
-    <Setter Property="VerticalAlignment" Value="Center" />
+                <Grid Name="FlyoutButtonContentGrid">
-    <Setter Property="Template">
+                  <!--Ignore col defs here, set in code-->
-      <ControlTemplate>
+                  <Border x:Name="FirstPickerHost" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-        <DataValidationErrors>
+                    <TextBlock x:Name="HourTextBlock" HorizontalAlignment="Center" Padding="{DynamicResource TimePickerHostPadding}" FontFamily="{TemplateBinding FontFamily}" FontWeight="{TemplateBinding FontWeight}" FontSize="{TemplateBinding FontSize}" />
-          <Grid Name="LayoutRoot" Margin="{TemplateBinding Padding}" RowDefinitions="Auto,*">
+                  </Border>
-            <ContentPresenter x:Name="HeaderContentPresenter"
+                  <Rectangle Name="FirstColumnDivider" Fill="{DynamicResource TimePickerSpacerFill}" HorizontalAlignment="Center" Width="{DynamicResource TimePickerSpacerThemeWidth}" Grid.Column="1" />
-                   Grid.Row="0"
+                  <Border x:Name="SecondPickerHost" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                   Content="{TemplateBinding Header}"
+                    <TextBlock x:Name="MinuteTextBlock" HorizontalAlignment="Center" Padding="{DynamicResource TimePickerHostPadding}" FontFamily="{TemplateBinding FontFamily}" FontWeight="{TemplateBinding FontWeight}" FontSize="{TemplateBinding FontSize}" />
-                   ContentTemplate="{TemplateBinding HeaderTemplate}"
+                  </Border>
-                   Margin="{DynamicResource TimePickerTopHeaderMargin}"
+                  <Rectangle Name="SecondColumnDivider" Fill="{DynamicResource TimePickerSpacerFill}" HorizontalAlignment="Center" Width="{DynamicResource TimePickerSpacerThemeWidth}" Grid.Column="3" />
-                   MaxWidth="{DynamicResource TimePickerThemeMaxWidth}"
+                  <Border x:Name="ThirdPickerHost" Grid.Column="4" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                   Foreground="{DynamicResource TimePickerHeaderForeground}"
+                    <TextBlock x:Name="PeriodTextBlock" HorizontalAlignment="Center" Padding="{DynamicResource TimePickerHostPadding}" FontFamily="{TemplateBinding FontFamily}" FontWeight="{TemplateBinding FontWeight}" FontSize="{TemplateBinding FontSize}" />
-                   HorizontalAlignment="Stretch"
+                  </Border>
-                   VerticalAlignment="Top" />
+                </Grid>
-
+              </Button>
-            <Button x:Name="FlyoutButton"
+              <Popup Name="Popup" WindowManagerAddShadowHint="False" IsLightDismissEnabled="True" PlacementTarget="{TemplateBinding}" PlacementMode="Bottom">
-                    Grid.Row="1"
+                <TimePickerPresenter Name="PickerPresenter" />
-                    Foreground="{TemplateBinding Foreground}"
+              </Popup>
-                    Background="{TemplateBinding Background}"
+            </Grid>
-                    BorderBrush="{TemplateBinding BorderBrush}"
+          </DataValidationErrors>
-                    BorderThickness="{TemplateBinding BorderThickness}"
+        </ControlTemplate>
-                    CornerRadius="{TemplateBinding CornerRadius}"
+      </Setter>
-                    IsEnabled="{TemplateBinding IsEnabled}"
+      <Style Selector="^:hasnotime /template/ Button#FlyoutButton TextBlock">
-                    MinWidth="{DynamicResource TimePickerThemeMinWidth}"
+        <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForeground}" />
-                    MaxWidth="{DynamicResource TimePickerThemeMaxWidth}"
+      </Style>
-                    HorizontalAlignment="Stretch"
+      <!--<Style Selector="^:error /template/ Button#FlyoutButton /template/ ContentPresenter">
-                    HorizontalContentAlignment="Stretch"
+        <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
-                    VerticalAlignment="Top"
+      </Style>
-                    VerticalContentAlignment="Stretch">
+      <Style Selector="^ /template/ Button">
-              <Button.Template>
+        <Style Selector="^#FlyoutButton:pointerover /template/ ContentPresenter">
-                <ControlTemplate>
+          <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackgroundPointerOver}" />
-                  <ContentPresenter Name="ContentPresenter"
+          <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrushPointerOver}" />
-                                  BorderBrush="{TemplateBinding BorderBrush}"
+          <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForegroundPointerOver}" />
-                                  Background="{TemplateBinding Background}"
+        </Style>
-                                  BorderThickness="{TemplateBinding BorderThickness}"
+        <Style Selector="^:pressed /template/ ContentPresenter">
-                                  CornerRadius="{TemplateBinding CornerRadius}"
+          <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackgroundPressed}" />
-                                  Content="{TemplateBinding Content}"
+          <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrushPressed}" />
-                                  Foreground="{TemplateBinding Foreground}"
+          <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForegroundPressed}" />
-                                  HorizontalContentAlignment="Stretch"
+        </Style>
-                                  VerticalContentAlignment="Stretch" />
+        <Style Selector="^:disabled /template/ ContentPresenter">
-                </ControlTemplate>
+          <Setter Property="Background" Value="{DynamicResource TimePickerButtonBackgroundDisabled}" />
-              </Button.Template>
+          <Setter Property="BorderBrush" Value="{DynamicResource TimePickerButtonBorderBrushDisabled}" />
-
+          <Setter Property="Foreground" Value="{DynamicResource TimePickerButtonForegroundDisabled}" />
-              <Grid Name="FlyoutButtonContentGrid">
+        </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">
+                <Panel Name="HourHost" Grid.Column="0">
-                  <TextBlock x:Name="HourTextBlock"
+                  <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Hidden">
-                      HorizontalAlignment="Center"
+                    <DateTimePickerPanel Name="HourSelector" PanelType="Hour" ShouldLoop="True" ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}" />
-                      Padding="{DynamicResource TimePickerHostPadding}"
+                  </ScrollViewer>
-                      FontFamily="{TemplateBinding FontFamily}"
+                  <RepeatButton Name="HourUpButton" Classes="DateTimeFlyoutButtonStyle UpButton" />
-                      FontWeight="{TemplateBinding FontWeight}"
+                  <RepeatButton Name="HourDownButton" Classes="DateTimeFlyoutButtonStyle DownButton" />
-                      FontSize="{TemplateBinding FontSize}" />
+                </Panel>
-                </Border>
+                <Panel Name="MinuteHost" Grid.Column="2">
-
+                  <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Hidden">
-                <Rectangle Name="FirstColumnDivider"
+                    <DateTimePickerPanel Name="MinuteSelector" PanelType="Minute" ShouldLoop="True" ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}" />
-                    Fill="{DynamicResource TimePickerSpacerFill}"
+                  </ScrollViewer>
-                    HorizontalAlignment="Center"
+                  <RepeatButton Name="MinuteUpButton" Classes="DateTimeFlyoutButtonStyle UpButton" />
-                    Width="{DynamicResource TimePickerSpacerThemeWidth}"
+                  <RepeatButton Name="MinuteDownButton" Classes="DateTimeFlyoutButtonStyle DownButton" />
-                    Grid.Column="1" />
+                </Panel>
-
+                <Panel Name="PeriodHost" Grid.Column="4">
-                <Border x:Name="SecondPickerHost" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                  <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Hidden">
-                  <TextBlock x:Name="MinuteTextBlock"
+                    <DateTimePickerPanel Name="PeriodSelector" PanelType="TimePeriod" ShouldLoop="False" ItemHeight="{DynamicResource TimePickerFlyoutPresenterItemHeight}" />
-                      HorizontalAlignment="Center"
+                  </ScrollViewer>
-                      Padding="{DynamicResource TimePickerHostPadding}"
+                  <RepeatButton Name="PeriodUpButton" Classes="DateTimeFlyoutButtonStyle UpButton" />
-                      FontFamily="{TemplateBinding FontFamily}"
+                  <RepeatButton Name="PeriodDownButton" Classes="DateTimeFlyoutButtonStyle DownButton" />
-                      FontWeight="{TemplateBinding FontWeight}"
+                </Panel>
-                      FontSize="{TemplateBinding FontSize}"/>
+                <Rectangle x:Name="HighlightRect" ZIndex="-1" Fill="{DynamicResource TimePickerFlyoutPresenterHighlightFill}" Grid.Column="0" Grid.ColumnSpan="5" VerticalAlignment="Center" Height="{DynamicResource TimePickerFlyoutPresenterHighlightHeight}" />
-                </Border>
+                <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" />
-                <Rectangle Name="SecondColumnDivider"
+              </Grid>
-                    Fill="{DynamicResource TimePickerSpacerFill}"
+              <Grid Grid.Row="1" Height="{DynamicResource TimePickerFlyoutPresenterAcceptDismissHostGridHeight}" Name="AcceptDismissHostGrid" ColumnDefinitions="*,*">
-                    HorizontalAlignment="Center"
+                <Rectangle Height="{DynamicResource TimePickerSpacerThemeWidth}" VerticalAlignment="Top" Fill="{DynamicResource TimePickerFlyoutPresenterSpacerFill}" Grid.ColumnSpan="2" />
-                    Width="{DynamicResource TimePickerSpacerThemeWidth}"
+                <Button Name="AcceptButton" Grid.Column="0" Classes="DateTimeFlyoutButtonStyle" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                    Grid.Column="3" />
+                  <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round" StrokeThickness="0.75" Data="M0.5,8.5 5,13.5 15.5,3" />
-
+                </Button>
-                <Border x:Name="ThirdPickerHost" Grid.Column="4" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                <Button Name="DismissButton" Grid.Column="1" Classes="DateTimeFlyoutButtonStyle" FontSize="16" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                  <TextBlock x:Name="PeriodTextBlock"
+                  <Path Stroke="{Binding $parent[Button].Foreground}" StrokeLineCap="Round" StrokeThickness="0.75" Data="M2,2 14,14 M2,14 14 2" />
-                      HorizontalAlignment="Center"
+                </Button>
-                      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>
-
-  <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>
-
+          </Border>
-          </Grid>
+        </ControlTemplate>
-        </Border>
+      </Setter>
-      </ControlTemplate>
+      <Style Selector="^ /template/ Panel">
-    </Setter>
+        <Style Selector="^ RepeatButton">
-  </Style>
+          <Setter Property="IsVisible" Value="False" />
-
+        </Style>
-  <Style Selector="TimePickerPresenter /template/ Panel RepeatButton">
+        <Style Selector="^:pointerover RepeatButton">
-    <Setter Property="IsVisible" Value="False" />
+          <Setter Property="IsVisible" Value="True" />
+        </Style>
+      </Style>
+    </ControlTheme>
+  </Styles.Resources>
+  <Style Selector="TimePicker">
+    <Setter Property="Theme" Value="{StaticResource FluentTimePicker}" />
   </Style>
-
+  <Style Selector="TimePickerPresenter">
-  <Style Selector="TimePickerPresenter /template/ Panel:pointerover RepeatButton">
+    <Setter Property="Theme" Value="{StaticResource FluentTimePickerPresenter}" />
-    <Setter Property="IsVisible" Value="True" />
   </Style>
-  
 </Styles>

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">
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-  <Design.PreviewWith>
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Border>
+    <Design.PreviewWith>
-      <TitleBar Background="SkyBlue" Height="30" Width="300" Foreground="Black" />
+      <Border>
-    </Border>
+        <TitleBar Background="SkyBlue" Height="30" Width="300" Foreground="Black" />
-  </Design.PreviewWith>
+      </Border>
-  <Style Selector="TitleBar">
+    </Design.PreviewWith>
-    <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}"/>    
+
-    <Setter Property="VerticalAlignment" Value="Top" />
+    <ControlTheme x:Key="{x:Type TitleBar}" TargetType="TitleBar">
-    <Setter Property="HorizontalAlignment" Value="Stretch" />
+      <Setter Property="Foreground" Value="{DynamicResource SystemControlForegroundBaseHighBrush}" />
-    <Setter Property="Background" Value="Transparent" />
+      <Setter Property="VerticalAlignment" Value="Top" />
-    <Setter Property="Template">
+      <Setter Property="HorizontalAlignment" Value="Stretch" />
-      <ControlTemplate>
+      <Setter Property="Background" Value="Transparent" />
-        <Panel HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="Stretch">
+      <Setter Property="Template">
-          <Panel x:Name="PART_MouseTracker" Height="1" VerticalAlignment="Top" />
+        <ControlTemplate>
-          <Panel x:Name="PART_Container">
+          <Panel HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="Stretch">
-            <Border x:Name="PART_Background" Background="{TemplateBinding Background}" />
+            <Panel x:Name="PART_MouseTracker" Height="1" VerticalAlignment="Top" />
-            <CaptionButtons x:Name="PART_CaptionButtons" VerticalAlignment="Top" HorizontalAlignment="Right" Foreground="{TemplateBinding Foreground}" />
+            <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>
-      </ControlTemplate>
+      </Setter>
-    </Setter>
-  </Style>
 
-  <Style Selector="TitleBar:fullscreen">
+      <Style Selector="^:fullscreen">
-    <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
+        <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
-  </Style>
+      </Style>
 
-  <Style Selector="TitleBar /template/ Border#PART_Background">
+      <Style Selector="^ /template/ Border#PART_Background">
-    <Setter Property="IsHitTestVisible" Value="False" />
+        <Setter Property="IsHitTestVisible" Value="False" />
-  </Style>
+      </Style>
 
-  <Style Selector="TitleBar:fullscreen /template/ Border#PART_Background">
+      <Style Selector="^:fullscreen /template/ Border#PART_Background">
-    <Setter Property="IsHitTestVisible" Value="True" />
+        <Setter Property="IsHitTestVisible" Value="True" />
-  </Style>
+      </Style>
 
-  <Style Selector="TitleBar:fullscreen /template/ Panel#PART_MouseTracker">
+      <Style Selector="^:fullscreen /template/ Panel#PART_MouseTracker">
-    <Setter Property="Background" Value="Transparent" />
+        <Setter Property="Background" Value="Transparent" />
-  </Style>
+      </Style>
 
-  <Style Selector="TitleBar:fullscreen /template/ Panel#PART_Container">
+      <Style Selector="^:fullscreen /template/ Panel#PART_Container">
-    <Setter Property="RenderTransform" Value="translateY(-30px)" />
+        <Setter Property="RenderTransform" Value="translateY(-30px)" />
-    <Setter Property="Transitions">
+        <Setter Property="Transitions">
-      <Transitions>
+          <Transitions>
-        <TransformOperationsTransition Property="RenderTransform" Duration="0:0:.25" />
+            <TransformOperationsTransition Property="RenderTransform" Duration="0:0:.25" />
-      </Transitions>
+          </Transitions>
-    </Setter>
+        </Setter>
-  </Style>
+      </Style>
 
-  <Style Selector="TitleBar:fullscreen:pointerover /template/ Panel#PART_Container">
+      <Style Selector="^:fullscreen:pointerover /template/ Panel#PART_Container">
-    <Setter Property="RenderTransform" Value="none" />
+        <Setter Property="RenderTransform" Value="none" />
-  </Style>
+      </Style>
-</Styles>
+    </ControlTheme>
+</ResourceDictionary>

src/Avalonia.Themes.Fluent/Controls/ToggleButton.xaml

@@ -1,5 +1,5 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+                    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">
+    <ControlTheme x:Key="{x:Type ToggleButton}" TargetType="ToggleButton">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundPointerOver}" />
+      <Setter Property="Background" Value="{DynamicResource ToggleButtonBackground}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushPointerOver}" />
+      <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForeground}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundPointerOver}" />
+      <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrush}" />
-  </Style>
+      <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">
+      <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundPressed}" />
+        <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushPressed}" />
+      </Style>
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundPressed}" />
-  </Style>
 
-  <Style Selector="ToggleButton:disabled /template/ ContentPresenter#PART_ContentPresenter">
+      <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundDisabled}" />
+        <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushDisabled}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushPointerOver}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundDisabled}" />
+        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundPointerOver}" />
-  </Style>
+      </Style>
 
-  <Style Selector="ToggleButton:checked /template/ ContentPresenter#PART_ContentPresenter">
+      <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundChecked}" />
+        <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushChecked}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushPressed}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundChecked}" />
+        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundPressed}" />
-  </Style>
+      </Style>
 
-  <Style Selector="ToggleButton:checked:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+      <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundCheckedPointerOver}" />
+        <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushCheckedPointerOver}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushDisabled}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundCheckedPointerOver}" />
+        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundDisabled}" />
-  </Style>
+      </Style>
 
-  <Style Selector="ToggleButton:checked:pressed /template/ ContentPresenter#PART_ContentPresenter">
+      <Style Selector="^:indeterminate">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundCheckedPressed}" />
+        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushCheckedPressed}" />
+          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminate}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundCheckedPressed}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminate}" />
-  </Style>
+          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminate}" />
+        </Style>
 
-  <Style Selector="ToggleButton:checked:disabled /template/ ContentPresenter#PART_ContentPresenter">
+        <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundCheckedDisabled}" />
+          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminatePointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushCheckedDisabled}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminatePointerOver}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundCheckedDisabled}" />
+          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminatePointerOver}" />
-  </Style>
+        </Style>
 
-  <Style Selector="ToggleButton:indeterminate /template/ ContentPresenter#PART_ContentPresenter">
+        <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminate}" />
+          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminatePressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminate}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminatePressed}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminate}" />
+          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminatePressed}" />
-  </Style>
+        </Style>
 
-  <Style Selector="ToggleButton:indeterminate:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+        <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminatePointerOver}" />
+          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminateDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminatePointerOver}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminateDisabled}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminatePointerOver}" />
+          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminateDisabled}" />
-  </Style>
+        </Style>
+      </Style>
 
-  <Style Selector="ToggleButton:indeterminate:pressed /template/ ContentPresenter#PART_ContentPresenter">
+      <Style Selector="^:checked">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminatePressed}" />
+        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminatePressed}" />
+          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundChecked}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminatePressed}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushChecked}" />
-  </Style>
+          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundChecked}" />
+        </Style>
 
-  <Style Selector="ToggleButton:indeterminate:disabled /template/ ContentPresenter#PART_ContentPresenter">
+        <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-    <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundIndeterminateDisabled}" />
+          <Setter Property="Background" Value="{DynamicResource ToggleButtonBackgroundCheckedPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushIndeterminateDisabled}" />
+          <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonBorderBrushCheckedPointerOver}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundIndeterminateDisabled}" />
+          <Setter Property="Foreground" Value="{DynamicResource ToggleButtonForegroundCheckedPointerOver}" />
-  </Style>
+        </Style>
-</Styles>
+
+        <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>

src/Avalonia.Themes.Fluent/Controls/ToggleSwitch.xaml

@@ -1,288 +1,307 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns="https://github.com/avaloniaui"
-        xmlns:sys="clr-namespace:System;assembly=netstandard">
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-  <Styles.Resources>
+    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
+    <ControlTheme x:Key="{x:Type ToggleSwitch}" TargetType="ToggleSwitch">
-          Text="Previewer"
+        <Setter Property="Foreground" Value="{DynamicResource ToggleSwitchContentForeground}" />
-          Classes="h1"/>
+        <Setter Property="HorizontalAlignment" Value="Left" />
-        <TextBlock
+        <Setter Property="VerticalAlignment" Value="Center" />
-          Text="The previewer Shows a preview off your code, this could slow down your system"
+        <Setter Property="HorizontalContentAlignment" Value="Left" />
-          TextWrapping="Wrap"/>
+        <Setter Property="VerticalContentAlignment" Value="Center" />
-        <ToggleSwitch
+        <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-          Background="Green"
+        <Setter Property="Template">
-          IsChecked="True" />
+            <ControlTemplate>
-      </StackPanel>
+                <Grid Background="{TemplateBinding Background}" RowDefinitions="Auto,*">
-    </StackPanel>
+
-  </Design.PreviewWith>
+                    <ContentPresenter
-
+                        x:Name="PART_ContentPresenter"
-  <Style Selector="ToggleSwitch">
+                        Grid.Row="0"
-    <Setter Property="Foreground" Value="{DynamicResource ToggleSwitchContentForeground}" />
+                        VerticalAlignment="Top"
-    <Setter Property="HorizontalAlignment" Value="Left" />
+                        Content="{TemplateBinding Content}"
-    <Setter Property="VerticalAlignment" Value="Center" />
+                        ContentTemplate="{TemplateBinding ContentTemplate}"
-    <Setter Property="HorizontalContentAlignment" Value="Left" />
+                        RecognizesAccessKey="True" />
-    <Setter Property="VerticalContentAlignment" Value="Center" />
+
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+                    <Grid
-    <Setter Property="Template">
+                        Grid.Row="1"
-      <ControlTemplate>
+                        MinWidth="{DynamicResource ToggleSwitchThemeMinWidth}"
-        <Grid Background="{TemplateBinding Background}"
+                        HorizontalAlignment="Left"
-          RowDefinitions="Auto,*">
+                        VerticalAlignment="Top">
-
+
-          <ContentPresenter x:Name="PART_ContentPresenter"
+                        <Grid.RowDefinitions>
-            Grid.Row="0"
+                            <RowDefinition Height="{DynamicResource ToggleSwitchPreContentMargin}" />
-            Content="{TemplateBinding Content}"
+                            <RowDefinition Height="Auto" />
-            ContentTemplate="{TemplateBinding ContentTemplate}"
+                            <RowDefinition Height="{DynamicResource ToggleSwitchPostContentMargin}" />
-            RecognizesAccessKey="True"
+                        </Grid.RowDefinitions>
-            VerticalAlignment="Top"/>
+
-
+                        <Grid.ColumnDefinitions>
-          <Grid Grid.Row="1"
+                            <ColumnDefinition Width="Auto" />
-            MinWidth="{DynamicResource ToggleSwitchThemeMinWidth}"
+                            <ColumnDefinition Width="12" MaxWidth="12" />
-            HorizontalAlignment="Left"
+                            <ColumnDefinition Width="Auto" />
-            VerticalAlignment="Top">
+                        </Grid.ColumnDefinitions>
-
+
-            <Grid.RowDefinitions>
+                        <Grid
-              <RowDefinition Height="{DynamicResource ToggleSwitchPreContentMargin}" />
+                            x:Name="SwitchAreaGrid"
-              <RowDefinition Height="Auto" />
+                            Grid.RowSpan="3"
-              <RowDefinition Height="{DynamicResource ToggleSwitchPostContentMargin}" />
+                            Grid.ColumnSpan="3"
-            </Grid.RowDefinitions>
+                            Margin="0,5"
-
+                            TemplatedControl.IsTemplateFocusTarget="True" />
-            <Grid.ColumnDefinitions>
+
-              <ColumnDefinition Width="Auto" />
+                        <ContentPresenter
-              <ColumnDefinition Width="12" MaxWidth="12" />
+                            x:Name="PART_OffContentPresenter"
-              <ColumnDefinition Width="Auto" />
+                            Grid.RowSpan="3"
-            </Grid.ColumnDefinitions>
+                            Grid.Column="2"
-
+                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-            <Grid x:Name="SwitchAreaGrid"
+                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-              Grid.RowSpan="3"
+                            Content="{TemplateBinding OffContent}"
-              Grid.ColumnSpan="3"
+                            ContentTemplate="{TemplateBinding OffContentTemplate}" />
-              TemplatedControl.IsTemplateFocusTarget="True"
+
-              Margin="0,5" />
+                        <ContentPresenter
-
+                            x:Name="PART_OnContentPresenter"
-            <ContentPresenter x:Name="PART_OffContentPresenter"
+                            Grid.RowSpan="3"
-              Grid.RowSpan="3"
+                            Grid.Column="2"
-              Grid.Column="2"
+                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-              Content="{TemplateBinding OffContent}"
+                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-              ContentTemplate="{TemplateBinding OffContentTemplate}"
+                            Content="{TemplateBinding OnContent}"
-              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            ContentTemplate="{TemplateBinding OnContentTemplate}" />
-              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
+
-
+                        <Border
-            <ContentPresenter x:Name="PART_OnContentPresenter"
+                            x:Name="OuterBorder"
-              Grid.RowSpan="3"
+                            Grid.Row="1"
-              Grid.Column="2"
+                            Width="40"
-              Content="{TemplateBinding OnContent}"
+                            Height="20"
-              ContentTemplate="{TemplateBinding OnContentTemplate}"
+                            BorderThickness="{DynamicResource ToggleSwitchOuterBorderStrokeThickness}"
-              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            CornerRadius="10" />
-              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
+
-
+                        <Border
-            <Border x:Name="OuterBorder"
+                            x:Name="SwitchKnobBounds"
-              Grid.Row="1"
+                            Grid.Row="1"
-              Height="20"
+                            Width="40"
-              Width="40"
+                            Height="20"
-              CornerRadius="10"
+                            BorderThickness="{DynamicResource ToggleSwitchOnStrokeThickness}"
-              BorderThickness="{DynamicResource ToggleSwitchOuterBorderStrokeThickness}" />
+                            CornerRadius="10" />
-
+
-            <Border x:Name="SwitchKnobBounds"
+                        <Canvas
-              Grid.Row="1"
+                            x:Name="SwitchKnob"
-              Height="20"
+                            Grid.Row="1"
-              Width="40"
+                            Width="20"
-              CornerRadius="10"
+                            Height="20"
-              BorderThickness="{DynamicResource ToggleSwitchOnStrokeThickness}"/>
+                            HorizontalAlignment="Left">
-
+
-            <Canvas x:Name="SwitchKnob" Grid.Row="1"
+                            <Grid
-               HorizontalAlignment="Left"
+                                x:Name="MovingKnobs"
-               Width="20" Height="20">
+                                Width="20"
-
+                                Height="20">
-              <Grid x:Name="MovingKnobs"
+
-                Width="20" Height="20">
+                                <Ellipse
-
+                                    x:Name="SwitchKnobOn"
-                <Ellipse x:Name="SwitchKnobOn"
+                                    Width="10"
-                         Width="10" Height="10" />
+                                    Height="10" />
-
+
-                <Ellipse x:Name="SwitchKnobOff"
+                                <Ellipse
-                         Width="10" Height="10" />
+                                    x:Name="SwitchKnobOff"
-              </Grid>
+                                    Width="10"
-            </Canvas>
+                                    Height="10" />
-          </Grid>
+                            </Grid>
-        </Grid>
+                        </Canvas>
-      </ControlTemplate>
+                    </Grid>
-    </Setter>
+                </Grid>
-  </Style>
+            </ControlTemplate>
-
+        </Setter>
-  <Style Selector="ToggleSwitch /template/ ContentPresenter#PART_ContentPresenter">
+
-    <Setter Property="Margin" Value="{DynamicResource ToggleSwitchTopHeaderMargin}" />
+        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
-  </Style>
+            <Setter Property="Margin" Value="{DynamicResource ToggleSwitchTopHeaderMargin}" />
-  <Style Selector="ToggleSwitch /template/ ContentPresenter#PART_ContentPresenter:empty">
+        </Style>
-    <Setter Property="Margin" Value="0" />
+        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter:empty">
-  </Style>
+            <Setter Property="Margin" Value="0" />
-
+        </Style>
-  <!-- NormalState -->
+
-  <Style Selector="ToggleSwitch /template/ Grid#SwitchAreaGrid">
+        <!--  NormalState  -->
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackground}"/>
+        <Style Selector="^ /template/ Grid#SwitchAreaGrid">
-  </Style>
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackground}" />
-
+        </Style>
-  <Style Selector="ToggleSwitch /template/ Border#OuterBorder">
+
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOff}"/>
+        <Style Selector="^ /template/ Border#OuterBorder">
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOff}"/>
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOff}" />
-  </Style>
+            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOff}" />
-
+        </Style>
-  <Style Selector="ToggleSwitch /template/ Border#SwitchKnobBounds">
+
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOn}"/>
+        <Style Selector="^ /template/ Border#SwitchKnobBounds">
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOn}"/>
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOn}" />
-  </Style>
+            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOn}" />
-
+        </Style>
-  <Style Selector="ToggleSwitch /template/ Ellipse#SwitchKnobOn">
+
-    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOn}"/>
+        <Style Selector="^ /template/ Ellipse#SwitchKnobOn">
-  </Style>
+            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOn}" />
-
+        </Style>
-  <Style Selector="ToggleSwitch /template/ Ellipse#SwitchKnobOff">
+
-    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOff}"/>
+        <Style Selector="^ /template/ Ellipse#SwitchKnobOff">
-  </Style>
+            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOff}" />
-
+        </Style>
-  <Style Selector="ToggleSwitch:not(:dragging) /template/ Grid#MovingKnobs">
+
-    <Setter Property="Transitions">
+        <Style Selector="^:not(:dragging) /template/ Grid#MovingKnobs">
-      <Transitions>
+            <Setter Property="Transitions">
-        <DoubleTransition Property="Canvas.Left" Duration="0:0:0.2" Easing="CubicEaseOut"/>
+                <Transitions>
-      </Transitions>
+                    <DoubleTransition
-    </Setter>
+                        Easing="CubicEaseOut"
-  </Style>
+                        Property="Canvas.Left"
-
+                        Duration="0:0:0.2" />
-  <!-- PointerOverState -->
+                </Transitions>
-  <Style Selector="ToggleSwitch:pointerover /template/ Border#OuterBorder">
+            </Setter>
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffPointerOver}"/>
+        </Style>
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffPointerOver}"/>
+
-  </Style>
+        <!--  PointerOverState  -->
-
+        <Style Selector="^:pointerover /template/ Border#OuterBorder">
-  <Style Selector="ToggleSwitch:pointerover /template/ Ellipse#SwitchKnobOff">
+            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffPointerOver}" />
-    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffPointerOver}"/>
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffPointerOver}" />
-  </Style>
+        </Style>
-
+
-  <Style Selector="ToggleSwitch:pointerover /template/ Ellipse#SwitchKnobOn">
+        <Style Selector="^:pointerover /template/ Ellipse#SwitchKnobOff">
-    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnPointerOver}"/>
+            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffPointerOver}" />
-  </Style>
+        </Style>
-
+
-  <Style Selector="ToggleSwitch:pointerover /template/ Border#SwitchKnobBounds">
+        <Style Selector="^:pointerover /template/ Ellipse#SwitchKnobOn">
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnPointerOver}"/>
+            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnPointerOver}"/>
+        </Style>
-  </Style>
+
-
+        <Style Selector="^:pointerover /template/ Border#SwitchKnobBounds">
-  <Style Selector="ToggleSwitch:pointerover /template/ Grid#SwitchAreaGrid">
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnPointerOver}" />
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundPointerOver}"/>
+            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnPointerOver}" />
-  </Style>
+        </Style>
-
+
-  <!-- PressedState -->
+        <Style Selector="^:pointerover /template/ Grid#SwitchAreaGrid">
-  <Style Selector="ToggleSwitch:pressed /template/ Border#OuterBorder">
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundPointerOver}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffPressed}"/>
+        </Style>
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffPressed}"/>
+
-  </Style>
+        <!--  PressedState  -->
-
+        <Style Selector="^:pressed /template/ Border#OuterBorder">
-  <Style Selector="ToggleSwitch:pressed /template/ Border#SwitchKnobBounds">
+            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffPressed}" />
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnPressed}"/>
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffPressed}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnPressed}"/>
+        </Style>
-  </Style>
+
-
+        <Style Selector="^:pressed /template/ Border#SwitchKnobBounds">
-  <Style Selector="ToggleSwitch:pressed /template/ Ellipse#SwitchKnobOff">
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnPressed}" />
-    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffPressed}"/>
+            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnPressed}" />
-  </Style>
+        </Style>
-
+
-  <Style Selector="ToggleSwitch:pressed /template/ Ellipse#SwitchKnobOn">
+        <Style Selector="^:pressed /template/ Ellipse#SwitchKnobOff">
-    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnPressed}"/>
+            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffPressed}" />
-  </Style>
+        </Style>
-
+
-  <Style Selector="ToggleSwitch:pressed /template/ Grid#SwitchAreaGrid">
+        <Style Selector="^:pressed /template/ Ellipse#SwitchKnobOn">
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundPressed}"/>
+            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnPressed}" />
-  </Style>
+        </Style>
-
+
-  <!-- DisabledState -->
+        <Style Selector="^:pressed /template/ Grid#SwitchAreaGrid">
-  <Style Selector="ToggleSwitch:disabled">
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundPressed}" />
-    <Setter Property="Foreground" Value="{DynamicResource ToggleSwitchHeaderForegroundDisabled}"/>
+        </Style>
-  </Style>
+
-
+        <!--  DisabledState  -->
-  <Style Selector="ToggleSwitch:disabled /template/ Border#OuterBorder">
+        <Style Selector="^:disabled">
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffDisabled}"/>
+            <Setter Property="Foreground" Value="{DynamicResource ToggleSwitchHeaderForegroundDisabled}" />
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffDisabled}"/>
+        </Style>
-  </Style>
+
-
+        <Style Selector="^:disabled /template/ Border#OuterBorder">
-  <Style Selector="ToggleSwitch:disabled /template/ Ellipse#SwitchKnobOff">
+            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffDisabled}" />
-    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffDisabled}"/>
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffDisabled}" />
-  </Style>
+        </Style>
-
+
-  <Style Selector="ToggleSwitch:disabled /template/ Ellipse#SwitchKnobOn">
+        <Style Selector="^:disabled /template/ Ellipse#SwitchKnobOff">
-    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnDisabled}"/>
+            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffDisabled}" />
-  </Style>
+        </Style>
-
+
-  <Style Selector="ToggleSwitch:disabled /template/ Border#SwitchKnobBounds">
+        <Style Selector="^:disabled /template/ Ellipse#SwitchKnobOn">
-    <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnDisabled}"/>
+            <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnDisabled}" />
-    <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnDisabled}"/>
+        </Style>
-  </Style>
+
-
+        <Style Selector="^:disabled /template/ Border#SwitchKnobBounds">
-  <!-- CheckedState -->
+            <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnDisabled}" />
-  <Style Selector="ToggleSwitch:checked /template/ Border#OuterBorder">
+            <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnDisabled}" />
-    <Setter Property="Opacity" Value="0"/>
+        </Style>
-  </Style>
+
-
+        <!--  CheckedState  -->
-  <Style Selector="ToggleSwitch:checked  /template/ Ellipse#SwitchKnobOff">
+        <Style Selector="^:checked /template/ Border#OuterBorder">
-    <Setter Property="Opacity" Value="0"/>
+            <Setter Property="Opacity" Value="0" />
-  </Style>
+        </Style>
-
+
-  <Style Selector="ToggleSwitch:checked  /template/ Border#SwitchKnobBounds">
+        <Style Selector="^:checked  /template/ Ellipse#SwitchKnobOff">
-    <Setter Property="Opacity" Value="1"/>
+            <Setter Property="Opacity" Value="0" />
-  </Style>
+        </Style>
-
+
-  <Style Selector="ToggleSwitch:checked /template/ Ellipse#SwitchKnobOn">
+        <Style Selector="^:checked  /template/ Border#SwitchKnobBounds">
-    <Setter Property="Opacity" Value="1"/>
+            <Setter Property="Opacity" Value="1" />
-  </Style>
+        </Style>
-
+
-  <Style Selector="ToggleSwitch:checked /template/ ContentPresenter#PART_OffContentPresenter">
+        <Style Selector="^:checked /template/ Ellipse#SwitchKnobOn">
-    <Setter Property="Opacity" Value="0"/>
+            <Setter Property="Opacity" Value="1" />
-  </Style>
+        </Style>
-
+
-  <Style Selector="ToggleSwitch:checked /template/ ContentPresenter#PART_OnContentPresenter">
+        <Style Selector="^:checked /template/ ContentPresenter#PART_OffContentPresenter">
-    <Setter Property="Opacity" Value="1"/>
+            <Setter Property="Opacity" Value="0" />
-  </Style>
+        </Style>
-
+
-  <!--UncheckedState -->
+        <Style Selector="^:checked /template/ ContentPresenter#PART_OnContentPresenter">
-  <Style Selector="ToggleSwitch:unchecked /template/ Border#OuterBorder">
+            <Setter Property="Opacity" Value="1" />
-    <Setter Property="Opacity" Value="1"/>
+        </Style>
-  </Style>
+
-
+        <!--  UncheckedState  -->
-  <Style Selector="ToggleSwitch:unchecked /template/ Ellipse#SwitchKnobOff">
+        <Style Selector="^:unchecked /template/ Border#OuterBorder">
-    <Setter Property="Opacity" Value="1"/>
+            <Setter Property="Opacity" Value="1" />
-  </Style>
+        </Style>
-
+
-  <Style Selector="ToggleSwitch:unchecked /template/ Ellipse#SwitchKnobOn">
+        <Style Selector="^:unchecked /template/ Ellipse#SwitchKnobOff">
-    <Setter Property="Opacity" Value="0"/>
+            <Setter Property="Opacity" Value="1" />
-  </Style>
+        </Style>
-
+
-  <Style Selector="ToggleSwitch:unchecked  /template/ Border#SwitchKnobBounds">
+        <Style Selector="^:unchecked /template/ Ellipse#SwitchKnobOn">
-    <Setter Property="Opacity" Value="0"/>
+            <Setter Property="Opacity" Value="0" />
-  </Style>
+        </Style>
-
+
-  <Style Selector="ToggleSwitch:unchecked /template/ ContentPresenter#PART_OffContentPresenter">
+        <Style Selector="^:unchecked  /template/ Border#SwitchKnobBounds">
-    <Setter Property="Opacity" Value="1"/>
+            <Setter Property="Opacity" Value="0" />
-  </Style>
+        </Style>
-
+
-  <Style Selector="ToggleSwitch:unchecked /template/ ContentPresenter#PART_OnContentPresenter">
+        <Style Selector="^:unchecked /template/ ContentPresenter#PART_OffContentPresenter">
-    <Setter Property="Opacity" Value="0"/>
+            <Setter Property="Opacity" Value="1" />
-  </Style>
+        </Style>
-</Styles>
+
+        <Style Selector="^:unchecked /template/ ContentPresenter#PART_OnContentPresenter">
+            <Setter Property="Opacity" Value="0" />
+        </Style>
+    </ControlTheme>
+</ResourceDictionary>

src/Avalonia.Themes.Fluent/Controls/ToolTip.xaml

@@ -1,87 +1,71 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"       
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        xmlns:sys="clr-namespace:System;assembly=netstandard"
+                    xmlns:sys="clr-namespace:System;assembly=netstandard"
-        x:CompileBindings="True">
+                    x:CompileBindings="True">
-
+    <Design.PreviewWith>
-  <Design.PreviewWith>
+      <Grid RowDefinitions="Auto,Auto"
-    <Grid RowDefinitions="Auto,Auto"
+            ColumnDefinitions="Auto,Auto"
-          ColumnDefinitions="Auto,Auto"
+            HorizontalAlignment="Center">
-          HorizontalAlignment="Center">
+        <Border Grid.Column="0"
-      <Border Grid.Column="0"
+                Grid.Row="1"
-              Grid.Row="1"
+                Background="{DynamicResource SystemControlBackgroundAccentBrush}"
-              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.">
-              Margin="5"
+          <TextBlock>Hover Here</TextBlock>
-              Padding="50"
+        </Border>
-              ToolTip.Tip="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.">
+        <CheckBox Grid.Column="1"
-        <TextBlock>Hover Here</TextBlock>
+                  Margin="5"
-      </Border>
+                  Grid.Row="0"
-      <CheckBox Grid.Column="1"
+                  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"
+                Padding="50"
-                IsChecked="{Binding ElementName=Border, Path=(ToolTip.IsOpen)}"
+                ToolTip.Placement="Bottom">
-                Content="ToolTip Open" />
+          <ToolTip.Tip>
-      <Border Name="Border"
+            <StackPanel>
-              Grid.Column="1"
+              <TextBlock Classes="h1">ToolTip</TextBlock>
-              Grid.Row="1"
+              <TextBlock Classes="h2">A control which pops up a hint when a control is hovered</TextBlock>
-              Background="{DynamicResource SystemControlBackgroundAccentBrush}"
+            </StackPanel>
-              Margin="5"
+          </ToolTip.Tip>
-              Padding="50"
+          <TextBlock>ToolTip bottom placement</TextBlock>
-              ToolTip.Placement="Bottom">
+        </Border>
-        <ToolTip.Tip>
+      </Grid>
-          <StackPanel>
+    </Design.PreviewWith>
-            <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">
+    <ControlTheme x:Key="{x:Type ToolTip}" TargetType="ToolTip">
-    <Setter Property="TextWrapping" Value="Wrap" />
+      <Setter Property="Foreground" Value="{DynamicResource ToolTipForeground}" />
-  </Style>
+      <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">
+      <!--<Style Selector="^ > TextBlock">
-    <Setter Property="Opacity" Value="0" />
+        <Setter Property="TextWrapping" Value="Wrap" />
-  </Style>
+      </Style>-->
 
-  <Style Selector="ToolTip:open">
+      <Style Selector="^:open">
-    <Setter Property="Opacity" Value="1" />
+        <Setter Property="Opacity" Value="1" />
-  </Style>
+      </Style>
-</Styles>
+    </ControlTheme>
+</ResourceDictionary>

src/Avalonia.Themes.Fluent/Controls/TransitioningContentControl.xaml

@@ -1,20 +1,19 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Style Selector="TransitioningContentControl">
+    <ControlTheme x:Key="{x:Type TransitioningContentControl}" TargetType="TransitioningContentControl">
-    <!-- Set Defaults -->
+      <Setter Property="Template">
-    <Setter Property="Template">
+        <ControlTemplate>
-      <ControlTemplate>
+          <ContentPresenter Name="PART_ContentPresenter"
-        <ContentPresenter Name="PART_ContentPresenter"
+                            Background="{TemplateBinding Background}" 
-                          Background="{TemplateBinding Background}"
+                            BorderBrush="{TemplateBinding BorderBrush}"
-                          BorderBrush="{TemplateBinding BorderBrush}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
-                          BorderThickness="{TemplateBinding BorderThickness}"
+                            CornerRadius="{TemplateBinding CornerRadius}"
-                          CornerRadius="{TemplateBinding CornerRadius}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
-                          ContentTemplate="{TemplateBinding ContentTemplate}"
+                            Content="{TemplateBinding CurrentContent}"
-                          Content="{TemplateBinding CurrentContent}"
+                            Padding="{TemplateBinding Padding}"
-                          Padding="{TemplateBinding Padding}"
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" />
-                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
+        </ControlTemplate>
-      </ControlTemplate>
+      </Setter>
-    </Setter>
+    </ControlTheme>
-  </Style>
+</ResourceDictionary>
-</Styles>

src/Avalonia.Themes.Fluent/Controls/TreeView.xaml

@@ -1,28 +1,31 @@
-<Style xmlns="https://github.com/avaloniaui"
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
-       Selector="TreeView">
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-  <Setter Property="Background" Value="Transparent" />
+
-  <Setter Property="BorderBrush" Value="Transparent" />
+    <ControlTheme x:Key="{x:Type TreeView}" TargetType="TreeView">
-  <Setter Property="BorderThickness" Value="0" />
+      <Setter Property="Background" Value="Transparent" />
-  <Setter Property="Padding" Value="0" />
+      <Setter Property="BorderBrush" Value="Transparent" />
-  <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
+      <Setter Property="BorderThickness" Value="0" />
-  <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
+      <Setter Property="Padding" Value="0" />
-  <Setter Property="ScrollViewer.IsScrollChainingEnabled" Value="True" />
+      <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
-  <Setter Property="Template">
+      <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
-    <ControlTemplate>
+      <Setter Property="ScrollViewer.IsScrollChainingEnabled" Value="True" />
-      <Border BorderBrush="{TemplateBinding BorderBrush}"
+      <Setter Property="Template">
-              BorderThickness="{TemplateBinding BorderThickness}"
+        <ControlTemplate>
-              CornerRadius="{TemplateBinding CornerRadius}">
+          <Border BorderBrush="{TemplateBinding BorderBrush}"
-        <ScrollViewer Background="{TemplateBinding Background}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
-                      HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}"
+                  CornerRadius="{TemplateBinding CornerRadius}">
-                      VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}"
+            <ScrollViewer Background="{TemplateBinding Background}"
-                      IsScrollChainingEnabled="{TemplateBinding (ScrollViewer.IsScrollChainingEnabled)}"
+                          HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}"
-                      AllowAutoHide="{TemplateBinding (ScrollViewer.AllowAutoHide)}">
+                          VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}"
-          <ItemsPresenter Name="PART_ItemsPresenter"
+                          IsScrollChainingEnabled="{TemplateBinding (ScrollViewer.IsScrollChainingEnabled)}"
-                          Items="{TemplateBinding Items}"
+                          AllowAutoHide="{TemplateBinding (ScrollViewer.AllowAutoHide)}">
-                          ItemsPanel="{TemplateBinding ItemsPanel}"
+              <ItemsPresenter Name="PART_ItemsPresenter"
-                          Margin="{TemplateBinding Padding}" />
+                              Items="{TemplateBinding Items}"
-        </ScrollViewer>
+                              ItemsPanel="{TemplateBinding ItemsPanel}"
-      </Border>
+                              Margin="{TemplateBinding Padding}" />
-    </ControlTemplate>
+            </ScrollViewer>
-  </Setter>
+          </Border>
-</Style>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+</ResourceDictionary>

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}" />

src/Avalonia.Themes.Fluent/Controls/UserControl.xaml

@@ -1,16 +1,24 @@
-<Style xmlns="https://github.com/avaloniaui" Selector=":is(UserControl)">
+<Style xmlns="https://github.com/avaloniaui"
-  <Setter Property="Template">
+       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    <ControlTemplate>
+       Selector=":is(UserControl)">
-      <ContentPresenter Name="PART_ContentPresenter"
+  <Style.Resources>
-                        Background="{TemplateBinding Background}"
+    <ControlTheme x:Key="FluentUserControl" TargetType="UserControl">
-                        BorderBrush="{TemplateBinding BorderBrush}"
+      <Setter Property="Template">
-                        BorderThickness="{TemplateBinding BorderThickness}"
+        <ControlTemplate>
-                        CornerRadius="{TemplateBinding CornerRadius}"
+          <ContentPresenter Name="PART_ContentPresenter"
-                        ContentTemplate="{TemplateBinding ContentTemplate}"
+                            Background="{TemplateBinding Background}"
-                        Content="{TemplateBinding Content}"
+                            BorderBrush="{TemplateBinding BorderBrush}"
-                        Padding="{TemplateBinding Padding}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
-                        VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                            CornerRadius="{TemplateBinding CornerRadius}"
-                        HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
-    </ControlTemplate>
+                            Content="{TemplateBinding Content}"
-  </Setter>
+                            Padding="{TemplateBinding Padding}"
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
+        </ControlTemplate>
+      </Setter>
+    </ControlTheme>
+  </Style.Resources>
+  
+  <Setter Property="Theme" Value="{StaticResource FluentUserControl}" />
 </Style>

src/Avalonia.Themes.Fluent/Controls/Window.xaml

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

src/Avalonia.Themes.Fluent/Controls/WindowNotificationManager.xaml

@@ -1,47 +1,58 @@
-<Styles xmlns="https://github.com/avaloniaui"
+<ResourceDictionary
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns="https://github.com/avaloniaui"
-        x:DataType="WindowNotificationManager"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        x:CompileBindings="True">
+    x:CompileBindings="True"
-  <Style Selector="WindowNotificationManager">
+    x:DataType="WindowNotificationManager">
-    <Setter Property="Margin" Value="0 0"/>    
+    <ControlTheme x:Key="{x:Type WindowNotificationManager}" TargetType="WindowNotificationManager">
-    <Setter Property="Template">
+        <Setter Property="Margin" Value="0 0" />
-      <ControlTemplate>
+        <Setter Property="Template">
-        <ReversibleStackPanel Name="PART_Items">
+            <ControlTemplate>
-          <ReversibleStackPanel.DataTemplates>
+                <ReversibleStackPanel Name="PART_Items">
-            <DataTemplate DataType="INotification">
+                    <ReversibleStackPanel.DataTemplates>
-              <StackPanel Spacing="8" Margin="12" TextElement.Foreground="{DynamicResource SystemControlForegroundBaseHighBrush}">
+                        <DataTemplate DataType="INotification">
-                <TextBlock Text="{Binding Title}" FontWeight="Medium" />
+                            <StackPanel
-                <TextBlock MaxHeight="80" Text="{Binding Message}" TextWrapping="Wrap" Margin="0,0,12,0"/>
+                                Margin="12"
-              </StackPanel>
+                                Spacing="8"
-            </DataTemplate>
+                                TextElement.Foreground="{DynamicResource SystemControlForegroundBaseHighBrush}">
-            <DataTemplate DataType="x:String">
+                                <TextBlock FontWeight="Medium" Text="{Binding Title}" />
-              <TextBlock Text="{Binding }" Margin="12" Foreground="{DynamicResource SystemControlForegroundBaseHighBrush}" />
+                                <TextBlock
-            </DataTemplate>
+                                    MaxHeight="80"
-          </ReversibleStackPanel.DataTemplates>
+                                    Margin="0,0,12,0"
-        </ReversibleStackPanel>
+                                    Text="{Binding Message}"
-      </ControlTemplate>
+                                    TextWrapping="Wrap" />
-    </Setter>
+                            </StackPanel>
-  </Style>
+                        </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">
+        <Style Selector="^:topleft /template/ ReversibleStackPanel#PART_Items">
-    <Setter Property="VerticalAlignment" Value="Top"/>
+            <Setter Property="VerticalAlignment" Value="Top" />
-    <Setter Property="HorizontalAlignment" Value="Left"/>
+            <Setter Property="HorizontalAlignment" Value="Left" />
-  </Style>
+        </Style>
 
-  <Style Selector="WindowNotificationManager:topright /template/ ReversibleStackPanel#PART_Items">
+        <Style Selector="^:topright /template/ ReversibleStackPanel#PART_Items">
-    <Setter Property="VerticalAlignment" Value="Top"/>
+            <Setter Property="VerticalAlignment" Value="Top" />
-    <Setter Property="HorizontalAlignment" Value="Right"/>
+            <Setter Property="HorizontalAlignment" Value="Right" />
-  </Style>
+        </Style>
 
-  <Style Selector="WindowNotificationManager:bottomleft /template/ ReversibleStackPanel#PART_Items">
+        <Style Selector="^:bottomleft /template/ ReversibleStackPanel#PART_Items">
-    <Setter Property="ReverseOrder" Value="True"/>
+            <Setter Property="ReverseOrder" Value="True" />
-    <Setter Property="VerticalAlignment" Value="Bottom"/>
+            <Setter Property="VerticalAlignment" Value="Bottom" />
-    <Setter Property="HorizontalAlignment" Value="Left"/>
+            <Setter Property="HorizontalAlignment" Value="Left" />
-  </Style>
+        </Style>
 
-  <Style Selector="WindowNotificationManager:bottomright /template/ ReversibleStackPanel#PART_Items">
+        <Style Selector="^:bottomright /template/ ReversibleStackPanel#PART_Items">
-    <Setter Property="ReverseOrder" Value="True"/>
+            <Setter Property="ReverseOrder" Value="True" />
-    <Setter Property="VerticalAlignment" Value="Bottom"/>
+            <Setter Property="VerticalAlignment" Value="Bottom" />
-    <Setter Property="HorizontalAlignment" Value="Right"/>
+            <Setter Property="HorizontalAlignment" Value="Right" />
-  </Style>
+        </Style>
-</Styles>
+    </ControlTheme>
+</ResourceDictionary>