Scripting - Core implementation (#629)

Scripting - Added plugin classes Layers - Fix certain blend modes not working as intended UI - Add customizable header per page Profile editor - Hide the regular header Profile editor - Added a new toolbar
2026-11-12 03:48:56 +00:00 · 2021-06-19 09:48:16 +02:00
1 parent d749ab5bbd
commit 048864fe78
@@ -0,0 +1,35 @@
+<UserControl x:Class="Artemis.UI.Screens.Header.SimpleHeaderView"
+             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
+             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
+             xmlns:local="clr-namespace:Artemis.UI.Screens.Header"
+             xmlns:s="https://github.com/canton7/Stylet"
+             xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
+             mc:Ignorable="d" 
+             d:DesignHeight="450" d:DesignWidth="800"
+             d:DataContext="{d:DesignInstance local:SimpleHeaderViewModel}">
+    <Grid>
+        <Grid.ColumnDefinitions>
+            <ColumnDefinition Width="*" />
+            <ColumnDefinition Width="Auto" />
+        </Grid.ColumnDefinitions>
+        <TextBlock Grid.Column="0"
+                   Text="{Binding 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 -->
+            <Button Style="{StaticResource MaterialDesignIconForegroundButton}"
+                    VerticalAlignment="Center"
+                    ToolTip="Open debugger"
+                    Command="{s:Action ShowDebugger}"
+                    materialDesign:RippleAssist.RippleOnTop="True">
+                <materialDesign:PackIcon Kind="Matrix" />
+            </Button>
+        </StackPanel>
+    </Grid>
+</UserControl>
@@ -0,0 +1,69 @@
+using System.Timers;
+using Artemis.Core.Services;
+using Artemis.UI.Services;
+using Stylet;
+
+namespace Artemis.UI.Screens.Header
+{
+    public class SimpleHeaderViewModel : Screen
+    {
+        private readonly ICoreService _coreService;
+        private readonly IDebugService _debugService;
+        private string _frameTime;
+        private Timer _frameTimeUpdateTimer;
+
+        public SimpleHeaderViewModel(string displayName, ICoreService coreService, IDebugService debugService)
+        {
+            DisplayName = displayName;
+
+            _coreService = coreService;
+            _debugService = debugService;
+        }
+        
+        public string FrameTime
+        {
+            get => _frameTime;
+            set => SetAndNotify(ref _frameTime, value);
+        }
+
+        public void ShowDebugger()
+        {
+            _debugService.ShowDebugger();
+        }
+
+        private void UpdateFrameTime()
+        {
+            FrameTime = $"Frame time: {_coreService.FrameTime.TotalMilliseconds:F2} ms";
+        }
+
+        private void OnFrameTimeUpdateTimerOnElapsed(object sender, ElapsedEventArgs args)
+        {
+            UpdateFrameTime();
+        }
+
+        #region Overrides of Screen
+
+        /// <inheritdoc />
+        protected override void OnInitialActivate()
+        {
+            _frameTimeUpdateTimer = new Timer(500);
+            _frameTimeUpdateTimer.Elapsed += OnFrameTimeUpdateTimerOnElapsed;
+            _frameTimeUpdateTimer.Start();
+
+            UpdateFrameTime();
+            base.OnInitialActivate();
+        }
+
+        /// <inheritdoc />
+        protected override void OnClose()
+        {
+            _frameTimeUpdateTimer.Elapsed -= OnFrameTimeUpdateTimerOnElapsed;
+            _frameTimeUpdateTimer?.Dispose();
+            _frameTimeUpdateTimer = null;
+
+            base.OnClose();
+        }
+
+        #endregion
+    }
+}
@@ -1,12 +1,13 @@
-using Stylet;
+using Artemis.UI.Ninject.Factories;

 namespace Artemis.UI.Screens.Home
 {
-    public class HomeViewModel : Screen, IMainScreenViewModel
+    public class HomeViewModel : MainScreenViewModel
    {
-        public HomeViewModel()
+        public HomeViewModel(IHeaderVmFactory headerVmFactory)
        {
            DisplayName = "Home";
+            HeaderViewModel = headerVmFactory.SimpleHeaderViewModel(DisplayName);
        }

        public void OpenUrl(string url)
@@ -1,6 +1,19 @@
-namespace Artemis.UI.Screens
+using Stylet;
+
+namespace Artemis.UI.Screens
 {
-    public interface IMainScreenViewModel
+    public abstract class MainScreenViewModel : Screen
    {
+        private Screen _headerViewModel;
+
+        public Screen HeaderViewModel
+        {
+            get => _headerViewModel;
+            set
+            {
+                if (!SetAndNotify(ref _headerViewModel, value)) return;
+                _headerViewModel.ConductWith(this);
+            }
+        }
    }
 }
@@ -7,8 +7,7 @@
             xmlns:s="https://github.com/canton7/Stylet"
             xmlns:profileEditor="clr-namespace:Artemis.UI.Screens.ProfileEditor"
             xmlns:behaviors="clr-namespace:Artemis.UI.Behaviors"
-             xmlns:dataTemplateSelectors="clr-namespace:Artemis.UI.DataTemplateSelectors"
-             xmlns:profile="clr-namespace:Artemis.Core;assembly=Artemis.Core"
+             xmlns:shared="clr-namespace:Artemis.UI.Shared;assembly=Artemis.UI.Shared"
             mc:Ignorable="d"
             behaviors:InputBindingBehavior.PropagateInputBindingsToWindow="True"
             d:DesignHeight="450" d:DesignWidth="800"
@@ -29,70 +28,202 @@
        <KeyBinding Command="{s:Action Redo}" Modifiers="Control" Key="Y" />
    </UserControl.InputBindings>

-    <Grid Margin="10">
+    <Grid ClipToBounds="True">
        <Grid.ColumnDefinitions>
-            <!-- Left side -->
-            <ColumnDefinition Width="*" MinWidth="100" />
-            <!-- Side panels resize -->
            <ColumnDefinition Width="Auto" />
-            <!-- Side panels -->
-            <ColumnDefinition Width="{Binding SidePanelsWidth.Value, Mode=TwoWay}" MinWidth="100" />
+            <ColumnDefinition Width="*" />
+            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>
+        <Grid.RowDefinitions>
+            <RowDefinition Height="Auto" />
+            <RowDefinition Height="*" />
+        </Grid.RowDefinitions>
+
+        <shared:ProfileConfigurationIcon Grid.Row="0"
+                                         Grid.Column="0"
+                                         Width="25"
+                                         Height="25"
+                                         Margin="25 -5 25 0"
+                                         ToolTip="{Binding ProfileConfiguration.Name}"
+                                         ConfigurationIcon="{Binding ProfileConfiguration.Icon}" />
+
+        <Menu Grid.Row="0" Grid.Column="1" IsMainMenu="True" Margin="0 -4 0 0">
+            <MenuItem Header="_File">
+                <MenuItem Header="New" Icon="{materialDesign:PackIcon Kind=Plus}">
+                    <MenuItem Header="Folder"
+                              Icon="{materialDesign:PackIcon Kind=Folder}" 
+                              Command="{s:Action AddFolder}" 
+                              s:View.ActionTarget="{Binding ProfileTreeViewModel}" />
+                    <MenuItem Header="Layer" 
+                              Icon="{materialDesign:PackIcon Kind=Layers}" 
+                              Command="{s:Action AddLayer}" 
+                              s:View.ActionTarget="{Binding ProfileTreeViewModel}" />
+                </MenuItem>
+                <Separator />
+                <MenuItem Header="View properties"
+                          Icon="{materialDesign:PackIcon Kind=Settings}"
+                          Command="{s:Action ViewProperties}"/>
+                <MenuItem Header="Suspend profile"
+                          IsCheckable="True"
+                          IsChecked="{Binding ProfileConfiguration.IsSuspended}" />
+                <Separator />
+                <MenuItem Header="Export profile"
+                          Icon="{materialDesign:PackIcon Kind=Export}" 
+                          Command="{s:Action ExportProfile}" />
+                <MenuItem Header="Duplicate profile"
+                          Icon="{materialDesign:PackIcon Kind=ContentDuplicate}" 
+                          Command="{s:Action DuplicateProfile}" />
+                <Separator />
+                <MenuItem Header="Delete profile" 
+                          Icon="{materialDesign:PackIcon Kind=Trash}" 
+                          Command="{s:Action DeleteProfile}" />
+            </MenuItem>
+            <MenuItem Header="_Edit" SubmenuOpened="{s:Action EditMenuOpened}">
+                <MenuItem Header="_Duplicate" 
+                          Icon="{materialDesign:PackIcon Kind=ContentDuplicate}"
+                          Command="{s:Action Duplicate}" 
+                          InputGestureText="Ctrl+D"
+                          IsEnabled="{Binding HasSelectedElement}"/>
+                <MenuItem Header="_Copy" 
+                          Icon="{materialDesign:PackIcon Kind=ContentCopy}" 
+                          Command="{s:Action Copy}"
+                          InputGestureText="Ctrl+C" 
+                          IsEnabled="{Binding HasSelectedElement}"/>
+                <MenuItem Header="_Paste"
+                          Icon="{materialDesign:PackIcon Kind=ContentPaste}" 
+                          Command="{s:Action Paste}" 
+                          InputGestureText="Ctrl+V" />
+            </MenuItem>
+            <MenuItem Header="_Scripting" IsEnabled="False">
+                <MenuItem Header="_Profile scripts"
+                          Icon="{materialDesign:PackIcon Kind=BookEdit}" />
+                <MenuItem Header="_Layer scripts" 
+                          Icon="{materialDesign:PackIcon Kind=Layers}"
+                          IsEnabled="{Binding HasSelectedElement}"/>
+                <MenuItem Header="_Property scripts" 
+                          Icon="{materialDesign:PackIcon Kind=FormTextbox}"
+                          IsEnabled="{Binding HasSelectedElement}"/>
+            </MenuItem>
+            <MenuItem Header="_Help">
+                <MenuItem Header="Artemis wiki"
+                          Icon="{materialDesign:PackIcon Kind=BookEdit}"
+                          Command="{s:Action OpenUrl}"
+                          CommandParameter="https://wiki.artemis-rgb.com/" />
+                <Separator />
+                <MenuItem Header="Editor"
+                          Icon="{materialDesign:PackIcon Kind=Edit}"
+                          Command="{s:Action OpenUrl}"
+                          CommandParameter="https://wiki.artemis-rgb.com/en/guides/user/profiles" />
+                <MenuItem Header="Layers"
+                          Icon="{materialDesign:PackIcon Kind=Layers}"
+                          Command="{s:Action OpenUrl}"
+                          CommandParameter="https://wiki.artemis-rgb.com/guides/user/profiles/layers" />
+                <MenuItem Header="Display conditions"
+                          Icon="{materialDesign:PackIcon Kind=NotEqual}"
+                          Command="{s:Action OpenUrl}"
+                          CommandParameter="https://wiki.artemis-rgb.com/guides/user/profiles/conditions" />
+                <MenuItem Header="Timeline"
+                          Icon="{materialDesign:PackIcon Kind=Stopwatch}"
+                          Command="{s:Action OpenUrl}"
+                          CommandParameter="https://wiki.artemis-rgb.com/guides/user/profiles/timeline" />
+                <MenuItem Header="Data bindings"
+                          Icon="{materialDesign:PackIcon Kind=VectorLink}"
+                          Command="{s:Action OpenUrl}"
+                          CommandParameter="https://wiki.artemis-rgb.com/guides/user/profiles/data-bindings" />
+                <MenuItem Header="Scripting"
+                          Icon="{materialDesign:PackIcon Kind=CodeJson}"
+                          Command="{s:Action OpenUrl}"
+                          CommandParameter="https://wiki.artemis-rgb.com/guides/user/profiles/scripting" />
+                <Separator />
+                <MenuItem Header="Report a bug"
+                          Icon="{materialDesign:PackIcon Kind=Github}"
+                          Command="{s:Action OpenUrl}"
+                          CommandParameter="https://github.com/Artemis-RGB/Artemis/issues" />
+                <MenuItem Header="Get help on Discord"
+                          Icon="{materialDesign:PackIcon Kind=Discord}"
+                          Command="{s:Action OpenUrl}"
+                          CommandParameter="https://discord.gg/S3MVaC9" />
+            </MenuItem>
+        </Menu>
+
+        <Button Grid.Row="0"
+                Grid.Column="2"
+                Style="{StaticResource MaterialDesignIconForegroundButton}"
+                ToolTip="Open debugger"
+                Margin="10 -4 10 0"
+                Width="34"
+                Height="34"
+                Command="{s:Action OpenDebugger}">
+            <materialDesign:PackIcon Kind="Matrix" Width="20" Height="20" />
+        </Button>
+
+        <Grid Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="3" Margin="10 -5 10 10">
+            <Grid.ColumnDefinitions>
+                <!-- Left side -->
+                <ColumnDefinition Width="*" MinWidth="100" />
+                <!-- Side panels resize -->
+                <ColumnDefinition Width="Auto" />
+                <!-- Side panels -->
+                <ColumnDefinition Width="{Binding SidePanelsWidth.Value, Mode=TwoWay}" MinWidth="100" />
+            </Grid.ColumnDefinitions>
+
+            <!-- Left side -->
+            <Grid Grid.Row="0" Grid.Column="0">
+                <Grid.RowDefinitions>
+                    <!-- Design area -->
+                    <RowDefinition Height="*" MinHeight="200" />
+                    <!-- Bottom panels resize -->
+                    <RowDefinition Height="Auto" />
+                    <!-- Bottom panels -->
+                    <RowDefinition Height="{Binding BottomPanelsHeight.Value, Mode=TwoWay}" MinHeight="108" />
+                </Grid.RowDefinitions>

-        <!-- Left side -->
-        <Grid Grid.Row="0" Grid.Column="0">
-            <Grid.RowDefinitions>
                <!-- Design area -->
-                <RowDefinition Height="*" MinHeight="200" />
+                <materialDesign:Card Grid.Row="0" materialDesign:ShadowAssist.ShadowDepth="Depth1" VerticalAlignment="Stretch">
+                    <ContentControl s:View.Model="{Binding ProfileViewModel, IsAsync=True}" />
+                </materialDesign:Card>
+
                <!-- Bottom panels resize -->
-                <RowDefinition Height="Auto" />
+                <GridSplitter Grid.Row="1" Grid.Column="0" Height="5" HorizontalAlignment="Stretch" Cursor="SizeNS" Margin="0 5" />
+
                <!-- Bottom panels -->
-                <RowDefinition Height="{Binding BottomPanelsHeight.Value, Mode=TwoWay}" MinHeight="108" />
-            </Grid.RowDefinitions>
-            
-            <!-- Design area -->
-            <materialDesign:Card Grid.Row="0" materialDesign:ShadowAssist.ShadowDepth="Depth1" VerticalAlignment="Stretch">
-                <ContentControl s:View.Model="{Binding ProfileViewModel, IsAsync=True}" />
-            </materialDesign:Card>
+                <Grid Grid.Row="2">
+                    <!-- Layer elements -->
+                    <materialDesign:Card Grid.Column="0" materialDesign:ShadowAssist.ShadowDepth="Depth1" VerticalAlignment="Stretch">
+                        <ContentControl s:View.Model="{Binding LayerPropertiesViewModel, IsAsync=True}" />
+                    </materialDesign:Card>
+                </Grid>
+            </Grid>

-            <!-- Bottom panels resize -->
-            <GridSplitter Grid.Row="1" Grid.Column="0" Height="5" HorizontalAlignment="Stretch" Cursor="SizeNS" Margin="0 5" />
+            <!-- Side panels resize -->
+            <GridSplitter Grid.Row="0" Grid.Column="1" Width="5" HorizontalAlignment="Stretch" Cursor="SizeWE" Margin="5 0" />

-            <!-- Bottom panels -->
-            <Grid Grid.Row="2">
-                <!-- Layer elements -->
-                <materialDesign:Card Grid.Column="0" materialDesign:ShadowAssist.ShadowDepth="Depth1" VerticalAlignment="Stretch">
-                    <ContentControl s:View.Model="{Binding LayerPropertiesViewModel, IsAsync=True}" />
+            <!-- Side panels -->
+            <Grid Grid.Row="0" Grid.Column="2">
+                <Grid.RowDefinitions>
+                    <!-- Profile elements -->
+                    <RowDefinition Height="*" MinHeight="100" />
+                    <!-- Conditions resize -->
+                    <RowDefinition Height="Auto" />
+                    <!-- Display conditions -->
+                    <RowDefinition Height="{Binding DataModelConditionsHeight.Value, Mode=TwoWay}" MinHeight="100" />
+                </Grid.RowDefinitions>
+
+                <!-- Profile elements -->
+                <materialDesign:Card Grid.Row="0" materialDesign:ShadowAssist.ShadowDepth="Depth1" VerticalAlignment="Stretch">
+                    <ContentControl s:View.Model="{Binding ProfileTreeViewModel, IsAsync=True}" Margin="0,-1,-0.2,1" />
+                </materialDesign:Card>
+
+                <!-- Conditions resize -->
+                <GridSplitter Grid.Row="1" Height="5" HorizontalAlignment="Stretch" Cursor="SizeNS" Margin="0 5" />
+
+                <!-- Display conditions -->
+                <materialDesign:Card Grid.Row="2" materialDesign:ShadowAssist.ShadowDepth="Depth1" VerticalAlignment="Stretch">
+                    <ContentControl s:View.Model="{Binding DisplayConditionsViewModel, IsAsync=True}" />
                </materialDesign:Card>
            </Grid>
        </Grid>
-
-        <!-- Side panels resize -->
-        <GridSplitter Grid.Row="0" Grid.Column="1" Width="5" HorizontalAlignment="Stretch" Cursor="SizeWE" Margin="5 0" />
-
-        <!-- Side panels -->
-        <Grid Grid.Row="0" Grid.Column="2">
-            <Grid.RowDefinitions>
-               <!-- Profile elements -->
-                <RowDefinition Height="*" MinHeight="100" />
-                <!-- Conditions resize -->
-                <RowDefinition Height="Auto" />
-                <!-- Display conditions -->
-                <RowDefinition Height="{Binding DataModelConditionsHeight.Value, Mode=TwoWay}" MinHeight="100" />
-            </Grid.RowDefinitions>
-            
-            <!-- Profile elements -->
-            <materialDesign:Card Grid.Row="0" materialDesign:ShadowAssist.ShadowDepth="Depth1" VerticalAlignment="Stretch">
-                <ContentControl s:View.Model="{Binding ProfileTreeViewModel, IsAsync=True}" Margin="0,-1,-0.2,1" />
-            </materialDesign:Card>
-
-            <!-- Conditions resize -->
-            <GridSplitter Grid.Row="1" Height="5" HorizontalAlignment="Stretch" Cursor="SizeNS" Margin="0 5" />
-
-            <!-- Display conditions -->
-            <materialDesign:Card Grid.Row="2" materialDesign:ShadowAssist.ShadowDepth="Depth1" VerticalAlignment="Stretch">
-                <ContentControl s:View.Model="{Binding DisplayConditionsViewModel, IsAsync=True}" />
-            </materialDesign:Card>
-        </Grid>
    </Grid>
+
+
 </UserControl>
@@ -5,18 +5,25 @@ using System.Windows;
 using System.Windows.Input;
 using Artemis.Core;
 using Artemis.Core.Services;
+using Artemis.UI.Events;
+using Artemis.UI.Ninject.Factories;
 using Artemis.UI.Screens.ProfileEditor.DisplayConditions;
 using Artemis.UI.Screens.ProfileEditor.LayerProperties;
 using Artemis.UI.Screens.ProfileEditor.ProfileTree;
 using Artemis.UI.Screens.ProfileEditor.Visualization;
+using Artemis.UI.Screens.Sidebar.Dialogs;
+using Artemis.UI.Shared;
 using Artemis.UI.Shared.Services;
 using Stylet;
+using ProfileConfigurationEventArgs = Artemis.UI.Shared.ProfileConfigurationEventArgs;

 namespace Artemis.UI.Screens.ProfileEditor
 {
-    public class ProfileEditorViewModel : Screen, IMainScreenViewModel
+    public class ProfileEditorViewModel : MainScreenViewModel
    {
        private readonly IMessageService _messageService;
+        private readonly ISidebarVmFactory _sidebarVmFactory;
+        private readonly IEventAggregator _eventAggregator;
        private readonly IProfileEditorService _profileEditorService;
        private readonly IProfileService _profileService;
        private readonly ISettingsService _settingsService;
@@ -37,12 +44,14 @@ namespace Artemis.UI.Screens.ProfileEditor
            IProfileService profileService,
            IDialogService dialogService,
            ISettingsService settingsService,
-            IMessageService messageService)
+            IMessageService messageService, 
+            ISidebarVmFactory sidebarVmFactory)
        {
            _profileEditorService = profileEditorService;
            _profileService = profileService;
            _settingsService = settingsService;
            _messageService = messageService;
+            _sidebarVmFactory = sidebarVmFactory;

            DisplayName = "Profile Editor";
            DialogService = dialogService;
@@ -60,6 +69,8 @@ namespace Artemis.UI.Screens.ProfileEditor

        public IDialogService DialogService { get; }

+        public ProfileConfiguration ProfileConfiguration => _profileEditorService.SelectedProfileConfiguration;
+
        public DisplayConditionsViewModel DisplayConditionsViewModel
        {
            get => _displayConditionsViewModel;
@@ -176,20 +187,96 @@ namespace Artemis.UI.Screens.ProfileEditor
            _messageService.ShowMessage("Redid profile update", "UNDO", Undo);
        }

+        #region Menu
+
+        public bool HasSelectedElement => _profileEditorService.SelectedProfileElement != null;
+        public bool CanPaste => _profileEditorService.GetCanPasteProfileElement();
+
+        public async Task ViewProperties()
+        {
+            await _sidebarVmFactory.SidebarProfileConfigurationViewModel(_profileEditorService.SelectedProfileConfiguration).ViewProperties();
+        }
+
+        public void DuplicateProfile()
+        {
+            ProfileConfigurationExportModel export = _profileService.ExportProfile(ProfileConfiguration);
+            _profileService.ImportProfile(ProfileConfiguration.Category, export, true, false, "copy");
+        }
+
+        public async Task DeleteProfile()
+        {
+            await _sidebarVmFactory.SidebarProfileConfigurationViewModel(_profileEditorService.SelectedProfileConfiguration).Delete();
+        }
+
+        public async Task ExportProfile()
+        {
+            await _sidebarVmFactory.SidebarProfileConfigurationViewModel(_profileEditorService.SelectedProfileConfiguration).Export();
+        }
+
+        public void Copy()
+        {
+            if (_profileEditorService.SelectedProfileElement != null)
+                _profileEditorService.CopyProfileElement(_profileEditorService.SelectedProfileElement);
+        }
+
+        public void Duplicate()
+        {
+            if (_profileEditorService.SelectedProfileElement != null)
+                _profileEditorService.DuplicateProfileElement(_profileEditorService.SelectedProfileElement);
+        }
+
+        public void Paste()
+        {
+            if (_profileEditorService.SelectedProfileElement != null && _profileEditorService.SelectedProfileElement.Parent is Folder parent)
+                _profileEditorService.PasteProfileElement(parent, _profileEditorService.SelectedProfileElement.Order - 1);
+            else
+            {
+                Folder rootFolder = _profileEditorService.SelectedProfile?.GetRootFolder();
+                if (rootFolder != null)
+                    _profileEditorService.PasteProfileElement(rootFolder, rootFolder.Children.Count);
+            }
+        }
+
+        public void OpenUrl(string url)
+        {
+            Core.Utilities.OpenUrl(url);
+        }
+
+        public void EditMenuOpened()
+        {
+            NotifyOfPropertyChange(nameof(CanPaste));
+        }
+
+        #endregion
+
+
        protected override void OnInitialActivate()
        {
+            _profileEditorService.SelectedProfileChanged += ProfileEditorServiceOnSelectedProfileChanged;
+            _profileEditorService.SelectedProfileElementChanged += ProfileEditorServiceOnSelectedProfileElementChanged;
            LoadWorkspaceSettings();
            base.OnInitialActivate();
        }

        protected override void OnClose()
        {
+            _profileEditorService.SelectedProfileChanged -= ProfileEditorServiceOnSelectedProfileChanged;
+            _profileEditorService.SelectedProfileElementChanged -= ProfileEditorServiceOnSelectedProfileElementChanged;
            SaveWorkspaceSettings();
            _profileEditorService.ChangeSelectedProfileConfiguration(null);

            base.OnClose();
        }

+        private void ProfileEditorServiceOnSelectedProfileChanged(object sender, ProfileConfigurationEventArgs e)
+        {
+            NotifyOfPropertyChange(nameof(ProfileConfiguration));
+        }
+
+        private void ProfileEditorServiceOnSelectedProfileElementChanged(object sender, RenderProfileElementEventArgs e)
+        {
+            NotifyOfPropertyChange(nameof(HasSelectedElement));
+        }
        private void LoadWorkspaceSettings()
        {
            SidePanelsWidth = _settingsService.GetSetting("ProfileEditor.SidePanelsWidth", new GridLength(385));
@@ -100,7 +100,7 @@
                </ItemsControl>
            </Grid>

-            <Grid Name="EditorDisplayGrid" 
+            <Grid Name="EditorDisplayGrid"
                  shared:SizeObserver.Observe="True"
                  shared:SizeObserver.ObservedHeight="{Binding PanZoomViewModel.CanvasHeight}"
                  shared:SizeObserver.ObservedWidth="{Binding PanZoomViewModel.CanvasWidth}">
@@ -133,13 +133,13 @@
            <StackPanel ZIndex="1" VerticalAlignment="Bottom" HorizontalAlignment="Left" Margin="10" Cursor="Arrow">
                <materialDesign:Card Padding="8">
                    <StackPanel Orientation="Horizontal">
-                        <CheckBox Style="{StaticResource MaterialDesignCheckBox}" 
+                        <CheckBox Style="{StaticResource MaterialDesignCheckBox}"
                                  IsChecked="{Binding FocusSelectedLayer.Value}"
                                  ToolTip="If selected, dims all LEDs that are not part of the selected layer">
                            Focus selected layer
                        </CheckBox>
-                        <CheckBox Style="{StaticResource MaterialDesignCheckBox}" 
-                                  Margin="10 0 0 0" 
+                        <CheckBox Style="{StaticResource MaterialDesignCheckBox}"
+                                  Margin="10 0 0 0"
                                  IsChecked="{Binding AlwaysApplyDataBindings.Value}"
                                  ToolTip="If selected, updates all data bindings instead of only the one you are editing">
                            Apply all data bindings in editor
@@ -150,14 +150,13 @@

            <StackPanel Orientation="Vertical" VerticalAlignment="Bottom" HorizontalAlignment="Right"
                        Margin="10" ZIndex="1">
-                <Slider Margin="0,0,14,0"
-                        Orientation="Vertical"
+                <Slider Orientation="Vertical"
+                        HorizontalAlignment="Center"
+                        Margin="0 10"
+                        Height="120"
                        Minimum="10"
                        Maximum="250"
-                        Height="100"
-                        FocusVisualStyle="{x:Null}"
-                        Value="{Binding PanZoomViewModel.ZoomPercentage}"
-                        Style="{StaticResource MaterialDesignDiscreteSlider}" />
+                        Value="{Binding PanZoomViewModel.ZoomPercentage}" />
                <Button Command="{s:Action ResetZoomAndPan}"
                        Style="{StaticResource MaterialDesignFloatingActionMiniButton}"
                        HorizontalAlignment="Right"
@@ -1,4 +1,4 @@
-<mde:MaterialWindow x:Class="Artemis.UI.Screens.RootView"
+<mde:MaterialWindow
                    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
@@ -8,6 +8,7 @@
                    xmlns:screens="clr-namespace:Artemis.UI.Screens"
                    xmlns:mde="clr-namespace:MaterialDesignExtensions.Controls;assembly=MaterialDesignExtensions"
                    xmlns:svgc="http://sharpvectors.codeplex.com/svgc/"
+                    xmlns:Shared="clr-namespace:Artemis.UI.Shared;assembly=Artemis.UI.Shared" x:Class="Artemis.UI.Screens.RootView"
                    mc:Ignorable="d"
                    FadeContentIfInactive="False"
                    Icon="/Resources/Images/Logo/bow.ico"
@@ -24,7 +25,10 @@
                    MouseDown="{s:Action WindowMouseDown}"
                    MouseUp="{s:Action WindowMouseUp}"
                    d:DesignHeight="640" d:DesignWidth="1200"
-                    d:DataContext="{d:DesignInstance screens:RootViewModel}">
+                    d:DataContext="{d:DesignInstance {x:Type screens:RootViewModel}}">
+    <mde:MaterialWindow.Resources>
+        <Shared:NullToVisibilityConverter x:Key="NullToVisibilityConverter"/>
+    </mde:MaterialWindow.Resources>
    <materialDesign:DialogHost IsTabStop="False" Focusable="False" Identifier="RootDialog" DialogTheme="Inherit" SnackbarMessageQueue="{Binding MainMessageQueue}">
        <Grid>
            <Grid.ColumnDefinitions>
@@ -42,30 +46,13 @@
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>
-                <materialDesign:ColorZone Grid.Row="0" Mode="PrimaryMid" DockPanel.Dock="Top" DockPanel.ZIndex="1" Height="42">
-                    <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 -->
-                            <Button Style="{StaticResource MaterialDesignIconForegroundButton}"
-                                    VerticalAlignment="Center"
-                                    ToolTip="Open debugger"
-                                    Command="{s:Action ShowDebugger}"
-                                    materialDesign:RippleAssist.RippleOnTop="True">
-                                <materialDesign:PackIcon Kind="Matrix" />
-                            </Button>
-                        </StackPanel>
-                    </Grid>
+                <materialDesign:ColorZone Grid.Row="0" 
+                                          Mode="PrimaryMid" 
+                                          DockPanel.Dock="Top" 
+                                          Panel.ZIndex="1" 
+                                          Height="48" 
+                                          Visibility="{Binding SidebarViewModel.SelectedScreen.HeaderViewModel, Converter={StaticResource NullToVisibilityConverter}}" >
+                    <ContentControl s:View.Model="{Binding SidebarViewModel.SelectedScreen.HeaderViewModel}" VerticalContentAlignment="Stretch" HorizontalContentAlignment="Stretch" IsTabStop="False" />
                </materialDesign:ColorZone>

                <ContentControl Grid.Row="1"
@@ -1,8 +1,6 @@
 using System;
-using System.ComponentModel;
 using System.Reflection;
 using System.Threading.Tasks;
-using System.Timers;
 using System.Windows;
 using System.Windows.Input;
 using Artemis.Core;
@@ -21,19 +19,17 @@ using Constants = Artemis.Core.Constants;

 namespace Artemis.UI.Screens
 {
-    public sealed class RootViewModel : Conductor<Screen>, IDisposable
+    public sealed class RootViewModel : Conductor<Screen>
    {
        private readonly IRegistrationService _builtInRegistrationService;
-        private readonly ICoreService _coreService;
-        private readonly IDebugService _debugService;
+
        private readonly IEventAggregator _eventAggregator;
-        private readonly Timer _frameTimeUpdateTimer;
        private readonly IKernel _kernel;
        private readonly IMessageService _messageService;
        private readonly ISettingsService _settingsService;
        private readonly IWindowManager _windowManager;
        private readonly PluginSetting<WindowSize> _windowSize;
-        private string _frameTime;
+
        private bool _lostFocus;
        private ISnackbarMessageQueue _mainMessageQueue;
        private MaterialWindow _window;
@@ -43,9 +39,7 @@ namespace Artemis.UI.Screens
            IKernel kernel,
            IEventAggregator eventAggregator,
            ISettingsService settingsService,
-            ICoreService coreService,
            IWindowManager windowManager,
-            IDebugService debugService,
            IRegistrationService builtInRegistrationService,
            IMessageService messageService,
            SidebarViewModel sidebarViewModel)
@@ -53,12 +47,9 @@ namespace Artemis.UI.Screens
            _kernel = kernel;
            _eventAggregator = eventAggregator;
            _settingsService = settingsService;
-            _coreService = coreService;
            _windowManager = windowManager;
-            _debugService = debugService;
            _builtInRegistrationService = builtInRegistrationService;
            _messageService = messageService;
-            _frameTimeUpdateTimer = new Timer(500);
            _windowSize = _settingsService.GetSetting<WindowSize>("UI.RootWindowSize");

            SidebarWidth = _settingsService.GetSetting("UI.SidebarWidth", new GridLength(240));
@@ -84,11 +75,6 @@ namespace Artemis.UI.Screens
            set => SetAndNotify(ref _windowTitle, value);
        }

-        public string FrameTime
-        {
-            get => _frameTime;
-            set => SetAndNotify(ref _frameTime, value);
-        }

        public void WindowDeactivated()
        {
@@ -109,11 +95,6 @@ namespace Artemis.UI.Screens
            _eventAggregator.Publish(new MainWindowFocusChangedEvent(true));
        }

-        public void ShowDebugger()
-        {
-            _debugService.ShowDebugger();
-        }
-
        public void WindowKeyDown(object sender, KeyEventArgs e)
        {
            _eventAggregator.Publish(new MainWindowKeyEvent(sender, true, e));
@@ -134,22 +115,6 @@ namespace Artemis.UI.Screens
            _eventAggregator.Publish(new MainWindowMouseEvent(sender, false, e));
        }

-        private void UpdateFrameTime()
-        {
-            FrameTime = $"Frame time: {_coreService.FrameTime.TotalMilliseconds:F2} ms";
-        }
-
-        private void OnFrameTimeUpdateTimerOnElapsed(object sender, ElapsedEventArgs args)
-        {
-            UpdateFrameTime();
-        }
-
-        /// <inheritdoc />
-        public void Dispose()
-        {
-            _frameTimeUpdateTimer?.Dispose();
-        }
-
        private void SidebarViewModelOnSelectedScreenChanged(object? sender, EventArgs e)
        {
            ActiveItem = SidebarViewModel.SelectedScreen;
@@ -181,8 +146,6 @@ namespace Artemis.UI.Screens
        protected override void OnInitialActivate()
        {
            MainMessageQueue = _messageService.MainMessageQueue;
-            UpdateFrameTime();
-
            SidebarViewModel.SelectedScreenChanged += SidebarViewModelOnSelectedScreenChanged;
            ActiveItem = SidebarViewModel.SelectedScreen;

@@ -190,9 +153,6 @@ namespace Artemis.UI.Screens
            _builtInRegistrationService.RegisterBuiltInDataModelInputs();
            _builtInRegistrationService.RegisterBuiltInPropertyEditors();

-            _frameTimeUpdateTimer.Elapsed += OnFrameTimeUpdateTimerOnElapsed;
-            _frameTimeUpdateTimer.Start();
-
            _window = (MaterialWindow) View;

            PluginSetting<bool> setupWizardCompleted = _settingsService.GetSetting("UI.SetupWizardCompleted", false);
@@ -209,7 +169,6 @@ namespace Artemis.UI.Screens
            Keyboard.ClearFocus();

            MainMessageQueue = null;
-            _frameTimeUpdateTimer.Stop();

            SidebarViewModel.SelectedScreenChanged -= SidebarViewModelOnSelectedScreenChanged;
            SidebarWidth.Save();
@@ -217,8 +176,6 @@ namespace Artemis.UI.Screens
            _windowSize.Value.ApplyFromWindow(_window);
            _windowSize.Save();

-            _frameTimeUpdateTimer.Elapsed -= OnFrameTimeUpdateTimerOnElapsed;
-
            // Lets force the GC to run after closing the window so it is obvious to users watching task manager
            // that closing the UI will decrease the memory footprint of the application.
            Task.Run(async () =>
@@ -0,0 +1,24 @@
+using Artemis.Core;
+using Stylet;
+
+namespace Artemis.UI.Screens.Scripting
+{
+    public class ScriptsDialogViewModel : Conductor<ScriptConfigurationViewModel>.Collection.OneActive
+    {
+        public ScriptsDialogViewModel(Profile profile)
+        {
+        }
+
+        public ScriptsDialogViewModel(Layer layer)
+        {
+        }
+
+        public ScriptsDialogViewModel(ILayerProperty layerProperty)
+        {
+        }
+    }
+
+    public class ScriptConfigurationViewModel : Screen
+    {
+    }
+}
@@ -0,0 +1,33 @@
+<UserControl x:Class="Artemis.UI.Screens.Settings.SettingsTabsView"
+             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
+             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
+             xmlns:local="clr-namespace:Artemis.UI.Screens.Settings"
+             xmlns:s="https://github.com/canton7/Stylet"
+             mc:Ignorable="d" 
+             d:DesignHeight="450" d:DesignWidth="800"
+             d:DataContext="{d:DesignInstance local:SettingsTabsViewModel}">
+    <UserControl.Resources>
+        <ResourceDictionary>
+            <ResourceDictionary.MergedDictionaries>
+                <ResourceDictionary
+                    Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.TextBlock.xaml" />
+            </ResourceDictionary.MergedDictionaries>
+        </ResourceDictionary>
+    </UserControl.Resources>
+    <TabControl Style="{StaticResource MaterialDesignAppBarTabControl}"
+                ItemsSource="{Binding Items}"
+                SelectedItem="{Binding ActiveItem}"
+                DisplayMemberPath="DisplayName">
+        <TabControl.ContentTemplate>
+            <DataTemplate>
+                <ContentControl s:View.Model="{Binding IsAsync=True}"
+                                VerticalContentAlignment="Stretch"
+                                HorizontalContentAlignment="Stretch"
+                                IsTabStop="False"
+                                TextElement.Foreground="{DynamicResource MaterialDesignBody}" />
+            </DataTemplate>
+        </TabControl.ContentTemplate>
+    </TabControl>
+</UserControl>
@@ -0,0 +1,27 @@
+using Artemis.UI.Screens.Settings.Tabs.About;
+using Artemis.UI.Screens.Settings.Tabs.Devices;
+using Artemis.UI.Screens.Settings.Tabs.General;
+using Artemis.UI.Screens.Settings.Tabs.Plugins;
+using Stylet;
+
+namespace Artemis.UI.Screens.Settings
+{
+    public class SettingsTabsViewModel : Conductor<Screen>.Collection.OneActive
+    {
+        public SettingsTabsViewModel(
+            GeneralSettingsTabViewModel generalSettingsTabViewModel,
+            PluginSettingsTabViewModel pluginSettingsTabViewModel,
+            DeviceSettingsTabViewModel deviceSettingsTabViewModel,
+            AboutTabViewModel aboutTabViewModel)
+        {
+            DisplayName = "Settings";
+
+            Items.Add(generalSettingsTabViewModel);
+            Items.Add(pluginSettingsTabViewModel);
+            Items.Add(deviceSettingsTabViewModel);
+            Items.Add(aboutTabViewModel);
+
+            ActiveItem = generalSettingsTabViewModel;
+        }
+    }
+}
@@ -8,26 +8,5 @@
             mc:Ignorable="d"
             d:DataContext="{d:DesignInstance settings:SettingsViewModel}"
             d:DesignHeight="600" d:DesignWidth="600">
-    <UserControl.Resources>
-        <ResourceDictionary>
-            <ResourceDictionary.MergedDictionaries>
-                <ResourceDictionary
-                    Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.TextBlock.xaml" />
-            </ResourceDictionary.MergedDictionaries>
-        </ResourceDictionary>
-    </UserControl.Resources>
-    <TabControl Style="{StaticResource MaterialDesignTabControl}"
-                ItemsSource="{Binding Items}"
-                SelectedItem="{Binding ActiveItem}"
-                DisplayMemberPath="DisplayName">
-        <TabControl.ContentTemplate>
-            <DataTemplate>
-                <ContentControl s:View.Model="{Binding IsAsync=True}"
-                                VerticalContentAlignment="Stretch"
-                                HorizontalContentAlignment="Stretch"
-                                IsTabStop="False"
-                                TextElement.Foreground="{DynamicResource MaterialDesignBody}" />
-            </DataTemplate>
-        </TabControl.ContentTemplate>
-    </TabControl>
+    <ContentControl s:View.Model="{Binding ActiveItem}" VerticalContentAlignment="Stretch" HorizontalContentAlignment="Stretch" IsTabStop="False" />
 </UserControl>
@@ -1,27 +1,17 @@
-using Artemis.UI.Screens.Settings.Tabs.About;
-using Artemis.UI.Screens.Settings.Tabs.Devices;
-using Artemis.UI.Screens.Settings.Tabs.General;
-using Artemis.UI.Screens.Settings.Tabs.Plugins;
-using Stylet;
+using Stylet;

 namespace Artemis.UI.Screens.Settings
 {
-    public class SettingsViewModel : Conductor<Screen>.Collection.OneActive, IMainScreenViewModel
+    public class SettingsViewModel : MainScreenViewModel
    {
-        public SettingsViewModel(
-            GeneralSettingsTabViewModel generalSettingsTabViewModel,
-            PluginSettingsTabViewModel pluginSettingsTabViewModel,
-            DeviceSettingsTabViewModel deviceSettingsTabViewModel,
-            AboutTabViewModel aboutTabViewModel)
+        public SettingsViewModel(SettingsTabsViewModel settingsTabsViewModel)
        {
            DisplayName = "Settings";

-            Items.Add(generalSettingsTabViewModel);
-            Items.Add(pluginSettingsTabViewModel);
-            Items.Add(deviceSettingsTabViewModel);
-            Items.Add(aboutTabViewModel);
-
-            ActiveItem = generalSettingsTabViewModel;
+            settingsTabsViewModel.ConductWith(this);
+            ActiveItem = settingsTabsViewModel;
        }
+
+        public SettingsTabsViewModel ActiveItem { get; }
    }
 }
@@ -70,7 +70,7 @@
            <Separator />
            <MenuItem Header="Delete" Command="{s:Action Delete}" InputGestureText="Del">
                <MenuItem.Icon>
-                    <materialDesign:PackIcon Kind="TrashCan" />
+                    <materialDesign:PackIcon Kind="Trash" />
                </MenuItem.Icon>
            </MenuItem>
        </ContextMenu>
@@ -1,16 +1,15 @@
 using MaterialDesignThemes.Wpf;
 using Ninject;
-using Stylet;

 namespace Artemis.UI.Screens.Sidebar
 {
-    public class SidebarScreenViewModel<T> : SidebarScreenViewModel where T : Screen
+    public class SidebarScreenViewModel<T> : SidebarScreenViewModel where T : MainScreenViewModel
    {
        public SidebarScreenViewModel(PackIconKind icon, string displayName) : base(icon, displayName)
        {
        }

-        public override Screen CreateInstance(IKernel kernel)
+        public override MainScreenViewModel CreateInstance(IKernel kernel)
        {
            return kernel.Get<T>();
        }
@@ -24,8 +23,9 @@ namespace Artemis.UI.Screens.Sidebar
            DisplayName = displayName;
        }

-        public abstract Screen CreateInstance(IKernel kernel);
        public PackIconKind Icon { get; }
        public string DisplayName { get; }
+
+        public abstract MainScreenViewModel CreateInstance(IKernel kernel);
    }
 }
@@ -30,9 +30,9 @@ namespace Artemis.UI.Screens.Sidebar
        private readonly IProfileService _profileService;
        private readonly IProfileEditorService _profileEditorService;
        private readonly IDialogService _dialogService;
-        private SidebarScreenViewModel _selectedSidebarScreen;
        private ArtemisDevice _headerDevice;
-        private Screen _selectedScreen;
+        private SidebarScreenViewModel _selectedSidebarScreen;
+        private MainScreenViewModel _selectedScreen;
        private readonly SidebarScreenViewModel<ProfileEditorViewModel> _profileEditor;
        private readonly DefaultDropHandler _defaultDropHandler;

@@ -80,7 +80,7 @@ namespace Artemis.UI.Screens.Sidebar

        public BindableCollection<SidebarScreenViewModel> SidebarScreens { get; }

-        public Screen SelectedScreen
+        public MainScreenViewModel SelectedScreen
        {
            get => _selectedScreen;
            private set => SetAndNotify(ref _selectedScreen, value);
@@ -21,7 +21,7 @@
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </UserControl.Resources>
-    <Grid Margin="16">
+    <Grid Margin="10">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" MinWidth="100" />
            <ColumnDefinition Width="5" />
@@ -204,12 +204,12 @@
                <StackPanel ZIndex="1" VerticalAlignment="Bottom" HorizontalAlignment="Left" Margin="10" Cursor="Arrow">
                    <materialDesign:Card Padding="8">
                        <StackPanel Orientation="Horizontal">
-                            <CheckBox Style="{StaticResource MaterialDesignCheckBox}" 
+                            <CheckBox Style="{StaticResource MaterialDesignCheckBox}"
                                      IsChecked="{Binding ColorDevices}"
                                      ToolTip="If selected, each device is completely lid up with a random color">
                                Show random device colors
                            </CheckBox>
-                            <CheckBox Style="{StaticResource MaterialDesignCheckBox}" 
+                            <CheckBox Style="{StaticResource MaterialDesignCheckBox}"
                                      IsChecked="{Binding ColorFirstLedOnly}"
                                      IsEnabled="{Binding ColorDevices}"
                                      ToolTip="If selected, only the first LED of each device is lid up, aiding with rotation settings"
@@ -220,7 +220,7 @@
                    </materialDesign:Card>
                </StackPanel>

-                <StackPanel Orientation="Horizontal" VerticalAlignment="Bottom" HorizontalAlignment="Right" Margin="0, 0, 15, 15">
+                <StackPanel Orientation="Horizontal" VerticalAlignment="Bottom" HorizontalAlignment="Right" Margin="0 0 15 15">
                    <Button Command="{s:Action AutoArrange}"
                            Style="{StaticResource MaterialDesignFloatingActionMiniButton}"
                            HorizontalAlignment="Right"
@@ -228,15 +228,14 @@
                            VerticalAlignment="Bottom">
                        <materialDesign:PackIcon Kind="Wand" Height="24" Width="24" />
                    </Button>
-                    <StackPanel Orientation="Vertical">
-                        <Slider Margin="0,0,14,0"
-                                Orientation="Vertical"
+                    <StackPanel Orientation="Vertical" Margin="10 0 0 0">
+                        <Slider Orientation="Vertical"
+                                HorizontalAlignment="Center"
+                                Margin="0 10"
+                                Height="120"
                                Minimum="10"
                                Maximum="400"
-                                Height="100"
-                                FocusVisualStyle="{x:Null}"
-                                Value="{Binding PanZoomViewModel.ZoomPercentage}"
-                                Style="{StaticResource MaterialDesignDiscreteSlider}" />
+                                Value="{Binding PanZoomViewModel.ZoomPercentage}" />
                        <Button Command="{s:Action ResetZoomAndPan}"
                                Style="{StaticResource MaterialDesignFloatingActionMiniButton}"
                                HorizontalAlignment="Right"
@@ -317,7 +316,7 @@
            </materialDesign:DialogHost>
        </materialDesign:Card>

-        <TextBlock Grid.Column="0" Grid.Row="2" Grid.ColumnSpan="2" Style="{StaticResource MaterialDesignCaptionTextBlock}" Margin="0,5,0,0">
+        <TextBlock Grid.Column="0" Grid.Row="2" Grid.ColumnSpan="2" Style="{StaticResource MaterialDesignCaptionTextBlock}" Margin="0 5 0 -5">
            <InlineUIContainer>
                <materialDesign:PackIcon Kind="Keyboard" Margin="0 0 0 -3" />
            </InlineUIContainer>
@@ -22,7 +22,7 @@ using MouseButton = System.Windows.Input.MouseButton;

 namespace Artemis.UI.Screens.SurfaceEditor
 {
-    public class SurfaceEditorViewModel : Screen, IMainScreenViewModel
+    public class SurfaceEditorViewModel : MainScreenViewModel
    {
        private readonly ICoreService _coreService;
        private readonly IDeviceService _deviceService;
@@ -3,7 +3,7 @@ using Stylet;

 namespace Artemis.UI.Screens.Workshop
 {
-    public class WorkshopViewModel : Screen, IMainScreenViewModel
+    public class WorkshopViewModel : MainScreenViewModel
    {
        private Color _testColor;
        private bool _testPopupOpen;