Merge branch 'development'

README.md

@@ -9,7 +9,7 @@
 Artemis adds highly configurable support for several games to a range of RGB keyboards, mice and headsets. 
 
 ### Check out our [Wiki](https://wiki.artemis-rgb.com) and more specifically, the [getting started guide](https://wiki.artemis-rgb.com/en/guides/user).
-**Pre-release download**: https://github.com/SpoinkyNL/Artemis/releases (pre-release means your profiles may break at any given time!)  
+**Pre-release download**: https://artemis-rgb.com/  
 **Plugin documentation**: https://artemis-rgb.com/docs/
 
 **Please note that even though we have plugins for each brand supported by RGB.NET, they have not been thoroughly tested due to a lack of hardware. If you run into any issues please let us know on Discord.**  

src/Artemis.Core/Plugins/PluginInfo.cs

@@ -29,6 +29,8 @@ public class PluginInfo : CorePropertyChanged, IPrerequisitesSubject
     private Uri? _website;
     private Uri? _helpPage;
     private bool _hotReloadSupported;
+    private Uri? _license;
+    private string? _licenseName;
 
     internal PluginInfo()
     {
@@ -103,6 +105,26 @@ public class PluginInfo : CorePropertyChanged, IPrerequisitesSubject
         get => _helpPage;
         set => SetAndNotify(ref _helpPage, value);
     }
+    
+    /// <summary>
+    ///     Gets or sets the help page of this plugin
+    /// </summary>
+    [JsonProperty]
+    public Uri? License
+    {
+        get => _license;
+        set => SetAndNotify(ref _license, value);
+    }
+    
+    /// <summary>
+    ///     Gets or sets the author of this plugin
+    /// </summary>
+    [JsonProperty]
+    public string? LicenseName
+    {
+        get => _licenseName;
+        set => SetAndNotify(ref _licenseName, value);
+    }
 
     /// <summary>
     ///     The plugins display icon that's shown in the settings see <see href="https://materialdesignicons.com" /> for

src/Artemis.UI.Shared/Controls/ArtemisIcon.axaml.cs

@@ -43,30 +43,18 @@ public partial class ArtemisIcon : UserControl
             // If it's a string there are several options
             else if (Icon is string iconString)
             {
+                // An URI pointing to an image
+                if (ImageRegex.IsMatch(iconString))
+                {
+                    Image image = new() {Source = new Bitmap(iconString), VerticalAlignment = VerticalAlignment.Stretch, HorizontalAlignment = HorizontalAlignment.Stretch};
+                    RenderOptions.SetBitmapInterpolationMode(image, BitmapInterpolationMode.HighQuality);
+                    Content = image;
+                }
                 // An enum defined as a string
-                if (Enum.TryParse(iconString, true, out MaterialIconKind parsedIcon))
+                else if (Enum.TryParse(iconString, true, out MaterialIconKind parsedIcon))
                 {
                     Content = new MaterialIcon {Kind = parsedIcon, Width = Bounds.Width, Height = Bounds.Height};
                 }
-                // An URI pointing to an image
-                else if (ImageRegex.IsMatch(iconString))
-                {
-                    if (!Fill)
-                        Content = new Image
-                        {
-                            Source = new Bitmap(iconString),
-                            VerticalAlignment = VerticalAlignment.Stretch,
-                            HorizontalAlignment = HorizontalAlignment.Stretch
-                        };
-                    else
-                        Content = new Border
-                        {
-                            Background = TextElement.GetForeground(this),
-                            VerticalAlignment = VerticalAlignment.Stretch,
-                            HorizontalAlignment = HorizontalAlignment.Stretch,
-                            OpacityMask = new ImageBrush(new Bitmap(iconString))
-                        };
-                }
                 else
                 {
                     Content = new MaterialIcon {Kind = MaterialIconKind.QuestionMark, Width = Bounds.Width, Height = Bounds.Height};
@@ -87,10 +75,10 @@ public partial class ArtemisIcon : UserControl
             contentControl.Height = Bounds.Height;
         }
     }
-    
+
     private void OnPropertyChanged(object? sender, AvaloniaPropertyChangedEventArgs e)
     {
-        if (e.Property == IconProperty || e.Property == FillProperty)
+        if (e.Property == IconProperty)
             Update();
     }
 
@@ -119,21 +107,5 @@ public partial class ArtemisIcon : UserControl
         set => SetValue(IconProperty, value);
     }
 
-    /// <summary>
-    ///     Gets or sets a boolean indicating whether or not the icon should be filled in with the primary text color of the
-    ///     theme
-    /// </summary>
-    public static readonly StyledProperty<bool> FillProperty = AvaloniaProperty.Register<ArtemisIcon, bool>(nameof(Icon));
-
-    /// <summary>
-    ///     Gets or sets a boolean indicating whether or not the icon should be filled in with the primary text color of the
-    ///     theme
-    /// </summary>
-    public bool Fill
-    {
-        get => GetValue(FillProperty);
-        set => SetValue(FillProperty, value);
-    }
-
     #endregion
 }

src/Artemis.UI.Shared/Controls/Flyouts/MaterialIconPickerFlyout.cs

@@ -0,0 +1,38 @@
+using Avalonia.Controls;
+using FluentAvalonia.UI.Controls;
+
+namespace Artemis.UI.Shared.Flyouts;
+
+/// <summary>
+///     Defines a flyout that hosts a data model picker.
+/// </summary>
+public sealed class MaterialIconPickerFlyout : Flyout
+{
+    private MaterialIconPicker.MaterialIconPicker? _picker;
+
+    /// <summary>
+    ///     Gets the data model picker that the flyout hosts.
+    /// </summary>
+    public MaterialIconPicker.MaterialIconPicker MaterialIconPicker => _picker ??= new MaterialIconPicker.MaterialIconPicker();
+    
+    /// <inheritdoc />
+    protected override Control CreatePresenter()
+    {
+        _picker ??= new MaterialIconPicker.MaterialIconPicker();
+        _picker.Flyout = this;
+        FlyoutPresenter presenter = new() {Content = MaterialIconPicker};
+        return presenter;
+    }
+
+    #region Overrides of FlyoutBase
+
+    /// <inheritdoc />
+    protected override void OnClosed()
+    {
+        if (_picker != null)
+            _picker.Flyout = null;
+        base.OnClosed();
+    }
+
+    #endregion
+}

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

@@ -0,0 +1,147 @@
+using System;
+using System.Collections.Generic;
+using System.Collections.ObjectModel;
+using System.Linq;
+using System.Reactive.Linq;
+using System.Text.RegularExpressions;
+using System.Windows.Input;
+using Artemis.UI.Shared.Flyouts;
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Controls.Primitives;
+using Avalonia.Data;
+using Avalonia.LogicalTree;
+using DynamicData;
+using DynamicData.Binding;
+using Material.Icons;
+using ReactiveUI;
+
+namespace Artemis.UI.Shared.MaterialIconPicker;
+
+/// <summary>
+///     Represents a Material icon picker picker that can be used to search and select a Material icon.
+/// </summary>
+public partial class MaterialIconPicker : TemplatedControl
+{
+    /// <summary>
+    ///     Gets or sets the current Material icon.
+    /// </summary>
+    public static readonly StyledProperty<MaterialIconKind?> ValueProperty =
+        AvaloniaProperty.Register<MaterialIconPicker, MaterialIconKind?>(nameof(Value), defaultBindingMode: BindingMode.TwoWay);
+
+    /// <summary>
+    ///     Gets the command to execute when deleting stops.
+    /// </summary>
+    public static readonly DirectProperty<MaterialIconPicker, ICommand> SelectIconProperty =
+        AvaloniaProperty.RegisterDirect<MaterialIconPicker, ICommand>(nameof(SelectIcon), g => g.SelectIcon);
+
+    private readonly ICommand _selectIcon;
+    private ItemsRepeater? _iconsContainer;
+
+    private SourceList<MaterialIconKind>? _iconsSource;
+    private TextBox? _searchBox;
+    private IDisposable? _sub;
+    private readonly Dictionary<string,MaterialIconKind> _enumNames;
+
+    /// <inheritdoc />
+    public MaterialIconPicker()
+    {
+        _selectIcon = ReactiveCommand.Create<MaterialIconKind>(i =>
+        {
+            Value = i;
+            Flyout?.Hide();
+        });
+
+        // Build a list of enum names and values, this is required because a value may have more than one name
+        _enumNames = new Dictionary<string, MaterialIconKind>();
+        MaterialIconKind[] values = Enum.GetValues<MaterialIconKind>();
+        string[] names = Enum.GetNames<MaterialIconKind>();
+        for (int index = 0; index < names.Length; index++)
+            _enumNames[names[index]] = values[index];
+    }
+
+    /// <summary>
+    ///     Gets or sets the current Material icon.
+    /// </summary>
+    public MaterialIconKind? Value
+    {
+        get => GetValue(ValueProperty);
+        set => SetValue(ValueProperty, value);
+    }
+
+    /// <summary>
+    ///     Gets the command to execute when deleting stops.
+    /// </summary>
+    public ICommand SelectIcon
+    {
+        get => _selectIcon;
+        private init => SetAndRaise(SelectIconProperty, ref _selectIcon, value);
+    }
+
+    internal MaterialIconPickerFlyout? Flyout { get; set; }
+
+    private void Setup()
+    {
+        if (_searchBox == null || _iconsContainer == null)
+            return;
+
+        // Build a list of values, they are not unique because a value with multiple names occurs once per name
+        _iconsSource = new SourceList<MaterialIconKind>();
+        _iconsSource.AddRange(Enum.GetValues<MaterialIconKind>().Distinct());
+        _sub = _iconsSource.Connect()
+            .Filter(_searchBox.WhenAnyValue(s => s.Text).Throttle(TimeSpan.FromMilliseconds(100)).Select(CreatePredicate))
+            .Sort(SortExpressionComparer<MaterialIconKind>.Descending(p => p.ToString()))
+            .Bind(out ReadOnlyObservableCollection<MaterialIconKind> icons)
+            .Subscribe();
+        _iconsContainer.ItemsSource = icons;
+    }
+
+    #region Overrides of TemplatedControl
+
+    /// <inheritdoc />
+    protected override void OnApplyTemplate(TemplateAppliedEventArgs e)
+    {
+        _searchBox = e.NameScope.Find<TextBox>("SearchBox");
+        _iconsContainer = e.NameScope.Find<ItemsRepeater>("IconsContainer");
+
+        Setup();
+        base.OnApplyTemplate(e);
+    }
+
+    /// <inheritdoc />
+    protected override void OnAttachedToLogicalTree(LogicalTreeAttachmentEventArgs e)
+    {
+        Setup();
+        base.OnAttachedToLogicalTree(e);
+    }
+
+    /// <inheritdoc />
+    protected override void OnDetachedFromLogicalTree(LogicalTreeAttachmentEventArgs e)
+    {
+        _iconsSource?.Dispose();
+        _iconsSource = null;
+        _sub?.Dispose();
+        _sub = null;
+
+        if (_searchBox != null)
+            _searchBox.Text = "";
+        base.OnDetachedFromLogicalTree(e);
+    }
+
+    private Func<MaterialIconKind, bool> CreatePredicate(string? text)
+    {
+        if (string.IsNullOrWhiteSpace(text))
+            return _ => true;
+
+        // Strip out whitespace and find all matching enum values
+        text = StripWhiteSpaceRegex().Replace(text, "");
+        HashSet<MaterialIconKind> values = _enumNames.Where(n => n.Key.Contains(text, StringComparison.OrdinalIgnoreCase)).Select(n => n.Value).ToHashSet();
+        // Only show those that matched
+        return data => values.Contains(data);
+    }
+
+    [GeneratedRegex("\\s+")]
+    private static partial Regex StripWhiteSpaceRegex();
+
+    #endregion
+}

src/Artemis.UI.Shared/Controls/MaterialIconPicker/MaterialIconPickerButton.cs

@@ -0,0 +1,137 @@
+using System;
+using Artemis.UI.Shared.Flyouts;
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Controls.Primitives;
+using Avalonia.Data;
+using Avalonia.Interactivity;
+using FluentAvalonia.Core;
+using Material.Icons;
+
+namespace Artemis.UI.Shared.MaterialIconPicker;
+
+/// <summary>
+///     Represents a button that can be used to pick a data model path in a flyout.
+/// </summary>
+public class MaterialIconPickerButton : TemplatedControl
+{
+    /// <summary>
+    ///     Gets or sets the placeholder to show when nothing is selected.
+    /// </summary>
+    public static readonly StyledProperty<string> PlaceholderProperty =
+        AvaloniaProperty.Register<MaterialIconPicker, string>(nameof(Placeholder), "Click to select");
+
+    /// <summary>
+    ///     Gets or sets the current Material icon.
+    /// </summary>
+    public static readonly StyledProperty<MaterialIconKind?> ValueProperty =
+        AvaloniaProperty.Register<MaterialIconPicker, MaterialIconKind?>(nameof(Value), defaultBindingMode: BindingMode.TwoWay);
+
+    /// <summary>
+    ///     Gets or sets the desired flyout placement.
+    /// </summary>
+    public static readonly StyledProperty<PlacementMode> PlacementProperty =
+        AvaloniaProperty.Register<FlyoutBase, PlacementMode>(nameof(Placement), PlacementMode.BottomEdgeAlignedLeft);
+
+    private Button? _button;
+    private MaterialIconPickerFlyout? _flyout;
+    private bool _flyoutActive;
+
+    /// <summary>
+    ///     Gets or sets the placeholder to show when nothing is selected.
+    /// </summary>
+    public string Placeholder
+    {
+        get => GetValue(PlaceholderProperty);
+        set => SetValue(PlaceholderProperty, value);
+    }
+
+    /// <summary>
+    ///     Gets or sets the current Material icon.
+    /// </summary>
+    public MaterialIconKind? Value
+    {
+        get => GetValue(ValueProperty);
+        set => SetValue(ValueProperty, value);
+    }
+
+    /// <summary>
+    ///     Gets or sets the desired flyout placement.
+    /// </summary>
+    public PlacementMode Placement
+    {
+        get => GetValue(PlacementProperty);
+        set => SetValue(PlacementProperty, value);
+    }
+
+    /// <summary>
+    ///     Raised when the flyout opens.
+    /// </summary>
+    public event TypedEventHandler<MaterialIconPickerButton, EventArgs>? FlyoutOpened;
+
+    /// <summary>
+    ///     Raised when the flyout closes.
+    /// </summary>
+    public event TypedEventHandler<MaterialIconPickerButton, EventArgs>? FlyoutClosed;
+
+    private void OnButtonClick(object? sender, RoutedEventArgs e)
+    {
+        if (_flyout == null)
+            return;
+
+        MaterialIconPickerFlyout flyout = new();
+        flyout.FlyoutPresenterClasses.Add("material-icon-picker-presenter");
+        flyout.MaterialIconPicker.Value = Value;
+        flyout.Placement = Placement;
+        
+        flyout.Closed += FlyoutOnClosed;
+        flyout.ShowAt(this);
+        FlyoutOpened?.Invoke(this, EventArgs.Empty);
+
+        void FlyoutOnClosed(object? closedSender, EventArgs closedEventArgs)
+        {
+            Value = flyout.MaterialIconPicker.Value;
+            flyout.Closed -= FlyoutOnClosed;
+            FlyoutClosed?.Invoke(this, EventArgs.Empty);
+        }
+    }
+
+    #region Overrides of TemplatedControl
+
+    /// <inheritdoc />
+    protected override void OnApplyTemplate(TemplateAppliedEventArgs e)
+    {
+        if (_button != null)
+            _button.Click -= OnButtonClick;
+        base.OnApplyTemplate(e);
+        _button = e.NameScope.Find<Button>("MainButton");
+        if (_button != null)
+            _button.Click += OnButtonClick;
+    }
+
+    /// <inheritdoc />
+    protected override void OnAttachedToVisualTree(VisualTreeAttachmentEventArgs e)
+    {
+        _flyout ??= new MaterialIconPickerFlyout();
+        _flyout.Closed += OnFlyoutClosed;
+    }
+
+    private void OnFlyoutClosed(object? sender, EventArgs e)
+    {
+        if (_flyoutActive)
+        {
+            FlyoutClosed?.Invoke(this, EventArgs.Empty);
+            _flyoutActive = false;
+        }
+    }
+
+
+    /// <inheritdoc />
+    protected override void OnDetachedFromVisualTree(VisualTreeAttachmentEventArgs e)
+    {
+        if (_flyout != null)
+            _flyout.Closed -= OnFlyoutClosed;
+    }
+
+    #endregion
+}

src/Artemis.UI.Shared/Styles/Artemis.axaml

@@ -18,6 +18,8 @@
     <StyleInclude Source="/Styles/Controls/GradientPickerButton.axaml" />
     <StyleInclude Source="/Styles/Controls/DataModelPicker.axaml" />
     <StyleInclude Source="/Styles/Controls/DataModelPickerButton.axaml" />
+    <StyleInclude Source="/Styles/Controls/MaterialIconPicker.axaml" />
+    <StyleInclude Source="/Styles/Controls/MaterialIconPickerButton.axaml" />
 
     <!-- Custom styles -->
     <StyleInclude Source="/Styles/Border.axaml" />
@@ -33,4 +35,5 @@
     <StyleInclude Source="/Styles/Notifications.axaml" />
     <StyleInclude Source="/Styles/NumberBox.axaml" />
     <StyleInclude Source="/Styles/TreeView.axaml" />
+    <StyleInclude Source="/Styles/Plugins.axaml" />
 </Styles>

src/Artemis.UI.Shared/Styles/Controls/GradientPickerButton.axaml

@@ -28,7 +28,6 @@
         <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
         <Setter Property="Template">
             <ControlTemplate>
-
                 <Button
                     Name="MainButton"
                     Padding="0 0 12 0"

src/Artemis.UI.Shared/Styles/Controls/MaterialIconPicker.axaml

@@ -0,0 +1,55 @@
+<Styles xmlns="https://github.com/avaloniaui"
+        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+        xmlns:avalonia="clr-namespace:Material.Icons.Avalonia;assembly=Material.Icons.Avalonia"
+        xmlns:materialIconPicker="clr-namespace:Artemis.UI.Shared.MaterialIconPicker"
+        xmlns:icons="clr-namespace:Material.Icons;assembly=Material.Icons">
+    <Design.PreviewWith>
+        <materialIconPicker:MaterialIconPicker />
+    </Design.PreviewWith>
+
+    <Style Selector="materialIconPicker|MaterialIconPicker">
+        <Setter Property="Template">
+            <ControlTemplate>
+                <Grid RowDefinitions="Auto,*" Width="525" Height="485" Margin="10">
+                    <TextBox Grid.Row="0" Watermark="Search" Name="SearchBox" />
+
+                    <Border Grid.Row="1" Classes="card card-condensed" Margin="0 10 0 0">
+                        <ScrollViewer Name="IconsViewer"
+                                      HorizontalScrollBarVisibility="Disabled"
+                                      VerticalScrollBarVisibility="Auto"
+                                      VerticalAlignment="Top">
+                            <ItemsRepeater Name="IconsContainer">
+                                <ItemsRepeater.Layout>
+                                    <WrapLayout />
+                                </ItemsRepeater.Layout>
+                                <ItemsRepeater.ItemTemplate>
+                                    <DataTemplate x:DataType="icons:MaterialIconKind">
+                                        <Button VerticalAlignment="Bottom"
+                                                HorizontalAlignment="Right"
+                                                Width="72" 
+                                                Height="75"
+                                                Margin="5"
+                                                Padding="1"
+                                                ToolTip.Tip="{CompiledBinding}"
+                                                Command="{CompiledBinding SelectIcon, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type materialIconPicker:MaterialIconPicker}}}"
+                                                CommandParameter="{CompiledBinding}">
+                                            <StackPanel Orientation="Vertical">
+                                                <avalonia:MaterialIcon Kind="{CompiledBinding}" Width="35" Height="35"/>
+                                                <TextBlock Text="{CompiledBinding}" 
+                                                           TextAlignment="Center" 
+                                                           TextTrimming="CharacterEllipsis"
+                                                           Classes="subtitle" 
+                                                           Margin="0 8 0 0"
+                                                           FontSize="10"/>
+                                            </StackPanel>
+                                        </Button>
+                                    </DataTemplate>
+                                </ItemsRepeater.ItemTemplate>
+                            </ItemsRepeater>
+                        </ScrollViewer>
+                    </Border>
+                </Grid>
+            </ControlTemplate>
+        </Setter>
+    </Style>
+</Styles>

src/Artemis.UI.Shared/Styles/Controls/MaterialIconPickerButton.axaml

@@ -0,0 +1,65 @@
+<Styles xmlns="https://github.com/avaloniaui"
+        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+        xmlns:materialIconPicker="clr-namespace:Artemis.UI.Shared.MaterialIconPicker"
+        xmlns:avalonia="clr-namespace:Material.Icons.Avalonia;assembly=Material.Icons.Avalonia"
+        xmlns:converters="clr-namespace:Artemis.UI.Shared.Converters">
+    <Design.PreviewWith>
+        <Border Padding="20" Width="600" Height="800">
+            <StackPanel Spacing="5">
+                <materialIconPicker:MaterialIconPickerButton Value="Achievement" />
+            </StackPanel>
+        </Border>
+    </Design.PreviewWith>
+
+    <Style Selector="FlyoutPresenter.material-icon-picker-presenter">
+        <Setter Property="Padding" Value="0" />
+        <Setter Property="MaxWidth" Value="1200" />
+        <Setter Property="MaxHeight" Value="1200" />
+        <Setter Property="Background" Value="{DynamicResource SolidBackgroundFillColorBaseBrush}" />
+        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Hidden" />
+        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Hidden" />
+    </Style>
+
+    <Style Selector="materialIconPicker|MaterialIconPickerButton">
+        <Style.Resources>
+            <converters:ToStringConverter x:Key="ToStringConverter" />
+        </Style.Resources>
+        <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrush}" />
+        <Setter Property="MinHeight" Value="{DynamicResource TextControlThemeMinHeight}" />
+        <Setter Property="MinWidth" Value="{DynamicResource TextControlThemeMinWidth}" />
+        <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+        <Setter Property="Template">
+            <ControlTemplate>
+                <Button Name="MainButton"
+                        CornerRadius="{TemplateBinding CornerRadius}"
+                        BorderBrush="{TemplateBinding BorderBrush}"
+                        VerticalAlignment="{TemplateBinding VerticalAlignment}"
+                        HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
+                        Width="{TemplateBinding Width}"
+                        Height="{TemplateBinding Height}"
+                        HorizontalContentAlignment="Stretch">
+                    <Grid ColumnDefinitions="*,Auto" HorizontalAlignment="Stretch">
+                        <StackPanel Grid.Column="0" IsVisible="{TemplateBinding Value, Converter={x:Static ObjectConverters.IsNotNull}}" Orientation="Horizontal" Spacing="5">
+                            <avalonia:MaterialIcon Kind="{TemplateBinding Value}"/>
+                            <TextBlock VerticalAlignment="Center" TextAlignment="Left" TextTrimming="CharacterEllipsis" Text="{TemplateBinding Value, Converter={StaticResource ToStringConverter}}"/>
+                        </StackPanel>
+                       
+                        <TextBlock Grid.Column="0"
+                                   Text="{TemplateBinding Placeholder}"
+                                   Foreground="{DynamicResource TextControlPlaceholderForeground}"
+                                   IsVisible="{TemplateBinding Value, Converter={x:Static ObjectConverters.IsNull}}" />
+                        <TextBlock Name="ChevronTextBlock"
+                                   Grid.Column="1"
+                                   FontFamily="{DynamicResource SymbolThemeFontFamily}"
+                                   FontSize="13"
+                                   Text="&#xE70D;"
+                                   VerticalAlignment="Center"
+                                   TextAlignment="Right"
+                                   Padding="2 2 2 0"
+                                   Margin="5 0" />
+                    </Grid>
+                </Button>
+            </ControlTemplate>
+        </Setter>
+    </Style>
+</Styles>

src/Artemis.UI.Shared/Styles/Plugins.axaml

@@ -0,0 +1,5 @@
+<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <Style Selector=":is(Control).plugin-introduction">
+        <Setter Property="Margin" Value="0 25 0 0" />
+    </Style>
+</Styles>

src/Artemis.UI.Shared/Styles/TextBlock.axaml

@@ -45,4 +45,9 @@
     <Style Selector="TextBlock.subtitle">
 		<Setter Property="Foreground" Value="{DynamicResource TextFillColorTertiaryBrush}" />
     </Style>
+    <Style Selector="TextBlock.card-title">
+        <Setter Property="FontSize" Value="15" />
+        <Setter Property="FontWeight" Value="Medium" />
+        <Setter Property="Margin" Value="0 25 0 5" />
+    </Style>
 </Styles>

src/Artemis.UI/Artemis.UI.csproj

@@ -17,7 +17,6 @@
     <ItemGroup>
         <PackageReference Include="Avalonia" Version="11.0.0-preview8" />
         <PackageReference Include="Avalonia.Controls.PanAndZoom" Version="11.0.0-preview8" />
-        <PackageReference Include="Avalonia.Controls.Skia" Version="11.0.0-preview8.1" />
         <PackageReference Include="Avalonia.Desktop" Version="11.0.0-preview8" />
         <!--Condition below is needed to remove Avalonia.Diagnostics package from build output in Release configuration.-->
         <PackageReference Condition="'$(Configuration)' == 'Debug'" Include="Avalonia.Diagnostics" Version="11.0.0-preview8" />
@@ -28,7 +27,7 @@
         <PackageReference Include="FluentAvaloniaUI" Version="2.0.0-preview8" />
         <PackageReference Include="Flurl.Http" Version="3.2.4" />
         <PackageReference Include="Live.Avalonia" Version="1.3.1" />
-        <PackageReference Include="Markdown.Avalonia.Tight" Version="11.0.0-b1" />
+        <PackageReference Include="Markdown.Avalonia.Tight" Version="11.0.0-c1" />
         <PackageReference Include="Material.Icons.Avalonia" Version="2.0.0-preview3" />
         <PackageReference Include="Octopus.Octodiff" Version="2.0.261" />
         <PackageReference Include="ReactiveUI" Version="18.4.26" />

src/Artemis.UI/Screens/Device/DeviceSettingsView.axaml

@@ -9,13 +9,13 @@
              mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
              x:DataType="local:DeviceSettingsViewModel"
              x:Class="Artemis.UI.Screens.Device.DeviceSettingsView">
-    <Border Classes="card" Padding="0" Width="200" ClipToBounds="True" Margin="5">
+    <Border Classes="card" Padding="0" Width="240" ClipToBounds="True" Margin="5">
-        <Grid RowDefinitions="140,*,Auto">
+        <Grid RowDefinitions="160,*,Auto">
             <Rectangle Grid.Row="0" Fill="{DynamicResource CheckerboardBrush}" />
             <shared:DeviceVisualizer Grid.Row="0"
                                      VerticalAlignment="Center"
                                      HorizontalAlignment="Center"
-                                     Margin="5"
+                                     Margin="10"
                                      ShowColors="False"
                                      Device="{CompiledBinding Device}"
                                      RenderOptions.BitmapInterpolationMode="HighQuality" />
@@ -28,7 +28,7 @@
                     Command="{CompiledBinding IdentifyDevice}">
                 <avalonia:MaterialIcon Kind="AlarmLight" />
             </Button>
-            <StackPanel Grid.Row="1" Margin="8 24 8 0">
+            <StackPanel Grid.Row="1" Margin="8 16 8 0">
                 <TextBlock Text="{CompiledBinding Device.RgbDevice.DeviceInfo.Model}" />
                 <StackPanel>
                     <TextBlock TextWrapping="Wrap" Classes="subtitle" Text="{CompiledBinding Device.RgbDevice.DeviceInfo.Manufacturer, Mode=OneWay}" />

src/Artemis.UI/Screens/Plugins/PluginSettingsWindowView.axaml

@@ -4,6 +4,9 @@
                      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
                      xmlns:windowing="clr-namespace:FluentAvalonia.UI.Windowing;assembly=FluentAvalonia"
                      xmlns:plugins="clr-namespace:Artemis.UI.Screens.Plugins"
+                     xmlns:controls="clr-namespace:FluentAvalonia.UI.Controls;assembly=FluentAvalonia"
+                     xmlns:avalonia="clr-namespace:Material.Icons.Avalonia;assembly=Material.Icons.Avalonia"
+                     xmlns:shared="clr-namespace:Artemis.UI.Shared;assembly=Artemis.UI.Shared"
                      mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
                      x:Class="Artemis.UI.Screens.Plugins.PluginSettingsWindowView"
                      x:DataType="plugins:PluginSettingsWindowViewModel"
@@ -11,9 +14,63 @@
                      Title="{CompiledBinding DisplayName}"
                      Width="800"
                      Height="800"
+                     MaxWidth="800"
                      WindowStartupLocation="CenterOwner">
     <Panel>
-        <ContentControl Content="{CompiledBinding ConfigurationViewModel}"></ContentControl>
+        <Grid RowDefinitions="Auto,Auto, *" ColumnDefinitions="Auto,*,Auto" Margin="15" MaxWidth="800">
-        <StackPanel Classes="notification-container" Name="NotificationContainer" VerticalAlignment="Bottom" HorizontalAlignment="Right" />
+            <shared:ArtemisIcon Grid.Column="0"
+                                Grid.RowSpan="2"
+                                Width="65"
+                                Height="65"
+                                VerticalAlignment="Center"
+                                Margin="0 0 20 0"
+                                Icon="{CompiledBinding Plugin.Info.ResolvedIcon}" />
+            <TextBlock Grid.Row="0" Grid.Column="1" FontSize="28" VerticalAlignment="Bottom" Text="{CompiledBinding Plugin.Info.Name}" />
+
+            <StackPanel Grid.Row="0" Grid.Column="2" HorizontalAlignment="Right" VerticalAlignment="Bottom" Orientation="Horizontal">
+                <controls:HyperlinkButton Classes="icon-button"
+                                          IsVisible="{CompiledBinding Plugin.Info.HelpPage, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"
+                                          NavigateUri="{CompiledBinding Plugin.Info.HelpPage}"
+                                          ToolTip.Tip="{CompiledBinding Plugin.Info.HelpPage}">
+                    <avalonia:MaterialIcon Kind="Quiz" />
+                </controls:HyperlinkButton>
+                <controls:HyperlinkButton Classes="icon-button"
+                                          IsVisible="{CompiledBinding Plugin.Info.Website, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"
+                                          NavigateUri="{CompiledBinding Plugin.Info.Website}"
+                                          ToolTip.Tip="{CompiledBinding Plugin.Info.Website}">
+                    <avalonia:MaterialIcon Kind="Web" />
+                </controls:HyperlinkButton>
+                <controls:HyperlinkButton Classes="icon-button"
+                                          IsVisible="{CompiledBinding Plugin.Info.Repository, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"
+                                          NavigateUri="{CompiledBinding Plugin.Info.Repository}"
+                                          ToolTip.Tip="{CompiledBinding Plugin.Info.Repository}">
+                    <avalonia:MaterialIcon Kind="Git" />
+                </controls:HyperlinkButton>
+            </StackPanel>
+
+            <TextBlock Grid.Row="1"
+                       Grid.Column="1"
+                       VerticalAlignment="Top"
+                       Classes="subtitle"
+                       Text="{CompiledBinding Plugin.Info.Version}" />
+
+            <controls:HyperlinkButton Grid.Row="1"
+                                      Grid.Column="2"
+                                      IsVisible="{CompiledBinding Plugin.Info.License, Converter={x:Static ObjectConverters.IsNotNull}}"
+                                      VerticalAlignment="Top"
+                                      NavigateUri="{CompiledBinding Plugin.Info.License}"
+                                      Content="{CompiledBinding LicenseButtonText}" />
+
+            <ScrollViewer Grid.Row="2"
+                          Grid.Column="0"
+                          Grid.ColumnSpan="3"
+                          Margin="0 0 -10 0"
+                          VerticalScrollBarVisibility="Auto"
+                          HorizontalScrollBarVisibility="Disabled">
+                <ContentControl Margin="0 0 5 0" Content="{CompiledBinding ConfigurationViewModel}"></ContentControl>
+            </ScrollViewer>
+        </Grid>
+
+        <StackPanel Name="NotificationContainer" Classes="notification-container" VerticalAlignment="Bottom" HorizontalAlignment="Right" />
     </Panel>
 </windowing:AppWindow>

src/Artemis.UI/Screens/Plugins/PluginSettingsWindowViewModel.cs

@@ -16,4 +16,5 @@ public class PluginSettingsWindowViewModel : ActivatableViewModelBase
 
     public PluginConfigurationViewModel ConfigurationViewModel { get; }
     public Plugin Plugin { get; }
+    public string LicenseButtonText => Plugin.Info.LicenseName ?? "View license";
 }

src/Artemis.UI/Screens/Plugins/PluginView.axaml

@@ -12,7 +12,6 @@
     <Grid RowDefinitions="*,Auto">
         <Grid Grid.Row="0" RowDefinitions="Auto,Auto,*" ColumnDefinitions="80,*, Auto">
             <shared:ArtemisIcon Icon="{CompiledBinding Plugin.Info.ResolvedIcon}"
-                                Fill="False"
                                 Width="48"
                                 Height="48"
                                 Margin="0 5 0 0"
@@ -95,7 +94,7 @@
                                           IsVisible="{CompiledBinding Plugin.Info.HelpPage, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"
                                           NavigateUri="{CompiledBinding Plugin.Info.HelpPage}"
                                           ToolTip.Tip="{CompiledBinding Plugin.Info.HelpPage}">
-                    <avalonia:MaterialIcon Kind="HelpCircle" />
+                    <avalonia:MaterialIcon Kind="Quiz" />
                 </controls:HyperlinkButton>
                 <controls:HyperlinkButton Classes="icon-button icon-button-large"
                                           IsVisible="{CompiledBinding Plugin.Info.Website, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"

src/Artemis.UI/Screens/ProfileEditor/Panels/Playback/PlaybackView.axaml

@@ -7,8 +7,12 @@
              mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="48"
              x:Class="Artemis.UI.Screens.ProfileEditor.Playback.PlaybackView"
              x:DataType="playback:PlaybackViewModel">
-    <DockPanel Margin="8 0">
+    <Grid Margin="8 0">
-        <StackPanel Orientation="Horizontal" Spacing="5">
+        <Grid.ColumnDefinitions>
+            <ColumnDefinition Width="*"/>
+            <ColumnDefinition Width="200"/>
+        </Grid.ColumnDefinitions>
+        <StackPanel Grid.Column="0" Orientation="Horizontal" Spacing="5">
             <Button Classes="icon-button icon-button-large"
                     ToolTip.Tip="Play from start (Shift+Space)" Command="{CompiledBinding PlayFromStart}"
                     Focusable="False">
@@ -60,6 +64,6 @@
 
             </ToggleButton>
         </StackPanel>
-        <TextBlock Classes="h4" Text="{CompiledBinding FormattedCurrentTime, FallbackValue=00.000}" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0" />
+        <TextBlock Grid.Column="1" Classes="h4" Height="32" Text="{CompiledBinding FormattedCurrentTime, FallbackValue=00.000}" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0" />
-    </DockPanel>
+    </Grid>
 </UserControl>

src/Artemis.UI/Screens/ProfileEditor/Panels/VisualEditor/VisualEditorView.axaml

@@ -53,7 +53,7 @@
                     </ItemsControl.ItemsPanel>
                     <ItemsControl.ItemTemplate>
                         <DataTemplate DataType="core:ArtemisDevice">
-                            <shared:DeviceVisualizer Device="{CompiledBinding}" ShowColors="True" />
+                            <shared:DeviceVisualizer Device="{CompiledBinding}" ShowColors="True" RenderOptions.BitmapInterpolationMode="HighQuality" />
                         </DataTemplate>
                     </ItemsControl.ItemTemplate>
                 </ItemsControl>

src/Artemis.UI/Screens/Settings/Tabs/AboutTabView.axaml

@@ -11,7 +11,14 @@
     <ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Disabled">
         <StackPanel Margin="15" MaxWidth="800">
             <Grid RowDefinitions="*,*" ColumnDefinitions="Auto,*,Auto">
-                <Image Grid.Column="0" Grid.RowSpan="2" Width="65" Height="65" VerticalAlignment="Center" Source="/Assets/Images/Logo/bow.png" Margin="0 0 20 0" />
+                <Image Grid.Column="0" 
+                       Grid.RowSpan="2" 
+                       Width="65"
+                       Height="65"
+                       VerticalAlignment="Center"
+                       Source="/Assets/Images/Logo/bow.png"
+                       Margin="0 0 20 0"
+                       RenderOptions.BitmapInterpolationMode="HighQuality"/>
                 <TextBlock Grid.Row="0" Grid.Column="1" FontSize="36" VerticalAlignment="Bottom">
                     Artemis 2
                 </TextBlock>

src/Artemis.UI/Screens/Settings/Tabs/DevicesTabView.axaml

@@ -6,26 +6,22 @@
              mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
              x:Class="Artemis.UI.Screens.Settings.DevicesTabView"
              x:DataType="settings:DevicesTabViewModel">
-    <Grid RowDefinitions="Auto,*">
+    <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">
-        <StackPanel MaxWidth="1050">
+        <StackPanel Margin="15" MaxWidth="1000">
             <TextBlock Classes="h4">Device management</TextBlock>
-            <TextBlock>
+            <TextBlock TextWrapping="Wrap">
                 Below you view and manage the devices that were detected by Artemis.
-            </TextBlock>
+                <LineBreak />
-            <TextBlock>
                 Disabling a device will cause it to stop updating. Some SDKs will even go back to using manufacturer lighting (Artemis restart may be required).
             </TextBlock>
-        </StackPanel>
+            
-
+            <ItemsControl ItemsSource="{CompiledBinding Devices}" Margin="0 25 0 0">
-        <ScrollViewer Grid.Row="1" HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">
-            <ItemsControl ItemsSource="{CompiledBinding Devices}" Margin="-5 0" MaxWidth="1050">
                 <ItemsControl.ItemsPanel>
                     <ItemsPanelTemplate>
                         <WrapPanel />
                     </ItemsPanelTemplate>
                 </ItemsControl.ItemsPanel>
             </ItemsControl>
-        </ScrollViewer>
+        </StackPanel>
-    </Grid>
+    </ScrollViewer>
-
 </UserControl>

src/Artemis.UI/Screens/Settings/Tabs/GeneralTabView.axaml

@@ -14,8 +14,12 @@
 
     <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">
         <StackPanel Margin="15" MaxWidth="1000">
+            <TextBlock Classes="h4">General settings</TextBlock>
+            <TextBlock>
+                Here you can change the general settings op the application, for plugin and device specific settings, see the other tabs.
+            </TextBlock>
             <!-- General settings -->
-            <TextBlock Classes="h4" Margin="0 15">
+            <TextBlock Classes="card-title">
                 General
             </TextBlock>
             <Border Classes="card" VerticalAlignment="Stretch" Margin="0,0,5,0">
@@ -95,7 +99,7 @@
             </Border>
 
             <!-- Web server settings -->
-            <TextBlock Classes="h4" Margin="0 15">
+            <TextBlock Classes="card-title">
                 Web server
             </TextBlock>
             <Border Classes="card" VerticalAlignment="Stretch" Margin="0,0,5,0">
@@ -138,7 +142,7 @@
 
             <!-- Update settings -->
             <StackPanel>
-                <TextBlock Classes="h4" Margin="0 15">
+                <TextBlock Classes="card-title">
                     Updating
                 </TextBlock>
                 <Border Classes="card" VerticalAlignment="Stretch" Margin="0,0,5,0">
@@ -191,7 +195,7 @@
             </StackPanel>
 
             <!-- Profile editor settings -->
-            <TextBlock Classes="h4" Margin="0 15">
+            <TextBlock Classes="card-title">
                 Profile editor
             </TextBlock>
             <Border Classes="card" VerticalAlignment="Stretch" Margin="0,0,5,0">
@@ -262,7 +266,7 @@
             </Border>
 
             <!-- Rendering settings -->
-            <TextBlock Classes="h4" Margin="0 15">
+            <TextBlock Classes="card-title">
                 Rendering
             </TextBlock>
             <Border Classes="card" VerticalAlignment="Stretch" Margin="0,0,5,0">
@@ -335,7 +339,7 @@
             </Border>
 
             <!-- Tools -->
-            <TextBlock Classes="h4" Margin="0 15">
+            <TextBlock Classes="card-title">
                 Tools
             </TextBlock>
             <Border Classes="card" VerticalAlignment="Stretch" Margin="0,0,5,0">

src/Artemis.UI/Screens/Settings/Tabs/PluginsTabView.axaml

@@ -9,7 +9,7 @@
              x:Class="Artemis.UI.Screens.Settings.PluginsTabView"
              x:DataType="settings:PluginsTabViewModel">
     <Grid RowDefinitions="Auto,*">
-        <Grid Grid.Row="0" Grid.Column="0" MaxWidth="900" Margin="0 10">
+        <Grid Grid.Row="0" Grid.Column="0" MaxWidth="1000" Margin="0 22 0 10">
             <Grid.ColumnDefinitions>
                 <ColumnDefinition MinWidth="165" MaxWidth="400" />
                 <ColumnDefinition Width="*" />
@@ -25,7 +25,7 @@
         </Grid>
 
         <ScrollViewer Grid.Row="1" Grid.Column="0" HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto" VerticalAlignment="Top">
-            <ItemsRepeater ItemsSource="{CompiledBinding Plugins}" MaxWidth="900" VerticalAlignment="Center">
+            <ItemsRepeater ItemsSource="{CompiledBinding Plugins}" MaxWidth="1000" VerticalAlignment="Center">
                 <ItemsRepeater.ItemTemplate>
                     <DataTemplate x:DataType="plugins:PluginSettingsViewModel">
                         <ContentControl Content="{CompiledBinding}" Height="200"/>

src/Artemis.UI/Screens/Sidebar/Dialogs/ProfileConfigurationEditView.axaml

@@ -8,6 +8,7 @@
                       xmlns:local="clr-namespace:Artemis.UI.Screens.Sidebar"
                       xmlns:shared="clr-namespace:Artemis.UI.Shared;assembly=Artemis.UI.Shared"
                       xmlns:windowing="clr-namespace:FluentAvalonia.UI.Windowing;assembly=FluentAvalonia"
+                      xmlns:materialIconPicker="clr-namespace:Artemis.UI.Shared.MaterialIconPicker;assembly=Artemis.UI.Shared"
                       mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="850"
                       x:Class="Artemis.UI.Screens.Sidebar.ProfileConfigurationEditView"
                       x:DataType="local:ProfileConfigurationEditViewModel"
@@ -108,27 +109,12 @@
                             <Border Background="{DynamicResource CheckerboardBrush}" CornerRadius="{DynamicResource CardCornerRadius}" Width="78" Height="78">
                                 <avalonia:MaterialIcon Kind="{CompiledBinding SelectedMaterialIcon.Icon}" Width="45" Height="45" />
                             </Border>
-                            <ComboBox ItemsSource="{CompiledBinding MaterialIcons}"
+                            <materialIconPicker:MaterialIconPickerButton 
-                                      SelectedItem="{CompiledBinding SelectedMaterialIcon}"
+                                Value="{CompiledBinding SelectedMaterialIcon.Icon}"
-                                      VerticalAlignment="Bottom"
+                                Margin="10 0"
-                                      IsTextSearchEnabled="True"
+                                Width="250"
-                                      Margin="10 0"
+                                VerticalAlignment="Bottom" 
-                                      Width="250"
+                                IsVisible="{CompiledBinding IconType, Converter={StaticResource EnumBoolConverter}, ConverterParameter={x:Static core:ProfileConfigurationIconType.MaterialIcon}}"/>
-                                      IsVisible="{CompiledBinding IconType, Converter={StaticResource EnumBoolConverter}, ConverterParameter={x:Static core:ProfileConfigurationIconType.MaterialIcon}}">
-                                <ComboBox.ItemsPanel>
-                                    <ItemsPanelTemplate>
-                                        <VirtualizingStackPanel />
-                                    </ItemsPanelTemplate>
-                                </ComboBox.ItemsPanel>
-                                <ComboBox.ItemTemplate>
-                                    <DataTemplate DataType="local:ProfileIconViewModel">
-                                        <StackPanel Orientation="Horizontal">
-                                            <avalonia:MaterialIcon Kind="{CompiledBinding Icon}" Margin="0 0 5 0" />
-                                            <TextBlock Text="{CompiledBinding DisplayName}" />
-                                        </StackPanel>
-                                    </DataTemplate>
-                                </ComboBox.ItemTemplate>
-                            </ComboBox>
                         </StackPanel>
 
                         <CheckBox VerticalAlignment="Bottom" IsChecked="{CompiledBinding FadeInAndOut}" ToolTip.Tip="Smoothly animates in and out when the profile activation conditions change.">

src/Artemis.UI/Screens/Sidebar/Dialogs/ProfileConfigurationEditViewModel.cs

@@ -32,7 +32,6 @@ public class ProfileConfigurationEditViewModel : DialogViewModelBase<ProfileConf
     private bool _fadeInAndOut;
     private ProfileConfigurationHotkeyMode _hotkeyMode;
     private ProfileConfigurationIconType _iconType;
-    private ObservableCollection<ProfileIconViewModel>? _materialIcons;
     private ProfileConfiguration _profileConfiguration;
     private string _profileName;
     private Bitmap? _selectedBitmapSource;
@@ -185,13 +184,7 @@ public class ProfileConfigurationEditViewModel : DialogViewModelBase<ProfileConf
         get => _iconType;
         set => RaiseAndSetIfChanged(ref _iconType, value);
     }
-
+    
-    public ObservableCollection<ProfileIconViewModel>? MaterialIcons
-    {
-        get => _materialIcons;
-        set => RaiseAndSetIfChanged(ref _materialIcons, value);
-    }
-
     public ProfileIconViewModel? SelectedMaterialIcon
     {
         get => _selectedMaterialIcon;
@@ -227,7 +220,6 @@ public class ProfileConfigurationEditViewModel : DialogViewModelBase<ProfileConf
         SelectedMaterialIcon = !IsNew && Enum.TryParse(_profileConfiguration.Icon.IconName, out MaterialIconKind enumValue)
             ? icons.FirstOrDefault(m => m.Icon == enumValue)
             : icons.ElementAt(new Random().Next(0, icons.Count - 1));
-        MaterialIcons = icons;
     }
 
     private async Task SaveIcon()

src/Artemis.UI/Screens/Sidebar/Dialogs/ProfileIconViewModel.cs

@@ -5,11 +5,20 @@ namespace Artemis.UI.Screens.Sidebar;
 
 public class ProfileIconViewModel : ViewModelBase
 {
+    private MaterialIconKind _icon;
+
     public ProfileIconViewModel(MaterialIconKind icon)
     {
         Icon = icon;
-        DisplayName = icon.ToString();
     }
 
-    public MaterialIconKind Icon { get; }
+    public MaterialIconKind Icon
+    {
+        get => _icon;
+        set
+        {
+            RaiseAndSetIfChanged(ref _icon, value);
+            DisplayName = _icon.ToString();
+        }
+    }
 }

src/Artemis.UI/Screens/StartupWizard/Steps/SettingsStep.axaml

@@ -19,7 +19,7 @@
 
             <!-- Auto-run settings -->
             <StackPanel IsVisible="{CompiledBinding IsAutoRunSupported}">
-                <TextBlock Classes="h4" Margin="0 15">
+                <TextBlock Classes="card-title">
                     Auto-run
                 </TextBlock>
                 <Border Classes="card" VerticalAlignment="Stretch" Margin="0,0,5,0">
@@ -69,7 +69,7 @@
 
             <!-- Update settings -->
             <StackPanel>
-                <TextBlock Classes="h4" Margin="0 15">
+                <TextBlock Classes="card-title">
                     Updating
                 </TextBlock>
                 <Border Classes="card" VerticalAlignment="Stretch" Margin="0,0,5,0">

src/Artemis.UI/Screens/Workshop/WorkshopView.axaml

@@ -9,6 +9,7 @@
              xmlns:shared="clr-namespace:Artemis.UI.Shared;assembly=Artemis.UI.Shared"
              xmlns:controls="clr-namespace:Artemis.UI.Shared.Controls;assembly=Artemis.UI.Shared"
              xmlns:gradientPicker="clr-namespace:Artemis.UI.Shared.Controls.GradientPicker;assembly=Artemis.UI.Shared"
+             xmlns:materialIconPicker="clr-namespace:Artemis.UI.Shared.MaterialIconPicker;assembly=Artemis.UI.Shared"
              mc:Ignorable="d" d:DesignWidth="800"
              x:Class="Artemis.UI.Screens.Workshop.WorkshopView"
              x:DataType="workshop:WorkshopViewModel">
@@ -59,6 +60,9 @@
                             Create random gradient
                         </Button>
                         <gradientPicker:GradientPickerButton ColorGradient="{CompiledBinding ColorGradient}" IsCompact="True" />
+                        
+                        <materialIconPicker:MaterialIconPickerButton Name="IconPicker" Value="Abc"/>
+                        <TextBlock Text="{CompiledBinding #IconPicker.Value}"></TextBlock>
                     </StackPanel>
                 </Border>
             </StackPanel>