From 1830a97aa74e6b63810a51065cfb255e6e267db5 Mon Sep 17 00:00:00 2001
From: Niels Laute <niels.laute@live.nl>
Date: Fri, 2 Sep 2022 15:22:59 +0200
Subject: [PATCH] UI design

---
 .../MeasureTool/MeasureToolUI/MainWindow.xaml |   2 +-
 src/settings-ui/Settings.UI/App.xaml          |  18 +-
 .../IsEnabledTextBlock.xaml                   |  23 +-
 .../Controls/KeyVisual/KeyVisual.xaml         |  74 ++-
 .../Settings.UI/Flyout/LaunchPage.xaml        | 258 ++++-----
 .../Settings.UI/Flyout/LaunchPage.xaml.cs     |  44 +-
 .../Settings.UI/Flyout/ShellPage.xaml         |   6 +-
 src/settings-ui/Settings.UI/FlyoutWindow.xaml |  24 +-
 .../Settings.UI/FlyoutWindow.xaml.cs          |  28 +-
 .../Settings.UI/PowerToys.Settings.csproj     |   1 +
 .../Settings.UI/Styles/Button.xaml            | 539 +++++++++++-------
 .../Settings.UI/Styles/TextBlock.xaml         |   8 +-
 .../Settings.UI/Themes/Colors.xaml            |  10 +-
 .../Themes/SettingsExpanderStyles.xaml        |  22 +-
 14 files changed, 617 insertions(+), 440 deletions(-)

diff --git a/src/modules/MeasureTool/MeasureToolUI/MainWindow.xaml b/src/modules/MeasureTool/MeasureToolUI/MainWindow.xaml
index e1c9e35ff15..94de5452eed 100644
--- a/src/modules/MeasureTool/MeasureToolUI/MainWindow.xaml
+++ b/src/modules/MeasureTool/MeasureToolUI/MainWindow.xaml
@@ -5,8 +5,8 @@
     xmlns:contract7NotPresent="http://schemas.microsoft.com/winfx/2006/xaml/presentation?IsApiContractNotPresent(Windows.Foundation.UniversalApiContract,7)"
     xmlns:contract7Present="http://schemas.microsoft.com/winfx/2006/xaml/presentation?IsApiContractPresent(Windows.Foundation.UniversalApiContract,7)"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-    xmlns:p="using:PowerToys.MeasureToolUI.Properties"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    xmlns:p="using:PowerToys.MeasureToolUI.Properties"
     xmlns:winuiex="using:WinUIEx"
     IsAlwaysOnTop="True"
     IsMaximizable="False"
diff --git a/src/settings-ui/Settings.UI/App.xaml b/src/settings-ui/Settings.UI/App.xaml
index 0ec73f08c07..f0c60449433 100644
--- a/src/settings-ui/Settings.UI/App.xaml
+++ b/src/settings-ui/Settings.UI/App.xaml
@@ -2,8 +2,8 @@
     x:Class="Microsoft.PowerToys.Settings.UI.App"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:local="using:Microsoft.PowerToys.Settings.UI"
-    xmlns:controls="using:Microsoft.PowerToys.Settings.UI.Controls">
+    xmlns:controls="using:Microsoft.PowerToys.Settings.UI.Controls"
+    xmlns:local="using:Microsoft.PowerToys.Settings.UI">
     <Application.Resources>
         <ResourceDictionary>
             <ResourceDictionary.MergedDictionaries>
@@ -11,10 +11,10 @@
                 <ResourceDictionary Source="/Controls/KeyVisual/KeyVisual.xaml" />
                 <ResourceDictionary Source="/Controls/IsEnabledTextBlock/IsEnabledTextBlock.xaml" />
                 <ResourceDictionary Source="/Styles/TextBlock.xaml" />
-                <ResourceDictionary Source="/Styles/Button.xaml"/>
-                <ResourceDictionary Source="/Themes/Colors.xaml"/>
-                <ResourceDictionary Source="/Themes/SettingsExpanderStyles.xaml"/>
-                <!-- Other merged dictionaries here -->
+                <ResourceDictionary Source="/Styles/Button.xaml" />
+                <ResourceDictionary Source="/Themes/Colors.xaml" />
+                <ResourceDictionary Source="/Themes/SettingsExpanderStyles.xaml" />
+                <!--  Other merged dictionaries here  -->
             </ResourceDictionary.MergedDictionaries>
 
             <Thickness x:Key="InfoBarIconMargin">6,16,16,16</Thickness>
@@ -25,11 +25,11 @@
                 <Setter Property="Margin" Value="0,0,0,2" />
                 <Setter Property="Padding" Value="0,0,0,0" />
                 <Setter Property="HorizontalContentAlignment" Value="Stretch" />
-                <Setter Property="IsTabStop" Value="False"/>
+                <Setter Property="IsTabStop" Value="False" />
             </Style>
 
-            <Style TargetType="controls:CheckBoxWithDescriptionControl" BasedOn="{StaticResource DefaultCheckBoxStyle}" />
-            <!-- Other app resources here -->
+            <Style BasedOn="{StaticResource DefaultCheckBoxStyle}" TargetType="controls:CheckBoxWithDescriptionControl" />
+            <!--  Other app resources here  -->
         </ResourceDictionary>
     </Application.Resources>
 </Application>
diff --git a/src/settings-ui/Settings.UI/Controls/IsEnabledTextBlock/IsEnabledTextBlock.xaml b/src/settings-ui/Settings.UI/Controls/IsEnabledTextBlock/IsEnabledTextBlock.xaml
index 636ac9d8a35..48dcc336432 100644
--- a/src/settings-ui/Settings.UI/Controls/IsEnabledTextBlock/IsEnabledTextBlock.xaml
+++ b/src/settings-ui/Settings.UI/Controls/IsEnabledTextBlock/IsEnabledTextBlock.xaml
@@ -1,5 +1,5 @@
 <ResourceDictionary
-    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:local="using:Microsoft.PowerToys.Settings.UI.Controls">
 
@@ -10,9 +10,17 @@
             <Setter.Value>
                 <ControlTemplate TargetType="local:IsEnabledTextBlock">
                     <Grid>
+                        <TextBlock
+                            x:Name="Label"
+                            FontFamily="{TemplateBinding FontFamily}"
+                            FontSize="{TemplateBinding FontSize}"
+                            FontWeight="{TemplateBinding FontWeight}"
+                            Foreground="{TemplateBinding Foreground}"
+                            Text="{TemplateBinding Text}"
+                            TextWrapping="WrapWholeWords" />
                         <VisualStateManager.VisualStateGroups>
                             <VisualStateGroup x:Name="CommonStates">
-                                <VisualState x:Name="Normal"/>
+                                <VisualState x:Name="Normal" />
                                 <VisualState x:Name="Disabled">
                                     <VisualState.Setters>
                                         <Setter Target="Label.Foreground" Value="{ThemeResource TextFillColorDisabledBrush}" />
@@ -20,20 +28,13 @@
                                 </VisualState>
                             </VisualStateGroup>
                         </VisualStateManager.VisualStateGroups>
-                        <TextBlock x:Name="Label"
-                                   FontSize="{TemplateBinding FontSize}"
-                                   FontWeight="{TemplateBinding FontWeight}"
-                                   FontFamily="{TemplateBinding FontFamily}"
-                                   Foreground="{TemplateBinding Foreground}"
-                                   TextWrapping="WrapWholeWords"
-                                   Text="{TemplateBinding Text}" />
                     </Grid>
                 </ControlTemplate>
             </Setter.Value>
         </Setter>
     </Style>
-    <Style TargetType="local:IsEnabledTextBlock" x:Key="SecondaryIsEnabledTextBlockStyle">
+    <Style x:Key="SecondaryIsEnabledTextBlockStyle" TargetType="local:IsEnabledTextBlock">
         <Setter Property="Foreground" Value="{ThemeResource TextFillColorSecondaryBrush}" />
-        <Setter Property="FontSize" Value="{StaticResource SecondaryTextFontSize}"/>
+        <Setter Property="FontSize" Value="{StaticResource SecondaryTextFontSize}" />
     </Style>
 </ResourceDictionary>
diff --git a/src/settings-ui/Settings.UI/Controls/KeyVisual/KeyVisual.xaml b/src/settings-ui/Settings.UI/Controls/KeyVisual/KeyVisual.xaml
index df88c487286..a33b6ea441a 100644
--- a/src/settings-ui/Settings.UI/Controls/KeyVisual/KeyVisual.xaml
+++ b/src/settings-ui/Settings.UI/Controls/KeyVisual/KeyVisual.xaml
@@ -1,6 +1,7 @@
-<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-                    xmlns:local="using:Microsoft.PowerToys.Settings.UI.Controls">
+<ResourceDictionary
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:local="using:Microsoft.PowerToys.Settings.UI.Controls">
 
     <x:Double x:Key="DefaultIconSize">16</x:Double>
     <x:Double x:Key="SmallIconSize">12</x:Double>
@@ -20,9 +21,29 @@
             <Setter.Value>
                 <ControlTemplate TargetType="local:KeyVisual">
                     <Grid>
+                        <Grid>
+                            <Rectangle
+                                x:Name="ContentHolder"
+                                Height="{TemplateBinding Height}"
+                                MinWidth="{TemplateBinding MinWidth}"
+                                Fill="{TemplateBinding Background}"
+                                RadiusX="4"
+                                RadiusY="4"
+                                Stroke="{TemplateBinding BorderBrush}"
+                                StrokeThickness="{TemplateBinding BorderThickness}" />
+                            <ContentPresenter
+                                x:Name="KeyPresenter"
+                                Margin="{TemplateBinding Padding}"
+                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                VerticalAlignment="Center"
+                                Content="{TemplateBinding Content}"
+                                FontSize="{TemplateBinding FontSize}"
+                                FontWeight="{TemplateBinding FontWeight}"
+                                Foreground="{TemplateBinding Foreground}" />
+                        </Grid>
                         <VisualStateManager.VisualStateGroups>
                             <VisualStateGroup x:Name="CommonStates">
-                                <VisualState x:Name="Normal"/>
+                                <VisualState x:Name="Normal" />
                                 <VisualState x:Name="Disabled">
                                     <VisualState.Setters>
                                         <Setter Target="ContentHolder.Fill" Value="{ThemeResource AccentButtonBackgroundDisabled}" />
@@ -33,7 +54,7 @@
                                 </VisualState>
                             </VisualStateGroup>
                             <VisualStateGroup x:Name="StateStates">
-                                <VisualState x:Name="Default"/>
+                                <VisualState x:Name="Default" />
                                 <VisualState x:Name="Error">
                                     <VisualState.Setters>
                                         <Setter Target="ContentHolder.Fill" Value="{ThemeResource InfoBarErrorSeverityBackgroundBrush}" />
@@ -44,31 +65,16 @@
                                 </VisualState>
                             </VisualStateGroup>
                         </VisualStateManager.VisualStateGroups>
-                        <Grid>
-                            <Rectangle x:Name="ContentHolder"
-                                Fill="{TemplateBinding Background}"
-                                Stroke="{TemplateBinding BorderBrush}"
-                                StrokeThickness="{TemplateBinding BorderThickness}"
-                                RadiusX="4"
-                                RadiusY="4"
-                                Height="{TemplateBinding Height}"
-                                MinWidth="{TemplateBinding MinWidth}"/>
-                            <ContentPresenter x:Name="KeyPresenter"
-                                          FontWeight="{TemplateBinding FontWeight}"
-                                          Foreground="{TemplateBinding Foreground}"
-                                          Content="{TemplateBinding Content}"
-                                          Margin="{TemplateBinding Padding}"
-                                          FontSize="{TemplateBinding FontSize}"
-                                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                          VerticalAlignment="Center" />
-                        </Grid>
                     </Grid>
                 </ControlTemplate>
             </Setter.Value>
         </Setter>
     </Style>
 
-    <Style x:Key="SmallTextKeyVisualStyle" TargetType="local:KeyVisual" BasedOn="{StaticResource DefaultTextKeyVisualStyle}">
+    <Style
+        x:Key="SmallTextKeyVisualStyle"
+        BasedOn="{StaticResource DefaultTextKeyVisualStyle}"
+        TargetType="local:KeyVisual">
         <Setter Property="MinWidth" Value="40" />
         <Setter Property="Height" Value="36" />
         <Setter Property="FontWeight" Value="SemiBold" />
@@ -77,7 +83,10 @@
         <Setter Property="HorizontalContentAlignment" Value="Center" />
     </Style>
 
-    <Style x:Key="SmallOutlineTextKeyVisualStyle" TargetType="local:KeyVisual" BasedOn="{StaticResource DefaultTextKeyVisualStyle}">
+    <Style
+        x:Key="SmallOutlineTextKeyVisualStyle"
+        BasedOn="{StaticResource DefaultTextKeyVisualStyle}"
+        TargetType="local:KeyVisual">
         <Setter Property="MinWidth" Value="40" />
         <Setter Property="Background" Value="{ThemeResource ButtonBackground}" />
         <Setter Property="Foreground" Value="{ThemeResource ButtonForeground}" />
@@ -90,7 +99,10 @@
     </Style>
 
 
-    <Style x:Key="DefaultIconKeyVisualStyle" TargetType="local:KeyVisual" BasedOn="{StaticResource DefaultTextKeyVisualStyle}">
+    <Style
+        x:Key="DefaultIconKeyVisualStyle"
+        BasedOn="{StaticResource DefaultTextKeyVisualStyle}"
+        TargetType="local:KeyVisual">
         <Setter Property="MinWidth" Value="56" />
         <Setter Property="MinHeight" Value="48" />
         <Setter Property="FontFamily" Value="{ThemeResource SymbolThemeFontFamily}" />
@@ -99,7 +111,10 @@
         <Setter Property="HorizontalContentAlignment" Value="Center" />
     </Style>
 
-    <Style x:Key="SmallIconKeyVisualStyle" TargetType="local:KeyVisual" BasedOn="{StaticResource DefaultTextKeyVisualStyle}">
+    <Style
+        x:Key="SmallIconKeyVisualStyle"
+        BasedOn="{StaticResource DefaultTextKeyVisualStyle}"
+        TargetType="local:KeyVisual">
         <Setter Property="MinWidth" Value="40" />
         <Setter Property="Height" Value="36" />
         <Setter Property="FontFamily" Value="{ThemeResource SymbolThemeFontFamily}" />
@@ -109,7 +124,10 @@
         <Setter Property="HorizontalContentAlignment" Value="Center" />
     </Style>
 
-    <Style x:Key="SmallOutlineIconKeyVisualStyle" TargetType="local:KeyVisual" BasedOn="{StaticResource DefaultTextKeyVisualStyle}">
+    <Style
+        x:Key="SmallOutlineIconKeyVisualStyle"
+        BasedOn="{StaticResource DefaultTextKeyVisualStyle}"
+        TargetType="local:KeyVisual">
         <Setter Property="MinWidth" Value="40" />
         <Setter Property="Background" Value="{ThemeResource ButtonBackground}" />
         <Setter Property="Foreground" Value="{ThemeResource ButtonForeground}" />
diff --git a/src/settings-ui/Settings.UI/Flyout/LaunchPage.xaml b/src/settings-ui/Settings.UI/Flyout/LaunchPage.xaml
index 2b22b6bbaef..be6bc36bc91 100644
--- a/src/settings-ui/Settings.UI/Flyout/LaunchPage.xaml
+++ b/src/settings-ui/Settings.UI/Flyout/LaunchPage.xaml
@@ -7,156 +7,127 @@
     xmlns:local="using:Microsoft.PowerToys.Settings.UI.Flyout"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     mc:Ignorable="d">
-
+    <Page.Resources>
+        <Style x:Key="CustomGridViewItemStyle" TargetType="GridViewItem">
+            <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
+            <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
+            <Setter Property="Background" Value="{ThemeResource GridViewItemBackground}" />
+            <Setter Property="Foreground" Value="{ThemeResource GridViewItemForeground}" />
+            <Setter Property="TabNavigation" Value="Local" />
+            <Setter Property="IsTabStop" Value="False" />
+            <Setter Property="IsHoldingEnabled" Value="True" />
+            <Setter Property="HorizontalContentAlignment" Value="Center" />
+            <Setter Property="VerticalContentAlignment" Value="Center" />
+            <Setter Property="Margin" Value="0,0,4,4" />
+            <Setter Property="MinWidth" Value="{ThemeResource GridViewItemMinWidth}" />
+            <Setter Property="MinHeight" Value="{ThemeResource GridViewItemMinHeight}" />
+            <Setter Property="AllowDrop" Value="False" />
+            <Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
+            <Setter Property="FocusVisualMargin" Value="-2" />
+            <Setter Property="FocusVisualPrimaryBrush" Value="{ThemeResource GridViewItemFocusVisualPrimaryBrush}" />
+            <Setter Property="FocusVisualPrimaryThickness" Value="2" />
+            <Setter Property="FocusVisualSecondaryBrush" Value="{ThemeResource GridViewItemFocusVisualSecondaryBrush}" />
+            <Setter Property="FocusVisualSecondaryThickness" Value="1" />
+            <Setter Property="Template">
+                <Setter.Value>
+                    <ControlTemplate TargetType="GridViewItem">
+                        <ListViewItemPresenter
+                            x:Name="Root"
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                            CheckBoxBrush="{ThemeResource GridViewItemCheckBoxBrush}"
+                            CheckBrush="{ThemeResource GridViewItemCheckBrush}"
+                            CheckMode="{ThemeResource GridViewItemCheckMode}"
+                            ContentMargin="{TemplateBinding Padding}"
+                            ContentTransitions="{TemplateBinding ContentTransitions}"
+                            Control.IsTemplateFocusTarget="True"
+                            DisabledOpacity="{ThemeResource ListViewItemDisabledThemeOpacity}"
+                            DragBackground="{ThemeResource GridViewItemDragBackground}"
+                            DragForeground="{ThemeResource GridViewItemDragForeground}"
+                            DragOpacity="{ThemeResource ListViewItemDragThemeOpacity}"
+                            FocusBorderBrush="{ThemeResource GridViewItemFocusBorderBrush}"
+                            FocusSecondaryBorderBrush="{ThemeResource GridViewItemFocusSecondaryBorderBrush}"
+                            FocusVisualMargin="{TemplateBinding FocusVisualMargin}"
+                            FocusVisualPrimaryBrush="{TemplateBinding FocusVisualPrimaryBrush}"
+                            FocusVisualPrimaryThickness="{TemplateBinding FocusVisualPrimaryThickness}"
+                            FocusVisualSecondaryBrush="{TemplateBinding FocusVisualSecondaryBrush}"
+                            FocusVisualSecondaryThickness="{TemplateBinding FocusVisualSecondaryThickness}"
+                            IsTabStop="False"
+                            PlaceholderBackground="{ThemeResource GridViewItemPlaceholderBackground}"
+                            PointerOverBackground="Transparent"
+                            PointerOverForeground="{ThemeResource TextFillColorPrimaryBrush}"
+                            PressedBackground="Transparent"
+                            ReorderHintOffset="{ThemeResource GridViewItemReorderHintThemeOffset}"
+                            SelectedBackground="Transparent"
+                            SelectedForeground="{ThemeResource GridViewItemForegroundSelected}"
+                            SelectedPointerOverBackground="{ThemeResource GridViewItemBackgroundSelectedPointerOver}"
+                            SelectedPressedBackground="Transparent"
+                            SelectionCheckMarkVisualEnabled="{ThemeResource GridViewItemSelectionCheckMarkVisualEnabled}" />
+                    </ControlTemplate>
+                </Setter.Value>
+            </Setter>
+        </Style>
+    </Page.Resources>
     <Grid>
+        <Grid.RowDefinitions>
+            <RowDefinition Height="*" />
+            <RowDefinition Height="48" />
+        </Grid.RowDefinitions>
+        <Grid
+            Background="{ThemeResource LayerOnAcrylicFillColorDefaultBrush}"
+            BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
+            BorderThickness="0,0,0,1">
 
-        <Grid>
-            <Grid.RowDefinitions>
-
-                <RowDefinition Height="*" />
-                <RowDefinition Height="48" />
-            </Grid.RowDefinitions>
-            <controls:WrapPanel
-                Grid.Row="0"
-                Width="312"
-                Margin="0,20,0,0"
-                HorizontalAlignment="Center"
-                HorizontalSpacing="12"
-                Orientation="Horizontal"
-                VerticalSpacing="24">
-                <StackPanel Spacing="8">
-                    <Button
-                        Width="96"
-                        Height="48"
-                        Tag="Run"
-                        ToolTipService.ToolTip="Launch Run (Alt + Space)">
-                        <BitmapIcon
-                            Height="24"
-                            ShowAsMonochrome="False"
-                            UriSource="ms-appx:///Assets/Icons/PowerToys Run.png" />
-                    </Button>
-                    <TextBlock
-                        HorizontalAlignment="Center"
-                        FontSize="12"
-                        Text="Run" />
-                </StackPanel>
-                <StackPanel Spacing="8">
-                    <Button
-                        Width="96"
-                        Height="48"
-                        Tag="Color Picker"
-                        ToolTipService.ToolTip="Launch Color Picker (Ctrl + Alt + C)">
-                        <BitmapIcon
-                            Height="20"
-                            ShowAsMonochrome="False"
-                            UriSource="ms-appx:///Assets/Icons/Color Picker.png" />
-                    </Button>
-                    <TextBlock
-                        HorizontalAlignment="Center"
-                        FontSize="12"
-                        Text="Color Picker" />
-                </StackPanel>
-                <StackPanel Spacing="8">
-                    <Button
-                        Width="96"
-                        Height="48"
-                        Tag="Shortcut Guide"
-                        ToolTipService.ToolTip="Launch Shortcut Guide (Windows key)">
-                        <BitmapIcon
-                            Height="20"
-                            ShowAsMonochrome="False"
-                            UriSource="ms-appx:///Assets/Icons/Shortcut Guide.png" />
-                    </Button>
-                    <TextBlock
-                        HorizontalAlignment="Center"
-                        FontSize="12"
-                        Text="Shortcut Guide" />
-                </StackPanel>
-
-
-                <StackPanel Spacing="8">
-                    <Button
-                        Width="96"
-                        Height="48"
-                        Click="Options_Click"
-                        Tag="Awake">
-                        <StackPanel Orientation="Horizontal" Spacing="8">
-                            <BitmapIcon
-                                Height="24"
-                                ShowAsMonochrome="False"
-                                UriSource="ms-appx:///Assets/Icons/Awake.png" />
-                            <FontIcon FontSize="12" Glyph="&#xE097;" />
-                        </StackPanel>
-                    </Button>
-                    <TextBlock
-                        HorizontalAlignment="Center"
-                        FontSize="12"
-                        Text="Awake" />
-                </StackPanel>
-
-                <StackPanel Spacing="8">
-                    <Button
-                        Width="96"
-                        Height="48"
-                        Click="Options_Click"
-                        Tag="FancyZones">
-                        <StackPanel Orientation="Horizontal" Spacing="8">
-                            <BitmapIcon
-                                Height="24"
-                                ShowAsMonochrome="False"
-                                UriSource="ms-appx:///Assets/Icons/FancyZones.png" />
-                            <FontIcon FontSize="12" Glyph="&#xE097;" />
-                        </StackPanel>
-                    </Button>
-                    <TextBlock
-                        HorizontalAlignment="Center"
-                        FontSize="12"
-                        Text="FancyZones" />
-                </StackPanel>
-
-                <StackPanel Spacing="8">
-                    <Button
-                        Width="96"
-                        Height="48"
-                        Click="Options_Click"
-                        Tag="VCM">
-                        <StackPanel Orientation="Horizontal" Spacing="8">
-                            <BitmapIcon
-                                Height="24"
-                                ShowAsMonochrome="False"
-                                UriSource="ms-appx:///Assets/Icons/Video Conference Mute.png" />
-                            <FontIcon FontSize="12" Glyph="&#xE097;" />
-                        </StackPanel>
-                    </Button>
-                    <TextBlock
-                        HorizontalAlignment="Center"
-                        FontSize="12"
-                        Text="Mute" />
-                </StackPanel>
-
-            </controls:WrapPanel>
-
-
-            <Grid
-                Grid.Row="1"
-                HorizontalAlignment="Stretch"
-                VerticalAlignment="Stretch"
-                Background="{ThemeResource SystemControlAcrylicElementBrush}" />
-            <Rectangle
-                Grid.Row="1"
-                Height="1"
+            <GridView
                 HorizontalAlignment="Stretch"
                 VerticalAlignment="Top"
-                Fill="{ThemeResource FlyoutBorderThemeBrush}" />
+                ItemContainerStyle="{StaticResource CustomGridViewItemStyle}"
+                ItemsSource="{x:Bind menuItems}"
+                TabNavigation="Local">
+                <GridView.ItemsPanel>
+                    <ItemsPanelTemplate>
+                        <ItemsWrapGrid
+                            Margin="0,24,0,0"
+                            HorizontalAlignment="Center"
+                            MaximumRowsOrColumns="3"
+                            Orientation="Horizontal" />
+                    </ItemsPanelTemplate>
+                </GridView.ItemsPanel>
+                <GridView.ItemTemplate>
+                    <DataTemplate x:DataType="local:FlyoutItem">
+                        <StackPanel
+                            Width="104"
+                            Height="112"
+                            IsTabStop="False"
+                            Orientation="Vertical"
+                            Spacing="8">
+                            <Button
+                                Width="96"
+                                Height="48"
+                                HorizontalAlignment="Center"
+                                Click="ModuleButton_Click"
+                                Tag="{x:Bind Tag, Mode=OneWay}">
+                                <BitmapIcon
+                                    Height="20"
+                                    ShowAsMonochrome="False"
+                                    UriSource="{x:Bind Icon, Mode=OneWay}" />
+                            </Button>
+                            <TextBlock
+                                HorizontalAlignment="Center"
+                                Style="{StaticResource CaptionTextBlockStyle}"
+                                Text="{x:Bind Label, Mode=OneWay}" />
+                        </StackPanel>
+                    </DataTemplate>
+                </GridView.ItemTemplate>
+            </GridView>
+        </Grid>
 
+        <Grid Grid.Row="1">
             <StackPanel
                 Grid.Row="1"
                 Margin="0,0,10,0"
                 HorizontalAlignment="Right"
                 Orientation="Horizontal">
-                <!--<Button Background="Transparent" ToolTipService.ToolTip="Documentation" BorderBrush="Transparent">
-                <FontIcon Glyph="&#xE11B;" FontSize="14" />
-            </Button>-->
                 <Button
                     Height="36"
                     Background="Transparent"
@@ -166,12 +137,7 @@
                 </Button>
 
             </StackPanel>
-            <!--<controls1:InfoBar Title="Update available" Message="0.51" Background="Transparent" BorderBrush="Transparent" Margin="4,0,36,0" Grid.Row="1" IsOpen="True" IsClosable="False" />-->
-            <!--<controls1:InfoBar Title="Update installed" Background="Transparent" BorderBrush="Transparent" Margin="4,0,36,0" Grid.Row="1" IsOpen="True" IsClosable="False">
-            <controls1:InfoBar.ActionButton>
-                <HyperlinkButton Content="See what's new"/>
-            </controls1:InfoBar.ActionButton>
-        </controls1:InfoBar>-->
         </Grid>
     </Grid>
+
 </Page>
diff --git a/src/settings-ui/Settings.UI/Flyout/LaunchPage.xaml.cs b/src/settings-ui/Settings.UI/Flyout/LaunchPage.xaml.cs
index 67fd908b86e..2489339e6f2 100644
--- a/src/settings-ui/Settings.UI/Flyout/LaunchPage.xaml.cs
+++ b/src/settings-ui/Settings.UI/Flyout/LaunchPage.xaml.cs
@@ -4,6 +4,7 @@
 
 namespace Microsoft.PowerToys.Settings.UI.Flyout
 {
+    using System.Collections.ObjectModel;
     using Microsoft.UI.Xaml;
     using Microsoft.UI.Xaml.Controls;
 
@@ -12,16 +13,57 @@ namespace Microsoft.PowerToys.Settings.UI.Flyout
     /// </summary>
     public sealed partial class LaunchPage : Page
     {
+        private ObservableCollection<FlyoutItem> menuItems;
+
         public LaunchPage()
         {
             this.InitializeComponent();
+            menuItems = new ObservableCollection<FlyoutItem>();
+            menuItems.Add(new FlyoutItem() { Label = "Color Picker", Icon = "ms-appx:///Assets/FluentIcons/FluentIconsColorPicker.png", Tag = "ColorPicker" });
+            menuItems.Add(new FlyoutItem() { Label = "FancyZones", Icon = "ms-appx:///Assets/FluentIcons/FluentIconsFancyZones.png", Tag = "FancyZones" });
+            menuItems.Add(new FlyoutItem() { Label = "PowerToys Run", Icon = "ms-appx:///Assets/FluentIcons/FluentIconsPowerToysRun.png", Tag = "Run" });
+            menuItems.Add(new FlyoutItem() { Label = "Screen Ruler", Icon = "ms-appx:///Assets/FluentIcons/FluentIconsScreenRuler.png", Tag = "MeasureTool" });
+            menuItems.Add(new FlyoutItem() { Label = "Shortcut Guide", Icon = "ms-appx:///Assets/FluentIcons/FluentIconsShortcutGuide.png", Tag = "ShortcutGuide" });
+            menuItems.Add(new FlyoutItem() { Label = "Text Extractor", Icon = "ms-appx:///Assets/FluentIcons/FluentIconsPowerOCR.png", Tag = "PowerOCR" });
         }
 
         private void Options_Click(object sender, RoutedEventArgs e)
         {
             Button selectedButton = sender as Button;
-
             Frame selectedFrame = this.Parent as Frame;
         }
+
+        private void ModuleButton_Click(object sender, RoutedEventArgs e)
+        {
+            Button selectedModuleBtn = sender as Button;
+            switch ((string)selectedModuleBtn.Tag)
+            {
+                case "ColorPicker": // Launch ColorPicker
+                    break;
+                case "FancyZones": // Launch FancyZones Editor
+                    break;
+                case "Run": // Launch Run
+                    break;
+                case "MeasureTool": // Launch Screen Ruler
+                    break;
+                case "ShortcutGuide": // Launch Shortcut Guide
+                    break;
+                case "PowerOCR": // Launch Text Extractor
+                    break;
+            }
+        }
+    }
+
+#pragma warning disable SA1402 // File may only contain a single type
+    public class FlyoutItem
+#pragma warning restore SA1402 // File may only contain a single type
+    {
+        public string Label { get; set; }
+
+        public string Icon { get; set; }
+
+        public bool HasOptions { get; set; }
+
+        public string Tag { get; set; }
     }
 }
diff --git a/src/settings-ui/Settings.UI/Flyout/ShellPage.xaml b/src/settings-ui/Settings.UI/Flyout/ShellPage.xaml
index d4191e3c4f6..52b5f542cae 100644
--- a/src/settings-ui/Settings.UI/Flyout/ShellPage.xaml
+++ b/src/settings-ui/Settings.UI/Flyout/ShellPage.xaml
@@ -9,10 +9,6 @@
     mc:Ignorable="d">
 
     <Grid>
-        <Frame
-            x:Name="ContentFrame"
-            Width="350"
-            Height="320"
-            Margin="-16" />
+        <Frame x:Name="ContentFrame" />
     </Grid>
 </Page>
diff --git a/src/settings-ui/Settings.UI/FlyoutWindow.xaml b/src/settings-ui/Settings.UI/FlyoutWindow.xaml
index 387e2d5ff2c..991008f137a 100644
--- a/src/settings-ui/Settings.UI/FlyoutWindow.xaml
+++ b/src/settings-ui/Settings.UI/FlyoutWindow.xaml
@@ -1,4 +1,4 @@
-<Window
+<winuiex:WindowEx
     x:Class="Microsoft.PowerToys.Settings.UI.FlyoutWindow"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
@@ -6,10 +6,26 @@
     xmlns:flyout="using:Microsoft.PowerToys.Settings.UI.Flyout"
     xmlns:local="using:Microsoft.PowerToys.Settings.UI"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-   
+    xmlns:winuiex="using:WinUIEx"
+    IsAlwaysOnTop="True"
+    IsMaximizable="False"
+    IsMinimizable="False"
+    IsResizable="False"
+    IsShownInSwitchers="False"
+    IsTitleBarVisible="False"
     mc:Ignorable="d">
-
+    <winuiex:WindowEx.Backdrop>
+        <winuiex:AcrylicSystemBackdrop
+            DarkFallbackColor="#1c1c1c"
+            DarkLuminosityOpacity="0.96"
+            DarkTintColor="#202020"
+            DarkTintOpacity="0.5"
+            LightFallbackColor="#EEEEEE"
+            LightLuminosityOpacity="0.85"
+            LightTintColor="#FCFCFC"
+            LightTintOpacity="0" />
+    </winuiex:WindowEx.Backdrop>
     <Grid>
         <flyout:ShellPage />
     </Grid>
-</Window>
+</winuiex:WindowEx>
diff --git a/src/settings-ui/Settings.UI/FlyoutWindow.xaml.cs b/src/settings-ui/Settings.UI/FlyoutWindow.xaml.cs
index 74d6732471b..6d7c4d3c06a 100644
--- a/src/settings-ui/Settings.UI/FlyoutWindow.xaml.cs
+++ b/src/settings-ui/Settings.UI/FlyoutWindow.xaml.cs
@@ -1,19 +1,43 @@
 // Copyright (c) Microsoft Corporation
 // The Microsoft Corporation licenses this file to you under the MIT license.
 // See the LICENSE file in the project root for more information.
+using WinUIEx;
 
 namespace Microsoft.PowerToys.Settings.UI
 {
-    using Microsoft.UI.Xaml;
+    using global::Windows.Graphics;
+    using Microsoft.UI;
+    using Microsoft.UI.Windowing;
+    using WinUIEx;
 
     /// <summary>
     /// An empty window that can be used on its own or navigated to within a Frame.
     /// </summary>
-    public sealed partial class FlyoutWindow : Window
+    public sealed partial class FlyoutWindow : WindowEx
     {
+        private const int WindowWidth = 360;
+        private const int WindowHeight = 340;
+
         public FlyoutWindow()
         {
             this.InitializeComponent();
+            this.Activated += FlyoutWindow_Activated;
+            var hwnd = WinRT.Interop.WindowNative.GetWindowHandle(this);
+            WindowId windowId = Win32Interop.GetWindowIdFromWindow(hwnd);
+            DisplayArea displayArea = DisplayArea.GetFromWindowId(windowId, DisplayAreaFallback.Nearest);
+            double x = displayArea.WorkArea.Width - (WindowWidth + 204); // TO DO - HARDCODED, BUT THIS SHOULD BE DPI DEPENDEND?
+            double y = displayArea.WorkArea.Height - (WindowHeight + 186); // TO DO - HARDCODED, BUT THIS SHOULD BE DPI DEPENDEND?
+            this.MoveAndResize(x, y, WindowWidth, WindowHeight);
+        }
+
+        private void FlyoutWindow_Activated(object sender, Microsoft.UI.Xaml.WindowActivatedEventArgs args)
+        {
+            if (args.WindowActivationState == Microsoft.UI.Xaml.WindowActivationState.Deactivated)
+            {
+                System.Diagnostics.Debug.WriteLine("Lost focus");
+
+                // TO DO: WINDOW SHOULD BE HIDDEN OR CLOSED
+            }
         }
     }
 }
diff --git a/src/settings-ui/Settings.UI/PowerToys.Settings.csproj b/src/settings-ui/Settings.UI/PowerToys.Settings.csproj
index 77a4676c51e..0e2098fbfa2 100644
--- a/src/settings-ui/Settings.UI/PowerToys.Settings.csproj
+++ b/src/settings-ui/Settings.UI/PowerToys.Settings.csproj
@@ -57,6 +57,7 @@
     <PackageReference Include="Microsoft.WindowsAppSDK" Version="1.1.4" />
     <PackageReference Include="Microsoft.Windows.SDK.BuildTools" Version="10.0.22000.197" />
     <PackageReference Include="Microsoft.Xaml.Behaviors.WinUI.Managed" Version="2.0.8" />
+    <PackageReference Include="WinUIEx" Version="1.8.0" />
     <Manifest Include="$(ApplicationManifest)" />
   </ItemGroup>
   <!-- Defining the "Msix" ProjectCapability here allows the Single-project MSIX Packaging
diff --git a/src/settings-ui/Settings.UI/Styles/Button.xaml b/src/settings-ui/Settings.UI/Styles/Button.xaml
index 1905af5347c..e4421dbbf76 100644
--- a/src/settings-ui/Settings.UI/Styles/Button.xaml
+++ b/src/settings-ui/Settings.UI/Styles/Button.xaml
@@ -1,19 +1,21 @@
 <ResourceDictionary
-    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:contract7Present="http://schemas.microsoft.com/winfx/2006/xaml/presentation?IsApiContractPresent(Windows.Foundation.UniversalApiContract,7)"
-    xmlns:contract7NotPresent="http://schemas.microsoft.com/winfx/2006/xaml/presentation?IsApiContractNotPresent(Windows.Foundation.UniversalApiContract,7)">
+    xmlns:contract7NotPresent="http://schemas.microsoft.com/winfx/2006/xaml/presentation?IsApiContractNotPresent(Windows.Foundation.UniversalApiContract,7)"
+    xmlns:contract7Present="http://schemas.microsoft.com/winfx/2006/xaml/presentation?IsApiContractPresent(Windows.Foundation.UniversalApiContract,7)">
 
-    <Style x:Key="SettingButtonStyle" TargetType="Button" BasedOn="{StaticResource DefaultButtonStyle}" >
+    <Style
+        x:Key="SettingButtonStyle"
+        BasedOn="{StaticResource DefaultButtonStyle}"
+        TargetType="Button">
         <Setter Property="BorderBrush" Value="{ThemeResource CardBorderBrush}" />
         <Setter Property="CornerRadius" Value="{ThemeResource ControlCornerRadius}" />
         <Setter Property="Padding" Value="16,0,16,0" />
         <Setter Property="HorizontalAlignment" Value="Stretch" />
-        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
+        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
     </Style>
 
-    <Style x:Key="HyperlinkButtonStyle" TargetType="HyperlinkButton" >
-    </Style>
+    <Style x:Key="HyperlinkButtonStyle" TargetType="HyperlinkButton" />
 
     <Style x:Key="TextButtonStyle" TargetType="ButtonBase">
         <Setter Property="Background" Value="{ThemeResource HyperlinkButtonBackground}" />
@@ -25,12 +27,16 @@
         <Setter Property="Template">
             <Setter.Value>
                 <ControlTemplate TargetType="ButtonBase">
-                    <Grid Margin="{TemplateBinding Padding}" CornerRadius="4" Background="{TemplateBinding Background}">
-                        <ContentPresenter x:Name="Text"
-                                          Content="{TemplateBinding Content}"
-                                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                          FontWeight="SemiBold"
-                                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
+                    <Grid
+                        Margin="{TemplateBinding Padding}"
+                        Background="{TemplateBinding Background}"
+                        CornerRadius="4">
+                        <ContentPresenter
+                            x:Name="Text"
+                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                            Content="{TemplateBinding Content}"
+                            FontWeight="SemiBold" />
 
                         <VisualStateManager.VisualStateGroups>
                             <VisualStateGroup x:Name="CommonStates">
@@ -84,7 +90,6 @@
                             </VisualStateGroup>
 
                         </VisualStateManager.VisualStateGroups>
-
                     </Grid>
 
                 </ControlTemplate>
@@ -92,7 +97,7 @@
         </Setter>
     </Style>
 
-    <!-- This style overrides the default style so that all ToggleSwitches are right aligned, with the label on the left -->
+    <!--  This style overrides the default style so that all ToggleSwitches are right aligned, with the label on the left  -->
     <Style TargetType="ToggleSwitch">
         <Setter Property="Foreground" Value="{ThemeResource ToggleSwitchContentForeground}" />
         <Setter Property="HorizontalAlignment" Value="Right" />
@@ -107,10 +112,156 @@
             <Setter.Value>
                 <ControlTemplate TargetType="ToggleSwitch">
                     <Grid
+                        contract7Present:CornerRadius="{TemplateBinding CornerRadius}"
                         Background="{TemplateBinding Background}"
                         BorderBrush="{TemplateBinding BorderBrush}"
-                        BorderThickness="{TemplateBinding BorderThickness}"
-                        contract7Present:CornerRadius="{TemplateBinding CornerRadius}">
+                        BorderThickness="{TemplateBinding BorderThickness}">
+                        <Grid.RowDefinitions>
+                            <RowDefinition Height="Auto" />
+                            <RowDefinition Height="*" />
+                        </Grid.RowDefinitions>
+
+                        <ContentPresenter
+                            x:Name="HeaderContentPresenter"
+                            Grid.Row="0"
+                            Margin="{ThemeResource ToggleSwitchTopHeaderMargin}"
+                            VerticalAlignment="Top"
+                            x:DeferLoadStrategy="Lazy"
+                            AutomationProperties.AccessibilityView="Raw"
+                            Content="{TemplateBinding Header}"
+                            ContentTemplate="{TemplateBinding HeaderTemplate}"
+                            Foreground="{ThemeResource ToggleSwitchHeaderForeground}"
+                            IsHitTestVisible="False"
+                            TextWrapping="Wrap"
+                            Visibility="Collapsed" />
+                        <Grid
+                            Grid.Row="1"
+                            HorizontalAlignment="Right"
+                            VerticalAlignment="Top">
+
+                            <Grid.RowDefinitions>
+                                <RowDefinition Height="{ThemeResource ToggleSwitchPreContentMargin}" />
+                                <RowDefinition Height="Auto" />
+                                <RowDefinition Height="{ThemeResource ToggleSwitchPostContentMargin}" />
+                            </Grid.RowDefinitions>
+
+                            <Grid.ColumnDefinitions>
+                                <ColumnDefinition Width="Auto" />
+                                <ColumnDefinition Width="12" MaxWidth="12" />
+                                <ColumnDefinition Width="Auto" />
+                            </Grid.ColumnDefinitions>
+                            <Grid
+                                x:Name="SwitchAreaGrid"
+                                Grid.RowSpan="3"
+                                Grid.ColumnSpan="3"
+                                Margin="0,5"
+                                contract7NotPresent:CornerRadius="{StaticResource ControlCornerRadius}"
+                                contract7Present:CornerRadius="{TemplateBinding CornerRadius}"
+                                Background="{ThemeResource ToggleSwitchContainerBackground}"
+                                Control.IsTemplateFocusTarget="True" />
+                            <ContentPresenter
+                                x:Name="OffContentPresenter"
+                                Grid.RowSpan="3"
+                                Grid.Column="0"
+                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                                AutomationProperties.AccessibilityView="Raw"
+                                Content="{TemplateBinding OffContent}"
+                                ContentTemplate="{TemplateBinding OffContentTemplate}"
+                                Foreground="{TemplateBinding Foreground}"
+                                IsHitTestVisible="False"
+                                Opacity="0" />
+                            <ContentPresenter
+                                x:Name="OnContentPresenter"
+                                Grid.RowSpan="3"
+                                Grid.Column="0"
+                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                                AutomationProperties.AccessibilityView="Raw"
+                                Content="{TemplateBinding OnContent}"
+                                ContentTemplate="{TemplateBinding OnContentTemplate}"
+                                Foreground="{TemplateBinding Foreground}"
+                                IsHitTestVisible="False"
+                                Opacity="0" />
+                            <Rectangle
+                                x:Name="OuterBorder"
+                                Grid.Row="1"
+                                Grid.Column="2"
+                                Width="40"
+                                Height="20"
+                                Fill="{ThemeResource ToggleSwitchFillOff}"
+                                RadiusX="10"
+                                RadiusY="10"
+                                Stroke="{ThemeResource ToggleSwitchStrokeOff}"
+                                StrokeThickness="{ThemeResource ToggleSwitchOuterBorderStrokeThickness}" />
+                            <Rectangle
+                                x:Name="SwitchKnobBounds"
+                                Grid.Row="1"
+                                Grid.Column="2"
+                                Width="40"
+                                Height="20"
+                                Fill="{ThemeResource ToggleSwitchFillOn}"
+                                Opacity="0"
+                                RadiusX="10"
+                                RadiusY="10"
+                                Stroke="{ThemeResource ToggleSwitchStrokeOn}"
+                                StrokeThickness="{ThemeResource ToggleSwitchOnStrokeThickness}" />
+                            <Grid
+                                x:Name="SwitchKnob"
+                                Grid.Row="1"
+                                Grid.Column="2"
+                                Width="20"
+                                Height="20"
+                                HorizontalAlignment="Left">
+                                <Border
+                                    x:Name="SwitchKnobOn"
+                                    Grid.Column="2"
+                                    Width="12"
+                                    Height="12"
+                                    Margin="0,0,1,0"
+                                    HorizontalAlignment="Center"
+                                    contract7Present:BackgroundSizing="OuterBorderEdge"
+                                    Background="{ThemeResource ToggleSwitchKnobFillOn}"
+                                    BorderBrush="{ThemeResource ToggleSwitchKnobStrokeOn}"
+                                    CornerRadius="7"
+                                    Opacity="0"
+                                    RenderTransformOrigin="0.5, 0.5">
+                                    <Border.RenderTransform>
+                                        <CompositeTransform />
+                                    </Border.RenderTransform>
+                                </Border>
+                                <Rectangle
+                                    x:Name="SwitchKnobOff"
+                                    Grid.Column="2"
+                                    Width="12"
+                                    Height="12"
+                                    Margin="-1,0,0,0"
+                                    HorizontalAlignment="Center"
+                                    Fill="{ThemeResource ToggleSwitchKnobFillOff}"
+                                    RadiusX="7"
+                                    RadiusY="7"
+                                    RenderTransformOrigin="0.5, 0.5">
+                                    <Rectangle.RenderTransform>
+                                        <CompositeTransform />
+                                    </Rectangle.RenderTransform>
+                                </Rectangle>
+                                <Grid.RenderTransform>
+                                    <TranslateTransform x:Name="KnobTranslateTransform" />
+                                </Grid.RenderTransform>
+                            </Grid>
+                            <Thumb
+                                x:Name="SwitchThumb"
+                                Grid.RowSpan="3"
+                                Grid.ColumnSpan="3"
+                                AutomationProperties.AccessibilityView="Raw">
+                                <Thumb.Template>
+                                    <ControlTemplate TargetType="Thumb">
+                                        <Rectangle Fill="Transparent" />
+                                    </ControlTemplate>
+                                </Thumb.Template>
+                            </Thumb>
+
+                        </Grid>
 
                         <VisualStateManager.VisualStateGroups>
                             <VisualStateGroup x:Name="CommonStates">
@@ -137,17 +288,41 @@
                                         <ObjectAnimationUsingKeyFrames Storyboard.TargetName="SwitchAreaGrid" Storyboard.TargetProperty="Background">
                                             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleSwitchContainerBackground}" />
                                         </ObjectAnimationUsingKeyFrames>
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Width" EnableDependentAnimation="True" >
-                                            <SplineDoubleKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" KeySpline="{StaticResource ControlFastOutSlowInKeySpline}" Value="12" />
+                                        <DoubleAnimationUsingKeyFrames
+                                            EnableDependentAnimation="True"
+                                            Storyboard.TargetName="SwitchKnobOn"
+                                            Storyboard.TargetProperty="Width">
+                                            <SplineDoubleKeyFrame
+                                                KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
+                                                KeyTime="{StaticResource ControlFasterAnimationDuration}"
+                                                Value="12" />
                                         </DoubleAnimationUsingKeyFrames>
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Height" EnableDependentAnimation="True">
-                                            <SplineDoubleKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" KeySpline="{StaticResource ControlFastOutSlowInKeySpline}" Value="12" />
+                                        <DoubleAnimationUsingKeyFrames
+                                            EnableDependentAnimation="True"
+                                            Storyboard.TargetName="SwitchKnobOn"
+                                            Storyboard.TargetProperty="Height">
+                                            <SplineDoubleKeyFrame
+                                                KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
+                                                KeyTime="{StaticResource ControlFasterAnimationDuration}"
+                                                Value="12" />
                                         </DoubleAnimationUsingKeyFrames>
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Width" EnableDependentAnimation="True">
-                                            <SplineDoubleKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" KeySpline="{StaticResource ControlFastOutSlowInKeySpline}" Value="12" />
+                                        <DoubleAnimationUsingKeyFrames
+                                            EnableDependentAnimation="True"
+                                            Storyboard.TargetName="SwitchKnobOff"
+                                            Storyboard.TargetProperty="Width">
+                                            <SplineDoubleKeyFrame
+                                                KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
+                                                KeyTime="{StaticResource ControlFasterAnimationDuration}"
+                                                Value="12" />
                                         </DoubleAnimationUsingKeyFrames>
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Height" EnableDependentAnimation="True">
-                                            <SplineDoubleKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" KeySpline="{StaticResource ControlFastOutSlowInKeySpline}" Value="12" />
+                                        <DoubleAnimationUsingKeyFrames
+                                            EnableDependentAnimation="True"
+                                            Storyboard.TargetName="SwitchKnobOff"
+                                            Storyboard.TargetProperty="Height">
+                                            <SplineDoubleKeyFrame
+                                                KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
+                                                KeyTime="{StaticResource ControlFasterAnimationDuration}"
+                                                Value="12" />
                                         </DoubleAnimationUsingKeyFrames>
                                     </Storyboard>
                                 </VisualState>
@@ -174,17 +349,41 @@
                                         <ColorAnimationUsingKeyFrames Storyboard.TargetName="SwitchAreaGrid" Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
                                             <LinearColorKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" Value="{ThemeResource ToggleSwitchContainerBackgroundPointerOver}" />
                                         </ColorAnimationUsingKeyFrames>
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Width" EnableDependentAnimation="True" >
-                                            <SplineDoubleKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" KeySpline="{StaticResource ControlFastOutSlowInKeySpline}" Value="14" />
+                                        <DoubleAnimationUsingKeyFrames
+                                            EnableDependentAnimation="True"
+                                            Storyboard.TargetName="SwitchKnobOn"
+                                            Storyboard.TargetProperty="Width">
+                                            <SplineDoubleKeyFrame
+                                                KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
+                                                KeyTime="{StaticResource ControlFasterAnimationDuration}"
+                                                Value="14" />
                                         </DoubleAnimationUsingKeyFrames>
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Height" EnableDependentAnimation="True">
-                                            <SplineDoubleKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" KeySpline="{StaticResource ControlFastOutSlowInKeySpline}" Value="14" />
+                                        <DoubleAnimationUsingKeyFrames
+                                            EnableDependentAnimation="True"
+                                            Storyboard.TargetName="SwitchKnobOn"
+                                            Storyboard.TargetProperty="Height">
+                                            <SplineDoubleKeyFrame
+                                                KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
+                                                KeyTime="{StaticResource ControlFasterAnimationDuration}"
+                                                Value="14" />
                                         </DoubleAnimationUsingKeyFrames>
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Width" EnableDependentAnimation="True">
-                                            <SplineDoubleKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" KeySpline="{StaticResource ControlFastOutSlowInKeySpline}" Value="14" />
+                                        <DoubleAnimationUsingKeyFrames
+                                            EnableDependentAnimation="True"
+                                            Storyboard.TargetName="SwitchKnobOff"
+                                            Storyboard.TargetProperty="Width">
+                                            <SplineDoubleKeyFrame
+                                                KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
+                                                KeyTime="{StaticResource ControlFasterAnimationDuration}"
+                                                Value="14" />
                                         </DoubleAnimationUsingKeyFrames>
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Height" EnableDependentAnimation="True">
-                                            <SplineDoubleKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" KeySpline="{StaticResource ControlFastOutSlowInKeySpline}" Value="14" />
+                                        <DoubleAnimationUsingKeyFrames
+                                            EnableDependentAnimation="True"
+                                            Storyboard.TargetName="SwitchKnobOff"
+                                            Storyboard.TargetProperty="Height">
+                                            <SplineDoubleKeyFrame
+                                                KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
+                                                KeyTime="{StaticResource ControlFasterAnimationDuration}"
+                                                Value="14" />
                                         </DoubleAnimationUsingKeyFrames>
                                     </Storyboard>
                                 </VisualState>
@@ -219,17 +418,41 @@
                                         <ColorAnimationUsingKeyFrames Storyboard.TargetName="SwitchAreaGrid" Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
                                             <LinearColorKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" Value="{ThemeResource ToggleSwitchContainerBackgroundPressed}" />
                                         </ColorAnimationUsingKeyFrames>
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Width" EnableDependentAnimation="True" >
-                                            <SplineDoubleKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" KeySpline="{StaticResource ControlFastOutSlowInKeySpline}" Value="17" />
+                                        <DoubleAnimationUsingKeyFrames
+                                            EnableDependentAnimation="True"
+                                            Storyboard.TargetName="SwitchKnobOn"
+                                            Storyboard.TargetProperty="Width">
+                                            <SplineDoubleKeyFrame
+                                                KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
+                                                KeyTime="{StaticResource ControlFasterAnimationDuration}"
+                                                Value="17" />
                                         </DoubleAnimationUsingKeyFrames>
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Height" EnableDependentAnimation="True">
-                                            <SplineDoubleKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" KeySpline="{StaticResource ControlFastOutSlowInKeySpline}" Value="14" />
+                                        <DoubleAnimationUsingKeyFrames
+                                            EnableDependentAnimation="True"
+                                            Storyboard.TargetName="SwitchKnobOn"
+                                            Storyboard.TargetProperty="Height">
+                                            <SplineDoubleKeyFrame
+                                                KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
+                                                KeyTime="{StaticResource ControlFasterAnimationDuration}"
+                                                Value="14" />
                                         </DoubleAnimationUsingKeyFrames>
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Width" EnableDependentAnimation="True">
-                                            <SplineDoubleKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" KeySpline="{StaticResource ControlFastOutSlowInKeySpline}" Value="17" />
+                                        <DoubleAnimationUsingKeyFrames
+                                            EnableDependentAnimation="True"
+                                            Storyboard.TargetName="SwitchKnobOff"
+                                            Storyboard.TargetProperty="Width">
+                                            <SplineDoubleKeyFrame
+                                                KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
+                                                KeyTime="{StaticResource ControlFasterAnimationDuration}"
+                                                Value="17" />
                                         </DoubleAnimationUsingKeyFrames>
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Height" EnableDependentAnimation="True">
-                                            <SplineDoubleKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" KeySpline="{StaticResource ControlFastOutSlowInKeySpline}" Value="14" />
+                                        <DoubleAnimationUsingKeyFrames
+                                            EnableDependentAnimation="True"
+                                            Storyboard.TargetName="SwitchKnobOff"
+                                            Storyboard.TargetProperty="Height">
+                                            <SplineDoubleKeyFrame
+                                                KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
+                                                KeyTime="{StaticResource ControlFasterAnimationDuration}"
+                                                Value="14" />
                                         </DoubleAnimationUsingKeyFrames>
                                     </Storyboard>
                                 </VisualState>
@@ -265,17 +488,41 @@
                                         <ColorAnimationUsingKeyFrames Storyboard.TargetName="SwitchAreaGrid" Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
                                             <LinearColorKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" Value="{ThemeResource ToggleSwitchContainerBackgroundDisabled}" />
                                         </ColorAnimationUsingKeyFrames>
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Width" EnableDependentAnimation="True" >
-                                            <SplineDoubleKeyFrame KeyTime="{StaticResource ControlNormalAnimationDuration}" KeySpline="{StaticResource ControlFastOutSlowInKeySpline}" Value="12" />
+                                        <DoubleAnimationUsingKeyFrames
+                                            EnableDependentAnimation="True"
+                                            Storyboard.TargetName="SwitchKnobOn"
+                                            Storyboard.TargetProperty="Width">
+                                            <SplineDoubleKeyFrame
+                                                KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
+                                                KeyTime="{StaticResource ControlNormalAnimationDuration}"
+                                                Value="12" />
                                         </DoubleAnimationUsingKeyFrames>
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Height" EnableDependentAnimation="True">
-                                            <SplineDoubleKeyFrame KeyTime="{StaticResource ControlNormalAnimationDuration}" KeySpline="{StaticResource ControlFastOutSlowInKeySpline}" Value="12" />
+                                        <DoubleAnimationUsingKeyFrames
+                                            EnableDependentAnimation="True"
+                                            Storyboard.TargetName="SwitchKnobOn"
+                                            Storyboard.TargetProperty="Height">
+                                            <SplineDoubleKeyFrame
+                                                KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
+                                                KeyTime="{StaticResource ControlNormalAnimationDuration}"
+                                                Value="12" />
                                         </DoubleAnimationUsingKeyFrames>
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Width" EnableDependentAnimation="True">
-                                            <SplineDoubleKeyFrame KeyTime="{StaticResource ControlNormalAnimationDuration}" KeySpline="{StaticResource ControlFastOutSlowInKeySpline}" Value="12" />
+                                        <DoubleAnimationUsingKeyFrames
+                                            EnableDependentAnimation="True"
+                                            Storyboard.TargetName="SwitchKnobOff"
+                                            Storyboard.TargetProperty="Width">
+                                            <SplineDoubleKeyFrame
+                                                KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
+                                                KeyTime="{StaticResource ControlNormalAnimationDuration}"
+                                                Value="12" />
                                         </DoubleAnimationUsingKeyFrames>
-                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Height" EnableDependentAnimation="True">
-                                            <SplineDoubleKeyFrame KeyTime="{StaticResource ControlNormalAnimationDuration}" KeySpline="{StaticResource ControlFastOutSlowInKeySpline}" Value="12" />
+                                        <DoubleAnimationUsingKeyFrames
+                                            EnableDependentAnimation="True"
+                                            Storyboard.TargetName="SwitchKnobOff"
+                                            Storyboard.TargetProperty="Height">
+                                            <SplineDoubleKeyFrame
+                                                KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
+                                                KeyTime="{StaticResource ControlNormalAnimationDuration}"
+                                                Value="12" />
                                         </DoubleAnimationUsingKeyFrames>
                                     </Storyboard>
                                 </VisualState>
@@ -284,13 +531,14 @@
                             <VisualStateGroup x:Name="ToggleStates">
 
                                 <VisualStateGroup.Transitions>
-                                    <VisualTransition x:Name="DraggingToOnTransition"
+                                    <VisualTransition
+                                        x:Name="DraggingToOnTransition"
+                                        GeneratedDuration="0"
                                         From="Dragging"
-                                        To="On"
-                                        GeneratedDuration="0">
+                                        To="On">
 
                                         <Storyboard>
-                                            <RepositionThemeAnimation TargetName="SwitchKnob" FromHorizontalOffset="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.KnobCurrentToOnOffset}" />
+                                            <RepositionThemeAnimation FromHorizontalOffset="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.KnobCurrentToOnOffset}" TargetName="SwitchKnob" />
                                             <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobBounds" Storyboard.TargetProperty="Opacity">
                                                 <LinearDoubleKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" Value="1" />
                                             </DoubleAnimationUsingKeyFrames>
@@ -305,10 +553,11 @@
                                             </DoubleAnimationUsingKeyFrames>
                                         </Storyboard>
                                     </VisualTransition>
-                                    <VisualTransition x:Name="OnToDraggingTransition"
+                                    <VisualTransition
+                                        x:Name="OnToDraggingTransition"
+                                        GeneratedDuration="0"
                                         From="On"
-                                        To="Dragging"
-                                        GeneratedDuration="0">
+                                        To="Dragging">
                                         <Storyboard>
                                             <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobBounds" Storyboard.TargetProperty="Opacity">
                                                 <LinearDoubleKeyFrame KeyTime="0" Value="1" />
@@ -321,13 +570,14 @@
                                             </DoubleAnimationUsingKeyFrames>
                                         </Storyboard>
                                     </VisualTransition>
-                                    <VisualTransition x:Name="DraggingToOffTransition"
+                                    <VisualTransition
+                                        x:Name="DraggingToOffTransition"
+                                        GeneratedDuration="0"
                                         From="Dragging"
-                                        To="Off"
-                                        GeneratedDuration="0">
+                                        To="Off">
 
                                         <Storyboard>
-                                            <RepositionThemeAnimation TargetName="SwitchKnob" FromHorizontalOffset="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.KnobCurrentToOffOffset}" />
+                                            <RepositionThemeAnimation FromHorizontalOffset="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.KnobCurrentToOffOffset}" TargetName="SwitchKnob" />
                                             <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobBounds" Storyboard.TargetProperty="Opacity">
                                                 <LinearDoubleKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" Value="0" />
                                             </DoubleAnimationUsingKeyFrames>
@@ -339,22 +589,24 @@
                                             </DoubleAnimationUsingKeyFrames>
                                         </Storyboard>
                                     </VisualTransition>
-                                    <VisualTransition x:Name="OnToOffTransition"
+                                    <VisualTransition
+                                        x:Name="OnToOffTransition"
+                                        GeneratedDuration="0"
                                         From="On"
-                                        To="Off"
-                                        GeneratedDuration="0">
+                                        To="Off">
 
                                         <Storyboard>
-                                            <RepositionThemeAnimation TargetName="SwitchKnob" FromHorizontalOffset="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.KnobOnToOffOffset}" />
+                                            <RepositionThemeAnimation FromHorizontalOffset="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.KnobOnToOffOffset}" TargetName="SwitchKnob" />
                                         </Storyboard>
                                     </VisualTransition>
-                                    <VisualTransition x:Name="OffToOnTransition"
+                                    <VisualTransition
+                                        x:Name="OffToOnTransition"
+                                        GeneratedDuration="0"
                                         From="Off"
-                                        To="On"
-                                        GeneratedDuration="0">
+                                        To="On">
 
                                         <Storyboard>
-                                            <RepositionThemeAnimation TargetName="SwitchKnob" FromHorizontalOffset="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.KnobOffToOnOffset}"/>
+                                            <RepositionThemeAnimation FromHorizontalOffset="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.KnobOffToOnOffset}" TargetName="SwitchKnob" />
                                             <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobBounds" Storyboard.TargetProperty="Opacity">
                                                 <LinearDoubleKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}" Value="1" />
                                             </DoubleAnimationUsingKeyFrames>
@@ -374,7 +626,8 @@
                                 <VisualState x:Name="Off" />
                                 <VisualState x:Name="On">
                                     <Storyboard>
-                                        <DoubleAnimation Storyboard.TargetName="KnobTranslateTransform"
+                                        <DoubleAnimation
+                                            Storyboard.TargetName="KnobTranslateTransform"
                                             Storyboard.TargetProperty="X"
                                             To="20"
                                             Duration="0" />
@@ -398,11 +651,12 @@
                                 <VisualState x:Name="OffContent">
 
                                     <Storyboard>
-                                        <DoubleAnimation Storyboard.TargetName="OffContentPresenter"
+                                        <DoubleAnimation
+                                            Storyboard.TargetName="OffContentPresenter"
                                             Storyboard.TargetProperty="Opacity"
                                             To="1"
                                             Duration="0" />
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="IsHitTestVisible" Storyboard.TargetName="OffContentPresenter">
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="OffContentPresenter" Storyboard.TargetProperty="IsHitTestVisible">
                                             <DiscreteObjectKeyFrame KeyTime="0">
                                                 <DiscreteObjectKeyFrame.Value>
                                                     <x:Boolean>True</x:Boolean>
@@ -414,11 +668,12 @@
                                 <VisualState x:Name="OnContent">
 
                                     <Storyboard>
-                                        <DoubleAnimation Storyboard.TargetName="OnContentPresenter"
+                                        <DoubleAnimation
+                                            Storyboard.TargetName="OnContentPresenter"
                                             Storyboard.TargetProperty="Opacity"
                                             To="1"
                                             Duration="0" />
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="IsHitTestVisible" Storyboard.TargetName="OnContentPresenter">
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="OnContentPresenter" Storyboard.TargetProperty="IsHitTestVisible">
                                             <DiscreteObjectKeyFrame KeyTime="0">
                                                 <DiscreteObjectKeyFrame.Value>
                                                     <x:Boolean>True</x:Boolean>
@@ -431,144 +686,6 @@
                             </VisualStateGroup>
 
                         </VisualStateManager.VisualStateGroups>
-
-                        <Grid.RowDefinitions>
-                            <RowDefinition Height="Auto" />
-                            <RowDefinition Height="*" />
-                        </Grid.RowDefinitions>
-
-                        <ContentPresenter x:Name="HeaderContentPresenter"
-                            x:DeferLoadStrategy="Lazy"
-                            Grid.Row="0"
-                            Content="{TemplateBinding Header}"
-                            ContentTemplate="{TemplateBinding HeaderTemplate}"
-                            Foreground="{ThemeResource ToggleSwitchHeaderForeground}"
-                            IsHitTestVisible="False"
-                            Margin="{ThemeResource ToggleSwitchTopHeaderMargin}"
-                            TextWrapping="Wrap"
-                            VerticalAlignment="Top"
-                            Visibility="Collapsed"
-                            AutomationProperties.AccessibilityView="Raw" />
-                        <Grid
-                            Grid.Row="1"
-                            HorizontalAlignment="Right"
-                            VerticalAlignment="Top">
-
-                            <Grid.RowDefinitions>
-                                <RowDefinition Height="{ThemeResource ToggleSwitchPreContentMargin}" />
-                                <RowDefinition Height="Auto" />
-                                <RowDefinition Height="{ThemeResource ToggleSwitchPostContentMargin}" />
-                            </Grid.RowDefinitions>
-
-                            <Grid.ColumnDefinitions>
-                                <ColumnDefinition Width="Auto" />
-                                <ColumnDefinition Width="12" MaxWidth="12" />
-                                <ColumnDefinition Width="Auto" />
-                            </Grid.ColumnDefinitions>
-                            <Grid x:Name="SwitchAreaGrid"
-                                Grid.RowSpan="3"
-                                Grid.ColumnSpan="3"
-                                Margin="0,5"
-                                contract7Present:CornerRadius="{TemplateBinding CornerRadius}"
-                                contract7NotPresent:CornerRadius="{StaticResource ControlCornerRadius}"
-                                Control.IsTemplateFocusTarget="True"
-                                Background="{ThemeResource ToggleSwitchContainerBackground}" />
-                            <ContentPresenter x:Name="OffContentPresenter"
-                                Grid.RowSpan="3"
-                                Grid.Column="0"
-                                Opacity="0"
-                                Foreground="{TemplateBinding Foreground}"
-                                IsHitTestVisible="False"
-                                Content="{TemplateBinding OffContent}"
-                                ContentTemplate="{TemplateBinding OffContentTemplate}"
-                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                                AutomationProperties.AccessibilityView="Raw" />
-                            <ContentPresenter x:Name="OnContentPresenter"
-                                Grid.RowSpan="3"
-                                Grid.Column="0"
-                                Opacity="0"
-                                Foreground="{TemplateBinding Foreground}"
-                                IsHitTestVisible="False"
-                                Content="{TemplateBinding OnContent}"
-                                ContentTemplate="{TemplateBinding OnContentTemplate}"
-                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                                AutomationProperties.AccessibilityView="Raw" />
-                            <Rectangle x:Name="OuterBorder"
-                                Grid.Row="1"
-                                               Grid.Column="2"
-                                Height="20"
-                                Width="40"
-                                RadiusX="10"
-                                RadiusY="10"
-                                Fill="{ThemeResource ToggleSwitchFillOff}"
-                                Stroke="{ThemeResource ToggleSwitchStrokeOff}"
-                                StrokeThickness="{ThemeResource ToggleSwitchOuterBorderStrokeThickness}" />
-                            <Rectangle x:Name="SwitchKnobBounds"
-                                Grid.Row="1"
-                                Height="20"
-                                Width="40"
-                                RadiusX="10"
-                                RadiusY="10"
-                                               Grid.Column="2"
-                                Fill="{ThemeResource ToggleSwitchFillOn}"
-                                Stroke="{ThemeResource ToggleSwitchStrokeOn}"
-                                StrokeThickness="{ThemeResource ToggleSwitchOnStrokeThickness}"
-                                Opacity="0" />
-                            <Grid x:Name="SwitchKnob"
-                                Grid.Row="1"
-                                          Grid.Column="2"
-                                HorizontalAlignment="Left"
-                                Width="20"
-                                Height="20">
-                                <Border x:Name="SwitchKnobOn"
-                                    Background="{ThemeResource ToggleSwitchKnobFillOn}"
-                                    BorderBrush="{ThemeResource ToggleSwitchKnobStrokeOn}"
-                                    contract7Present:BackgroundSizing="OuterBorderEdge"       
-                                    Width="12"
-                                    Height="12"
-                                    CornerRadius="7"
-                                                Grid.Column="2"
-                                    Opacity="0"
-                                    HorizontalAlignment="Center"
-                                    Margin="0,0,1,0"
-                                    RenderTransformOrigin="0.5, 0.5">
-                                    <Border.RenderTransform>
-                                        <CompositeTransform/>
-                                    </Border.RenderTransform>
-                                </Border>
-                                <Rectangle x:Name="SwitchKnobOff"
-                                    Fill="{ThemeResource ToggleSwitchKnobFillOff}"
-                                    Width="12"
-                                    Height="12"
-                                    RadiusX="7"
-                                                   Grid.Column="2"
-                                    RadiusY="7"
-                                    HorizontalAlignment="Center"
-                                    Margin="-1,0,0,0"
-                                    RenderTransformOrigin="0.5, 0.5">
-                                    <Rectangle.RenderTransform>
-                                        <CompositeTransform/>
-                                    </Rectangle.RenderTransform>
-                                </Rectangle>
-                                <Grid.RenderTransform>
-                                    <TranslateTransform x:Name="KnobTranslateTransform" />
-                                </Grid.RenderTransform>
-                            </Grid>
-                            <Thumb x:Name="SwitchThumb"
-                                AutomationProperties.AccessibilityView="Raw"
-                                Grid.RowSpan="3"
-                                Grid.ColumnSpan="3">
-                                <Thumb.Template>
-                                    <ControlTemplate TargetType="Thumb">
-                                        <Rectangle Fill="Transparent" />
-                                    </ControlTemplate>
-                                </Thumb.Template>
-                            </Thumb>
-
-                        </Grid>
-
                     </Grid>
 
                 </ControlTemplate>
diff --git a/src/settings-ui/Settings.UI/Styles/TextBlock.xaml b/src/settings-ui/Settings.UI/Styles/TextBlock.xaml
index 6f091a32d6b..dd3fc3e2459 100644
--- a/src/settings-ui/Settings.UI/Styles/TextBlock.xaml
+++ b/src/settings-ui/Settings.UI/Styles/TextBlock.xaml
@@ -1,6 +1,4 @@
-<ResourceDictionary
-    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
 
     <Style x:Key="OobeSubtitleStyle" TargetType="TextBlock">
         <Setter Property="Margin" Value="0,16,0,0" />
@@ -17,7 +15,7 @@
 
     <x:Double x:Key="SecondaryTextFontSize">12</x:Double>
     <Style x:Key="SecondaryTextStyle" TargetType="TextBlock">
-        <Setter Property="FontSize" Value="{StaticResource SecondaryTextFontSize}"/>
-        <Setter Property="Foreground" Value="{ThemeResource TextFillColorSecondaryBrush}"/>
+        <Setter Property="FontSize" Value="{StaticResource SecondaryTextFontSize}" />
+        <Setter Property="Foreground" Value="{ThemeResource TextFillColorSecondaryBrush}" />
     </Style>
 </ResourceDictionary>
\ No newline at end of file
diff --git a/src/settings-ui/Settings.UI/Themes/Colors.xaml b/src/settings-ui/Settings.UI/Themes/Colors.xaml
index 2ae414382d5..461c50f5f69 100644
--- a/src/settings-ui/Settings.UI/Themes/Colors.xaml
+++ b/src/settings-ui/Settings.UI/Themes/Colors.xaml
@@ -1,13 +1,11 @@
-<ResourceDictionary
-    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
 
     <ResourceDictionary.ThemeDictionaries>
         <ResourceDictionary x:Key="Dark">
             <StaticResource x:Key="CardBackgroundBrush" ResourceKey="CardBackgroundFillColorDefaultBrush" />
             <StaticResource x:Key="CardBorderBrush" ResourceKey="CardStrokeColorDefaultBrush" />
             <StaticResource x:Key="CardPrimaryForegroundBrush" ResourceKey="TextFillColorPrimaryBrush" />
-            <SolidColorBrush x:Key="InfoBarInformationalSeverityBackgroundBrush" Color="#FF34424d"/>
+            <SolidColorBrush x:Key="InfoBarInformationalSeverityBackgroundBrush" Color="#FF34424d" />
             <Color x:Key="InfoBarInformationalSeverityIconBackground">#FF5fb2f2</Color>
             <SolidColorBrush x:Key="SolidBackgroundBrush" Color="Black" />
             <Thickness x:Key="CardBorderThickness">1</Thickness>
@@ -17,7 +15,7 @@
             <StaticResource x:Key="CardBackgroundBrush" ResourceKey="CardBackgroundFillColorDefaultBrush" />
             <StaticResource x:Key="CardBorderBrush" ResourceKey="CardStrokeColorDefaultBrush" />
             <StaticResource x:Key="CardPrimaryForegroundBrush" ResourceKey="TextFillColorPrimaryBrush" />
-            <SolidColorBrush x:Key="InfoBarInformationalSeverityBackgroundBrush" Color="#FFd3e7f7"/>
+            <SolidColorBrush x:Key="InfoBarInformationalSeverityBackgroundBrush" Color="#FFd3e7f7" />
             <Color x:Key="InfoBarInformationalSeverityIconBackground">#FF0063b1</Color>
             <SolidColorBrush x:Key="SolidBackgroundBrush" Color="White" />
             <Thickness x:Key="CardBorderThickness">1</Thickness>
@@ -27,7 +25,7 @@
             <StaticResource x:Key="CardBackgroundBrush" ResourceKey="SystemColorButtonFaceColorBrush" />
             <StaticResource x:Key="CardBorderBrush" ResourceKey="SystemColorButtonTextColorBrush" />
             <StaticResource x:Key="CardPrimaryForegroundBrush" ResourceKey="SystemColorButtonTextColorBrush" />
-            <SolidColorBrush x:Key="InfoBarInformationalSeverityBackgroundBrush" Color="#FF34424d"/>
+            <SolidColorBrush x:Key="InfoBarInformationalSeverityBackgroundBrush" Color="#FF34424d" />
             <SolidColorBrush x:Key="SolidBackgroundBrush" Color="Black" />
             <Color x:Key="InfoBarInformationalSeverityIconBackground">#FF5fb2f2</Color>
             <Thickness x:Key="CardBorderThickness">2</Thickness>
diff --git a/src/settings-ui/Settings.UI/Themes/SettingsExpanderStyles.xaml b/src/settings-ui/Settings.UI/Themes/SettingsExpanderStyles.xaml
index cdf214db1d1..0d5d9fb516f 100644
--- a/src/settings-ui/Settings.UI/Themes/SettingsExpanderStyles.xaml
+++ b/src/settings-ui/Settings.UI/Themes/SettingsExpanderStyles.xaml
@@ -1,30 +1,30 @@
 <ResourceDictionary
-    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:controls="using:Microsoft.PowerToys.Settings.UI.Controls"
     xmlns:muxc="using:Microsoft.UI.Xaml.Controls">
 
-    <!-- Thickness -->
+    <!--  Thickness  -->
     <Thickness x:Key="ExpanderContentPadding">0</Thickness>
     <Thickness x:Key="ExpanderSettingMargin">56, 8, 40, 8</Thickness>
     <Thickness x:Key="ExpanderSettingMarginTight">86, 0, 40, 8</Thickness>
 
     <SolidColorBrush x:Key="ExpanderChevronPointerOverBackground">Transparent</SolidColorBrush>
 
-    <!-- Styles -->
-    <!-- Setting used in a Expander header -->
+    <!--  Styles  -->
+    <!--  Setting used in a Expander header  -->
     <Style x:Key="ExpanderHeaderSettingStyle" TargetType="controls:Setting">
         <Setter Property="Background" Value="Transparent" />
         <Setter Property="BorderThickness" Value="0" />
         <Setter Property="BorderBrush" Value="Transparent" />
-        <Setter Property="Padding" Value="0, 14, 0, 14" />
-        <Setter Property="Margin" Value="0"/>
+        <Setter Property="Padding" Value="0,14,0,14" />
+        <Setter Property="Margin" Value="0" />
         <Setter Property="HorizontalAlignment" Value="Stretch" />
     </Style>
 
     <Thickness x:Key="ExpanderChevronMargin">0,0,8,0</Thickness>
 
-    <!-- Setting used in a Expander header -->
+    <!--  Setting used in a Expander header  -->
     <Style x:Key="ExpanderContentSettingStyle" TargetType="controls:Setting">
         <Setter Property="Background" Value="Transparent" />
         <Setter Property="BorderThickness" Value="0,1,0,0" />
@@ -42,9 +42,9 @@
         <Setter Property="Padding" Value="{StaticResource ExpanderSettingMarginTight}" />
         <Setter Property="HorizontalAlignment" Value="Stretch" />
     </Style>
-    
-    
-    <!-- Setting expander style -->
+
+
+    <!--  Setting expander style  -->
     <Style x:Key="SettingExpanderStyle" TargetType="muxc:Expander">
         <Setter Property="Background" Value="{ThemeResource CardBackgroundBrush}" />
         <Setter Property="BorderThickness" Value="{ThemeResource CardBorderThickness}" />
@@ -54,7 +54,7 @@
     </Style>
 
     <Style x:Key="ExpanderSeparatorStyle" TargetType="Rectangle">
-        <Setter Property="Height" Value="1"/>
+        <Setter Property="Height" Value="1" />
         <Setter Property="Stroke" Value="{ThemeResource CardBorderBrush}" />
     </Style>
 </ResourceDictionary>