Sidebar - Made sidebar resizable (to an extend)

Sidebar - Truncate long profile names
Profile editor - Added shift+click on eye-icon in profile tree to focus an element
Profile editor - Fixed layer property prefix/affix vertical alignment
UI - Made shutdown via tray more responsive
UI - Fixed several memory leaks

src/Artemis.Core/Models/Profile/Folder.cs

@@ -202,13 +202,13 @@ namespace Artemis.Core
                     foreach (BaseLayerEffect baseLayerEffect in LayerEffects.Where(e => !e.Suspended))
                         baseLayerEffect.PreProcess(canvas, rendererBounds, layerPaint);
 
-                    canvas.SaveLayer(layerPaint);
-                    canvas.Translate(Bounds.Left - basePosition.X, Bounds.Top - basePosition.Y);
-
                     // No point rendering if the alpha was set to zero by one of the effects
                     if (layerPaint.Color.Alpha == 0)
                         return;
 
+                    canvas.SaveLayer(layerPaint);
+                    canvas.Translate(Bounds.Left - basePosition.X, Bounds.Top - basePosition.Y);
+                    
                     // Iterate the children in reverse because the first layer must be rendered last to end up on top
                     for (int index = Children.Count - 1; index > -1; index--)
                         Children[index].Render(canvas, new SKPointI(Bounds.Left, Bounds.Top));

src/Artemis.Core/Models/Profile/Layer.cs

@@ -172,6 +172,9 @@ namespace Artemis.Core
 
             Disposed = true;
 
+            LayerBrushStore.LayerBrushAdded -= LayerBrushStoreOnLayerBrushAdded;
+            LayerBrushStore.LayerBrushRemoved -= LayerBrushStoreOnLayerBrushRemoved;
+
             // Brush first in case it depends on any of the other disposables during it's own disposal
             _layerBrush?.Dispose();
             _general.Dispose();
@@ -355,8 +358,6 @@ namespace Artemis.Core
             if (Enabled)
                 return;
 
-            Debug.WriteLine($"Enabling {this}");
-
             LayerBrush?.InternalEnable();
             foreach (BaseLayerEffect baseLayerEffect in LayerEffects)
                 baseLayerEffect.InternalEnable();
@@ -370,8 +371,6 @@ namespace Artemis.Core
             if (!Enabled)
                 return;
 
-            Debug.WriteLine($"Disabling {this}");
-
             LayerBrush?.InternalDisable();
             foreach (BaseLayerEffect baseLayerEffect in LayerEffects)
                 baseLayerEffect.InternalDisable();

src/Artemis.UI.Shared/Controls/DeviceVisualizer.cs

@@ -53,7 +53,6 @@ namespace Artemis.UI.Shared
 
             // Run an update timer at 25 fps
             _timer = new Timer(40);
-            _timer.Elapsed += TimerOnTick;
 
             MouseLeftButtonUp += OnMouseLeftButtonUp;
             Loaded += OnLoaded;
@@ -158,7 +157,8 @@ namespace Artemis.UI.Shared
         /// </param>
         protected virtual void Dispose(bool disposing)
         {
-            if (disposing) _timer.Stop();
+            if (disposing) 
+                _timer.Dispose();
         }
 
 
@@ -191,6 +191,7 @@ namespace Artemis.UI.Shared
         private void OnUnloaded(object? sender, RoutedEventArgs e)
         {
             _timer.Stop();
+            _timer.Elapsed -= TimerOnTick;
 
             if (_oldDevice != null)
             {
@@ -222,6 +223,7 @@ namespace Artemis.UI.Shared
         private void OnLoaded(object? sender, RoutedEventArgs e)
         {
             _timer.Start();
+            _timer.Elapsed += TimerOnTick;
         }
 
         private void TimerOnTick(object? sender, EventArgs e)

src/Artemis.UI.Shared/Controls/ProfileConfigurationIcon.xaml

@@ -11,6 +11,7 @@
              d:DesignHeight="450" d:DesignWidth="800">
     <UserControl.Resources>
         <shared:StreamToBitmapImageConverter x:Key="StreamToBitmapImageConverter" />
+        <shared:StreamToSvgImageConverter x:Key="StreamToSvgImageConverter" />
     </UserControl.Resources>
     <ContentControl>
         <ContentControl.Style>
@@ -47,10 +48,11 @@
                         <Setter Property="ContentTemplate">
                             <Setter.Value>
                                 <DataTemplate>
-                                    <svgc:SvgViewbox StreamSource="{Binding ConfigurationIcon.FileIcon, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}"
+                                    <Image
-                                                     RenderOptions.BitmapScalingMode="HighQuality"
+                                        Source="{Binding ConfigurationIcon.FileIcon, Converter={StaticResource StreamToSvgImageConverter}, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}"
-                                                     Width="Auto"
+                                        RenderOptions.BitmapScalingMode="HighQuality"
-                                                     Height="Auto" />
+                                        Width="Auto"
+                                        Height="Auto" />
                                 </DataTemplate>
                             </Setter.Value>
                         </Setter>

src/Artemis.UI.Shared/Converters/StreamToBitmapImageConverter.cs

@@ -8,7 +8,7 @@ namespace Artemis.UI.Shared
 {
     /// <inheritdoc />
     /// <summary>
-    ///     Converts <see cref="T:Stream" /> into <see cref="T:BitmapImage" />.
+    ///     Converts bitmap file in the form of a <see cref="T:Stream" /> into <see cref="T:BitmapImage" />.
     /// </summary>
     [ValueConversion(typeof(Stream), typeof(BitmapImage))]
     public class StreamToBitmapImageConverter : IValueConverter
@@ -16,7 +16,7 @@ namespace Artemis.UI.Shared
         /// <inheritdoc />
         public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
         {
-            if (value is not Stream stream) 
+            if (value is not Stream stream)
                 return null;
 
             stream.Position = 0;

src/Artemis.UI.Shared/Converters/StreamToSvgImageConverter.cs

@@ -0,0 +1,48 @@
+using System;
+using System.Globalization;
+using System.IO;
+using System.Windows.Data;
+using System.Windows.Media.Imaging;
+using SharpVectors.Converters;
+using SharpVectors.Renderers.Wpf;
+
+namespace Artemis.UI.Shared
+{
+    /// <inheritdoc />
+    /// <summary>
+    ///     Converts SVG file in the form of a <see cref="T:Stream" /> into <see cref="T:BitmapImage" />.
+    /// </summary>
+    [ValueConversion(typeof(Stream), typeof(BitmapImage))]
+    public class StreamToSvgImageConverter : IValueConverter
+    {
+        /// <inheritdoc />
+        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
+        {
+            if (value is not Stream stream)
+                return null;
+
+            stream.Position = 0;
+
+            StreamSvgConverter converter = new(new WpfDrawingSettings());
+            using MemoryStream imageStream = new();
+            converter.Convert(stream, imageStream);
+
+            BitmapImage selectedBitmap = new();
+            selectedBitmap.BeginInit();
+            selectedBitmap.StreamSource = imageStream;
+            selectedBitmap.CacheOption = BitmapCacheOption.OnLoad;
+            selectedBitmap.EndInit();
+            selectedBitmap.Freeze();
+
+            stream.Position = 0;
+            return selectedBitmap;
+        }
+
+
+        /// <inheritdoc />
+        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
+        {
+            return Binding.DoNothing;
+        }
+    }
+}

src/Artemis.UI/Converters/ValuesAdditionConverter.cs

@@ -0,0 +1,20 @@
+using System;
+using System.Globalization;
+using System.Linq;
+using System.Windows.Data;
+
+namespace Artemis.UI.Converters
+{
+    public class ValuesAdditionConverter : IMultiValueConverter
+    {
+        public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
+        {
+            return values.Where(v => v is double).Cast<double>().Sum();
+        }
+
+        public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture)
+        {
+            throw new NotImplementedException();
+        }
+    }
+}

src/Artemis.UI/DefaultTypes/PropertyInput/BoolPropertyInputView.xaml

@@ -11,7 +11,7 @@
         <converters:InverseBooleanConverter x:Key="InverseBooleanConverter" />
     </UserControl.Resources>
     <StackPanel Orientation="Horizontal">
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" VerticalAlignment="Center" />
         <ComboBox Width="132"
                   Margin="0 2"
                   Padding="0 -1"
@@ -22,6 +22,6 @@
             <ComboBoxItem Content="True" IsSelected="{Binding InputValue}" />
             <ComboBoxItem Content="False" IsSelected="{Binding InputValue, Converter={StaticResource InverseBooleanConverter}}" />
         </ComboBox>
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" VerticalAlignment="Center" />
     </StackPanel>
 </UserControl>

src/Artemis.UI/DefaultTypes/PropertyInput/BrushPropertyInputView.xaml

@@ -18,7 +18,7 @@
         </ResourceDictionary>
     </UserControl.Resources>
     <StackPanel Orientation="Horizontal">
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" VerticalAlignment="Center" />
         <ComboBox Width="132"
                   Margin="0 2"
                   Padding="0 -1"
@@ -31,6 +31,6 @@
                   ItemTemplateSelector="{dataTemplateSelectors:ComboBoxTemplateSelector
                                          SelectedItemTemplate={StaticResource SimpleLayerBrushDescriptorTemplate},
                                          DropdownItemsTemplate={StaticResource ExtendedLayerBrushDescriptorTemplate}}" />
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" VerticalAlignment="Center" />
     </StackPanel>
 </UserControl>

src/Artemis.UI/DefaultTypes/PropertyInput/ColorGradientPropertyInputView.xaml

@@ -10,14 +10,14 @@
              d:DesignHeight="25" d:DesignWidth="800"
              d:DataContext="{d:DesignInstance propertyInput:ColorGradientPropertyInputViewModel}">
     <StackPanel Orientation="Horizontal">
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" VerticalAlignment="Center" />
         <shared:GradientPicker Width="132"
                                Margin="0 2"
                                Padding="0 -1"
                                ColorGradient="{Binding InputValue}"
                                DialogClosed="{s:Action DialogClosed}"
-                               DialogHost="PropertyTreeDialogHost" 
+                               DialogHost="PropertyTreeDialogHost"
-                               ToolTip="Click to edit gradient colors"/>
+                               ToolTip="Click to edit gradient colors" />
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" VerticalAlignment="Center" />
     </StackPanel>
 </UserControl>

src/Artemis.UI/DefaultTypes/PropertyInput/EnumPropertyInputView.xaml

@@ -7,7 +7,7 @@
              mc:Ignorable="d"
              d:DesignHeight="450" d:DesignWidth="800">
     <StackPanel Orientation="Horizontal">
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" VerticalAlignment="Center" />
         <ComboBox Width="132"
                   Margin="0 2"
                   Padding="0 -1"
@@ -19,6 +19,6 @@
                   SelectedValuePath="Value"
                   DisplayMemberPath="Description"
                   SelectedValue="{Binding Path=InputValue}" />
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" VerticalAlignment="Center" />
     </StackPanel>
 </UserControl>

src/Artemis.UI/DefaultTypes/PropertyInput/FloatPropertyInputView.xaml

@@ -11,7 +11,7 @@
              d:DesignHeight="450" d:DesignWidth="800"
              d:DataContext="{d:DesignInstance propertyInput:FloatPropertyInputViewModel}">
     <StackPanel Orientation="Horizontal">
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" VerticalAlignment="Center" />
         <shared:DraggableFloat Value="{Binding InputValue}"
                                materialDesign:ValidationAssist.UsePopup="True"
                                StepSize="{Binding LayerProperty.PropertyDescription.InputStepSize}"
@@ -19,7 +19,7 @@
                                Min="{Binding LayerProperty.PropertyDescription.MinInputValue}"
                                DragStarted="{s:Action InputDragStarted}"
                                DragEnded="{s:Action InputDragEnded}"
-                               IsEnabled="{Binding IsEnabled}"/>
+                               IsEnabled="{Binding IsEnabled}" />
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" VerticalAlignment="Center" />
     </StackPanel>
 </UserControl>

src/Artemis.UI/DefaultTypes/PropertyInput/FloatRangePropertyInputView.xaml

@@ -5,11 +5,12 @@
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:s="https://github.com/canton7/Stylet"
              xmlns:shared="clr-namespace:Artemis.UI.Shared;assembly=Artemis.UI.Shared"
+             xmlns:propertyInput="clr-namespace:Artemis.UI.DefaultTypes.PropertyInput"
              mc:Ignorable="d"
              d:DesignHeight="450" d:DesignWidth="800"
-             d:DataContext="{d:DesignInstance local:FloatRangePropertyInputViewModel}">
+             d:DataContext="{d:DesignInstance propertyInput:FloatRangePropertyInputViewModel}">
     <StackPanel Orientation="Horizontal">
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" VerticalAlignment="Center" />
         <shared:DraggableFloat ToolTip="Start"
                                Value="{Binding Start}"
                                StepSize="{Binding LayerProperty.PropertyDescription.InputStepSize}"
@@ -17,7 +18,7 @@
                                Min="{Binding LayerProperty.PropertyDescription.MinInputValue}"
                                DragStarted="{s:Action InputDragStarted}"
                                DragEnded="{s:Action InputDragEnded}"
-                               IsEnabled="{Binding IsStartEnabled}"/>
+                               IsEnabled="{Binding IsStartEnabled}" />
         <TextBlock Margin="5 0" VerticalAlignment="Bottom">-</TextBlock>
         <shared:DraggableFloat ToolTip="End"
                                Value="{Binding End}"
@@ -26,7 +27,7 @@
                                Min="{Binding Start}"
                                DragStarted="{s:Action InputDragStarted}"
                                DragEnded="{s:Action InputDragEnded}"
-                               IsEnabled="{Binding IsEndEnabled}"/>
+                               IsEnabled="{Binding IsEndEnabled}" />
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" VerticalAlignment="Center" />
     </StackPanel>
 </UserControl>

src/Artemis.UI/DefaultTypes/PropertyInput/IntPropertyInputView.xaml

@@ -6,11 +6,12 @@
              xmlns:s="https://github.com/canton7/Stylet"
              xmlns:shared="clr-namespace:Artemis.UI.Shared;assembly=Artemis.UI.Shared"
              xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
+             xmlns:propertyInput="clr-namespace:Artemis.UI.DefaultTypes.PropertyInput"
              mc:Ignorable="d"
              d:DesignHeight="450" d:DesignWidth="800"
              d:DataContext="{d:DesignInstance propertyInput:IntPropertyInputViewModel}">
     <StackPanel Orientation="Horizontal">
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" VerticalAlignment="Center" />
         <shared:DraggableFloat Value="{Binding InputValue}"
                                materialDesign:ValidationAssist.UsePopup="True"
                                StepSize="{Binding LayerProperty.PropertyDescription.InputStepSize}"
@@ -18,7 +19,7 @@
                                Min="{Binding LayerProperty.PropertyDescription.MinInputValue}"
                                DragStarted="{s:Action InputDragStarted}"
                                DragEnded="{s:Action InputDragEnded}"
-                               IsEnabled="{Binding IsEnabled}"/>
+                               IsEnabled="{Binding IsEnabled}" />
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" VerticalAlignment="Center" />
     </StackPanel>
 </UserControl>

src/Artemis.UI/DefaultTypes/PropertyInput/IntRangePropertyInputView.xaml

@@ -5,11 +5,12 @@
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:s="https://github.com/canton7/Stylet"
              xmlns:shared="clr-namespace:Artemis.UI.Shared;assembly=Artemis.UI.Shared"
+             xmlns:propertyInput="clr-namespace:Artemis.UI.DefaultTypes.PropertyInput"
              mc:Ignorable="d"
              d:DesignHeight="450" d:DesignWidth="800"
-             d:DataContext="{d:DesignInstance local:IntRangePropertyInputViewModel}">
+             d:DataContext="{d:DesignInstance propertyInput:IntRangePropertyInputViewModel}">
     <StackPanel Orientation="Horizontal">
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" VerticalAlignment="Center" />
         <shared:DraggableFloat ToolTip="Start"
                                Value="{Binding Start}"
                                StepSize="{Binding LayerProperty.PropertyDescription.InputStepSize}"
@@ -17,7 +18,7 @@
                                Min="{Binding LayerProperty.PropertyDescription.MinInputValue}"
                                DragStarted="{s:Action InputDragStarted}"
                                DragEnded="{s:Action InputDragEnded}"
-                               IsEnabled="{Binding IsStartEnabled}"/>
+                               IsEnabled="{Binding IsStartEnabled}" />
         <TextBlock Margin="5 0" VerticalAlignment="Bottom">-</TextBlock>
         <shared:DraggableFloat ToolTip="End"
                                Value="{Binding End}"
@@ -26,7 +27,7 @@
                                Min="{Binding Start}"
                                DragStarted="{s:Action InputDragStarted}"
                                DragEnded="{s:Action InputDragEnded}"
-                               IsEnabled="{Binding IsEndEnabled}"/>
+                               IsEnabled="{Binding IsEndEnabled}" />
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" VerticalAlignment="Center" />
     </StackPanel>
 </UserControl>

src/Artemis.UI/DefaultTypes/PropertyInput/SKColorPropertyInputView.xaml

@@ -5,6 +5,7 @@
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:artemis="clr-namespace:Artemis.UI.Shared;assembly=Artemis.UI.Shared"
              xmlns:s="https://github.com/canton7/Stylet"
+             xmlns:propertyInput="clr-namespace:Artemis.UI.DefaultTypes.PropertyInput"
              mc:Ignorable="d"
              d:DesignHeight="25" d:DesignWidth="800"
              d:DataContext="{d:DesignInstance propertyInput:SKColorPropertyInputViewModel}">
@@ -12,7 +13,7 @@
         <artemis:SKColorToColorConverter x:Key="SKColorToColorConverter" />
     </UserControl.Resources>
     <StackPanel Orientation="Horizontal">
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" VerticalAlignment="Center" />
         <artemis:ColorPicker Width="132"
                              Margin="0 -2 0 3"
                              Padding="0 -1"
@@ -20,6 +21,6 @@
                              IsEnabled="{Binding IsEnabled}"
                              DragStarted="{s:Action InputDragStarted}"
                              DragEnded="{s:Action InputDragEnded}"/>
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" VerticalAlignment="Center" />
     </StackPanel>
 </UserControl>

src/Artemis.UI/DefaultTypes/PropertyInput/SKPointPropertyInputView.xaml

@@ -5,11 +5,12 @@
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:s="https://github.com/canton7/Stylet"
              xmlns:shared="clr-namespace:Artemis.UI.Shared;assembly=Artemis.UI.Shared"
+             xmlns:propertyInput="clr-namespace:Artemis.UI.DefaultTypes.PropertyInput"
              mc:Ignorable="d"
              d:DesignHeight="25" d:DesignWidth="800"
              d:DataContext="{d:DesignInstance propertyInput:SKPointPropertyInputViewModel}">
     <StackPanel Orientation="Horizontal" KeyboardNavigation.IsTabStop="True">
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" VerticalAlignment="Center" />
         <shared:DraggableFloat ToolTip="X-coordinate (horizontal)"
                                Value="{Binding X}"
                                StepSize="{Binding LayerProperty.PropertyDescription.InputStepSize}"
@@ -17,7 +18,7 @@
                                Min="{Binding LayerProperty.PropertyDescription.MinInputValue}"
                                DragStarted="{s:Action InputDragStarted}"
                                DragEnded="{s:Action InputDragEnded}"
-                               IsEnabled="{Binding IsXEnabled}"/>
+                               IsEnabled="{Binding IsXEnabled}" />
         <TextBlock Margin="5 0" VerticalAlignment="Bottom">,</TextBlock>
         <shared:DraggableFloat ToolTip="Y-coordinate (vertical)"
                                Value="{Binding Y}"
@@ -26,7 +27,7 @@
                                Min="{Binding LayerProperty.PropertyDescription.MinInputValue}"
                                DragStarted="{s:Action InputDragStarted}"
                                DragEnded="{s:Action InputDragEnded}"
-                               IsEnabled="{Binding IsYEnabled}"/>
+                               IsEnabled="{Binding IsYEnabled}" />
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" VerticalAlignment="Center" />
     </StackPanel>
 </UserControl>

src/Artemis.UI/DefaultTypes/PropertyInput/SKSizePropertyInputView.xaml

@@ -5,11 +5,12 @@
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:s="https://github.com/canton7/Stylet"
              xmlns:shared="clr-namespace:Artemis.UI.Shared;assembly=Artemis.UI.Shared"
+             xmlns:propertyInput="clr-namespace:Artemis.UI.DefaultTypes.PropertyInput"
              mc:Ignorable="d"
              d:DesignHeight="450" d:DesignWidth="800"
-             d:DataContext="{d:DesignInstance local:SKSizePropertyInputViewModel}">
+             d:DataContext="{d:DesignInstance propertyInput:SKSizePropertyInputViewModel}">
     <StackPanel Orientation="Horizontal">
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputPrefix}" VerticalAlignment="Center" />
         <shared:DraggableFloat ToolTip="Height"
                                Value="{Binding Height}"
                                StepSize="{Binding LayerProperty.PropertyDescription.InputStepSize}"
@@ -17,7 +18,7 @@
                                Min="{Binding LayerProperty.PropertyDescription.MinInputValue}"
                                DragStarted="{s:Action InputDragStarted}"
                                DragEnded="{s:Action InputDragEnded}"
-                               IsEnabled="{Binding IsHeightEnabled}"/>
+                               IsEnabled="{Binding IsHeightEnabled}" />
         <TextBlock Margin="5 0" VerticalAlignment="Bottom">,</TextBlock>
         <shared:DraggableFloat ToolTip="Width"
                                Value="{Binding Width}"
@@ -26,7 +27,7 @@
                                Min="{Binding LayerProperty.PropertyDescription.MinInputValue}"
                                DragStarted="{s:Action InputDragStarted}"
                                DragEnded="{s:Action InputDragEnded}"
-                               IsEnabled="{Binding IsWidthEnabled}"/>
+                               IsEnabled="{Binding IsWidthEnabled}" />
-        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" />
+        <TextBlock Width="25" Text="{Binding LayerProperty.PropertyDescription.InputAffix}" VerticalAlignment="Center" />
     </StackPanel>
 </UserControl>

src/Artemis.UI/Screens/ProfileEditor/ProfileTree/TreeItem/LayerView.xaml

@@ -1,19 +1,19 @@
 <UserControl
-             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-             xmlns:s="https://github.com/canton7/Stylet"
+    xmlns:s="https://github.com/canton7/Stylet"
-             xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
+    xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
-             xmlns:treeItem1="clr-namespace:Artemis.UI.Screens.ProfileEditor.ProfileTree.TreeItem"
+    xmlns:treeItem1="clr-namespace:Artemis.UI.Screens.ProfileEditor.ProfileTree.TreeItem"
-             xmlns:Converters="clr-namespace:Artemis.UI.Converters"
+    xmlns:Converters="clr-namespace:Artemis.UI.Converters"
-             xmlns:shared="clr-namespace:Artemis.UI.Shared;assembly=Artemis.UI.Shared"
+    xmlns:shared="clr-namespace:Artemis.UI.Shared;assembly=Artemis.UI.Shared"
-             x:Class="Artemis.UI.Screens.ProfileEditor.ProfileTree.TreeItem.LayerView"
+    x:Class="Artemis.UI.Screens.ProfileEditor.ProfileTree.TreeItem.LayerView"
-             mc:Ignorable="d"
+    mc:Ignorable="d"
-             d:DesignHeight="450" d:DesignWidth="800"
+    d:DesignHeight="450" d:DesignWidth="800"
-             d:DataContext="{d:DesignInstance {x:Type treeItem1:LayerViewModel}}">
+    d:DataContext="{d:DesignInstance {x:Type treeItem1:LayerViewModel}}">
     <UserControl.Resources>
-        <Converters:InverseBooleanConverter x:Key="InverseBooleanConverter"/>
+        <Converters:InverseBooleanConverter x:Key="InverseBooleanConverter" />
     </UserControl.Resources>
     <!-- Capture clicks on full tree view item -->
     <StackPanel Margin="-10" Background="Transparent" ContextMenuOpening="{s:Action ContextMenuOpening}">
@@ -72,12 +72,17 @@
             <TextBlock Grid.Column="2" Text="{Binding Layer.Name}" VerticalAlignment="Center" Margin="5 0 0 0" />
             <ToggleButton Grid.Column="3"
                           Style="{StaticResource MaterialDesignFlatToggleButton}"
-                          ToolTip="Toggle suspended state"
                           Width="18"
                           Height="18"
                           IsChecked="{Binding ProfileElement.Suspended, Converter={StaticResource InverseBooleanConverter}}"
                           Command="{s:Action SuspendedToggled}"
                           VerticalAlignment="Center" Padding="-25">
+                <ToggleButton.ToolTip>
+                    <TextBlock>
+                        Toggle suspended state <LineBreak />
+                        <Bold>Shift+click</Bold> to toggle focus
+                    </TextBlock>
+                </ToggleButton.ToolTip>
                 <materialDesign:PackIcon Kind="Eye" Height="13" Width="13" />
             </ToggleButton>
         </Grid>

src/Artemis.UI/Screens/ProfileEditor/ProfileTree/TreeItem/TreeItemViewModel.cs

@@ -2,6 +2,7 @@
 using System.Collections.Generic;
 using System.Linq;
 using System.Threading.Tasks;
+using System.Windows.Input;
 using Artemis.Core;
 using Artemis.Core.LayerBrushes;
 using Artemis.Core.Services;
@@ -18,9 +19,9 @@ namespace Artemis.UI.Screens.ProfileEditor.ProfileTree.TreeItem
     {
         private readonly IDialogService _dialogService;
         private readonly ILayerBrushService _layerBrushService;
-        private readonly IRgbService _rgbService;
         private readonly IProfileEditorService _profileEditorService;
         private readonly IProfileTreeVmFactory _profileTreeVmFactory;
+        private readonly IRgbService _rgbService;
         private ProfileElement _profileElement;
 
         protected TreeItemViewModel(ProfileElement profileElement,
@@ -243,6 +244,39 @@ namespace Artemis.UI.Screens.ProfileEditor.ProfileTree.TreeItem
 
         public void SuspendedToggled()
         {
+            // If shift is held toggle focus state
+            if (Keyboard.IsKeyDown(Key.LeftShift) || Keyboard.IsKeyDown(Key.RightShift))
+            {
+                // Get all profile elements
+                List<ProfileElement> elements = ProfileElement.Profile.GetAllFolders().Cast<ProfileElement>().ToList();
+                elements.AddRange(ProfileElement.Profile.GetAllLayers().Cast<ProfileElement>().ToList());
+
+                // Separate out the targets of the focus state, the current profile element and all its parents
+                List<ProfileElement> targets = ProfileElement.GetAllFolders().Cast<ProfileElement>().ToList();
+                targets.AddRange(ProfileElement.GetAllLayers().Cast<ProfileElement>().ToList());
+                ProfileElement target = ProfileElement;
+                while (target != null)
+                {
+                    targets.Add(target);
+                    target = target.Parent;
+                }
+
+                // If any element is suspended, untoggle focus and unsuspend everything
+                if (elements.Except(targets).Any(e => e.Suspended))
+                {
+                    foreach (ProfileElement profileElement in elements)
+                        profileElement.Suspended = false;
+                }
+                // Otherwise suspend everything except the targets
+                else
+                {
+                    foreach (ProfileElement profileElement in elements.Except(targets))
+                        profileElement.Suspended = true;
+                    foreach (ProfileElement profileElement in targets)
+                        profileElement.Suspended = false;
+                }
+            }
+
             _profileEditorService.SaveSelectedProfileConfiguration();
         }
 

src/Artemis.UI/Screens/RootView.xaml

@@ -23,58 +23,63 @@
                     KeyUp="{s:Action WindowKeyUp}"
                     MouseDown="{s:Action WindowMouseDown}"
                     MouseUp="{s:Action WindowMouseUp}"
-                    d:DesignHeight="640" d:DesignWidth="1200" 
+                    d:DesignHeight="640" d:DesignWidth="1200"
                     d:DataContext="{d:DesignInstance screens:RootViewModel}">
     <materialDesign:DialogHost IsTabStop="False" Focusable="False" Identifier="RootDialog" DialogTheme="Inherit" SnackbarMessageQueue="{Binding MainMessageQueue}">
-        <DockPanel>
+        <Grid>
-            <Border DockPanel.Dock="Left" DockPanel.ZIndex="2" ClipToBounds="True" Background="{DynamicResource MaterialDesignToolBarBackground}">
+            <Grid.ColumnDefinitions>
-                <Grid>
+                <ColumnDefinition Width="{Binding SidebarWidth.Value, Mode=TwoWay}" MinWidth="175" MaxWidth="400" />
-                    <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="*" />
-                        <ColumnDefinition />
+            </Grid.ColumnDefinitions>
-                        <ColumnDefinition />
+            <Border Grid.Column="0" ClipToBounds="True" Background="{DynamicResource MaterialDesignToolBarBackground}">
-                    </Grid.ColumnDefinitions>
+                <ContentControl s:View.Model="{Binding SidebarViewModel}" VerticalContentAlignment="Stretch" HorizontalContentAlignment="Stretch" IsTabStop="False" />
-                    <ContentControl Grid.Column="0" s:View.Model="{Binding SidebarViewModel}" Width="240" />
-                    <Rectangle Grid.Column="1" Fill="DarkGray" Width="1" Margin="0 0 -1 0">
-                        <Rectangle.Effect>
-                            <DropShadowEffect ShadowDepth="0" BlurRadius="10" Color="{StaticResource MaterialDesignShadow}" />
-                        </Rectangle.Effect>
-                    </Rectangle>
-                </Grid>
             </Border>
 
-            <materialDesign:ColorZone Mode="PrimaryMid" DockPanel.Dock="Top" DockPanel.ZIndex="1" Height="42">
+            <GridSplitter Grid.Column="0" Width="8" Margin="0 0 -4 0" Background="Transparent" />
-                <Grid>
-                    <Grid.ColumnDefinitions>
-                        <ColumnDefinition Width="*" />
-                        <ColumnDefinition Width="Auto" />
-                    </Grid.ColumnDefinitions>
-                    <TextBlock Grid.Column="0" 
-                               Text="{Binding SidebarViewModel.SelectedScreen.DisplayName}" 
-                               VerticalAlignment="Center" 
-                               FontSize="20" 
-                               Margin="15 0" />
-                    <StackPanel Grid.Column="1" Orientation="Horizontal">
-                        <TextBlock Text="{Binding FrameTime}" VerticalAlignment="Center" FontSize="14" Margin="10 0" ToolTip="The time the last frame took to render" />
 
-                        <!-- Bug: materialDesign:RippleAssist.RippleOnTop doesn't look as nice but otherwise it doesn't work at all, not sure why -->
+            <Grid Grid.Column="1">
-                        <Button Style="{StaticResource MaterialDesignIconForegroundButton}"
+                <Grid.RowDefinitions>
-                                VerticalAlignment="Center"
+                    <RowDefinition Height="Auto" />
-                                ToolTip="Open debugger"
+                    <RowDefinition Height="*" />
-                                Command="{s:Action ShowDebugger}"
+                </Grid.RowDefinitions>
-                                materialDesign:RippleAssist.RippleOnTop="True">
+                <materialDesign:ColorZone Grid.Row="0" Mode="PrimaryMid" DockPanel.Dock="Top" DockPanel.ZIndex="1" Height="42">
-                            <materialDesign:PackIcon Kind="Matrix" />
+                    <Grid>
-                        </Button>
+                        <Grid.ColumnDefinitions>
-                    </StackPanel>
+                            <ColumnDefinition Width="*" />
-                </Grid>
+                            <ColumnDefinition Width="Auto" />
-            </materialDesign:ColorZone>
+                        </Grid.ColumnDefinitions>
+                        <TextBlock Grid.Column="0"
+                                   Text="{Binding SidebarViewModel.SelectedScreen.DisplayName}"
+                                   VerticalAlignment="Center"
+                                   FontSize="20"
+                                   Margin="15 0" />
+                        <StackPanel Grid.Column="1" Orientation="Horizontal">
+                            <TextBlock Text="{Binding FrameTime}" VerticalAlignment="Center" FontSize="14" Margin="10 0" ToolTip="The time the last frame took to render" />
 
-            <Grid>
+                            <!-- Bug: materialDesign:RippleAssist.RippleOnTop doesn't look as nice but otherwise it doesn't work at all, not sure why -->
-                <ContentControl s:View.Model="{Binding SidebarViewModel.SelectedScreen}" />
+                            <Button Style="{StaticResource MaterialDesignIconForegroundButton}"
-                <materialDesign:Snackbar x:Name="MainSnackbar"
+                                    VerticalAlignment="Center"
+                                    ToolTip="Open debugger"
+                                    Command="{s:Action ShowDebugger}"
+                                    materialDesign:RippleAssist.RippleOnTop="True">
+                                <materialDesign:PackIcon Kind="Matrix" />
+                            </Button>
+                        </StackPanel>
+                    </Grid>
+                </materialDesign:ColorZone>
+
+                <ContentControl Grid.Row="1"
+                                s:View.Model="{Binding SidebarViewModel.SelectedScreen}"
+                                VerticalContentAlignment="Stretch"
+                                HorizontalContentAlignment="Stretch"
+                                IsTabStop="False" />
+                <materialDesign:Snackbar Grid.Row="0"
+                                         Grid.RowSpan="2"
+                                         x:Name="MainSnackbar"
                                          MessageQueue="{Binding MainMessageQueue}"
                                          materialDesign:SnackbarMessage.InlineActionButtonMaxHeight="80"
                                          materialDesign:SnackbarMessage.ContentMaxHeight="200" />
             </Grid>
-        </DockPanel>
+        </Grid>
     </materialDesign:DialogHost>
 </mde:MaterialWindow>

src/Artemis.UI/Screens/RootViewModel.cs

@@ -61,6 +61,7 @@ namespace Artemis.UI.Screens
             _frameTimeUpdateTimer = new Timer(500);
             _windowSize = _settingsService.GetSetting<WindowSize>("UI.RootWindowSize");
 
+            SidebarWidth = _settingsService.GetSetting("UI.SidebarWidth", new GridLength(240, GridUnitType.Star));
             SidebarViewModel = sidebarViewModel;
             SidebarViewModel.ConductWith(this);
 
@@ -68,6 +69,7 @@ namespace Artemis.UI.Screens
             WindowTitle = $"Artemis {versionAttribute?.InformationalVersion} build {Constants.BuildInfo.BuildNumberDisplay}";
         }
 
+        public PluginSetting<GridLength> SidebarWidth { get; }
         public SidebarViewModel SidebarViewModel { get; }
 
         public ISnackbarMessageQueue MainMessageQueue
@@ -75,7 +77,7 @@ namespace Artemis.UI.Screens
             get => _mainMessageQueue;
             set => SetAndNotify(ref _mainMessageQueue, value);
         }
-        
+
         public string WindowTitle
         {
             get => _windowTitle;
@@ -210,7 +212,7 @@ namespace Artemis.UI.Screens
             _frameTimeUpdateTimer.Stop();
 
             SidebarViewModel.SelectedScreenChanged -= SidebarViewModelOnSelectedScreenChanged;
-
+            SidebarWidth.Save();
             _windowSize.Value ??= new WindowSize();
             _windowSize.Value.ApplyFromWindow(_window);
             _windowSize.Save();

src/Artemis.UI/Screens/Sidebar/Dialogs/ProfileEdit/ProfileEditView.xaml

@@ -6,10 +6,8 @@
              xmlns:s="https://github.com/canton7/Stylet"
              xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
              xmlns:converters="clr-namespace:Artemis.UI.Converters"
-             xmlns:dialogs="clr-namespace:Artemis.UI.Screens.Sidebar.Dialogs"
              xmlns:shared="clr-namespace:Artemis.UI.Shared;assembly=Artemis.UI.Shared"
              xmlns:profileEdit="clr-namespace:Artemis.UI.Screens.Sidebar.Dialogs.ProfileEdit"
-             xmlns:svgc="http://sharpvectors.codeplex.com/svgc/"
              xmlns:core="clr-namespace:Artemis.Core;assembly=Artemis.Core"
              mc:Ignorable="d"
              d:DesignHeight="450" d:DesignWidth="280"
@@ -17,9 +15,10 @@
              Width="800">
     <UserControl.Resources>
         <converters:InverseBooleanConverter x:Key="InverseBooleanConverter" />
-        <shared:StreamToBitmapImageConverter x:Key="StreamToBitmapImageConverter"/>
-        <shared:NullToVisibilityConverter x:Key="NullToVisibilityConverter" />
         <shared:BindingProxy x:Key="DataContextProxy" Data="{Binding}" />
+        <shared:NullToVisibilityConverter x:Key="NullToVisibilityConverter" />
+        <shared:StreamToBitmapImageConverter x:Key="StreamToBitmapImageConverter" />
+        <shared:StreamToSvgImageConverter x:Key="StreamToSvgImageConverter" />
     </UserControl.Resources>
     <Grid Margin="16">
         <Grid.RowDefinitions>
@@ -112,9 +111,9 @@
                                                     <ColumnDefinition Width="Auto" />
                                                     <ColumnDefinition />
                                                 </Grid.ColumnDefinitions>
-                                                <materialDesign:PackIcon Grid.Column="0" 
+                                                <materialDesign:PackIcon Grid.Column="0"
                                                                          Kind="{Binding DataContext.SelectedIcon.Icon, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}, Mode=OneWay}"
-                                                                         Width="45" 
+                                                                         Width="45"
                                                                          Height="45"
                                                                          Margin="0 0 10 0"
                                                                          VerticalAlignment="Center" />
@@ -154,14 +153,14 @@
                                                     <ColumnDefinition Width="Auto" />
                                                     <ColumnDefinition />
                                                 </Grid.ColumnDefinitions>
-                                                <Image Grid.Column="0" 
+                                                <Image Grid.Column="0"
                                                        Source="{Binding DataContext.SelectedImage, Converter={StaticResource StreamToBitmapImageConverter}, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}"
-                                                       RenderOptions.BitmapScalingMode="HighQuality"
                                                        Margin="0 0 10 0"
-                                                       Width="45" 
+                                                       Width="45"
                                                        Height="45"
-                                                       VerticalAlignment="Center" />
+                                                       VerticalAlignment="Center"
-                                                <Button Grid.Column="1" 
+                                                       RenderOptions.BitmapScalingMode="HighQuality" />
+                                                <Button Grid.Column="1"
                                                         Command="{s:Action SelectBitmapFile}"
                                                         Style="{StaticResource MaterialDesignRaisedButton}"
                                                         ToolTip="Select an image">
@@ -185,13 +184,14 @@
                                                     <ColumnDefinition />
                                                 </Grid.ColumnDefinitions>
 
-                                                <svgc:SvgViewbox Grid.Column="0" 
+                                                <Image Grid.Column="0"
-                                                                 StreamSource="{Binding DataContext.SelectedImage, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}" 
+                                                       Source="{Binding DataContext.SelectedImage, Converter={StaticResource StreamToSvgImageConverter}, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}"
-                                                                 Margin="0 0 10 0"
+                                                       Margin="0 0 10 0"
-                                                                 Width="45" 
+                                                       Width="45"
-                                                                 Height="45"
+                                                       Height="45"
-                                                                 VerticalAlignment="Center" />
+                                                       VerticalAlignment="Center"
-                                                <Button Grid.Column="1" 
+                                                       RenderOptions.BitmapScalingMode="HighQuality" />
+                                                <Button Grid.Column="1"
                                                         Command="{s:Action SelectSvgFile}"
                                                         Style="{StaticResource MaterialDesignRaisedButton}"
                                                         ToolTip="Select an image">

src/Artemis.UI/Screens/Sidebar/SidebarProfileConfigurationView.xaml

@@ -18,7 +18,7 @@
              Padding="8">
     <!-- Above is a dumb hack to get the context menu to cover the entire item -->
     <UserControl.Resources>
-        <shared:StreamToBitmapImageConverter x:Key="StreamToBitmapImageConverter" />
+        <converters:ValuesAdditionConverter x:Key="ValuesAddition" />
     </UserControl.Resources>
     <UserControl.ContextMenu>
         <ContextMenu>
@@ -52,17 +52,17 @@
                     <materialDesign:PackIcon Kind="Export" />
                 </MenuItem.Icon>
             </MenuItem>
-            <MenuItem Header="Duplicate" Command="{s:Action Duplicate}" >
+            <MenuItem Header="Duplicate" Command="{s:Action Duplicate}">
                 <MenuItem.Icon>
                     <materialDesign:PackIcon Kind="ContentDuplicate" />
                 </MenuItem.Icon>
             </MenuItem>
-            <MenuItem Header="Copy" Command="{s:Action Copy}" >
+            <MenuItem Header="Copy" Command="{s:Action Copy}">
                 <MenuItem.Icon>
                     <materialDesign:PackIcon Kind="ContentCopy" />
                 </MenuItem.Icon>
             </MenuItem>
-            <MenuItem Header="Paste" Command="{s:Action Paste}" >
+            <MenuItem Header="Paste" Command="{s:Action Paste}">
                 <MenuItem.Icon>
                     <materialDesign:PackIcon Kind="ContentPaste" />
                 </MenuItem.Icon>
@@ -77,12 +77,17 @@
     </UserControl.ContextMenu>
     <Grid>
         <Grid.ColumnDefinitions>
-            <ColumnDefinition Width="Auto" />
             <ColumnDefinition Width="Auto" />
             <ColumnDefinition Width="*" />
             <ColumnDefinition Width="Auto" />
+            <ColumnDefinition Width="Auto" />
         </Grid.ColumnDefinitions>
-        <shared:ProfileConfigurationIcon Grid.Column="0" VerticalAlignment="Center" ConfigurationIcon="{Binding ProfileConfiguration.Icon}" Width="20" Height="20">
+        <shared:ProfileConfigurationIcon Grid.Column="0"
+                                         x:Name="ProfileIcon"
+                                         VerticalAlignment="Center"
+                                         ConfigurationIcon="{Binding ProfileConfiguration.Icon}"
+                                         Width="20"
+                                         Height="20">
             <shared:ProfileConfigurationIcon.Style>
                 <Style>
                     <Style.Triggers>
@@ -107,15 +112,22 @@
             </shared:ProfileConfigurationIcon.Style>
         </shared:ProfileConfigurationIcon>
 
-        <TextBlock Grid.Column="1" FontSize="12" Margin="10 0 0 0" VerticalAlignment="Center" Text="{Binding ProfileConfiguration.Name}">
+        <TextBlock Grid.Column="1"
+                   x:Name="ProfileName"
+                   FontSize="12"
+                   Margin="10 0 0 0"
+                   VerticalAlignment="Center"
+                   HorizontalAlignment="Left"
+                   Text="{Binding ProfileConfiguration.Name}"
+                   TextTrimming="CharacterEllipsis">
             <TextBlock.Style>
-                <Style>
+                <Style TargetType="TextBlock">
                     <Style.Triggers>
                         <DataTrigger Binding="{Binding IsProfileActive}" Value="False">
                             <DataTrigger.EnterActions>
                                 <BeginStoryboard>
                                     <Storyboard>
-                                        <DoubleAnimation Storyboard.TargetProperty="Opacity" To="0.33" Duration="0:0:0.25" />
+                                        <DoubleAnimation Storyboard.TargetProperty="Opacity" To="0.33" />
                                     </Storyboard>
                                 </BeginStoryboard>
                             </DataTrigger.EnterActions>
@@ -132,7 +144,21 @@
             </TextBlock.Style>
         </TextBlock>
 
-        <Border Grid.Column="0" Grid.ColumnSpan="2" BorderThickness="1" BorderBrush="{DynamicResource MaterialDesignBody}" Height="1" Opacity="0">
+        <Border Grid.Column="0"
+                Grid.ColumnSpan="2"
+                BorderThickness="1"
+                BorderBrush="{DynamicResource MaterialDesignBody}"
+                Height="1"
+                Opacity="0"
+                HorizontalAlignment="Left">
+            <!-- Ensure the line covers the profile and the text but not the full two columns -->
+            <Border.Width>
+                <MultiBinding Converter="{StaticResource ValuesAddition}">
+                    <Binding Path="ActualWidth" ElementName="ProfileIcon" />
+                    <Binding Path="ActualWidth" ElementName="ProfileName" />
+                    <Binding Path="Margin.Left" ElementName="ProfileName" />
+                </MultiBinding>
+            </Border.Width>
             <Border.Style>
                 <Style>
                     <Style.Triggers>
@@ -160,7 +186,7 @@
         <Button Grid.Column="2" ToolTip="View properties" Width="20" Height="20" Command="{s:Action ViewProperties}" HorizontalAlignment="Right">
             <Button.Style>
                 <Style TargetType="{x:Type Button}" BasedOn="{StaticResource MaterialDesignIconForegroundButton}">
-                    <Setter Property="Visibility" Value="Hidden" />
+                    <Setter Property="Visibility" Value="Collapsed" />
                     <Style.Triggers>
                         <DataTrigger Binding="{Binding IsMouseOver, RelativeSource={RelativeSource AncestorType={x:Type ListBoxItem}, Mode=FindAncestor}}" Value="True">
                             <Setter Property="Visibility" Value="Visible" />
@@ -173,7 +199,7 @@
         <ToggleButton Grid.Column="3" ToolTip="Suspend profile" Width="18" Height="18" Margin="2 0 0 0" IsChecked="{Binding IsSuspended}">
             <ToggleButton.Style>
                 <Style TargetType="{x:Type ToggleButton}" BasedOn="{StaticResource MaterialDesignFlatToggleButton}">
-                    <Setter Property="Visibility" Value="Hidden" />
+                    <Setter Property="Visibility" Value="Collapsed" />
                     <Style.Triggers>
                         <DataTrigger Binding="{Binding IsMouseOver, RelativeSource={RelativeSource AncestorType={x:Type ListBoxItem}, Mode=FindAncestor}}" Value="True">
                             <Setter Property="Visibility" Value="Visible" />
@@ -183,6 +209,5 @@
             </ToggleButton.Style>
             <materialDesign:PackIcon Kind="Pause" Height="14" Width="14" />
         </ToggleButton>
-
     </Grid>
 </UserControl>

src/Artemis.UI/Screens/Sidebar/SidebarView.xaml

@@ -119,7 +119,7 @@
 
             <!-- Bottom buttons -->
             <Separator Grid.Row="4" Margin="8" />
-            <StackPanel Grid.Row="5" Orientation="Horizontal" HorizontalAlignment="Center" Margin="5 0 5 5">
+            <WrapPanel Grid.Row="5" Orientation="Horizontal" HorizontalAlignment="Left" Margin="5 0 5 5">
                 <Button Style="{StaticResource MaterialDesignIconForegroundButton}"
                         Width="44"
                         Height="44"
@@ -160,7 +160,7 @@
                         CommandParameter="https://wiki.artemis-rgb.com/en/donating">
                     <materialDesign:PackIcon Kind="Gift" Width="20" Height="20" />
                 </Button>
-            </StackPanel>
+            </WrapPanel>
         </Grid>
     </materialDesign:DialogHost>
 </UserControl>

src/Artemis.UI/Screens/TrayViewModel.cs

@@ -1,4 +1,5 @@
 using System;
+using System.Threading.Tasks;
 using System.Windows;
 using System.Windows.Controls;
 using System.Windows.Media;
@@ -129,8 +130,10 @@ namespace Artemis.UI.Screens
             _eventAggregator.Publish(new RequestSelectSidebarItemEvent(sidebarItem));
         }
 
-        public void TrayExit()
+        public async Task TrayExit()
         {
+            // Don't freeze the UI right after clicking
+            await Task.Delay(200);
             Core.Utilities.Shutdown();
         }