<Page
    x:Class="BasicLibrarySamples.DockPanelSample"
    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"
    mc:Ignorable="d"
    d:DesignHeight="600"
    d:DesignWidth="700">
    <c1:C1DockPanel>
        <Border x:Name="topBorder" c1:C1DockPanel.Dock="Top" Height="100" Background="#FF00ADD6" Margin="5">
            <TextBlock x:Name="topTxt" Text="Top" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="60" FontWeight="Light" Foreground="WhiteSmoke"/>
        </Border>
        <Border x:Name="bottomBorder" c1:C1DockPanel.Dock="Bottom" Height="100" Background="#FF005B84" Margin="5">
            <TextBlock x:Name="bottomTxt" Text="Bottom" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="60" FontWeight="Light" Foreground="WhiteSmoke"/>
        </Border>
        <Border c1:C1DockPanel.Dock="Left" Background="CornflowerBlue" Margin="5">
            <TextBlock x:Name="leftTxt" Text="Left" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="60" FontWeight="Light" Foreground="WhiteSmoke">
                <TextBlock.Projection>
                    <PlaneProjection RotationZ="90"/>
                </TextBlock.Projection>
            </TextBlock>
        </Border>
        <Border c1:C1DockPanel.Dock="Right" Background="#FF9DCFC3" Margin="5">
            <TextBlock x:Name="rightTxt" Text="Right" HorizontalAlignment="Right" VerticalAlignment="Center" FontSize="60" FontWeight="Light" Foreground="WhiteSmoke">
                <TextBlock.Projection>
                    <PlaneProjection RotationZ="-90"/>
                </TextBlock.Projection>
            </TextBlock>
        </Border>
        <Border Background="Cornsilk"  Margin="5">
            <TextBlock x:Name="fillTxt" Text="Fill" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="60" FontWeight="Light" Foreground="#FF303030"/>
        </Border>
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup>
                <VisualState x:Name="NarrowLayout">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="0">
                        </AdaptiveTrigger>
                    </VisualState.StateTriggers>
                </VisualState>
                <VisualState x:Name="WideLayout">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="480">
                        </AdaptiveTrigger>
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="topBorder.Height" Value="50"></Setter>
                        <Setter Target="bottomBorder.Height" Value="50"></Setter>
                        <Setter Target="topTxt.FontSize" Value="40"></Setter>
                        <Setter Target="bottomTxt.FontSize" Value="40"></Setter>
                        <Setter Target="leftTxt.FontSize" Value="40"></Setter>
                        <Setter Target="rightTxt.FontSize" Value="40"></Setter>
                        <Setter Target="fillTxt.FontSize" Value="40"></Setter>
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
    </c1:C1DockPanel>
</Page>