UI updates

src/PicView/PicView.csproj

@@ -10,6 +10,7 @@
 		<PlatformTarget>AnyCPU</PlatformTarget>
 	</PropertyGroup>
 	<ItemGroup>
+		<Folder Include="Assets\Fonts" />
 		<Folder Include="Assets\SvgIcons\" />
 		<Folder Include="Models\" />
 		<AvaloniaResource Include="Assets\**" />
@@ -29,6 +30,9 @@
 		<PackageReference Include="Avalonia.ReactiveUI" Version="0.10.11-rc.1" />
 		<PackageReference Include="Avalonia.Xaml.Behaviors" Version="0.10.10.4" />
 	</ItemGroup>
+	<ItemGroup>
+		<Resource Include="Resources\icon__Q6k_icon.ico" />
+	</ItemGroup>
 	<ItemGroup>
 	  <Compile Update="Styles\Themes\Dark\FluentDark.cs">
 	    <DependentUpon>FluentDark.axaml</DependentUpon>

src/PicView/Styles/Text.xaml

@@ -1,12 +1,7 @@
 <Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
 
-    <Style Selector="TextBlock">
-        <Setter Property="FontSize" Value="12" />
-        <Setter Property="FontFamily" Value="avares://PicView/Assets/Fonts/Aller.ttf" />
-    </Style>
-
     <Style Selector="TextBox">
-        <Setter Property="FontSize" Value="12" />
-        <Setter Property="FontFamily" Value="avares://PicView/Assets/Fonts/Aller.ttf" />
+        <Setter Property="FontSize" Value="13" />
+        <Setter Property="FontFamily" Value="IBM Plex Mono Medium" />
     </Style>
 </Styles>

src/PicView/Styles/Themes/Dark/FluentDark.axaml

@@ -1,31 +1,42 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Class="PicView.Styles.Themes.FluentDark">
+<Styles
+    x:Class="PicView.Styles.Themes.FluentDark"
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
 
-	<!-- Add Styles Here -->
-	<FluentTheme Mode="Dark"/>
+    <!--  Add Styles Here  -->
+    <FluentTheme Mode="Dark" />
 
-	<Styles.Resources>
+    <Styles.Resources>
 
-		<!--  Main Color  -->
-		<Color x:Key="MainColor">#FFf6f4f4</Color>
-		<SolidColorBrush x:Key="MainColorBrush" Color="{StaticResource MainColor}" />
+        <!--  Accent Color  -->
+        <Color x:Key="AccentColor">#D8FF5A12</Color>
+        <SolidColorBrush Color="{DynamicResource AccentColor}" x:Key="AccentColorBrush" />
 
-		<!--  Icon Color  -->
-		<Color x:Key="IconColor">#eeebebeb</Color>
-		<SolidColorBrush x:Key="IconColorBrush" Color="{StaticResource IconColor}" />
+        <!--  Main Color  -->
+        <Color x:Key="MainColor">#FFf6f4f4</Color>
+        <SolidColorBrush Color="{StaticResource MainColor}" x:Key="MainColorBrush" />
 
-		<!--  Border Brush  -->
-		<Color x:Key="BorderColor">#FF3A3A3A</Color>
-		<SolidColorBrush x:Key="BorderBrush" Color="{StaticResource BorderColor}" />
+        <!--  Icon Color  -->
+        <Color x:Key="IconColor">#eeebebeb</Color>
+        <SolidColorBrush Color="{StaticResource IconColor}" x:Key="IconColorBrush" />
 
-		<!--  Background Color Fade  -->
-		<Color x:Key="BackgroundColorFade">#2D171717</Color>
-		<SolidColorBrush x:Key="BackgroundColorBrushFade" Color="{StaticResource BackgroundColorFade}" />
-		
-		<!--  Window Background Color  -->
-		<Color x:Key="WindowBackgroundColor">#8E212121</Color>
-		<SolidColorBrush x:Key="WindowBackgroundColorBrush" Color="{StaticResource WindowBackgroundColor}" />
+        <!--  Border Brush  -->
+        <Color x:Key="BorderColor">#FF3A3A3A</Color>
+        <SolidColorBrush Color="{StaticResource BorderColor}" x:Key="BorderBrush" />
 
-	</Styles.Resources>
+        <!--  Background Color Fade  -->
+        <Color x:Key="BackgroundColorFade">#2D171717</Color>
+        <SolidColorBrush Color="{StaticResource BackgroundColorFade}" x:Key="BackgroundColorBrushFade" />
+
+        <!--  Background Subtle Highlight  -->
+        <Color x:Key="BackgroundSubtleHighlight">#1f1c1c</Color>
+        <SolidColorBrush Color="{StaticResource BackgroundSubtleHighlight}" x:Key="BackgroundSubtleHighlightBrush" />
+
+        <!--  Window Background Color  -->
+        <Color x:Key="WindowBackgroundColor">#8E212121</Color>
+        <SolidColorBrush Color="{StaticResource WindowBackgroundColor}" x:Key="WindowBackgroundColorBrush" />
+
+
+    </Styles.Resources>
 
 </Styles>

src/PicView/Views/CustomTitleBars/WinTitleBar.axaml

@@ -1,84 +1,130 @@
-<UserControl xmlns="https://github.com/avaloniaui"
-             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:vm="using:PicView.ViewModels"
-             x:Class="PicView.UserControls.WinTitleBar">
-	<Design.DataContext>
-		<vm:MainWindowViewModel/>
-	</Design.DataContext>
-	<DockPanel LastChildFill="True">
-		<Image
-			DockPanel.Dock="Left"
-			Source="avares://PicView/Assets/PicView/icon__Q6k_icon.ico"
-			Width="25"
-			Height="25"
-			Margin="10,1,10,1">
-		</Image>
-		<Rectangle
-			Width="1"
-			Height="30"
-			DockPanel.Dock="Left"
-			Fill="{StaticResource BorderBrush}" />
+<UserControl
+    x:Class="PicView.UserControls.WinTitleBar"
+    xmlns="https://github.com/avaloniaui"
+    xmlns:vm="using:PicView.ViewModels"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <Design.DataContext>
+        <vm:MainWindowViewModel />
+    </Design.DataContext>
+    <DockPanel LastChildFill="True">
+        <Image
+            DockPanel.Dock="Left"
+            Height="25"
+            Margin="7,1,7,1"
+            Source="avares://PicView/Assets/PicView/icon__Q6k_icon.ico"
+            Width="30" />
+        <Rectangle
+            DockPanel.Dock="Left"
+            Fill="{StaticResource BorderBrush}"
+            Height="30"
+            Width="1" />
 
-		<Button Name="CloseButton" DockPanel.Dock="Right" Height="30" Background="Transparent">
-			<Path
-				Width="12"
-				Height="12"
-				Data="M443.6,387.1L312.4,255.4l131.5-130c5.4-5.4,5.4-14.2,0-19.6l-37.4-37.6c-2.6-2.6-6.1-4-9.8-4c-3.7,0-7.2,1.5-9.8,4  L256,197.8L124.9,68.3c-2.6-2.6-6.1-4-9.8-4c-3.7,0-7.2,1.5-9.8,4L68,105.9c-5.4,5.4-5.4,14.2,0,19.6l131.5,130L68.4,387.1  c-2.6,2.6-4.1,6.1-4.1,9.8c0,3.7,1.4,7.2,4.1,9.8l37.4,37.6c2.7,2.7,6.2,4.1,9.8,4.1c3.5,0,7.1-1.3,9.8-4.1L256,313.1l130.7,131.1  c2.7,2.7,6.2,4.1,9.8,4.1c3.5,0,7.1-1.3,9.8-4.1l37.4-37.6c2.6-2.6,4.1-6.1,4.1-9.8C447.7,393.2,446.2,389.7,443.6,387.1z"
-				Stretch="Fill"
-				Fill="{StaticResource IconColor}">
-			</Path>
-			<Button.Styles>
-				<Style Selector="Button:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-					<Setter Property="Background" Value="#BFE61918"/>
-				</Style>
-			</Button.Styles>
-		</Button>
-		<Rectangle
-			Width="1"
-			Height="30"
-			DockPanel.Dock="Right"
-			Fill="{StaticResource BorderBrush}" />
+        <Button
+            Background="Transparent"
+            DockPanel.Dock="Left"
+            Height="30"
+            Name="GalleryButton"
+            Width="30">
+            <Image Width="17">
+                <DrawingImage>
+                    <DrawingGroup>
+                        <GeometryDrawing Brush="{StaticResource IconColor}" Geometry="F1 M22 16L22 4C22 2.9 21.1 2 20 2L8 2C6.9 2 6 2.9 6 4L6 16C6 17.1 6.9 18 8 18L20 18C21.1 18 22 17.1 22 16ZM11 12L13.03 14.71L16 11L20 16L8 16L11 12ZM2 6L2 20C2 21.1 2.9 22 4 22L18 22L18 20L4 20L4 6L2 6Z" />
+                    </DrawingGroup>
+                </DrawingImage>
+            </Image>
+        </Button>
+        <Rectangle
+            DockPanel.Dock="Left"
+            Fill="{StaticResource BorderBrush}"
+            Height="30"
+            Width="1" />
 
-		<Button Name="RestoreButton" DockPanel.Dock="Right" Height="30" Background="Transparent">
-			<Path
-				Width="12"
-				Height="12"
-				Data="M405.34 405.332H106.66V106.668H240V64H106.66C83.191 64 64 83.197 64 106.668v298.664C64 428.803 83.191 448 106.66 448h298.68c23.469 0 42.66-19.197 42.66-42.668V272h-42.66v133.332zM288 64v42.668h87.474L159.999 322.133l29.866 29.866 215.476-215.47V224H448V64H288z"
-				Stretch="Fill"
-				Fill="{StaticResource IconColor}">
-			</Path>
-		</Button>
-		<Rectangle
-			Width="1"
-			Height="30"
-			DockPanel.Dock="Right"
-			Fill="{StaticResource BorderBrush}" />
+        <Button
+            Background="Transparent"
+            DockPanel.Dock="Left"
+            Height="30"
+            Name="SearchButton"
+            Width="30">
+            <Path
+                Data="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"
+                Fill="{StaticResource IconColor}"
+                Height="15"
+                Stretch="Fill"
+                Width="15" />
+        </Button>
+        <Rectangle
+            DockPanel.Dock="Left"
+            Fill="{StaticResource BorderBrush}"
+            Height="30"
+            Width="1" />
 
-		<Button Name="MinimizeButton" DockPanel.Dock="Right" Height="30" Background="Transparent">
-			<Viewbox Width="12" Height="12">
-				<Path
-					Data="M24,11c0-0.6-0.4-1-1-1H1c-0.6,0-1,0.4-1,1v2c0,0.6,0.4,1,1,1h22c0.6,0,1-0.4,1-1V11z"
-					Stretch="Fill"
-					Fill="{StaticResource IconColor}">
-				</Path>
-			</Viewbox>
-		</Button>
-		<Rectangle
-			Width="1"
-			Height="30"
-			DockPanel.Dock="Right"
-			Fill="{StaticResource BorderBrush}" />
+        <Button
+            Background="Transparent"
+            DockPanel.Dock="Right"
+            Height="30"
+            Name="CloseButton">
+            <Path
+                Data="M443.6,387.1L312.4,255.4l131.5-130c5.4-5.4,5.4-14.2,0-19.6l-37.4-37.6c-2.6-2.6-6.1-4-9.8-4c-3.7,0-7.2,1.5-9.8,4  L256,197.8L124.9,68.3c-2.6-2.6-6.1-4-9.8-4c-3.7,0-7.2,1.5-9.8,4L68,105.9c-5.4,5.4-5.4,14.2,0,19.6l131.5,130L68.4,387.1  c-2.6,2.6-4.1,6.1-4.1,9.8c0,3.7,1.4,7.2,4.1,9.8l37.4,37.6c2.7,2.7,6.2,4.1,9.8,4.1c3.5,0,7.1-1.3,9.8-4.1L256,313.1l130.7,131.1  c2.7,2.7,6.2,4.1,9.8,4.1c3.5,0,7.1-1.3,9.8-4.1l37.4-37.6c2.6-2.6,4.1-6.1,4.1-9.8C447.7,393.2,446.2,389.7,443.6,387.1z"
+                Fill="{StaticResource IconColor}"
+                Height="12"
+                Stretch="Fill"
+                Width="12" />
+            <Button.Styles>
+                <Style Selector="Button:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+                    <Setter Property="Background" Value="#BFE61918" />
+                </Style>
+            </Button.Styles>
+        </Button>
+        <Rectangle
+            DockPanel.Dock="Right"
+            Fill="{StaticResource BorderBrush}"
+            Height="30"
+            Width="1" />
 
-		<TextBox Text="{Binding Title}"
-				 TextAlignment="Center"
-				 FontWeight="Bold"
-				 FontSize="13"
-				 IsTabStop="False"
-				 Background="{StaticResource BackgroundColorFade}"
-				 BorderThickness="0"
-				 AcceptsReturn="True"
-				 AcceptsTab="False"/>
-	</DockPanel>
+        <Button
+            Background="Transparent"
+            DockPanel.Dock="Right"
+            Height="30"
+            Name="RestoreButton">
+            <Path
+                Data="M405.34 405.332H106.66V106.668H240V64H106.66C83.191 64 64 83.197 64 106.668v298.664C64 428.803 83.191 448 106.66 448h298.68c23.469 0 42.66-19.197 42.66-42.668V272h-42.66v133.332zM288 64v42.668h87.474L159.999 322.133l29.866 29.866 215.476-215.47V224H448V64H288z"
+                Fill="{StaticResource IconColor}"
+                Height="12"
+                Stretch="Fill"
+                Width="12" />
+        </Button>
+        <Rectangle
+            DockPanel.Dock="Right"
+            Fill="{StaticResource BorderBrush}"
+            Height="30"
+            Width="1" />
+
+        <Button
+            Background="Transparent"
+            DockPanel.Dock="Right"
+            Height="30"
+            Name="MinimizeButton">
+            <Viewbox Height="12" Width="12">
+                <Path
+                    Data="M24,11c0-0.6-0.4-1-1-1H1c-0.6,0-1,0.4-1,1v2c0,0.6,0.4,1,1,1h22c0.6,0,1-0.4,1-1V11z"
+                    Fill="{StaticResource IconColor}"
+                    Stretch="Fill" />
+            </Viewbox>
+        </Button>
+        <Rectangle
+            DockPanel.Dock="Right"
+            Fill="{StaticResource BorderBrush}"
+            Height="30"
+            Width="1" />
+
+        <TextBox
+            AcceptsReturn="True"
+            AcceptsTab="False"
+            Background="{StaticResource BackgroundColorFade}"
+            BorderThickness="0"
+            FontWeight="SemiBold"
+            IsTabStop="False"
+            Text="{Binding Title}"
+            TextAlignment="Center" />
+    </DockPanel>
 </UserControl>

src/PicView/Views/MainWindow.axaml

@@ -37,6 +37,162 @@
                 DockPanel.Dock="Top"
                 Fill="{StaticResource BorderBrush}"
                 Height="1" />
+
+            <Border
+                BorderBrush="{StaticResource BorderBrush}"
+                BorderThickness="0,1,0,0"
+                DockPanel.Dock="Bottom"
+                Height="30">
+                <Grid x:Name="LowerBar">
+                    <Canvas
+                        Background="{StaticResource BackgroundColorFade}"
+                        Height="30"
+                        HorizontalAlignment="Center"
+                        Width="400">
+
+                        <Button
+                            Background="Transparent"
+                            BorderBrush="{StaticResource BorderBrush}"
+                            BorderThickness="1,0,1,0"
+                            Focusable="False"
+                            Height="30"
+                            Width="55">
+                            <Path
+                                Data="M30.718,23.404l0.007-19.877c-0.003-0.611-0.499-1.107-1.109-1.107H15.597  c-0.433-0.01-0.771-0.807-0.771-1.111V1.182c0-0.648-0.528-1.182-1.18-1.182h-7.46C5.535,0,5.008,0.533,5.008,1.182v0.127  c0,0.309-0.341,1.117-0.784,1.117h0.013c-0.604,0.008-1.094,0.5-1.094,1.105l0.005,5.754H0.763c0,0-1.056-0.057-0.683,1.199  l2.516,12.92c0,0.65,0.453,1.176,1.104,1.176h26.474C30.824,24.58,30.718,23.404,30.718,23.404z M29.359,10.949l-0.014,12.975  l-2.502-13.908c-0.212-0.764-1.075-0.711-1.075-0.711H4.51V4.891h24.85V10.949z"
+                                Fill="{StaticResource IconColor}"
+                                Height="20.091"
+                                Stretch="Fill"
+                                Width="25.112" />
+                        </Button>
+
+                        <Button
+                            Background="Transparent"
+                            BorderBrush="{StaticResource BorderBrush}"
+                            BorderThickness="0,0,1,0"
+                            Canvas.Left="55"
+                            Focusable="False"
+                            Height="30"
+                            Width="55">
+                            <Canvas
+                                Height="28"
+                                Margin="14,0,0,0"
+                                Width="28">
+                                <Path
+                                    Canvas.Bottom="5"
+                                    Canvas.Left="0.233"
+                                    Canvas.Top="0"
+                                    Data="F1M27.242,10.47L5.429,0.05C5.173,-0.072,4.868,0.035,4.748,0.287L0,10.223 2.587,10.223 6.073,2.922 24.983,11.956 19.071,24.335 15.741,22.744 15.741,29.289 17.786,30.267C18.042,30.39,18.346,30.28,18.467,30.027L27.484,11.149C27.605,10.897,27.497,10.593,27.242,10.47"
+                                    Fill="{StaticResource IconColor}"
+                                    Height="26.318"
+                                    Stretch="Fill"
+                                    Width="23.901" />
+                                <Path
+                                    Canvas.Left="-10"
+                                    Canvas.Right="13"
+                                    Canvas.Top="7.03"
+                                    Data="F1M23.29,16.034L21.76,16.034C20.866,13.747 19.768,10.543 18.102,10.97 16.146,11.47 15.168,16.034 15.168,16.034 15.168,16.034 14.172,10.883 11.414,8.124 8.654,5.367 5.983,16.034 5.983,16.034L2.333,16.034 2.333,2.314 23.29,2.314z M24.688,0L0.511,0C0.228,0,0,0.229,0,0.509L0,21.429C0,21.71,0.228,21.94,0.511,21.94L24.688,21.94C24.97,21.94,25.198,21.71,25.198,21.429L25.198,0.509C25.198,0.229,24.97,0,24.688,0"
+                                    Fill="{StaticResource IconColor}"
+                                    Height="19.288"
+                                    Stretch="Fill"
+                                    Width="22.152" />
+                                <Path
+                                    Canvas.Bottom="12"
+                                    Canvas.Right="14"
+                                    Data="F1M1.711,3.42C2.655,3.42 3.422,2.655 3.422,1.71 3.422,0.766 2.655,0 1.711,0 0.765,0 0,0.766 0,1.71 0,2.655 0.765,3.42 1.711,3.42"
+                                    Fill="{StaticResource IconColor}"
+                                    Height="7"
+                                    Width="7" />
+                            </Canvas>
+                        </Button>
+
+                        <Canvas
+                            Background="{StaticResource BackgroundColorFade}"
+                            Canvas.Left="109"
+                            Height="30"
+                            Width="180">
+
+                            <Button
+                                Background="Transparent"
+                                BorderBrush="{StaticResource BorderBrush}"
+                                BorderThickness="0,0,1,0"
+                                Focusable="False"
+                                Height="30"
+                                Width="90">
+                                <Path
+                                    Data="F1M27.008,0L27.01,31.062 0,15.529z"
+                                    Fill="{StaticResource IconColor}"
+                                    Height="22.62"
+                                    Stretch="Fill"
+                                    Width="19.669" />
+                            </Button>
+
+                            <Button
+                                Background="Transparent"
+                                BorderBrush="{StaticResource BorderBrush}"
+                                BorderThickness="0,0,1,0"
+                                Canvas.Left="90"
+                                Focusable="False"
+                                Height="30"
+                                Width="90">
+                                <Path
+                                    Data="F1M0.002,31.062L0,0 27.01,15.534z"
+                                    Fill="{StaticResource IconColor}"
+                                    Height="23"
+                                    Stretch="Fill"
+                                    Width="19.669" />
+                            </Button>
+                        </Canvas>
+
+                        <Button
+                            Background="Transparent"
+                            BorderBrush="{StaticResource BorderBrush}"
+                            BorderThickness="0,0,1,0"
+                            Canvas.Left="289"
+                            Focusable="False"
+                            Height="30"
+                            Width="55">
+                            <Path
+                                Data="M413.967,276.8c1.06-6.235,1.06-13.518,1.06-20.8s-1.06-13.518-1.06-20.8l44.667-34.318   c4.26-3.118,5.319-8.317,2.13-13.518L418.215,115.6c-2.129-4.164-8.507-6.235-12.767-4.164l-53.186,20.801   c-10.638-8.318-23.394-15.601-36.16-20.801l-7.448-55.117c-1.06-4.154-5.319-8.318-10.638-8.318h-85.098   c-5.318,0-9.577,4.164-10.637,8.318l-8.508,55.117c-12.767,5.2-24.464,12.482-36.171,20.801l-53.186-20.801   c-5.319-2.071-10.638,0-12.767,4.164l-42.549,71.765c-2.119,4.153-1.061,10.399,2.129,13.518L96.97,235.2   c0,7.282-1.06,13.518-1.06,20.8s1.06,13.518,1.06,20.8l-44.668,34.318c-4.26,3.118-5.318,8.317-2.13,13.518L92.721,396.4   c2.13,4.164,8.508,6.235,12.767,4.164l53.187-20.801c10.637,8.318,23.394,15.601,36.16,20.801l8.508,55.117   c1.069,5.2,5.318,8.318,10.637,8.318h85.098c5.319,0,9.578-4.164,10.638-8.318l8.518-55.117c12.757-5.2,24.464-12.482,36.16-20.801   l53.187,20.801c5.318,2.071,10.637,0,12.767-4.164l42.549-71.765c2.129-4.153,1.06-10.399-2.13-13.518L413.967,276.8z    M255.468,328.8c-41.489,0-74.46-32.235-74.46-72.8s32.971-72.8,74.46-72.8s74.461,32.235,74.461,72.8S296.957,328.8,255.468,328.8   z"
+                                Fill="{StaticResource IconColor}"
+                                Height="20.091"
+                                Stretch="Fill"
+                                Width="25.112" />
+                        </Button>
+
+                        <Button
+                            Background="Transparent"
+                            BorderBrush="{StaticResource BorderBrush}"
+                            BorderThickness="0,0,1,0"
+                            Canvas.Left="345"
+                            Focusable="False"
+                            Height="30"
+                            Width="55">
+                            <Image>
+                                <DrawingImage>
+                                    <DrawingGroup>
+                                        <GeometryDrawing Brush="{StaticResource IconColor}" Geometry="F1 M7.5 5.6L10 7L8.6 4.5L10 2L7.5 3.4L5 2L6.4 4.5L5 7L7.5 5.6ZM19.5 15.4L17 14L18.4 16.5L17 19L19.5 17.6L22 19L20.6 16.5L22 14L19.5 15.4ZM22 2L19.5 3.4L17 2L18.4 4.5L17 7L19.5 5.6L22 7L20.6 4.5L22 2ZM14.37 7.29C13.98 6.9 13.35 6.9 12.96 7.29L1.29 18.96C0.9 19.35 0.9 19.98 1.29 20.37L3.63 22.71C4.02 23.1 4.65 23.1 5.04 22.71L16.7 11.05C17.09 10.66 17.09 10.03 16.7 9.64L14.37 7.29L14.37 7.29ZM13.34 12.78L11.22 10.66L13.66 8.22L15.78 10.34L13.34 12.78L13.34 12.78Z" />
+                                    </DrawingGroup>
+                                </DrawingImage>
+                            </Image>
+                        </Button>
+
+                    </Canvas>
+
+                    <Path
+                        Data="M330.664 296 v-80c0-13.255-10.745-24-24-24H205.333c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24h101.333c13.256 0 24.001-10.745 24.001-24zm32-240v80c0 13.255 10.745 24 24 24H488c13.255 0 24-10.745 24-24V56c0-13.255-10.745-24-24-24H386.667c-13.255 0-24 10.745-24 24zM0 376v80c0 13.255 10.745 24 24 24h101.333c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H24c-13.255 0-24 10.745-24 24zm386.667-56H488c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H386.667c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24zm0 160H488c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H386.667c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24zM181.333 376v80c0 13.255 10.745 24 24 24h101.333c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H205.333c-13.255 0-24 10.745-24 24z"
+                        Fill="{StaticResource IconColor}"
+                        Height="12"
+                        HorizontalAlignment="Right"
+                        Margin="0,0,3,3"
+                        Stretch="Fill"
+                        VerticalAlignment="Bottom"
+                        Width="12" />
+
+                </Grid>
+            </Border>
+
+
+
             <uc:PicBox />
         </DockPanel>
     </Border>