<Page
    x:Class="was.touchcopy.features.contacts.ContactsSettingsPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="using:was.touchcopy.features.contacts"
    mc:Ignorable="d" d:DataContext="{d:DesignInstance Type=local:ContactsSettingsPage}">

    <Grid>
        <Grid.Resources>
            <Style x:Key="HelpButtonBorderStyle" TargetType="Border">
                <Setter Property="CornerRadius" Value="12"/>
                <Setter Property="BorderThickness" Value="2"/>
                <Setter Property="BorderBrush" Value="{StaticResource SystemAccentColor}"/>
                <Setter Property="Padding" Value="3"/>
                <Setter Property="VerticalAlignment" Value="Top"/>
            </Style>
            <Style x:Key="HelpButtonFontIconStyle" TargetType="FontIcon">
                <Setter Property="FontSize" Value="14"/>
                <Setter Property="FontWeight" Value="SemiBold"/>
                <Setter Property="Foreground" Value="{ThemeResource SystemAccentColor}"/>
                <Setter Property="Glyph" Value="&#xE897;"/>
            </Style>
        </Grid.Resources>
        <StackPanel Padding="20,10">
            <TextBlock x:Uid="TextBlockContactSettings" Style="{ThemeResource TitleTextBlockStyle}" Margin="0,10,0,20" Text="XX Contact Settings"/>
            <TextBlock x:Uid="TextBlockSortOptions" Style="{ThemeResource SubtitleTextBlockStyle}" Text="XX Sort Options"  Margin="0,0,0,15"/>
            <StackPanel Orientation="Horizontal" VerticalAlignment="Center">
                <ComboBox x:Uid="ComboBoxSortOrder" x:Name="comboBoxSortOrder" Header="XX Order contacts by">
                    <ComboBoxItem x:Uid="LastNameFirstName" Content="XX Last Name, First Name"  />
                    <ComboBoxItem x:Uid="FirstNameLastName" Content="XX First Name, Last Name" />
                </ComboBox>
                <Border x:Name="borderSortOrder" Style="{StaticResource HelpButtonBorderStyle}"
                        Tapped="_borderSortOrder_Tapped" Margin="20,1,0,0" >
                    <FontIcon Style="{StaticResource HelpButtonFontIconStyle}"/>
                </Border>
            </StackPanel>
            <TeachingTip x:Uid="TeachingTipSortOrder" x:Name="teachingTipSortOrder" Target="{x:Bind comboBoxSortOrder}" Title="XX Contacts Sort Order" 
                         Subtitle="XX This determines how your contacts are listed. Listed alphabetically by first name or last name."/>
            <TextBlock x:Uid="TextBlockExportOptions" Style="{ThemeResource SubtitleTextBlockStyle}" Text="XX Export Options" Margin="0,30,0,15" />
            <StackPanel Orientation="Horizontal" VerticalAlignment="Center">
                <ComboBox x:Uid="ComboBoxCSVExportFormat" x:Name="comboBoxCSVExportFormat" Header="XX Format CSV documents for">
                    <ComboBoxItem Content="Outlook"  />
                    <ComboBoxItem Content="Google Contacts" />
                </ComboBox>
                <Border x:Name="borderCSVExportFormat" Style="{StaticResource HelpButtonBorderStyle}" Tapped="_borderCSVExportFormat_Tapped" Margin="20,1,0,0" >
                    <FontIcon Style="{StaticResource HelpButtonFontIconStyle}"/>
                </Border>
            </StackPanel>
            <TeachingTip x:Uid="TeachingTipCSVExportFormat" x:Name="teachingTipCSVExportFormat" Target="{x:Bind comboBoxCSVExportFormat}" Title="XX CSV Export Format" 
             Subtitle="XX This determines the format used when exporting contacts to CSV."/>
        </StackPanel>
    </Grid>
</Page>
