From a1070928e0888f70ff086cd5b37f71d32aa7a5d9 Mon Sep 17 00:00:00 2001
From: Justin Swanson <justin.c.swanson@gmail.com>
Date: Sun, 17 Nov 2019 00:34:43 -0600
Subject: [PATCH] FilePicker error display rework

Circle was covering the text
---
 Wabbajack/Views/Common/FilePicker.xaml | 98 ++++++++++++++++++++------
 1 file changed, 76 insertions(+), 22 deletions(-)

diff --git a/Wabbajack/Views/Common/FilePicker.xaml b/Wabbajack/Views/Common/FilePicker.xaml
index 17bd62f1..fd36293b 100644
--- a/Wabbajack/Views/Common/FilePicker.xaml
+++ b/Wabbajack/Views/Common/FilePicker.xaml
@@ -10,36 +10,90 @@
     d:DesignWidth="400"
     BorderBrush="{StaticResource DarkBackgroundBrush}"
     mc:Ignorable="d">
-    <Grid>
+    <Grid ClipToBounds="True">
         <Grid.ColumnDefinitions>
             <ColumnDefinition Width="*" />
-            <ColumnDefinition Width="Auto" />
+            <ColumnDefinition Width="36" />
         </Grid.ColumnDefinitions>
+        <Border
+            x:Name="BackgroundCornerFillIn"
+            Grid.Column="0"
+            Grid.ColumnSpan="2"
+            Margin="0,0,5,0"
+            Background="{StaticResource TextBoxBackground}"
+            CornerRadius="3" />
         <TextBox
             Grid.Column="0"
-            Margin="0,0,-4,0"
+            Margin="5,0,-2,0"
             VerticalContentAlignment="Center"
             Background="{StaticResource DarkBackgroundBrush}"
             Text="{Binding TargetPath, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
             Visibility="{Binding ShowTextBoxInput}" />
-        <icon:PackIconMaterial
-            Margin="0,4,4,4"
-            Padding="0,3"
-            HorizontalAlignment="Right"
-            VerticalAlignment="Center"
-            Foreground="{StaticResource WarningBrush}"
-            Kind="Circle"
-            ToolTip="{Binding ErrorTooltip}"
-            Visibility="{Binding InError, Converter={StaticResource bool2VisibilityConverter}}" />
-        <Button
-            Grid.Column="1"
-            Command="{Binding SetTargetPathCommand}"
-            ToolTip="Set target path">
-            <icon:PackIconMaterial
-                Width="16"
-                Height="12"
-                Margin="4"
-                Kind="DotsHorizontal" />
-        </Button>
+        <Grid Grid.Column="1" HorizontalAlignment="Right">
+            <Border
+                Margin="3,1,0,1"
+                HorizontalAlignment="Right"
+                Background="{StaticResource WarningBrush}"
+                CornerRadius="3"
+                ToolTip="{Binding ErrorTooltip}">
+                <Border.Style>
+                    <Style TargetType="Border">
+                        <Setter Property="Width" Value="25" />
+                        <Style.Triggers>
+                            <DataTrigger Binding="{Binding InError}" Value="True">
+                                <DataTrigger.EnterActions>
+                                    <BeginStoryboard>
+                                        <Storyboard>
+                                            <DoubleAnimation
+                                                Storyboard.TargetProperty="Width"
+                                                To="33"
+                                                Duration="0:0:0.1">
+                                                <DoubleAnimation.EasingFunction>
+                                                    <ExponentialEase EasingMode="EaseOut" />
+                                                </DoubleAnimation.EasingFunction>
+                                            </DoubleAnimation>
+                                        </Storyboard>
+                                    </BeginStoryboard>
+                                </DataTrigger.EnterActions>
+                                <DataTrigger.ExitActions>
+                                    <BeginStoryboard>
+                                        <Storyboard>
+                                            <DoubleAnimation
+                                                Storyboard.TargetProperty="Width"
+                                                To="25"
+                                                Duration="0:0:0.1">
+                                                <DoubleAnimation.EasingFunction>
+                                                    <ExponentialEase EasingMode="EaseOut" />
+                                                </DoubleAnimation.EasingFunction>
+                                            </DoubleAnimation>
+                                        </Storyboard>
+                                    </BeginStoryboard>
+                                </DataTrigger.ExitActions>
+                            </DataTrigger>
+                        </Style.Triggers>
+                    </Style>
+                </Border.Style>
+            </Border>
+            <Border
+                Width="30"
+                HorizontalAlignment="Left"
+                Background="{StaticResource TextBoxBackground}"
+                CornerRadius="3">
+                <Button Command="{Binding SetTargetPathCommand}" ToolTip="Set target path">
+                    <icon:PackIconMaterial
+                        Width="16"
+                        Height="12"
+                        Margin="4"
+                        Kind="DotsHorizontal" />
+                </Button>
+                <Border.Effect>
+                    <DropShadowEffect
+                        BlurRadius="3"
+                        Direction="0"
+                        Opacity="0.5"
+                        ShadowDepth="2" />
+                </Border.Effect>
+            </Border>
+        </Grid>
     </Grid>
 </UserControl>