<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:SamplesCommon">

    <Style TargetType="local:ControlExample">
        <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundAltHighBrush}" />
        <Setter Property="Foreground" Value="{DynamicResource SystemControlPageTextBaseHighBrush}" />
        <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
        <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
        <Setter Property="HorizontalContentAlignment" Value="Left" />
        <Setter Property="VerticalContentAlignment" Value="Top" />
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
        <Setter Property="IsTabStop" Value="False" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:ControlExample">
                    <Grid SnapsToDevicePixels="True">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition />
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition MaxWidth="{TemplateBinding MaxContentWidth}" />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>

                        <TextBlock
                            Grid.Column="0"
                            Style="{DynamicResource SubtitleTextBlockStyle}"
                            Margin="0,15"
                            Text="{TemplateBinding HeaderText}" />

                        <Border
                            Grid.Row="1"
                            Grid.Column="0"
                            BorderBrush="{DynamicResource SystemControlBackgroundListLowBrush}"
                            BorderThickness="1"
                            Background="{DynamicResource SystemControlBackgroundAltHighBrush}">
                            <Grid x:Name="ExampleContainer">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition />
                                    <ColumnDefinition x:Name="OptionsColumn" Width="Auto" MaxWidth="320" MinWidth="200" />
                                </Grid.ColumnDefinitions>

                                <!-- Example Display -->
                                <ContentPresenter
                                    x:Name="ControlPresenter"
                                    Margin="12"
                                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                    Content="{TemplateBinding Example}"
                                    SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />

                                <!-- Options Display -->
                                <Border
                                    x:Name="OptionsRoot"
                                    Grid.Column="1"
                                    Margin="0,12,12,12"
                                    Background="{DynamicResource SystemControlPageBackgroundChromeLowBrush}">
                                    <ContentPresenter
                                        x:Name="OptionsPresenter"
                                        HorizontalAlignment="Stretch"
                                        VerticalAlignment="Stretch"
                                        Margin="16"
                                        Content="{TemplateBinding Options}"
                                        SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                                </Border>
                            </Grid>
                        </Border>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="Options" Value="{x:Null}">
                            <Setter TargetName="OptionsRoot" Property="Visibility" Value="Collapsed" />
                            <Setter TargetName="OptionsColumn" Property="MinWidth" Value="0" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style TargetType="local:CrossFadeContentControl">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:CrossFadeContentControl">
                    <Grid>
                        <ContentPresenter
                            x:Name="FirstContentPresenter"
                            Content="{x:Null}"
                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                        <ContentPresenter
                            x:Name="SecondContentPresenter"
                            Content="{x:Null}"
                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</ResourceDictionary>
