<Window x:Class="GridResizeProblem.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation" 
        Title="MainWindow" 
        mc:Ignorable="d" 
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
        d:DesignHeight="350" d:DesignWidth="525">
    
    <Window.Resources>
        <Style x:Key="GradientBorder" TargetType="Border">
            <Setter Property="Background">
                <Setter.Value>
                    <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                        <GradientStop Color="#FF8c9eb5" Offset="0.0" />
                        <GradientStop Color="#FF6e84a1" Offset="1.0" />
                    </LinearGradientBrush>
                </Setter.Value>
            </Setter>
            <Setter Property="CornerRadius" Value="5"/>
            <Setter Property="BorderBrush" Value="White"/>
            <Setter Property="BorderThickness" Value="2"/>
            <Setter Property="Margin" Value="5"/>
        </Style>
        <Style x:Key="LightIconButton" TargetType="Button">
            <Setter Property="OverridesDefaultStyle" Value="True"/>
            <Setter Property="Margin" Value="2"/>
            <Setter Property="FontFamily" Value="Verdana"/>
            <Setter Property="FontSize" Value="13px"/>
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="BorderThickness" Value="0"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border Name="border" 
				                BorderThickness="{TemplateBinding BorderThickness}"
				                Padding="5"
				                BorderBrush="Transparent" 
				                CornerRadius="5" 
				                Background="{TemplateBinding Background}">
                            <Grid>
                                <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Name="content"/>
                            </Grid>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Effect">
                                    <Setter.Value>
                                        <DropShadowEffect Color="White" ShadowDepth="0" BlurRadius="20"/>
                                    </Setter.Value>
                                </Setter>
                            </Trigger>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter TargetName="content" Property="RenderTransform" >
                                    <Setter.Value>
                                        <TranslateTransform Y="1.0" X="1.0"  />
                                    </Setter.Value>
                                </Setter>
                            </Trigger>
                            <!--<Trigger Property="IsDefaulted" Value="True">
                            <Setter TargetName="border" Property="BorderBrush" Value="#FF282828" />
                        </Trigger>-->
                            <!--<Trigger Property="IsFocused" Value="True">
                            <Setter TargetName="border" Property="BorderBrush" Value="#FF282828" />
                        </Trigger>-->
                            <!--<Trigger Property="IsEnabled" Value="False">
                            <Setter TargetName="border" Property="Opacity" Value="0.7" />
                            <Setter Property="Foreground" Value="LightGray" />
                        </Trigger>-->

                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <GeometryGroup x:Key="FiveDots">
            <EllipseGeometry Center="3,3" RadiusX="1" RadiusY="1"/>
            <EllipseGeometry Center="7,3" RadiusX="1" RadiusY="1"/>
            <EllipseGeometry Center="11,3" RadiusX="1" RadiusY="1"/>
            <EllipseGeometry Center="15,3" RadiusX="1" RadiusY="1"/>
            <EllipseGeometry Center="19,3" RadiusX="1" RadiusY="1"/>
        </GeometryGroup>
        
        <DrawingImage x:Key="BlackOptionsIndicator">
            <DrawingImage.Drawing>
                <DrawingGroup>
                    <GeometryDrawing Brush="Black" Geometry="{StaticResource FiveDots}"/>
                </DrawingGroup>
            </DrawingImage.Drawing>
        </DrawingImage>
    </Window.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <ToggleButton x:Name="fixDisplay" Content="Display Fixed" IsChecked="False" Width="100" Margin="15"/>
        <Border Grid.Row="1"  Margin="15" Style="{StaticResource GradientBorder}">
            <Grid Margin="15" MouseLeave="MouseLeaveLogArea">
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"/>
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>

                <telerik:RadGridView x:Name="CurrentStateGrid" RowHeight="0"
                                AutoGenerateColumns="False" ShowGroupPanel="True"
                                IsReadOnly="True" IsFilteringAllowed="True"
                                CanUserReorderColumns="True" CanUserSortColumns="True">
                    <telerik:RadGridView.Columns>
                        <telerik:GridViewDataColumn DataMemberBinding="{Binding FlowElementType}" Header="Element" IsFilterable="True"/>
                        <telerik:GridViewDataColumn DataMemberBinding="{Binding ReceivedTimestamp}" Header="Received Time" IsFilterable="False"/>
                        <telerik:GridViewDataColumn DataMemberBinding="{Binding Id}" Header="Id" IsFilterable="False"/>
                        <telerik:GridViewDataColumn DataMemberBinding="{Binding Type}" Header="Type" IsFilterable="True" Width="Auto"/>
                    </telerik:RadGridView.Columns>
                </telerik:RadGridView>
                <Button Style="{StaticResource LightIconButton}" 
                    Click="Close" HorizontalAlignment="Right" VerticalAlignment="Top"
                    Margin="0,-28,-28,0">
                    <Button.Content>
                        <Border BorderThickness="2" BorderBrush="White" CornerRadius="9">
                            <Image Source="53w.png" Height="16" Width="16" Margin="0"
                               ToolTip="Close Visualization" />
                        </Border>
                    </Button.Content>
                </Button>

                <Border Grid.Row="1" MouseMove="MouseOverLogArea" Background="Transparent">
                    <Image Source="{StaticResource ResourceKey=BlackOptionsIndicator}"
                               HorizontalAlignment="Center" VerticalAlignment="Bottom" Opacity="0.7"
                               Width="30" Height="5" Margin="2">
                    </Image>
                </Border>

                <Border Grid.Row="0" Grid.RowSpan="2" x:Name="optionsArea" Height="30" 
                    VerticalAlignment="Bottom" Background="#3D3F4F" Padding="5" Visibility="Hidden" Opacity="0.85"
                    MouseLeave="MouseLeaveOptionsArea">
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Text="Font Size" Foreground="White"/>
                        <Slider Width="75" Height="20" Margin="2,0,0,0" VerticalAlignment="Center" Minimum="6" Maximum="20" SmallChange="1" LargeChange="1" 
                            Value="{Binding ElementName=CurrentStateGrid, Path=FontSize}" ValueChanged="FontSizeChanged"/>
                    </StackPanel>
                </Border>
            </Grid>
        </Border>
    </Grid>
</Window>
