C4IT-F4SD-Client/FasdDesktopUi/Pages/DetailsPage/UserControls/DetailsPageSettings.xaml

<UserControl x:Class="FasdDesktopUi.Pages.DetailsPage.UserControls.DetailsPageSettings"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:local="clr-namespace:FasdDesktopUi.Pages.DetailsPage.UserControls"
             xmlns:ico="clr-namespace:FasdDesktopUi.Basics.UserControls.AdaptableIcon;assembly=F4SD-AdaptableIcon"
             mc:Ignorable="d"
             d:DesignHeight="270"
             d:DesignWidth="400"
             x:Name="SettingsUserControl"
             MinHeight="250"
             MinWidth="400"
             Initialized="UserControl_Initialized">

    <Border CornerRadius="10"
            Background="{DynamicResource BackgroundColor.Menu.Categories}"
            Padding="10">
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition />
            </Grid.RowDefinitions>

            <ico:AdaptableIcon x:Name="CloseButton"
                               Grid.Row="0"
                               HorizontalAlignment="Right"
                               Style="{DynamicResource SettingsPage.Close.Icon}"
                               MouseUp="CloseButton_MouseUp"
                               TouchDown="CloseButton_TouchDown"
                               SelectedInternIcon="window_close" />

            <StackPanel Grid.Row="1">
                <StackPanel.Resources>
                    <Style TargetType="Border">
                        <Setter Property="CornerRadius"
                                Value="7.5" />
                        <Setter Property="Background"
                                Value="{DynamicResource BackgroundColor.Menu.MainCategory}" />
                        <Setter Property="Margin"
                                Value="5" />
                        <Setter Property="Padding"
                                Value="10,5" />
                    </Style>

                    <Style TargetType="TextBlock">
                        <Setter Property="Margin"
                                Value="0, 0, 20, 0" />
                        <Setter Property="FontSize"
                                Value="14" />
                        <Setter Property="FontFamily"
                                Value="Calibri" />
                        <Setter Property="FontWeight"
                                Value="Bold" />
                        <Setter Property="Foreground"
                                Value="{DynamicResource FontColor.Menu.Categories}" />
                        <Setter Property="VerticalAlignment"
                                Value="Center" />
                    </Style>
                </StackPanel.Resources>

                <Border>
                    <StackPanel>
                        <TextBlock Text="Color Mode:" />

                        <StackPanel Orientation="Horizontal">
                            <StackPanel.Resources>
                                <Style TargetType="ico:AdaptableIcon">
                                    <Setter Property="BorderPadding"
                                            Value="0" />
                                    <Setter Property="Margin"
                                            Value="0, 5, 10, 0" />
                                    <Setter Property="Cursor"
                                            Value="Hand" />
                                    <Setter Property="PrimaryIconColor"
                                            Value="{DynamicResource Color.Menu.Icon}" />
                                    <Setter Property="IconHeight"
                                            Value="20" />
                                    <Setter Property="IconWidth"
                                            Value="20" />

                                    <EventSetter Event="MouseUp"
                                                 Handler="ColorModeIcon_MouseUp" />
                                    <EventSetter Event="TouchDown"
                                                 Handler="ColorModeIcon_TouchDown" />

                                    <Style.Triggers>
                                        <Trigger Property="IsMouseOver"
                                                 Value="True">
                                            <Setter Property="PrimaryIconColor"
                                                    Value="{DynamicResource Color.Menu.Icon.Hover}" />
                                        </Trigger>
                                    </Style.Triggers>
                                </Style>
                            </StackPanel.Resources>

                            <ico:AdaptableIcon x:Name="LightModeIcon"
                                               Tag="LightMode"
                                               IconHeight="25"
                                               IconWidth="25"
                                               SelectedInternIcon="style_sunFilled" />

                            <ico:AdaptableIcon x:Name="DarkModeIcon"
                                               Tag="DarkMode"
                                               SelectedInternIcon="style_moonFilled" />
                        </StackPanel>
                    </StackPanel>
                </Border>

                <Border>
                    <StackPanel>
                        <StackPanel Orientation="Horizontal">
                            <TextBlock>Zoom:</TextBlock>
                            <TextBox x:Name="ScaleValueTextBox"
                                     Text="{Binding Path=ScaleValue, StringFormat=N2, Mode=TwoWay, UpdateSourceTrigger=LostFocus}"
                                     Foreground="{DynamicResource FontColor.DetailsPage.DataHistory.Value}"
                                     Background="{DynamicResource BackgroundColor.DetailsPage.DataHistory.TitleColumn}"
                                     BorderBrush="{DynamicResource BackgroundColor.DetailsPage.DataHistory.ValueColumn}"
                                     Padding="2" />
                        </StackPanel>

                        <Slider x:Name="SizeSlider"
                                Orientation="Horizontal"
                                Minimum="0"
                                Maximum="2.50"
                                Value="{Binding Path=ScaleValue, Mode=TwoWay}"
                                Margin="0,3"
                                TickFrequency="0.01" />
                    </StackPanel>
                </Border>

                <Border>
                    <StackPanel>

                        <TextBlock Text="Hightlight Colors:" />

                        <StackPanel x:Name="HighlightColorStack"
                                    Orientation="Horizontal"
                                    Margin="-5,0,0,0">
                            <StackPanel.Resources>
                                <Style TargetType="Border">
                                    <Setter Property="Cursor"
                                            Value="Hand" />
                                    <Setter Property="CornerRadius"
                                            Value="5" />
                                    <Setter Property="Height"
                                            Value="25" />
                                    <Setter Property="Width"
                                            Value="25" />
                                    <Setter Property="Margin"
                                            Value="5" />
                                    <Setter Property="BorderThickness"
                                            Value="2.5" />

                                    <EventSetter Event="MouseEnter"
                                                 Handler="HightlightColorBorder_MouseEnter" />
                                    <EventSetter Event="MouseLeave"
                                                 Handler="HightlightColorBorder_MouseLeave" />
                                    <EventSetter Event="MouseUp"
                                                 Handler="HighlightColorBorder_MouseUp" />
                                    <EventSetter Event="TouchDown"
                                                 Handler="HighlightColorBorder_TouchDown" />

                                    <Style.Triggers>
                                        <Trigger Property="IsMouseOver"
                                                 Value="True">
                                            <Setter Property="Height"
                                                    Value="30" />
                                            <Setter Property="Width"
                                                    Value="30" />
                                            <Setter Property="Margin"
                                                    Value="2.5" />
                                        </Trigger>
                                    </Style.Triggers>
                                </Style>
                            </StackPanel.Resources>

                            <Border x:Name="HighlightBlue"
                                    Background="{DynamicResource Color.Blue}"
                                    BorderBrush="{DynamicResource Color.Menu.Icon}"
                                    Tag="Blue" />
                            <Border x:Name="HighlightGreen"
                                    Background="{DynamicResource Color.Green}"
                                    BorderBrush="{DynamicResource Color.Menu.Icon}"
                                    Tag="Green" />
                            <Border x:Name="HighlightOrange"
                                    Background="{DynamicResource Color.Orange}"
                                    BorderBrush="{DynamicResource Color.Menu.Icon}"
                                    Tag="Orange" />
                            <Border x:Name="HighlightRed"
                                    Background="{DynamicResource Color.Red}"
                                    BorderBrush="{DynamicResource Color.Menu.Icon}"
                                    Tag="Red" />
                        </StackPanel>
                    </StackPanel>
                </Border>

            </StackPanel>

        </Grid>
    </Border>

</UserControl>