<UserControl x:Class="ControlExplorer.Controls.RichTextBox.FormatPopup"
    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:c1="using:C1.Xaml"
    xmlns:c1doc="using:C1.Xaml.RichTextBox.Documents"
    mc:Ignorable="d"
             Height="800" Width="480"
    d:DesignHeight="800" d:DesignWidth="480">
    <UserControl.Resources>
        <SolidColorBrush x:Key="popupForeground" Color="Black" />
        <SolidColorBrush x:Key="popupBackground" Color="White" />
        <Style TargetType="Button">
            <Setter Property="Width" Value="50" />
            <Setter Property="Height" Value="50" />
            <Setter Property="Padding" Value="0" />
            <Setter Property="BorderThickness" Value="1" />
            <Setter Property="BorderBrush" Value="{StaticResource popupForeground}" />
            <Setter Property="MinWidth" Value="0"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid Background="Transparent" >
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="EnabledBackground" Storyboard.TargetProperty="Visibility">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <Visibility>Collapsed</Visibility>
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DisabledBackground" Storyboard.TargetProperty="Visibility">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <Visibility>Visible</Visibility>
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Border x:Name="EnabledBackground" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
                                <ContentControl x:Name="EnabledContent" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" Margin="{TemplateBinding Padding}" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/>
                            </Border>
                            <Border x:Name="DisabledBackground" IsHitTestVisible="False" Background="Transparent" BorderBrush="{StaticResource PhoneDisabledBrush}" BorderThickness="{TemplateBinding BorderThickness}" Margin="{StaticResource PhoneTouchTargetOverhang}" Visibility="Collapsed">
                                <ContentControl x:Name="DisabledContent" Foreground="{StaticResource PhoneDisabledBrush}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" Margin="{TemplateBinding Padding}" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/>
                            </Border>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Setter Property="Margin" Value="20,8"/>
            <Setter Property="MinHeight" Value="1"/>
        </Style>
        <Style TargetType="ToggleButton">
            <Setter Property="Width" Value="50" />
            <Setter Property="Height" Value="50" />
            <Setter Property="Padding" Value="0" />
            <Setter Property="BorderThickness" Value="1" />
            <Setter Property="BorderBrush" Value="{StaticResource popupForeground}" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ToggleButton">
                        <Grid Background="Transparent" >
                            <Border x:Name="EnabledBackground" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
                                <ContentControl x:Name="EnabledContent" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" Margin="{TemplateBinding Padding}" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/>
                            </Border>
                            <Border x:Name="DisabledBackground" IsHitTestVisible="False" Background="Transparent" BorderBrush="{StaticResource PhoneDisabledBrush}" BorderThickness="{TemplateBinding BorderThickness}" Margin="{StaticResource PhoneTouchTargetOverhang}" Visibility="Collapsed">
                                <ContentControl x:Name="DisabledContent" Foreground="{StaticResource PhoneDisabledBrush}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" Margin="{TemplateBinding Padding}" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/>
                            </Border>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Setter Property="MinWidth" Value="0"/>
            <Setter Property="MinHeight" Value="0"/>
            <Setter Property="Margin" Value="20,8"/>
        </Style>
        <x:Double x:Key="FontSize">16</x:Double>
    </UserControl.Resources>
    <ScrollViewer>
        <Grid x:Name="LayoutRoot" Background="{StaticResource popupBackground}">
            <StackPanel Margin="24,12,12,12">
                <TextBlock FontSize="{StaticResource FontSize}"  Style="{StaticResource CE-HeaderTextBlock}"  Text="format" Foreground="{StaticResource popupForeground}"/>
                <c1:C1WrapPanel>
                    <ToggleButton x:Name="btnBold" Click="ButtonBase_Click" >
                        <TextBlock Text="B" TextWrapping="Wrap" FontFamily="Times New Roman" FontSize="40" FontWeight="Bold" TextAlignment="Center" Foreground="{StaticResource popupForeground}"/>
                    </ToggleButton>
                    <ToggleButton x:Name="btnItalic" Click="ButtonBase_Click">
                        <TextBlock Text="I" TextWrapping="Wrap" FontFamily="Times New Roman" FontSize="40" FontWeight="Normal" FontStyle="Italic" TextAlignment="Center" Foreground="{StaticResource popupForeground}"/>
                    </ToggleButton>
                    <ToggleButton x:Name="btnUnderline" Click="ButtonBase_Click">
                        <TextBlock Text="U" TextWrapping="Wrap" FontFamily="Times New Roman" FontSize="40" FontWeight="Normal" TextAlignment="Center" Foreground="{StaticResource popupForeground}"/>
                    </ToggleButton>
                    <ToggleButton x:Name="btnStrike" Click="ButtonBase_Click">
                        <Grid>
                            <TextBlock Text="abc" FontFamily="Times New Roman" FontSize="30" Foreground="{StaticResource popupForeground}"/>
                            <Path Height="2" Width="44" HorizontalAlignment="Center" VerticalAlignment="Center" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="2" Data="M4.3000002,4.4000001 L11.500694,4.4000001" Margin="0 5 0 0"/>
                        </Grid>
                    </ToggleButton>
                    <ToggleButton x:Name="btnSubscript" Click="ButtonBase_Click">
                        <StackPanel Orientation="Horizontal" >
                            <TextBlock  FontSize="30" Text="X" TextWrapping="Wrap" FontWeight="Bold" TextAlignment="Center" Margin="0,1,0,0" Foreground="{StaticResource popupForeground}"/>
                            <TextBlock Text="2" TextWrapping="Wrap" FontSize="20" HorizontalAlignment="Right" VerticalAlignment="Bottom" FontWeight="Normal" Foreground="{StaticResource popupForeground}"/>
                        </StackPanel>
                    </ToggleButton>
                    <ToggleButton x:Name="btnSuperscript" Click="ButtonBase_Click">
                        <StackPanel Orientation="Horizontal">
                            <TextBlock Text="X" TextWrapping="Wrap" FontSize="30" FontWeight="Bold" TextAlignment="Center" Margin="0,1,0,0" Foreground="{StaticResource popupForeground}"/>
                            <TextBlock Text="2" TextWrapping="Wrap" FontSize="20" HorizontalAlignment="Right" VerticalAlignment="Stretch" Margin="0,0,0,7.45100021362305" FontWeight="Normal" Foreground="{StaticResource popupForeground}" d:LayoutOverrides="Height"/>
                        </StackPanel>
                    </ToggleButton>
                    <Button x:Name="btnGrowFont" Click="ButtonBase_Click">
                        <StackPanel Height="42" Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center">
                            <TextBlock FontFamily="Times New Roman" FontSize="42" Text="A" TextWrapping="Wrap" FontWeight="Bold" TextAlignment="Center" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="{StaticResource popupForeground}"/>
                            <Path HorizontalAlignment="Right" VerticalAlignment="Top" Stretch="Fill" StrokeThickness="1" Data="M0,0 L5,0 L2.5,-0.43323728 L2.5,-0.43751192 z" Fill="{StaticResource popupForeground}" Height="8" UseLayoutRounding="False" Width="14"/>
                        </StackPanel>
                    </Button>
                    <Button x:Name="btnShrinkFont" Click="ButtonBase_Click" >
                        <StackPanel Height="30" Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Bottom">
                            <TextBlock Text="A" TextWrapping="Wrap" FontFamily="Times New Roman" FontSize="30" FontWeight="Bold" TextAlignment="Center" Foreground="{StaticResource popupForeground}"/>
                            <Path HorizontalAlignment="Right" VerticalAlignment="Top" Stretch="Fill" StrokeThickness="1" Data="M0,0 L5,0 L2.5,3 L2.5,3 z" Margin="0"  Fill="{StaticResource popupForeground}" Height="8" Width="14"/>
                        </StackPanel>
                    </Button>
                </c1:C1WrapPanel>
                <TextBlock FontSize="{StaticResource FontSize}"  Style="{StaticResource CE-HeaderTextBlock}"  Text="highlight" Foreground="{StaticResource popupForeground}"/>
                <c1:C1WrapPanel>
                    <ToggleButton x:Name="btnHighlight1" Click="ButtonBase_Click" />
                    <ToggleButton x:Name="btnHighlight2" Click="ButtonBase_Click" />
                    <ToggleButton x:Name="btnHighlight3" Click="ButtonBase_Click" />
                </c1:C1WrapPanel>
                <TextBlock FontSize="{StaticResource FontSize}" Style="{StaticResource CE-HeaderTextBlock}" Foreground="{StaticResource popupForeground}" Text="font color" />
                <c1:C1WrapPanel>
                    <ToggleButton x:Name="btnFontColor1" Click="ButtonBase_Click" />
                    <ToggleButton x:Name="btnFontColor2" Click="ButtonBase_Click" />
                    <ToggleButton x:Name="btnFontColor3" Click="ButtonBase_Click" />
                </c1:C1WrapPanel>
                <TextBlock FontSize="{StaticResource FontSize}"  Text="alignment" Style="{StaticResource CE-HeaderTextBlock}" Foreground="{StaticResource popupForeground}" />
                <c1:C1WrapPanel>
                    <ToggleButton x:Name="btnAlignLeft" Click="ButtonBase_Click">
                        <StackPanel Height="40" Width="40" >
                            <Path Height="3" HorizontalAlignment="Left" Margin="-0.5,0" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001"/>
                            <Path Height="3" HorizontalAlignment="Left" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001" Margin="-0.5,4,6,0"/>
                            <Path Height="3" HorizontalAlignment="Left" Margin="-0.5,4,-0.5,0" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001"/>
                            <Path Height="3" HorizontalAlignment="Left" Margin="-0.5,4,-0.5,0" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001"/>
                            <Path Height="3" HorizontalAlignment="Left" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001" Margin="-0.5,4,6,0"/>
                            <Path Height="3" HorizontalAlignment="Left" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001" Margin="-0.5,4,0,0" UseLayoutRounding="False"/>
                        </StackPanel>
                    </ToggleButton>
                    <ToggleButton x:Name="btnAlignCenter" Click="ButtonBase_Click">
                        <StackPanel Width="40" Height="40">
                            <Path Height="3" HorizontalAlignment="Stretch" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001" Margin="-0.5,0,-0.5,0"/>
                            <Path Height="3" HorizontalAlignment="Stretch" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001" Margin="3,4,3,0"/>
                            <Path Height="3" HorizontalAlignment="Stretch" Margin="-0.5,4,-0.5,0" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001"/>
                            <Path Height="3" HorizontalAlignment="Stretch" Margin="-0.5,4,-0.5,0" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001"/>
                            <Path Height="3" HorizontalAlignment="Stretch" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001" Margin="3,4,3,0"/>
                            <Path Height="3" HorizontalAlignment="Stretch" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001" Margin="1.5,4,1.5,0"/>
                        </StackPanel>
                    </ToggleButton>
                    <ToggleButton x:Name="btnAlignRight" Click="ButtonBase_Click">
                        <StackPanel Height="40" Width="40">
                            <Path Height="3" HorizontalAlignment="Stretch" Margin="-0.5,0,-0.5,0" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001"/>
                            <Path Height="3" HorizontalAlignment="Stretch" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001" Margin="6,4,-0.5,0"/>
                            <Path Height="3" HorizontalAlignment="Stretch" Margin="-0.5,4,-0.5,0" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001"/>
                            <Path Height="3" HorizontalAlignment="Stretch" Margin="-0.5,4,-0.5,0" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001"/>
                            <Path Height="3" HorizontalAlignment="Right" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001" Margin="6,4,-0.5,0"/>
                            <Path Height="3" HorizontalAlignment="Right" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001" Margin="3,4,-0.5,0"/>
                        </StackPanel>
                    </ToggleButton>
                </c1:C1WrapPanel>
                <TextBlock Text="list" FontSize="{StaticResource FontSize}"  Style="{StaticResource CE-HeaderTextBlock}" Foreground="{StaticResource popupForeground}"/>
                <c1:C1WrapPanel>
                    <ToggleButton x:Name="btnBullets" Click="ButtonBase_Click">
                        <Grid Height="40" Width="40">
                            <Path Height="3" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001" Margin="10,10,-0.5,0"/>
                            <Path Height="3" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001" Margin="10,20,-0.5,0"/>
                            <Path Height="3" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001" Margin="10,30,-0.5,0"/>
                            <Ellipse Height="6" HorizontalAlignment="Left" VerticalAlignment="Top" Width="6" Fill="{StaticResource popupForeground}" StrokeThickness="1" Margin="0,8,0,0"/>
                            <Ellipse Height="6" HorizontalAlignment="Left" VerticalAlignment="Top" Width="6" Fill="{StaticResource popupForeground}" StrokeThickness="1" Margin="0,18,0,0" />
                            <Ellipse Height="6" HorizontalAlignment="Left" VerticalAlignment="Top" Width="6" Fill="{StaticResource popupForeground}" StrokeThickness="1" Margin="0,28,0,0"/>
                        </Grid>
                    </ToggleButton>
                    <ToggleButton x:Name="btnNumbering" Click="ButtonBase_Click">
                        <Grid Height="40" Width="40">
                            <Path Height="3" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001" Margin="10,10,-0.5,0"/>
                            <Path Height="3" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001" Margin="10,20,-0.5,0"/>
                            <Path Height="3" VerticalAlignment="Top" Fill="#FFFFFFFF" Stretch="Fill" Stroke="{StaticResource popupForeground}" StrokeThickness="3" Data="M4.3000002,4.4000001 L11.500694,4.4000001" Margin="10,30,-0.5,0"/>
                            <TextBlock Text="1" FontSize="10" HorizontalAlignment="Left" VerticalAlignment="Top" Width="7" Margin="0,5,0,0" Foreground="{StaticResource popupForeground}"/>
                            <TextBlock Text="2" FontSize="10" HorizontalAlignment="Left" VerticalAlignment="Top" Width="7" Margin="0,15,0,0" Foreground="{StaticResource popupForeground}"/>
                            <TextBlock Text="3" FontSize="10" HorizontalAlignment="Left" VerticalAlignment="Top" Width="7" Margin="0,25,0,0" Foreground="{StaticResource popupForeground}"/>
                        </Grid>
                    </ToggleButton>

                </c1:C1WrapPanel>
            </StackPanel>
        </Grid>
    </ScrollViewer>
</UserControl>
