Made px translateable and optimized SizeInput for RTL

src/PixiEditor/Data/Localization/Languages/en.json

@@ -588,5 +588,7 @@
   "HTTP_ERROR_MESSAGE": "HTTP Error: {0} {1}",
   "LOGGED_IN": "Logged in",
   "SYNCED_SUCCESSFULLY": "Synced successfully",
-  "EXCEPTION_ERROR": "Exception: {0}"
+  "EXCEPTION_ERROR": "Exception: {0}",
+  
+  "PIXEL_UNIT": "px"
 }

src/PixiEditor/Helpers/Converters/EnumToStringConverter.cs

@@ -1,5 +1,6 @@
 using PixiEditor.Models.Enums;
 using System;
+using PixiEditor.Localization;
 
 namespace PixiEditor.Helpers.Converters;
 
@@ -16,7 +17,7 @@ internal class EnumToStringConverter : SingleInstanceConverter<EnumToStringConve
                 if (valueCasted == SizeUnit.Percentage)
                     return "%";
 
-                return "px";
+                return "PIXEL_UNIT";
             }
             return Enum.GetName((value.GetType()), value);
         }
@@ -25,4 +26,4 @@ internal class EnumToStringConverter : SingleInstanceConverter<EnumToStringConve
             return string.Empty;
         }
     }
-}
+}

src/PixiEditor/ViewModels/SubViewModels/Tools/ToolSettings/Settings/SizeSetting.cs

@@ -18,7 +18,6 @@ internal sealed class SizeSetting : Setting<int>
     {
         SizeInput tb = new SizeInput
         {
-            Width = 65,
             Height = 20,
             VerticalAlignment = VerticalAlignment.Center,
             MaxSize = 9999,

src/PixiEditor/Views/Dialogs/SettingsWindow.xaml

@@ -130,14 +130,14 @@
                     <Label Style="{StaticResource SettingsText}" d:Content="Width" views:Translator.Key="WIDTH"/>
                     <usercontrols:SizeInput Margin="10 0 0 0" 
                                  Size="{Binding SettingsSubViewModel.File.DefaultNewFileWidth, Mode=TwoWay}" 
-                                 Width="70" Height="21" MaxSize="9999" HorizontalAlignment="Left"/>
+                                 Height="21" MaxSize="9999" HorizontalAlignment="Left"/>
                 </StackPanel>
 
                 <StackPanel Orientation="Horizontal" Margin="27 5">
                     <Label Style="{StaticResource SettingsText}" d:Content="Height" views:Translator.Key="HEIGHT"/> 
                     <usercontrols:SizeInput Margin="7 0 0 0"
                                  Size="{Binding SettingsSubViewModel.File.DefaultNewFileHeight, Mode=TwoWay}" 
-                                 Width="70" Height="21" MaxSize="9999" HorizontalAlignment="Left"/>
+                                 Height="21" MaxSize="9999" HorizontalAlignment="Left"/>
                 </StackPanel>
 
                 <Label Style="{StaticResource SettingsHeader}" d:Content="Tools" views:Translator.Key="TOOLS"/>

src/PixiEditor/Views/UserControls/SizeInput.xaml

@@ -7,9 +7,10 @@
              xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
              xmlns:behaviors="clr-namespace:PixiEditor.Helpers.Behaviours"
              xmlns:converters="clr-namespace:PixiEditor.Helpers.Converters"
+             xmlns:views="clr-namespace:PixiEditor.Views"
              mc:Ignorable="d" Foreground="White" Focusable="True"
-             d:DesignHeight="30" d:DesignWidth="160" Name="uc">
-
+             d:DesignHeight="30" Name="uc"
+             FlowDirection="LeftToRight">
     <Border BorderThickness="1" CornerRadius="3.5"
             x:Name="border"
             Cursor="IBeam" MouseLeftButtonDown="Border_MouseLeftButtonDown"
@@ -42,7 +43,8 @@
                      x:Name="textBox"
                      Text="{Binding Size, ElementName=uc, Converter={converters:ToolSizeToIntConverter}}"
                      d:Text="22"
-                     MaxLength = "6">
+                     MaxLength="6"
+                     MinWidth="43">
                 <i:Interaction.Behaviors>
                     <behaviors:GlobalShortcutFocusBehavior/>
                     <behaviors:TextBoxFocusBehavior 
@@ -53,10 +55,9 @@
             </TextBox>
             <Grid Grid.Column="1" Background="{Binding BorderBrush, ElementName=border}"
                   d:Background="{StaticResource BrighterAccentColor}"/>
-            <TextBlock Text="{Binding Unit, ElementName=uc, Converter={converters:EnumToStringConverter}}" TextAlignment="Right"
-                       Grid.Column="2" Margin="5,0" VerticalAlignment="Center" d:Text="px"
-                       
-                       />
+            <TextBlock views:Translator.Key="{Binding Unit, ElementName=uc, Converter={converters:EnumToStringConverter}}" TextAlignment="Right"
+                       Grid.Column="2" Margin="5,0" VerticalAlignment="Center"
+            />
         </Grid>
     </Border>
 </UserControl>

src/PixiEditor/Views/UserControls/SizePicker.xaml

@@ -23,7 +23,6 @@
             <Setter Property="BehaveLikeSmallEmbeddedField" Value="False"/>
             <Setter Property="FontSize" Value="12"/>
             <Setter Property="Margin" Value="10,0,0,0"/>
-            <Setter Property="Width" Value="80"/>
             <Setter Property="Height" Value="25"/>
         </Style>
     </UserControl.Resources>
@@ -54,13 +53,14 @@
                                               }" local:Translator.Key="PERCENTAGE"/>
                 <userControls:SizeInput Grid.Column="1" Grid.Row="0" 
                                      VerticalAlignment="Center"
+                                     HorizontalAlignment="Right"
                                      x:Name="PercentageSizePicker"
                                      IsEnabled="{Binding EditingEnabled, ElementName=uc}"
                                      Size="{Binding Path=ChosenPercentageSize, ElementName=uc, Mode=TwoWay}"
                                      Unit="Percentage"
                                      Margin="-10,0,0,0"
                                      MaxSize="999900"
-                                     Width="80">
+                                     Width="{Binding ActualWidth, ElementName=WidthPicker}">
                     <i:Interaction.Triggers>
                         <i:EventTrigger EventName="LostFocus">
                             <i:InvokeCommandAction Command="{Binding ElementName=uc, Path=PercentageLostFocusCommand}"/>
@@ -96,11 +96,9 @@
                 <TextBlock Grid.Column="0" Grid.Row="0" Foreground="Snow" local:Translator.Key="WIDTH" VerticalAlignment="Center" HorizontalAlignment="Left" />
                 <userControls:SizeInput Grid.Column="1" Grid.Row="0"
                              x:Name="WidthPicker"
-                             Width="80"
                              IsEnabled="{Binding EditingEnabled, ElementName=uc}"
                              Size="{Binding Path=ChosenWidth, ElementName=uc, Mode=TwoWay}"
-                             Margin="50,0,0,0"
-                             >
+                             Margin="50,0,0,0">
                     <i:Interaction.Triggers>
                         <i:EventTrigger EventName="LostFocus">
                             <i:InvokeCommandAction Command="{Binding ElementName=uc, Path=WidthLostFocusCommand}"/>