<views:ViewBase
    x:Class="CharacterMap.Views.SettingsView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="using:CharacterMap.Controls"
    xmlns:core="using:CharacterMap.Core"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:h="using:CharacterMap.Helpers"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:models="using:CharacterMap.Models"
    xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
    xmlns:viewmodels="using:CharacterMap.ViewModels"
    xmlns:views="using:CharacterMap.Views"
    xmlns:win1903="http://schemas.microsoft.com/winfx/2006/xaml/presentation?IsApiContractPresent(Windows.Foundation.UniversalApiContract, 8)"
    DataContext="{x:Bind}"
    Loaded="View_Loaded"
    TabFocusNavigation="Cycle"
    mc:Ignorable="d"
    d:DataContext="{d:DesignInstance Type=viewmodels:SettingsViewModel}"
    d:DesignHeight="1880"
    d:DesignWidth="1200">

    <UserControl.Resources>

        <Style BasedOn="{StaticResource DefaultThemeSliderStyle}" TargetType="Slider" />

        <Style BasedOn="{StaticResource DefaultThemeComboBoxStyle}" TargetType="ComboBox" />

        <DataTemplate x:Key="BlankTemplate" />

        <Style x:Key="SubheaderTextBlockStyle2" BasedOn="{StaticResource SubheaderTextBlockStyle}" TargetType="TextBlock">
            <Setter Property="FontSize" Value="20" />
            <Setter Property="FontWeight" Value="Normal" />
            <Setter Property="Margin" Value="0 12 0 4" />
        </Style>

    </UserControl.Resources>

    <Grid x:Name="Root">

        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="SizeStates">
                <VisualState x:Name="DefaultSizeState">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="740" />
                    </VisualState.StateTriggers>
                </VisualState>
                <VisualState x:Name="CompactSizeState">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="0" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="MenuColumn.Width" Value="44" />
                        <Setter Target="SpacerColumn.Width" Value="48" />
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
            <VisualStateGroup x:Name="ThemeStatesGroup">
                <VisualState x:Name="DefaultThemeState" />
                <VisualState x:Name="ClassicThemeState">
                    <VisualState.Setters>
                        <Setter Target="Presenter.TitleBackgroundBrush" Value="Transparent" />
                    </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="ZuneThemeState">
                    <VisualState.Setters>
                        <Setter Target="MenuColumn.Spacing" Value="8" />
                        <Setter Target="MenuColumn.Padding" Value="20 0 0 0" />
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
            <VisualStateGroup x:Name="ScrollStates">
                <VisualState x:Name="ContentScrollEnabledState" />
                <VisualState x:Name="ContentScrollDisabledState">
                    <VisualState.Setters>
                        <Setter Target="ContentScroller.VerticalScrollBarVisibility" Value="Disabled" />
                        <Setter Target="ContentScroller.VerticalScrollMode" Value="Disabled" />
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>

        <controls:ModalPagePresenter
            x:Name="Presenter"
            Title="{core:Localizer Key=SettingsHeader/Text}"
            CloseClicked="{x:Bind Hide}"
            TitleBarHeight="{x:Bind TitleBarHeight, Mode=OneWay}">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>

                <StackPanel
                    x:Name="MenuColumn"
                    Width="256"
                    Margin="0 24 0 0"
                    ChildrenTransitions="{x:Bind GetRepositionCollection(ViewModel.AllowAnimation), Mode=OneWay}"
                    Style="{StaticResource SettingsMenuStyle}">

                    <controls:MenuButton
                        Checked="MenuItem_Checked"
                        Content="{x:Bind h:Localization.Get('SettingsUIHeader/Text')}"
                        IsChecked="False"
                        Tag="UserInterfacePanel"
                        d:Content="{core:Localizer Key=SettingsUIHeader/Text}">
                        <controls:MenuButton.Icon>
                            <PathIcon
                                HorizontalAlignment="Center"
                                VerticalAlignment="Center"
                                Data="F1 M 13.125 0.019531 L 6.25 3.457031 L 6.25 6.445313 L 7.5 7.070313 L 7.5 4.853516 L 12.5 7.353516 L 12.5 10.498047 L 13.75 9.873047 L 13.75 7.353516 L 18.75 4.853516 L 18.75 10.498047 L 20 11.123047 L 20 3.457031 Z M 13.125 6.269531 L 8.271484 3.847656 L 10.332031 2.8125 L 14.853516 5.400391 Z M 16.201172 4.736328 L 11.669922 2.148438 L 13.125 1.416016 L 17.978516 3.847656 Z M 11.25 11.123047 L 11.25 10.341797 L 5.625 7.529297 L 0 10.341797 L 0 16.943359 L 5.625 19.765625 L 10 17.578125 L 10 16.171875 L 6.25 18.056641 L 6.25 13.613281 L 10 11.738281 L 10 11.748047 Z M 5 18.056641 L 1.25 16.171875 L 1.25 11.738281 L 5 13.613281 Z M 5.625 12.529297 L 2.021484 10.732422 L 5.625 8.925781 L 9.228516 10.732422 Z M 11.25 12.519531 L 11.25 17.666016 L 15.625 19.853516 L 20 17.666016 L 20 12.519531 L 15.625 10.332031 Z M 15 18.144531 L 12.5 16.894531 L 12.5 13.916016 L 15 15.166016 Z M 18.75 16.894531 L 16.25 18.144531 L 16.25 15.166016 L 18.75 13.916016 Z M 15.625 14.082031 L 13.271484 12.900391 L 15.625 11.728516 L 17.978516 12.900391 Z " />
                        </controls:MenuButton.Icon>
                    </controls:MenuButton>

                    <controls:MenuButton
                        Checked="MenuItem_Checked"
                        Content="{x:Bind h:Localization.Get('SettingsAdvancedUILabel/Text')}"
                        Tag="UserInterfaceAdvancedPanel"
                        d:Content="{core:Localizer Key=SettingsAdvancedUILabel/Text}">
                        <controls:MenuButton.Icon>
                            <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xE771;" />
                        </controls:MenuButton.Icon>
                    </controls:MenuButton>

                    <controls:MenuButton
                        Checked="MenuItem_Checked"
                        Content="{x:Bind h:Localization.Get('SettingsCollectionsHeader')}"
                        Tag="CollectionPanel"
                        d:Content="{core:Localizer Key=SettingsCollectionsHeader}">
                        <controls:MenuButton.Icon>
                            <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xE71D;" />
                        </controls:MenuButton.Icon>
                    </controls:MenuButton>

                    <controls:MenuButton
                        controls:MenuButton.Icon="Font"
                        Checked="MenuItem_Checked"
                        Content="{x:Bind h:Localization.Get('SettingsFontManagementLabel/Text')}"
                        Tag="FontPanel"
                        d:Content="{core:Localizer Key=SettingsFontManagementLabel/Text}" />

                    <controls:MenuButton
                        Checked="MenuItem_Checked"
                        Content="{x:Bind h:Localization.Get('SettingsSuggestionsHeader/Text')}"
                        Tag="RampPanel"
                        d:Content="{core:Localizer Key=SettingsSuggestionsHeader/Text}">
                        <controls:MenuButton.Icon>
                            <FontIcon FontFamily="{ThemeResource SymbolThemeFontFamily}" Glyph="&#xEA37;" />
                        </controls:MenuButton.Icon>
                    </controls:MenuButton>

                    <controls:MenuButton
                        Checked="MenuItem_Checked"
                        Content="{x:Bind h:Localization.Get('SettingsExportHeader/Text')}"
                        Tag="ExportPanel"
                        d:Content="{core:Localizer Key=SettingsExportHeader/Text}">
                        <controls:MenuButton.Icon>
                            <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xE8A7;" />
                        </controls:MenuButton.Icon>
                    </controls:MenuButton>

                    <controls:MenuButton
                        Checked="MenuItem_Checked"
                        Content="{x:Bind h:Localization.Get('SettingsCharacterSearchHeader/Text')}"
                        Tag="SearchPanel"
                        d:Content="{core:Localizer Key=SettingsCharacterSearchHeader/Text}">
                        <controls:MenuButton.Icon>
                            <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xE721;" />
                        </controls:MenuButton.Icon>
                    </controls:MenuButton>

                    <controls:MenuButton
                        Checked="MenuItem_Checked"
                        Content="{x:Bind h:Localization.Get('SettingsAdvancedOptionsLabel/Text')}"
                        Tag="AdvancedPanel"
                        d:Content="{core:Localizer Key=SettingsAdvancedOptionsLabel/Text}">
                        <controls:MenuButton.Icon>
                            <FontIcon FontFamily="{ThemeResource SymbolThemeFontFamily}" Glyph="&#xEA86;" />
                        </controls:MenuButton.Icon>
                    </controls:MenuButton>

                    <controls:MenuButton
                        Checked="MenuItem_Checked"
                        Content="{x:Bind h:Localization.Get('SettingsChangelogLabel/Text')}"
                        Tag="ChangePanel"
                        d:Content="{core:Localizer Key=SettingsChangelogLabel/Text}">
                        <controls:MenuButton.Icon>
                            <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xEC7A;" />
                        </controls:MenuButton.Icon>
                    </controls:MenuButton>

                    <controls:MenuButton
                        Checked="MenuItem_Checked"
                        Content="{x:Bind h:Localization.Get('SettingsLicensesLabel/Text')}"
                        Tag="LicensesPanel"
                        d:Content="{core:Localizer Key=SettingsLicensesLabel/Text}">
                        <controls:MenuButton.Icon>
                            <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xF571;" />
                        </controls:MenuButton.Icon>
                    </controls:MenuButton>

                    <controls:MenuButton
                        Checked="MenuItem_Checked"
                        Content="{x:Bind h:Localization.Get('SettingsAboutLabel/Text')}"
                        Tag="AboutPanel"
                        d:Content="{core:Localizer Key=SettingsAboutLabel/Text}">
                        <controls:MenuButton.Icon>
                            <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xE946;" />
                        </controls:MenuButton.Icon>
                    </controls:MenuButton>

                </StackPanel>

                <Border
                    x:Name="ContentBorder"
                    Grid.Column="1"
                    core:Properties.UseStandardReposition="{x:Bind ViewModel.AllowAnimation, Mode=OneWay}">
                    <!--  RepositionAnimation on the ScrollViewer itself breaks hit testing  -->
                    <ScrollViewer x:Name="ContentScroller">
                        <Grid
                            x:Name="ContentPanel"
                            ColumnSpacing="16"
                            Margin="20 14 20 120">

                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*" MaxWidth="700" />
                                <ColumnDefinition x:Name="SpacerColumn" Width="0.35*" />
                            </Grid.ColumnDefinitions>

                            <StackPanel
                                x:Name="UserInterfacePanel"
                                x:Load="False"
                                Visibility="Collapsed"
                                d:Visibility="Collapsed">

                                <TextBlock
                                    x:Uid="SettingsUIHeader"
                                    Style="{StaticResource SectionHeaderTextBlockStyle}"
                                    d:Text="{core:Localizer Key=SettingsUIHeader/Text}" />

                                <controls:SettingsPresenter
                                    x:Uid="SettingsCharGrouping"
                                    d:Description="{core:Localizer Key=SettingsCharGrouping/Description}"
                                    d:Title="{core:Localizer Key=SettingsCharGrouping/Title}">
                                    <ToggleSwitch MinWidth="0" IsOn="{x:Bind Settings.GroupCharacters, Mode=TwoWay}" />
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter
                                    Title="{core:Localizer Key=SettingsCharGridHeader/Text}"
                                    ContentPlacement="Bottom"
                                    Description="{core:Localizer Key=SettingsCharGridDescription/Text}">
                                    <StackPanel>
                                        <Slider
                                            HorizontalAlignment="Stretch"
                                            IsThumbToolTipEnabled="True"
                                            Maximum="{x:Bind core:AppSettings.MaxGridSize}"
                                            Minimum="{x:Bind core:AppSettings.MinGridSize}"
                                            StepFrequency="8"
                                            TickFrequency="8"
                                            TickPlacement="Outside"
                                            Value="{x:Bind GetGridSize(GridSize), Mode=TwoWay, BindBack=UpdateGridSize}"
                                            d:Value="80" />
                                        <TextBlock Style="{StaticResource BodyTextBlockStyle}">
                                            <Run Text="{x:Bind GridSize, Mode=OneWay}" d:Text="80" />
                                            <Run x:Uid="PixelUnits" d:Text="{core:Localizer Key=PixelUnits/Text}" />
                                        </TextBlock>
                                    </StackPanel>
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter
                                    Title="{core:Localizer Key=SettingsCharLabel/Text}"
                                    ContentPlacement="Bottom"
                                    Description="{core:Localizer Key=SettingsCharLabelDesc/Text}">
                                    <StackPanel>
                                        <controls:UXComboBox
                                            MinWidth="160"
                                            ItemsSource="{x:Bind ViewModel.Annotations}"
                                            SelectedItem="{Binding Settings.GlyphAnnotation, Mode=TwoWay}">
                                            <ComboBox.ItemTemplate>
                                                <DataTemplate x:DataType="models:GlyphAnnotation">
                                                    <TextBlock Text="{x:Bind core:Converters.GetLocalizedEnumName((models:GlyphAnnotation))}" />
                                                </DataTemplate>
                                            </ComboBox.ItemTemplate>
                                        </controls:UXComboBox>

                                        <Border
                                            Margin="0 12 0 0"
                                            HorizontalAlignment="Left"
                                            BorderBrush="{ThemeResource PivotNavButtonBackgroundThemeBrush}"
                                            BorderThickness="1"
                                            CornerRadius="4">
                                            <StackPanel
                                                Padding="4 4 0 0"
                                                h:CompositionFactory.CornerRadius="4"
                                                Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
                                                Orientation="Horizontal">
                                                <StackPanel.BackgroundTransition>
                                                    <BrushTransition x:Name="BackgroundTransition" Duration="0:0:0.25" />
                                                </StackPanel.BackgroundTransition>
                                                <GridViewItem>
                                                    <Grid
                                                        Width="{x:Bind GridSize, Mode=OneWay}"
                                                        Height="{x:Bind GridSize, Mode=OneWay}"
                                                        Padding="4">
                                                        <TextBlock
                                                            x:Name="Preview1"
                                                            Margin="0 -2 0 0"
                                                            Padding="0,0,0,8"
                                                            FontFamily="{x:Bind ViewModel.PreviewFontSource, Mode=OneWay}"
                                                            FontSize="{x:Bind core:Converters.GetFontSize(GridSize), Mode=OneWay}"
                                                            IsTextScaleFactorEnabled="False"
                                                            Text="A"
                                                            TextAlignment="Center" />
                                                        <TextBlock
                                                            Style="{StaticResource CharItemUnicodeStyle}"
                                                            Text="{x:Bind core:Converters.GetAnnotation(Settings.GlyphAnnotation, 65), Mode=OneWay}"
                                                            Visibility="{x:Bind ShowUnicode(Settings.GlyphAnnotation), Mode=OneWay}" />
                                                    </Grid>
                                                </GridViewItem>

                                                <GridViewItem>
                                                    <Grid
                                                        Width="{x:Bind GridSize, Mode=OneWay}"
                                                        Height="{x:Bind GridSize, Mode=OneWay}"
                                                        Padding="4">
                                                        <TextBlock
                                                            x:Name="Preview2"
                                                            Margin="0 -2 0 0"
                                                            Padding="0,0,0,8"
                                                            FontFamily="{x:Bind ViewModel.PreviewFontSource, Mode=OneWay}"
                                                            FontSize="{x:Bind core:Converters.GetFontSize(GridSize), Mode=OneWay}"
                                                            IsTextScaleFactorEnabled="False"
                                                            Text="b"
                                                            TextAlignment="Center" />
                                                        <TextBlock
                                                            Style="{StaticResource CharItemUnicodeStyle}"
                                                            Text="{x:Bind core:Converters.GetAnnotation(Settings.GlyphAnnotation, 98), Mode=OneWay}"
                                                            Visibility="{x:Bind ShowUnicode(Settings.GlyphAnnotation), Mode=OneWay}" />
                                                    </Grid>
                                                </GridViewItem>

                                                <GridViewItem>
                                                    <Grid
                                                        Width="{x:Bind GridSize, Mode=OneWay}"
                                                        Height="{x:Bind GridSize, Mode=OneWay}"
                                                        Padding="4">
                                                        <TextBlock
                                                            x:Name="Preview3"
                                                            Margin="0 -2 0 0"
                                                            Padding="0,0,0,8"
                                                            FontFamily="{x:Bind ViewModel.PreviewFontSource, Mode=OneWay}"
                                                            FontSize="{x:Bind core:Converters.GetFontSize(GridSize), Mode=OneWay}"
                                                            IsTextScaleFactorEnabled="False"
                                                            Text="y"
                                                            TextAlignment="Center" />
                                                        <TextBlock
                                                            Style="{StaticResource CharItemUnicodeStyle}"
                                                            Text="{x:Bind core:Converters.GetAnnotation(Settings.GlyphAnnotation, 121), Mode=OneWay}"
                                                            Visibility="{x:Bind ShowUnicode(Settings.GlyphAnnotation), Mode=OneWay}" />
                                                    </Grid>
                                                </GridViewItem>

                                            </StackPanel>

                                        </Border>

                                        <TextBlock
                                            x:Uid="SettingsCharPreviewHint"
                                            Style="{StaticResource HintStyle}"
                                            d:Text="{core:Localizer Key=SettingsCharPreviewHint/Text}" />
                                    </StackPanel>
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter
                                    Title="{core:Localizer Key=FontListDisplayHeader/Text}"
                                    ContentPlacement="Bottom"
                                    Description="{core:Localizer Key=SettingsFontListDescription/Text}">
                                    <StackPanel>

                                        <controls:UXRadioButton
                                            x:Name="UseActualFont"
                                            x:Uid="RbUseActualFont"
                                            Checked="UseActualFont_Checked"
                                            GroupName="FontList"
                                            d:Content="{core:Localizer Key=RbUseActualFont/Content}" />
                                        <controls:UXRadioButton
                                            x:Name="UseSystemFont"
                                            x:Uid="RbUseSystemFont"
                                            Checked="UseSystemFont_Checked"
                                            GroupName="FontList"
                                            d:Content="{core:Localizer Key=RbUseSystemFont/Content}" />

                                        <ListView
                                            x:Name="LstFontFamily"
                                            Width="256"
                                            Margin="0 12 0 0"
                                            HorizontalAlignment="Left"
                                            Background="{ThemeResource DefaultHostBrush}"
                                            BorderBrush="{ThemeResource PivotNavButtonBackgroundThemeBrush}"
                                            BorderThickness="1"
                                            CornerRadius="4"
                                            IsHitTestVisible="False"
                                            IsItemClickEnabled="False"
                                            IsSwipeEnabled="False"
                                            IsTabStop="False"
                                            ItemContainerTransitions="{StaticResource NoTransitions}"
                                            ItemTemplate="{StaticResource FontListItemTemplate}"
                                            ItemsSource="{x:Bind ViewModel.PreviewFonts, Mode=OneWay}"
                                            SelectionMode="None"
                                            ShowsScrollingPlaceholders="False">
                                            <ListView.Resources>
                                                <Style BasedOn="{StaticResource ListViewItemRevealStyle}" TargetType="ListViewItem">
                                                    <Setter Property="IsTabStop" Value="False" />
                                                    <Setter Property="HorizontalAlignment" Value="Stretch" />
                                                    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                                                    <Setter Property="Padding" Value="0" />
                                                </Style>
                                            </ListView.Resources>
                                        </ListView>

                                        <TextBlock x:Uid="SettingsFontListPreviewHint" Style="{StaticResource HintStyle}" />
                                    </StackPanel>

                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter Title="{core:Localizer Key=SettingsEnablePaneHeader/Text}" Description="{core:Localizer Key=SettingsEnablePaneDescription/Text}">
                                    <ToggleSwitch MinWidth="0" IsOn="{x:Bind Settings.EnablePreviewPane, Mode=TwoWay}" />
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter Title="{core:Localizer Key=SettingsLanguageHeader/Text}">
                                    <StackPanel>
                                        <controls:UXComboBox
                                            MinWidth="256"
                                            Margin="0 8 0 0"
                                            ItemsSource="{x:Bind ViewModel.SupportedLanguages}"
                                            PlaceholderText="{x:Bind core:Converters.GetLanguageDisplayFromID(Settings.AppLanguage)}"
                                            SelectedItem="{x:Bind core:Converters.GetSelectedLanguage(Settings.AppLanguage, ViewModel.SupportedLanguages), Mode=TwoWay, BindBack=SelectedLanguageToString}" />

                                        <TextBlock
                                            x:Uid="SettingsNeedRestart"
                                            Margin="4 4 0 4"
                                            Style="{StaticResource HintStyle}"
                                            Visibility="{x:Bind core:Converters.CompareLanguageToSetting(Settings.AppLanguage), Mode=OneWay}"
                                            d:Text="{core:Localizer Key=SettingsNeedRestart/Text}" />
                                    </StackPanel>
                                </controls:SettingsPresenter>

                                <controls:UXButton
                                    x:Uid="RestartButton"
                                    MinWidth="200"
                                    Margin="0 24 0 0"
                                    HorizontalAlignment="Left"
                                    Click="{x:Bind ViewModel.Restart}"
                                    d:Content="{core:Localizer Key=RestartButton/Content}" />

                            </StackPanel>

                            <StackPanel
                                x:Name="UserInterfaceAdvancedPanel"
                                x:Load="False"
                                ChildrenTransitions="{x:Bind GetRepositionCollection(ViewModel.AllowAnimation), Mode=OneWay}"
                                Visibility="Collapsed"
                                d:Visibility="Collapsed">

                                <TextBlock
                                    Style="{StaticResource SectionHeaderTextBlockStyle}"
                                    Text="{x:Bind h:Localization.Get('SettingsAdvancedUILabel/Text')}"
                                    d:Text="{core:Localizer Key=SettingsAdvancedUILabel/Text}" />

                                <controls:SettingsPresenter Title="{core:Localizer Key=SettingsSimpleAnimationHeader/Text}" Description="{core:Localizer Key=SettingsSimpleAnimationDescription/Text}">
                                    <ToggleSwitch
                                        x:Name="BasicAnimationToggle"
                                        MinWidth="0"
                                        IsOn="{x:Bind Settings.UseSelectionAnimations, Mode=TwoWay}" />
                                    <controls:SettingsPresenter.Items>
                                        <controls:SettingsPresenter
                                            x:Name="FluentAnimationsToggle"
                                            x:Load="{x:Bind BasicAnimationToggle.IsOn, Mode=OneWay}"
                                            x:Uid="SettingsPointerOverAnimation"
                                            Style="{StaticResource SubItemSettingsPresenterStyle}"
                                            d:Description="{core:Localizer Key=SettingsPointerOverAnimation/Description}"
                                            d:Title="{core:Localizer Key=SettingsPointerOverAnimation/Title}">
                                            <ToggleSwitch MinWidth="0" IsOn="{x:Bind Settings.UseFluentPointerOverAnimations1, Mode=TwoWay}" />
                                        </controls:SettingsPresenter>
                                        <controls:SettingsPresenter
                                            x:Name="ExpensiveAnimationToggle"
                                            x:Load="{x:Bind BasicAnimationToggle.IsOn, Mode=OneWay}"
                                            Title="{core:Localizer Key=SettingsExpensiveAnimationHeader/Text}"
                                            Description="{core:Localizer Key=SettingsExpensiveAnimationDescription/Text}"
                                            Style="{StaticResource SubItemSettingsPresenterStyle}">
                                            <ToggleSwitch MinWidth="0" IsOn="{x:Bind Settings.AllowExpensiveAnimations, Mode=TwoWay}" />
                                        </controls:SettingsPresenter>
                                    </controls:SettingsPresenter.Items>
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter Title="{core:Localizer Key=SettingsTransparencyHeader/Text}" Description="{core:Localizer Key=SettingsTransparencyDescription/Text}">
                                    <ToggleSwitch MinWidth="0" IsOn="{x:Bind Settings.IsTransparencyEnabled, Mode=TwoWay}" />
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter
                                    x:Name="ShadowSettings"
                                    x:Load="{x:Bind _themeSupportsShadows}"
                                    Title="{core:Localizer Key=SettingsShadowsHeader/Text}"
                                    Description="{core:Localizer Key=SettingsShadowsDescription/Text}">
                                    <win1903:ToggleSwitch MinWidth="0" IsOn="{x:Bind Settings.EnableShadows, Mode=TwoWay}" />
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter
                                    x:Name="ColorThemeSettings"
                                    x:Load="{x:Bind _themeSupportsDark}"
                                    Title="{core:Localizer Key=SettingsThemeHeader/Text}"
                                    ContentPlacement="Bottom">
                                    <StackPanel>
                                        <controls:UXRadioButton
                                            x:Name="ThemeLight"
                                            x:Uid="RbThemeLight"
                                            Checked="{x:Bind ViewModel.SetLightTheme}"
                                            GroupName="ThemeSelector"
                                            d:Content="{core:Localizer Key=RbThemeLight/Content}" />
                                        <controls:UXRadioButton
                                            x:Name="ThemeDark"
                                            x:Uid="RbThemeDark"
                                            Checked="{x:Bind ViewModel.SetDarkTheme}"
                                            GroupName="ThemeSelector"
                                            d:Content="{core:Localizer Key=RbThemeDark/Content}" />
                                        <controls:UXRadioButton
                                            x:Name="ThemeSystem"
                                            x:Uid="RbThemeSystem"
                                            Checked="{x:Bind ViewModel.SetWindowsTheme}"
                                            GroupName="ThemeSelector"
                                            d:Content="{core:Localizer Key=RbThemeSystem/Content}" />

                                        <controls:UXHyperlinkButton
                                            x:Uid="SettingsWindowsThemeSettings"
                                            NavigateUri="ms-settings:personalization-colors"
                                            Style="{StaticResource TextBlockButtonStyle}"
                                            d:Content="{core:Localizer Key=SettingsWindowsThemeSettings/Content}" />
                                    </StackPanel>
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter x:Uid="SettingsDesignStyle">
                                    <controls:UXComboBox
                                        Width="256"
                                        Margin="0 8 0 0"
                                        ItemsSource="{x:Bind ViewModel.Themes}"
                                        SelectedIndex="{x:Bind Settings.ApplicationDesignTheme}"
                                        SelectionChanged="Design_SelectionChanged" />
                                    <controls:SettingsPresenter.Items>
                                        <controls:UXButton
                                            x:Name="ThemeRestartButton"
                                            x:Load="{x:Bind ViewModel.ThemeHasChanged, Mode=OneWay}"
                                            x:Uid="RestartButton"
                                            MinWidth="200"
                                            Margin="20 14 0 18"
                                            HorizontalAlignment="Left"
                                            Click="{x:Bind ViewModel.Restart}"
                                            d:Content="{core:Localizer Key=RestartButton/Content}" />
                                    </controls:SettingsPresenter.Items>
                                </controls:SettingsPresenter>



                            </StackPanel>

                            <StackPanel
                                x:Name="ExportPanel"
                                x:Load="False"
                                Visibility="Collapsed"
                                d:Visibility="Collapsed">

                                <TextBlock
                                    x:Uid="SettingsExportHeader"
                                    Style="{StaticResource SectionHeaderTextBlockStyle}"
                                    d:Text="{core:Localizer Key=SettingsExportHeader/Text}" />

                                <controls:SettingsPresenter
                                    Title="{core:Localizer Key=SettingsPNGExportHeader/Text}"
                                    ContentPlacement="Bottom"
                                    Description="{core:Localizer Key=SettingsPNGExportDescription/Text}">
                                    <StackPanel>
                                        <Slider
                                            x:Name="SldResolution"
                                            HorizontalAlignment="Stretch"
                                            IsThumbToolTipEnabled="True"
                                            Maximum="2048"
                                            Minimum="32"
                                            StepFrequency="32"
                                            TickFrequency="64"
                                            TickPlacement="Outside"
                                            Value="{x:Bind Settings.PngSize, Mode=TwoWay}"
                                            d:Value="1024" />
                                        <TextBlock Margin="0,0,0,0" Style="{StaticResource BodyTextBlockStyle}">
                                            <Run Text="{Binding Value, ElementName=SldResolution}" d:Text="1024" />
                                            <Run Text="×" />
                                            <Run Text="{Binding Value, ElementName=SldResolution}" d:Text="1024" />
                                        </TextBlock>
                                    </StackPanel>
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter
                                    Title="{core:Localizer Key=SettingsFontNameExportLabel/Text}"
                                    ContentPlacement="Bottom"
                                    Description="{core:Localizer Key=SettingsFontNameExportDescription/Text}">
                                    <StackPanel>
                                        <muxc:RadioButtons
                                            x:Name="FontNamingSelection"
                                            Background="{x:Null}"
                                            BorderThickness="0"
                                            SelectionChanged="FontNamingSelection_SelectionChanged">
                                            <controls:UXRadioButton>
                                                <TextBlock>
                                                    <Run x:Uid="SettingsFontExportSystemLabel" d:Text="{core:Localizer Key=SettingsFontExportSystemLabel/Text}" />
                                                    <Run
                                                        FontSize="12.666"
                                                        Foreground="{ThemeResource TextControlPlaceholderForeground}"
                                                        Text="e.g. MSOFFSYMB.ttf" />
                                                </TextBlock>
                                            </controls:UXRadioButton>
                                            <controls:UXRadioButton x:Name="OptimisedRadio">
                                                <TextBlock>
                                                    <Run x:Uid="SettingsFontExportOptimizedLabel" d:Text="{core:Localizer Key=SettingsFontExportOptimizedLabel/Text}" />
                                                    <Run
                                                        FontSize="12.666"
                                                        Foreground="{ThemeResource TextControlPlaceholderForeground}"
                                                        Text=" e.g. MS Office Symbol Regular.ttf" />
                                                </TextBlock>
                                            </controls:UXRadioButton>
                                        </muxc:RadioButtons>

                                        <CheckBox
                                            Margin="48 0 0 0"
                                            IsChecked="{x:Bind Settings.FontExportIncludeVersion, Mode=TwoWay}"
                                            IsEnabled="{Binding ElementName=OptimisedRadio, Path=IsChecked}"
                                            Style="{StaticResource DefaultThemeCheckBoxStyle}">
                                            <TextBlock TextWrapping="Wrap">
                                                <Run x:Uid="SettingsFontExportVersionLabel" d:Text="{core:Localizer Key=SettingsFontExportVersionLabel/Text}" />
                                                <Run
                                                    FontSize="12.666"
                                                    Foreground="{ThemeResource TextControlPlaceholderForeground}"
                                                    Text=" e.g. MS Office Symbol Regular v1.5.ttf" />
                                            </TextBlock>
                                        </CheckBox>
                                    </StackPanel>


                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter
                                    x:Uid="SettingsGlyphNaming"
                                    ContentPlacement="Bottom"
                                    d:Description="{core:Localizer Key=SettingsGlyphNaming/Description}"
                                    d:Title="{core:Localizer Key=SettingsGlyphNaming/Title}">
                                    <controls:GlyphNamingControl ViewModel="{x:Bind ViewModel.GlyphNameModel}" />
                                </controls:SettingsPresenter>

                            </StackPanel>

                            <StackPanel
                                x:Name="SearchPanel"
                                x:Load="False"
                                Visibility="Collapsed"
                                d:Visibility="Collapsed">

                                <TextBlock
                                    x:Uid="SettingsCharacterSearchHeader"
                                    Style="{StaticResource SectionHeaderTextBlockStyle}"
                                    d:Text="{core:Localizer Key=SettingsCharacterSearchHeader/Text}" />

                                <controls:SettingsPresenter
                                    Title="{core:Localizer Key=InstantSearchToggleHeader/Text}"
                                    Description="{core:Localizer Key=SettingsCharacterSearchDescription/Text}"
                                    Loaded="SearchSwitchSettingsPresenter_Loaded">
                                    <ToggleSwitch
                                        x:Name="SearchSwitch"
                                        MinWidth="0"
                                        IsOn="{x:Bind Settings.UseInstantSearch, Mode=TwoWay}" />
                                    <controls:SettingsPresenter.Items>
                                        <controls:SettingsPresenter
                                            x:Name="SearchDelayItem"
                                            x:Load="{x:Bind Settings.UseInstantSearch, Mode=OneWay}"
                                            Title="{core:Localizer Key=SearchDelaySelector/Header}"
                                            Style="{StaticResource SubItemSettingsPresenterStyle}">
                                            <muxc:NumberBox
                                                x:Uid="SearchDelaySelector"
                                                Width="200"
                                                HorizontalAlignment="Left"
                                                AcceptsExpression="False"
                                                BorderThickness="1"
                                                FontSize="14"
                                                HeaderTemplate="{StaticResource BlankTemplate}"
                                                LargeChange="50"
                                                Maximum="2000"
                                                Minimum="250"
                                                SmallChange="10"
                                                SpinButtonPlacementMode="Inline"
                                                Value="{x:Bind Settings.InstantSearchDelay, Mode=TwoWay}"
                                                d:Header="{core:Localizer Key=SearchDelaySelector/Header}"
                                                d:Value="500" />
                                        </controls:SettingsPresenter>
                                    </controls:SettingsPresenter.Items>
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter Title="{core:Localizer Key=SearchResultsSlider/Header}" core:Properties.UseStandardReposition="{x:Bind ViewModel.AllowAnimation, Mode=OneWay}">

                                    <muxc:NumberBox
                                        x:Uid="SearchResultsSlider"
                                        Grid.Column="1"
                                        Width="200"
                                        HorizontalAlignment="Left"
                                        AcceptsExpression="False"
                                        FontSize="14"
                                        HeaderTemplate="{StaticResource BlankTemplate}"
                                        LargeChange="10"
                                        Maximum="250"
                                        Minimum="5"
                                        SmallChange="5"
                                        SpinButtonPlacementMode="Inline"
                                        Value="{x:Bind Settings.MaxSearchResult, Mode=TwoWay}"
                                        d:Header="{core:Localizer Key=SearchResultsSlider/Header}"
                                        d:Value="101" />
                                </controls:SettingsPresenter>

                            </StackPanel>

                            <Grid
                                x:Name="CollectionPanel"
                                x:Load="False"
                                HorizontalAlignment="Stretch"
                                Visibility="Collapsed"
                                d:Visibility="Collapsed">
                                <views:CollectionManagementView Margin="0 0 0 -80" HorizontalAlignment="Stretch" />
                            </Grid>

                            <StackPanel
                                x:Name="AdvancedPanel"
                                x:Load="False"
                                Visibility="Collapsed"
                                d:Visibility="Collapsed">
                                <TextBlock
                                    x:Uid="SettingsAdvancedOptionsLabel"
                                    Style="{StaticResource SectionHeaderTextBlockStyle}"
                                    d:Text="{core:Localizer Key=SettingsAdvancedOptionsLabel/Text}" />

                                <controls:SettingsPresenter
                                    x:Uid="SettingsDeprecatedIconsPresenter"
                                    d:Description="{core:Localizer Key=SettingsDeprecatedIconsPresenter/Description}"
                                    d:Title="{core:Localizer Key=SettingsDeprecatedIconsPresenter/Title}">
                                    <ToggleSwitch MinWidth="0" IsOn="{x:Bind Settings.HideDeprecatedMDL2, Mode=TwoWay}" />
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter
                                    x:Uid="SettingsRememberFilter"
                                    d:Description="{core:Localizer Key=SettingsRememberFilter/Description}"
                                    d:Title="{core:Localizer Key=SettingsRememberFilter/Title}">
                                    <ToggleSwitch MinWidth="0" IsOn="{x:Bind Settings.RestoreLastCollectionOnLaunch, Mode=TwoWay}" />
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter
                                    x:Uid="SettingsSimulatedFontFaces"
                                    d:Description="If enabled, simulated font faces automatically generated by Windows - tpyically bold and oblqiue font faces for fonts that do not have their own - will not be shown in the font face selector."
                                    d:Title="Hide simulated font faces">
                                    <ToggleSwitch MinWidth="0" IsOn="{x:Bind Settings.HideSimulatedFontFaces, Mode=TwoWay}" />
                                </controls:SettingsPresenter>

                            </StackPanel>

                            <StackPanel x:Name="ChangePanel" d:Visibility="Collapsed">
                                <TextBlock
                                    x:Uid="SettingsChangelogLabel"
                                    Style="{StaticResource SectionHeaderTextBlockStyle}"
                                    d:Text="{core:Localizer Key=SettingsChangelogLabel/Text}" />

                                <controls:UXHyperlinkButton
                                    x:Uid="BtnGithubCommits"
                                    NavigateUri="https://github.com/character-map-uwp/Character-Map-UWP/commits/master"
                                    d:Content="{core:Localizer Key=BtnGithubCommits/Content}" />

                                <ItemsControl ItemsSource="{x:Bind ViewModel.Changelog}">
                                    <ItemsControl.ItemTemplate>
                                        <DataTemplate x:DataType="models:ChangelogItem">
                                            <controls:SettingsPresenter
                                                Title="{x:Bind Header}"
                                                Margin="0 0 0 8"
                                                Description="{x:Bind Content}" />
                                        </DataTemplate>
                                    </ItemsControl.ItemTemplate>
                                </ItemsControl>

                            </StackPanel>

                            <StackPanel
                                x:Name="FontPanel"
                                x:Load="False"
                                Visibility="Collapsed"
                                d:Visibility="Collapsed">

                                <TextBlock
                                    x:Uid="SettingsFontManagementLabel"
                                    OpticalMarginAlignment="None"
                                    Style="{StaticResource SectionHeaderTextBlockStyle}"
                                    d:Text="{core:Localizer Key=SettingsFontManagementLabel/Text}" />

                                <controls:SettingsPresenter Title="{core:Localizer Key=SettingsSystemFontHeader/Text}" ContentPlacement="Bottom">
                                    <controls:SettingsPresenter.Description>
                                        <TextBlock Text="{x:Bind core:Converters.GetFormat2('InstallCountLabel', ViewModel.SystemFamilyCount, ViewModel.SystemFaceCount), Mode=OneWay}" TextWrapping="Wrap" />
                                    </controls:SettingsPresenter.Description>
                                    <StackPanel Orientation="Horizontal" Spacing="12">
                                        <controls:UXHyperlinkButton
                                            x:Uid="SettingsManageSystemFonts"
                                            NavigateUri="ms-settings:fonts"
                                            d:Content="{core:Localizer Key=SettingsManageSystemFonts/Content}" />
                                        <controls:UXHyperlinkButton MinWidth="136" IsEnabled="{x:Bind ViewModel.IsSystemExportEnabled, Mode=OneWay}">
                                            <Grid>
                                                <StackPanel
                                                    HorizontalAlignment="Center"
                                                    Orientation="Horizontal"
                                                    Spacing="12"
                                                    Visibility="{x:Bind core:Converters.FalseToVis(ViewModel.IsSystemExportEnabled), Mode=OneWay}"
                                                    d:Visibility="Collapsed">
                                                    <muxc:ProgressRing
                                                        Width="16"
                                                        Height="16"
                                                        HorizontalAlignment="Center" />
                                                    <TextBlock Text="{x:Bind ViewModel.SystemExportProgress, Mode=OneWay}" />
                                                </StackPanel>

                                                <TextBlock
                                                    x:Uid="SettingsExportInstalledLabel"
                                                    Visibility="{x:Bind ViewModel.IsSystemExportEnabled, Mode=OneWay}"
                                                    d:Text="{core:Localizer Key=SettingsExportInstalledLabel/Text}" />
                                            </Grid>
                                            <core:Properties.Flyout>
                                                <MenuFlyout
                                                    AreOpenCloseAnimationsEnabled="{x:Bind ViewModel.AllowAnimation, Mode=OneWay}"
                                                    MenuFlyoutPresenterStyle="{StaticResource DefaultFlyoutStyle}"
                                                    Placement="Bottom">
                                                    <MenuFlyoutItem
                                                        x:Uid="CollectionExportFolder"
                                                        Click="{x:Bind ViewModel.ExportSystemToFolder}"
                                                        Style="{StaticResource ThemeMenuFlyoutItemStyle}"
                                                        d:Text="{core:Localizer Key=CollectionExportFolder/Text}" />
                                                    <MenuFlyoutItem
                                                        x:Uid="CollectionExportZip"
                                                        Click="{x:Bind ViewModel.ExportSystemAsZip}"
                                                        Style="{StaticResource ThemeMenuFlyoutItemStyle}"
                                                        d:Text="{core:Localizer Key=CollectionExportZip/Text}" />
                                                </MenuFlyout>
                                            </core:Properties.Flyout>
                                        </controls:UXHyperlinkButton>
                                    </StackPanel>
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter Title="{core:Localizer Key=SettingsImportedFontsLabel/Text}" ContentPlacement="Bottom">
                                    <controls:SettingsPresenter.Description>
                                        <StackPanel Spacing="12">
                                            <TextBlock
                                                x:Uid="SettingsFontImportDescription"
                                                TextWrapping="Wrap"
                                                d:Text="{core:Localizer Key=SettingsFontImportDescription/Text}" />
                                            <TextBlock
                                                Text="{x:Bind core:Converters.GetFormat2('ImportCountLabel', ViewModel.ImportedFamilyCount, ViewModel.ImportedFaceCount), Mode=OneWay}"
                                                TextWrapping="Wrap"
                                                d:Text="{core:Localizer Key=ImportCountLabel}" />
                                        </StackPanel>
                                    </controls:SettingsPresenter.Description>

                                    <StackPanel Spacing="6">
                                        <controls:UXHyperlinkButton
                                            x:Name="ExportImportedButton"
                                            MinWidth="136"
                                            IsEnabled="{x:Bind ViewModel.IsCollectionExportEnabled, Mode=OneWay}">
                                            <Grid>
                                                <StackPanel
                                                    HorizontalAlignment="Center"
                                                    Orientation="Horizontal"
                                                    Spacing="12"
                                                    Visibility="{x:Bind core:Converters.FalseToVis(ViewModel.IsCollectionExportEnabled), Mode=OneWay}"
                                                    d:Visibility="Collapsed">
                                                    <muxc:ProgressRing
                                                        Width="16"
                                                        Height="16"
                                                        HorizontalAlignment="Center" />
                                                    <TextBlock Text="{x:Bind ViewModel.ImportedExportProgress, Mode=OneWay}" />
                                                </StackPanel>

                                                <TextBlock x:Uid="SettingsExportImportedLabel" Visibility="{x:Bind ViewModel.IsCollectionExportEnabled, Mode=OneWay}" />
                                            </Grid>
                                            <core:Properties.Flyout>
                                                <MenuFlyout
                                                    AreOpenCloseAnimationsEnabled="{x:Bind ViewModel.AllowAnimation, Mode=OneWay}"
                                                    MenuFlyoutPresenterStyle="{StaticResource DefaultFlyoutStyle}"
                                                    Placement="Bottom">
                                                    <MenuFlyoutItem
                                                        x:Uid="CollectionExportFolder"
                                                        Click="{x:Bind ViewModel.ExportToFolder}"
                                                        Style="{StaticResource ThemeMenuFlyoutItemStyle}"
                                                        d:Text="{core:Localizer Key=CollectionExportFolder/Text}" />
                                                    <MenuFlyoutItem
                                                        x:Uid="CollectionExportZip"
                                                        Click="{x:Bind ViewModel.ExportAsZip}"
                                                        Style="{StaticResource ThemeMenuFlyoutItemStyle}"
                                                        d:Text="{core:Localizer Key=CollectionExportZip/Text}" />
                                                </MenuFlyout>
                                            </core:Properties.Flyout>
                                        </controls:UXHyperlinkButton>

                                        <TextBlock
                                            x:Uid="ImportLabel"
                                            Margin="0 16 0 0"
                                            Style="{StaticResource HeaderStyle}"
                                            TextWrapping="Wrap"
                                            d:Text="{core:Localizer Key=ImportLabel/Text}" />

                                        <Grid
                                            x:Name="ImportFontsRegion"
                                            MaxWidth="352"
                                            HorizontalAlignment="Left">
                                            <Rectangle
                                                Opacity="0.8"
                                                Stroke="{ThemeResource SystemControlForegroundBaseHighBrush}"
                                                StrokeDashArray="2 2"
                                                StrokeThickness="1" />

                                            <Grid ColumnSpacing="12" Padding="16">
                                                <Grid.ColumnDefinitions>
                                                    <ColumnDefinition Width="Auto" />
                                                    <ColumnDefinition Width="*" />
                                                </Grid.ColumnDefinitions>

                                                <FontIcon
                                                    VerticalAlignment="Top"
                                                    FontFamily="{ThemeResource SymbolThemeFontFamily}"
                                                    FontSize="30"
                                                    Glyph="&#xE7C9;" />

                                                <StackPanel Grid.Column="1">
                                                    <TextBlock
                                                        x:Uid="ImportDragDropLabel"
                                                        FontWeight="SemiBold"
                                                        Opacity="0.8"
                                                        TextWrapping="Wrap"
                                                        d:Text="{core:Localizer Key=ImportDragDropLabel/Text}" />
                                                    <TextBlock
                                                        x:Uid="ImportDragDropDescriptionLabel"
                                                        FontSize="12"
                                                        Opacity="0.6"
                                                        TextWrapping="Wrap"
                                                        d:Text="{core:Localizer Key=ImportDragDropLabel/Text}" />
                                                </StackPanel>

                                            </Grid>


                                        </Grid>
                                    </StackPanel>


                                </controls:SettingsPresenter>

                            </StackPanel>

                            <StackPanel
                                x:Name="RampPanel"
                                x:Load="False"
                                Spacing="6"
                                Visibility="Collapsed"
                                d:Visibility="Collapsed">
                                <TextBlock
                                    x:Uid="SettingsSuggestionsHeader"
                                    Margin="0 16 0 0"
                                    Style="{StaticResource SectionHeaderTextBlockStyle}"
                                    d:Text="{core:Localizer Key=SettingsSuggestionsHeader/Text}" />

                                <controls:SettingsPresenter
                                    x:Uid="SettingsFontListToolTip"
                                    ContentPlacement="Bottom"
                                    d:Description="{core:Localizer Key=SettingsFontListToolTip/Description}"
                                    d:Title="{core:Localizer Key=SettingsFontListToolTip/Title}">
                                    <TextBox Text="{Binding Settings.FamilyPreviewString, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" d:PlaceholderText="{core:Localizer Key=CultureSpecificPangram/Text}" />
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter
                                    x:Uid="SettingsCustomSuggestions"
                                    ContentPlacement="Bottom"
                                    d:Description="{core:Localizer Key=SettingsCustomSuggestions/Description}"
                                    d:Title="{core:Localizer Key=SettingsCustomSuggestions/Title}">

                                    <Grid RowSpacing="12" Padding="4">
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="Auto" />
                                            <RowDefinition Height="*" />
                                        </Grid.RowDefinitions>

                                        <Grid ColumnSpacing="8" Padding="4">
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="*" />
                                                <ColumnDefinition Width="Auto" />
                                            </Grid.ColumnDefinitions>

                                            <TextBox
                                                x:Uid="SettingsSuggestionTextBox"
                                                VerticalAlignment="Center"
                                                AcceptsReturn="False"
                                                Text="{Binding ViewModel.RampInput, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
                                                d:PlaceholderText="{core:Localizer Key=SettingsSuggestionTextBox/PlaceholderText}" />
                                            <controls:UXButton
                                                Grid.Column="1"
                                                core:Properties.ToolTip="{core:Localizer Key='AddButton/Label'}"
                                                h:FluentAnimation.PointerOverOffset="-2"
                                                Click="{x:Bind ViewModel.AddRamp}"
                                                Style="{StaticResource MapInfoButtonStyle}">
                                                <SymbolIcon Symbol="Add" />
                                            </controls:UXButton>
                                        </Grid>

                                        <ListView
                                            Grid.Row="1"
                                            Margin="-12 0"
                                            AllowDrop="True"
                                            CanDragItems="True"
                                            CanReorderItems="True"
                                            ItemsSource="{x:Bind ViewModel.RampOptions, Mode=OneWay}"
                                            SelectionMode="None">
                                            <ListView.ItemTemplate>
                                                <DataTemplate>
                                                    <Grid Padding="4">
                                                        <Grid.ColumnDefinitions>
                                                            <ColumnDefinition Width="*" />
                                                            <ColumnDefinition Width="Auto" />
                                                        </Grid.ColumnDefinitions>

                                                        <TextBlock
                                                            VerticalAlignment="Center"
                                                            Text="{Binding}"
                                                            TextWrapping="Wrap" />
                                                        <controls:UXButton
                                                            Grid.Column="1"
                                                            VerticalAlignment="Center"
                                                            h:FluentAnimation.PointerOverOffset="-2"
                                                            Click="DeleteRampClick"
                                                            Style="{StaticResource MapInfoButtonStyle}">
                                                            <SymbolIcon Symbol="Delete" />
                                                        </controls:UXButton>
                                                    </Grid>
                                                </DataTemplate>
                                            </ListView.ItemTemplate>
                                        </ListView>

                                    </Grid>


                                </controls:SettingsPresenter>

                            </StackPanel>

                            <StackPanel
                                x:Name="LicensesPanel"
                                x:Load="False"
                                Visibility="Collapsed"
                                d:Visibility="Collapsed">

                                <TextBlock
                                    x:Uid="SettingsLicensesLabel"
                                    Style="{StaticResource SectionHeaderTextBlockStyle}"
                                    d:Text="{core:Localizer Key=SettingsLicensesLabel/Text}" />

                                <TextBlock
                                    x:Uid="SettingsLicensesDescriptionLabel"
                                    Style="{StaticResource DescriptionStyle}"
                                    d:Text="{core:Localizer Key=SettingsLicensesDescriptionLabel/Text}" />

                                <controls:SettingsPresenter Title="WinUI">
                                    <controls:UXHyperlinkButton Content="MIT License" NavigateUri="https://github.com/microsoft/microsoft-ui-xaml/blob/master/LICENSE" />
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter Title="Win2D">
                                    <controls:UXHyperlinkButton Content="MIT License" NavigateUri="https://github.com/microsoft/Win2D/blob/master/LICENSE.txt" />
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter Title="Windows Community Toolkit">
                                    <controls:UXHyperlinkButton Content="MIT License" NavigateUri="https://github.com/windows-toolkit/WindowsCommunityToolkit/blob/master/license.md" />
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter Title="Humanizer">
                                    <controls:UXHyperlinkButton Content="MIT License" NavigateUri="https://github.com/Humanizr/Humanizer/blob/master/LICENSE" />
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter Title="SQLitePCLRaw">
                                    <controls:UXHyperlinkButton Content="Apache License 2.0" NavigateUri="https://github.com/ericsink/SQLitePCL.raw/blob/master/LICENSE.TXT" />
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter Title="woff2otf-CSharp">
                                    <controls:UXHyperlinkButton Content="Apache License 2.0" NavigateUri="https://github.com/JohnnyWestlake/woff2otf-CSharp/blob/master/LICENSE" />
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter Title="Adobe Glyph List">
                                    <controls:UXHyperlinkButton Content="BSD 3-Clause" NavigateUri="https://github.com/adobe-type-tools/agl-aglfn/blob/master/LICENSE.md" />
                                </controls:SettingsPresenter>

                                <controls:SettingsPresenter Title="Adobe Blank">
                                    <controls:UXHyperlinkButton Content="SIL Open Font License 1.1" NavigateUri="https://github.com/adobe-fonts/adobe-blank/blob/master/LICENSE.txt" />
                                </controls:SettingsPresenter>
                            </StackPanel>

                            <StackPanel
                                x:Name="AboutPanel"
                                x:Load="False"
                                Visibility="Collapsed"
                                d:Visibility="Collapsed">

                                <TextBlock
                                    x:Uid="SettingsAboutLabel"
                                    Style="{StaticResource SectionHeaderTextBlockStyle}"
                                    d:Text="{core:Localizer Key=SettingsAboutLabel/Text}" />

                                <controls:SettingsPresenter Title="{x:Bind core:Utils.GetAppDescription()}" ContentPlacement="Bottom">
                                    <StackPanel Spacing="12">
                                        <Image
                                            Width="150"
                                            HorizontalAlignment="Left"
                                            Source="/Assets/FileAssociationTile.png" />

                                        <TextBlock
                                            x:Uid="Settings_AboutDescription"
                                            Style="{StaticResource BodyTextBlockStyle}"
                                            TextWrapping="Wrap"
                                            d:Text="{core:Localizer Key=Settings_AboutDescription/Text}" />

                                        <StackPanel>
                                            <controls:UXHyperlinkButton Content="GitHub" NavigateUri="https://github.com/character-map-uwp/Character-Map-UWP" />
                                            <controls:UXHyperlinkButton
                                                x:Uid="BtnContributors"
                                                NavigateUri="https://github.com/character-map-uwp/Character-Map-UWP/graphs/contributors"
                                                d:Content="{core:Localizer Key=BtnContributors/Content}" />
                                            <controls:UXHyperlinkButton
                                                x:Uid="BtnHelpAndTips"
                                                NavigateUri="https://github.com/character-map-uwp/Character-Map-UWP/wiki"
                                                d:Content="{core:Localizer Key=BtnHelpAndTips/Content}" />
                                        </StackPanel>

                                        <controls:UXButton
                                            x:Name="BtnReview"
                                            x:Uid="BtnRateAndReview"
                                            Width="200"
                                            HorizontalAlignment="Left"
                                            Click="{x:Bind ViewModel.LaunchReview}"
                                            d:Content="{core:Localizer Key=BtnRateAndReview/Content}" />
                                        <controls:UXButton
                                            x:Name="BtnRestart"
                                            x:Uid="RestartButton"
                                            Width="200"
                                            HorizontalAlignment="Left"
                                            Click="{x:Bind ViewModel.Restart}"
                                            d:Content="{core:Localizer Key=RestartButton/Content}" />

                                    </StackPanel>
                                </controls:SettingsPresenter>

                            </StackPanel>
                        </Grid>
                    </ScrollViewer>
                </Border>
            </Grid>
        </controls:ModalPagePresenter>

    </Grid>
</views:ViewBase>
