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

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

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