From 90ddfb02a40389d5c33758599a6b88c158075857 Mon Sep 17 00:00:00 2001
From: MyDrift <personal@mdiana.ch>
Date: Thu, 29 Aug 2024 02:58:05 +0200
Subject: [PATCH] Toggle + Checkbox styling (#2617)

* restyle toggle + add animation + change check to blue

* use mainforegroundcolor for toggle label
---
 functions/public/Invoke-WPFUIElements.ps1 |  1 +
 xaml/inputXML.xaml                        | 37 ++++++++++++++++++++---
 2 files changed, 33 insertions(+), 5 deletions(-)

diff --git a/functions/public/Invoke-WPFUIElements.ps1 b/functions/public/Invoke-WPFUIElements.ps1
index 2319d6fe..f8e9c7ba 100644
--- a/functions/public/Invoke-WPFUIElements.ps1
+++ b/functions/public/Invoke-WPFUIElements.ps1
@@ -186,6 +186,7 @@ function Invoke-WPFUIElements {
                         $label.ToolTip = $entryInfo.Description
                         $label.HorizontalAlignment = "Left"
                         $label.FontSize = $theme.FontSize
+                        $label.Foreground = $theme.MainForegroundColor
                         $dockPanel.Children.Add($label) | Out-Null
                         $stackPanel.Children.Add($dockPanel) | Out-Null
 
diff --git a/xaml/inputXML.xaml b/xaml/inputXML.xaml
index db4be1a9..827017f1 100644
--- a/xaml/inputXML.xaml
+++ b/xaml/inputXML.xaml
@@ -315,7 +315,7 @@
                                                 Margin="2"
                                                 SnapsToDevicePixels="True"/>
                                         <Path x:Name="CheckMark"
-                                              Stroke="{TemplateBinding Foreground}"
+                                              Stroke="{ToggleButtonOnColor}"
                                               StrokeThickness="2"
                                               Data="M 0 5 L 5 10 L 12 0"
                                               Visibility="Collapsed"/>
@@ -427,7 +427,11 @@
                                 Width="34" Height="17">
                             <Ellipse x:Name="Ellipse" Fill="{MainForegroundColor}" Stretch="Uniform"
                                     Margin="2,2,2,1"
-                                    HorizontalAlignment="Left" Width="12">
+                                    HorizontalAlignment="Left" Width="10.8"
+                                    RenderTransformOrigin="0.5, 0.5">
+                                <Ellipse.RenderTransform>
+                                    <ScaleTransform ScaleX="1" ScaleY="1" />
+                                </Ellipse.RenderTransform>
                             </Ellipse>
                         </Border>
                         </Grid>
@@ -438,12 +442,35 @@
                                 <Setter TargetName="Border" Property="Background" Value="{LinkHoverForegroundColor}"/>
                                 <Setter Property="Cursor" Value="Hand" />
                                 <Setter Property="Panel.ZIndex" Value="1000"/>
+                                <Trigger.EnterActions>
+                                    <BeginStoryboard>
+                                        <Storyboard>
+                                            <DoubleAnimation Storyboard.TargetName="Ellipse"
+                                                            Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)"
+                                                            To="1.1" Duration="0:0:0.1" />
+                                            <DoubleAnimation Storyboard.TargetName="Ellipse"
+                                                            Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)"
+                                                            To="1.1" Duration="0:0:0.1" />
+                                        </Storyboard>
+                                    </BeginStoryboard>
+                                </Trigger.EnterActions>
+                                <Trigger.ExitActions>
+                                    <BeginStoryboard>
+                                        <Storyboard>
+                                            <DoubleAnimation Storyboard.TargetName="Ellipse"
+                                                            Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)"
+                                                            To="1.0" Duration="0:0:0.1" />
+                                            <DoubleAnimation Storyboard.TargetName="Ellipse"
+                                                            Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)"
+                                                            To="1.0" Duration="0:0:0.1" />
+                                        </Storyboard>
+                                    </BeginStoryboard>
+                                </Trigger.ExitActions>
                             </Trigger>
                             <Trigger Property="ToggleButton.IsChecked" Value="False">
                                 <Setter TargetName="Border" Property="Background" Value="{MainBackgroundColor}" />
-                                <Setter TargetName="Border" Property="BorderBrush" Value="{MainForegroundColor}" />
-                                <Setter TargetName="Ellipse" Property="Fill" Value="{MainForegroundColor}" />
-
+                                <Setter TargetName="Border" Property="BorderBrush" Value="#707070" />
+                                <Setter TargetName="Ellipse" Property="Fill" Value="#707070" />
                             </Trigger>
 
                             <Trigger Property="ToggleButton.IsChecked" Value="True">