<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:SalesDashboard"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:c1="using:C1.Xaml.Gauge"
    x:Class="SalesDashboard.SalesByType"
    mc:Ignorable="d"
    d:DesignHeight="300"
    d:DesignWidth="400" Loaded="UserControl_Loaded_1">
    <UserControl.Resources>
        <Style TargetType="TextBlock">
            <Setter Property="HorizontalAlignment" Value="Center" />
            <Setter Property="FontSize" Value="16" />
        </Style>
    </UserControl.Resources>

    <Grid Background="Black">
        <Grid Margin="5">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition/>
                <RowDefinition Height="Auto"/>
                <RowDefinition/>
                <RowDefinition Height="Auto"/>
                <RowDefinition/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition/>
                <ColumnDefinition/>
            </Grid.ColumnDefinitions>
            <TextBlock Text="Sales by Type" Grid.ColumnSpan="2" Style="{StaticResource PageSubheaderTextStyle}"/>

            <TextBlock Grid.Row="1" >
            <Run Text="Console" />
            <Run Text="{Binding TotalSalesConsole}" FontWeight="Bold" />
            </TextBlock>
            <TextBlock Grid.Row="1" Grid.Column="1">
            <Run Text="Desktop" />
            <Run Text="{Binding TotalSalesDesktop}" FontWeight="Bold" />
            </TextBlock>
            <local:TypeGauge x:Name="gaugeConsole" Grid.Row="2" Margin="10" />
            <local:TypeGauge x:Name="gaugeDesktop" Grid.Row="2" Grid.Column="1" Margin="10" />
            <TextBlock Grid.Row="3">
            <Run Text="Phone" />
            <Run Text="{Binding TotalSalesPhone}" FontWeight="Bold" />
            </TextBlock>
            <TextBlock Grid.Row="3" Grid.Column="1">
            <Run Text="Tablet" />
            <Run Text="{Binding TotalSalesTablet}" FontWeight="Bold" />
            </TextBlock>
            <local:TypeGauge x:Name="gaugePhone" Grid.Row="4" Margin="10" />
            <local:TypeGauge x:Name="gaugeTablet" Grid.Row="4" Grid.Column="1" Margin="10" />
            <TextBlock Grid.Row="5">
            <Run Text="TV" />
            <Run Text="{Binding TotalSalesTV}" FontWeight="Bold" />
            </TextBlock>
            <local:TypeGauge x:Name="gaugeTV" Grid.Row="6" Margin="10" />
        </Grid>
    </Grid>
</UserControl>
