Scale down the resize canvas dialog

PixiEditor/Styles/DarkCheckboxStyle.xaml

@@ -11,9 +11,9 @@
                 <ControlTemplate TargetType="CheckBox">
                     <BulletDecorator Background="Transparent">
                         <BulletDecorator.Bullet>
-                            <Border x:Name="Border" Width="20" Height="20" CornerRadius="2" Background="#FF1B1B1B"
+                            <Border x:Name="Border" Width="18" Height="18" CornerRadius="2" Background="#FF1B1B1B"
                                     BorderThickness="1">
-                                <Path Width="9" Height="9" x:Name="CheckMark" SnapsToDevicePixels="False" Stroke="#FF0077C9" StrokeThickness="2" Data="M 0 4 L 3 8 8 0" />
+                                <Path Width="9" Height="9" x:Name="CheckMark" SnapsToDevicePixels="False" Stroke="#FF0077C9" StrokeThickness="1.5" Data="M 0 4 L 3 8 8 0" />
                             </Border>
                         </BulletDecorator.Bullet>
                         <ContentPresenter Margin="4,0,0,0" VerticalAlignment="Center" HorizontalAlignment="Left" RecognizesAccessKey="True"/>
@@ -43,4 +43,4 @@
             </Setter.Value>
         </Setter>
     </Style>
-</ResourceDictionary>
+</ResourceDictionary>

PixiEditor/Styles/ThemeStyle.xaml

@@ -8,7 +8,7 @@
     <Style TargetType="Button" x:Key="BaseDarkButton">
         <Setter Property="Background" Value="#404040" />
         <Setter Property="Foreground" Value="White" />
-        <Setter Property="FontSize" Value="22" />
+        <Setter Property="FontSize" Value="15" />
         <Setter Property="SnapsToDevicePixels" Value="True" />
         <Setter Property="Template">
             <Setter.Value>

PixiEditor/Views/Dialogs/ResizeCanvasPopup.xaml

@@ -8,7 +8,7 @@
         xmlns:behaviors="clr-namespace:PixiEditor.Helpers.Behaviours"
         mc:Ignorable="d" Name="window"
         Title="ResizeCanvasPopup" ShowInTaskbar="False" WindowStartupLocation="CenterScreen"
-        Height="390" Width="400" WindowStyle="None">
+        Height="350" Width="300" WindowStyle="None">
 
     <WindowChrome.WindowChrome>
         <WindowChrome CaptionHeight="32"  GlassFrameThickness="0.1"
@@ -29,27 +29,36 @@
             <behaviors:ClearFocusOnClickBehavior/>
         </i:Interaction.Behaviors>
 
-        <DockPanel Grid.Row="0" Background="{StaticResource MainColor}">
-            <Button DockPanel.Dock="Right" HorizontalAlignment="Right" Style="{StaticResource CloseButtonStyle}"
+        <Grid Grid.Row="0" Background="{StaticResource MainColor}">
+            <Grid.ColumnDefinitions>
+                <ColumnDefinition/>
+                <ColumnDefinition/>
+            </Grid.ColumnDefinitions>
+            <Button Grid.Column="1" HorizontalAlignment="Right" Style="{StaticResource CloseButtonStyle}"
                     WindowChrome.IsHitTestVisibleInChrome="True" ToolTip="Close"
                     Command="{x:Static SystemCommands.CloseWindowCommand}" />
-        </DockPanel>
-        <Label Grid.Row="1" VerticalAlignment="Top" Foreground="White" FontSize="24" HorizontalAlignment="Center"
-               Content="Resize Canvas" />
-        <StackPanel HorizontalAlignment="Center" Margin="0,50,0,0" Background="{StaticResource MainColor}"
-                    VerticalAlignment="Top" Grid.Row="1" Width="300" Height="250">
-            <local:SizePicker Margin="0,10,0,0" Width="300" Height="110"
+            <TextBlock TextAlignment="Center" HorizontalAlignment="Stretch" VerticalAlignment="Center" Foreground="White" FontSize="15" Margin="5,0,0,0" Grid.Column="0" Grid.ColumnSpan="2">
+                Resize Canvas
+            </TextBlock>
+        </Grid>
+
+        <StackPanel HorizontalAlignment="Center" Margin="0,30,0,0" Background="{StaticResource MainColor}"
+                    VerticalAlignment="Top" Grid.Row="1" Width="230" Height="225">
+            <local:SizePicker Margin="0,20,0,0" Width="200"
                               x:Name="sizePicker"
                               PreserveAspectRatio="False"
                               ChosenHeight="{Binding NewHeight, Mode=TwoWay, ElementName=window}"
                               ChosenWidth="{Binding NewWidth, Mode=TwoWay, ElementName=window}" />
-            <Separator Margin="10,20,10,0" Background="{StaticResource AccentColor}" Height="1" />
-            <Label Content="Anchor point:" Foreground="White" Margin="10,5,0,0" HorizontalAlignment="Left"
-                   FontSize="16" />
-            <local:AnchorPointPicker AnchorPoint="{Binding Path=SelectedAnchorPoint, Mode=TwoWay, ElementName=window}"
-                                     Width="78" Margin="45,-25,0,0" Height="78" />
+            <Separator Margin="10,5,10,0" Background="{StaticResource AccentColor}" Height="1" />
+            <DockPanel>
+                <Label Content="Anchor point:" Foreground="White" Margin="25,5,0,0" HorizontalAlignment="Left"
+                       FontSize="12" />
+                <local:AnchorPointPicker AnchorPoint="{Binding Path=SelectedAnchorPoint, Mode=TwoWay, ElementName=window}"
+                                         HorizontalAlignment="Right"
+                                         Width="78" Margin="0,10,30,0" Height="78" />
+            </DockPanel>
         </StackPanel>
-        <Button Grid.Row="1" Height="30" Width="60" VerticalAlignment="Bottom" HorizontalAlignment="Right" Margin="10"
+        <Button Grid.Row="1" Height="28" Width="70" VerticalAlignment="Bottom" HorizontalAlignment="Center" Margin="16"
                 Style="{StaticResource DarkRoundButton}" Content="OK" Click="Button_Click" IsDefault="True" />
     </Grid>
 </Window>

PixiEditor/Views/UserControls/SizePicker.xaml

@@ -17,17 +17,27 @@
             <Setter Property="HorizontalAlignment" Value="Left"/>
             <Setter Property="MaxSize" Value="9999"/>
             <Setter Property="BehaveLikeSmallEmbeddedField" Value="False"/>
-            <Setter Property="FontSize" Value="16"/>
+            <Setter Property="FontSize" Value="12"/>
             <Setter Property="Margin" Value="10,0,0,0"/>
-            <Setter Property="Width" Value="150"/>
-            <Setter Property="Height" Value="30"/>
+            <Setter Property="Width" Value="100"/>
+            <Setter Property="Height" Value="25"/>
         </Style>
     </UserControl.Resources>
     <StackPanel Background="{StaticResource MainColor}">
-        <DockPanel Margin="5,10,0,0" HorizontalAlignment="Center" VerticalAlignment="Center">
-            <TextBlock Foreground="Snow" Text="Width:" TextAlignment="Center" FontSize="16"
-                       HorizontalAlignment="Center" VerticalAlignment="Center" />
-            <local:SizeInput x:Name="WidthPicker"
+        <Grid Height="90" HorizontalAlignment="Center">
+            <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="40"/>
+                <ColumnDefinition/>
+            </Grid.ColumnDefinitions>
+            <Grid.RowDefinitions>
+                <RowDefinition />
+                <RowDefinition />
+                <RowDefinition />
+            </Grid.RowDefinitions>
+
+            <TextBlock Grid.Column="0" Grid.Row="0" Foreground="Snow" Text="Width:" VerticalAlignment="Center" HorizontalAlignment="Left" />
+            <local:SizeInput Grid.Column="1" Grid.Row="0"
+                             x:Name="WidthPicker"
                              IsEnabled="{Binding EditingEnabled, ElementName=uc}"
                              Size="{Binding Path=ChosenWidth, ElementName=uc, Mode=TwoWay}">
                 <i:Interaction.Triggers>
@@ -36,13 +46,11 @@
                     </i:EventTrigger>
                 </i:Interaction.Triggers>
             </local:SizeInput>
-        </DockPanel>
-        <DockPanel Margin="5,10,0,0" HorizontalAlignment="Center" VerticalAlignment="Center">
-            <TextBlock Foreground="Snow" Text="Height:" TextAlignment="Center" FontSize="16"
-                       HorizontalAlignment="Center" VerticalAlignment="Center" />
-            <local:SizeInput x:Name="HeightPicker" 
+
+            <TextBlock Grid.Column="0" Grid.Row="1" Foreground="Snow" Text="Height:" VerticalAlignment="Center" HorizontalAlignment="Left"/>
+            <local:SizeInput Grid.Column="1" Grid.Row="1"
+                             x:Name="HeightPicker" 
                              IsEnabled="{Binding EditingEnabled, ElementName=uc}"
-                             Margin="5,0,0,0"
                              Size="{Binding ChosenHeight, ElementName=uc, Mode=TwoWay}">
                 <i:Interaction.Triggers>
                     <i:EventTrigger EventName="LostFocus">
@@ -50,12 +58,15 @@
                     </i:EventTrigger>
                 </i:Interaction.Triggers>
             </local:SizeInput>
-        </DockPanel>
-        <CheckBox Name="aspectRatio" 
-                  IsChecked="{Binding ElementName=uc, Path=PreserveAspectRatio}" 
+
+            <CheckBox 
+                  Grid.Column="0" Grid.ColumnSpan="2" Grid.Row="2"
+                  Name="aspectRatio" 
+                  IsChecked="{Binding ElementName=uc, Path=PreserveAspectRatio}"
                   Content="Preserve aspect ratio" 
                   Foreground="White" 
                   HorizontalAlignment="Left" 
-                  Margin="50,10,0,0" />
+                  VerticalAlignment="Center" />
+        </Grid>
     </StackPanel>
 </UserControl>