<UserControl x:Class="ModernFlyouts.Controls.FlyoutAlignmentPicker"
             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:ui="http://schemas.modernwpf.com/2019"
             xmlns:toolkitControls="http://schemas.modernwpf.com/toolkit/controls"
             xmlns:utils="clr-namespace:ModernFlyouts.Utilities"
             xmlns:resx="clr-namespace:ModernFlyouts.Properties"
             mc:Ignorable="d">
    <UserControl.Resources>
        <Style TargetType="ToggleButton" BasedOn="{StaticResource DefaultToggleButtonStyle}">
            <Setter Property="Padding" Value="5" />
            <Setter Property="Width" Value="30" />
            <Setter Property="Height" Value="30" />
        </Style>
    </UserControl.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <TextBlock Text="{x:Static resx:Strings.Settings_FlyoutAlignment}" Margin="0,0,0,10"/>
        <toolkitControls:SimpleWrapPanel
            Grid.Row="1" HorizontalSpacing="10" VerticalSpacing="10" Orientation="Horizontal">
            <Border Padding="5" BorderBrush="{DynamicResource SystemControlHighlightAccentBrush}"
                    VerticalAlignment="Center"
                    BorderThickness="2" CornerRadius="{DynamicResource ControlCornerRadius}">
                <Grid Height="100" Width="100">
                    <ToggleButton x:Name="TgCenter" x:FieldModifier="private"
                                  Width="30" Height="30"
                                  Padding="5" HorizontalAlignment="Center" VerticalAlignment="Center">
                        <ui:FontIcon Glyph="{x:Static utils:CommonGlyphs.Align}" FontSize="16" />
                    </ToggleButton>
                    <ToggleButton x:Name="TgLeft" x:FieldModifier="private"
                                  Width="30" Height="30"
                                  Padding="5" HorizontalAlignment="Left" VerticalAlignment="Center">
                        <ui:FontIcon Glyph="{x:Static utils:CommonGlyphs.ChevronLeft}" FontSize="16" />
                    </ToggleButton>
                    <ToggleButton x:Name="TgRight" x:FieldModifier="private"
                                  Width="30" Height="30"
                                  Padding="5" HorizontalAlignment="Right" VerticalAlignment="Center">
                        <ui:FontIcon Glyph="{x:Static utils:CommonGlyphs.ChevronRight}" FontSize="16" />
                    </ToggleButton>
                    <ToggleButton x:Name="TgTop" x:FieldModifier="private"
                                  Width="30" Height="30"
                                  Padding="5" HorizontalAlignment="Center" VerticalAlignment="Top">
                        <ui:FontIcon Glyph="{x:Static utils:CommonGlyphs.ChevronUp}" FontSize="16" />
                    </ToggleButton>
                    <ToggleButton x:Name="TgBottom" x:FieldModifier="private"
                                  Width="30" Height="30"
                                  Padding="5" HorizontalAlignment="Center" VerticalAlignment="Bottom">
                        <ui:FontIcon Glyph="{x:Static utils:CommonGlyphs.ChevronDown}" FontSize="16" />
                    </ToggleButton>
                </Grid>
            </Border>
            <ui:SimpleStackPanel Spacing="10">
                <ComboBox x:Name="CmbHorizontal" x:FieldModifier="private"
                          ui:ControlHelper.Header="{x:Static resx:Strings.Settings_HorizontalAlignment}"
                          ItemTemplate="{StaticResource LocalizedEnumItemTemplate}"
                          Width="240" />
                <ComboBox x:Name="CmbVertical" x:FieldModifier="private"
                          ui:ControlHelper.Header="{x:Static resx:Strings.Settings_VerticalAlignment}"
                          ItemTemplate="{StaticResource LocalizedEnumItemTemplate}"
                          Width="240" />
            </ui:SimpleStackPanel>
        </toolkitControls:SimpleWrapPanel>
    </Grid>
</UserControl>
