diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/App.xaml b/src/settings-ui/Microsoft.PowerToys.Settings.UI/App.xaml
index 3b25047fdf..90ac9bcd85 100644
--- a/src/settings-ui/Microsoft.PowerToys.Settings.UI/App.xaml
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/App.xaml
@@ -14,6 +14,10 @@
+
+
+
+
@@ -41,6 +45,12 @@
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/Setting/Setting.cs b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/Setting/Setting.cs
new file mode 100644
index 0000000000..9a328995bb
--- /dev/null
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/Setting/Setting.cs
@@ -0,0 +1,124 @@
+// Copyright (c) Microsoft Corporation
+// The Microsoft Corporation licenses this file to you under the MIT license.
+// See the LICENSE file in the project root for more information.
+
+using System.ComponentModel;
+using Windows.UI.Xaml;
+using Windows.UI.Xaml.Controls;
+
+namespace Microsoft.PowerToys.Settings.UI.Controls
+{
+ [TemplatePart(Name = PartIconPresenter, Type = typeof(ContentPresenter))]
+ [TemplatePart(Name = PartDescriptionPresenter, Type = typeof(ContentPresenter))]
+ public class Setting : ContentControl
+ {
+ private const string PartIconPresenter = "IconPresenter";
+ private const string PartDescriptionPresenter = "DescriptionPresenter";
+ private ContentPresenter _iconPresenter;
+ private ContentPresenter _descriptionPresenter;
+ private Setting _setting;
+
+ public Setting()
+ {
+ this.DefaultStyleKey = typeof(Setting);
+ }
+
+ public static readonly DependencyProperty TitleProperty = DependencyProperty.Register(
+ "Title",
+ typeof(string),
+ typeof(Setting),
+ new PropertyMetadata(default(string)));
+
+ public static readonly DependencyProperty DescriptionProperty = DependencyProperty.Register(
+ "Description",
+ typeof(object),
+ typeof(Setting),
+ new PropertyMetadata(null, OnDescriptionChanged));
+
+ public static readonly DependencyProperty IconProperty = DependencyProperty.Register(
+ "Icon",
+ typeof(object),
+ typeof(Setting),
+ new PropertyMetadata(default(string), OnIconChanged));
+
+ public static readonly DependencyProperty ActionContentProperty = DependencyProperty.Register(
+ "ActionContent",
+ typeof(object),
+ typeof(Setting),
+ null);
+
+ [Localizable(true)]
+ public string Title
+ {
+ get => (string)GetValue(TitleProperty);
+ set => SetValue(TitleProperty, value);
+ }
+
+ [Localizable(true)]
+ public object Description
+ {
+ get => (object)GetValue(DescriptionProperty);
+ set => SetValue(DescriptionProperty, value);
+ }
+
+ public object Icon
+ {
+ get => (object)GetValue(IconProperty);
+ set => SetValue(IconProperty, value);
+ }
+
+ public object ActionContent
+ {
+ get => (object)GetValue(ActionContentProperty);
+ set => SetValue(ActionContentProperty, value);
+ }
+
+ protected override void OnApplyTemplate()
+ {
+ base.OnApplyTemplate();
+ _setting = (Setting)this;
+ _iconPresenter = (ContentPresenter)_setting.GetTemplateChild(PartIconPresenter);
+ _descriptionPresenter = (ContentPresenter)_setting.GetTemplateChild(PartDescriptionPresenter);
+ Update();
+ }
+
+ private static void OnIconChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
+ {
+ ((Setting)d).Update();
+ }
+
+ private static void OnDescriptionChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
+ {
+ ((Setting)d).Update();
+ }
+
+ private void Update()
+ {
+ if (_setting == null)
+ {
+ return;
+ }
+
+ if (_setting._iconPresenter != null)
+ {
+ if (_setting.Icon == null)
+ {
+ _setting._iconPresenter.Visibility = Visibility.Collapsed;
+ }
+ else
+ {
+ _setting._iconPresenter.Visibility = Visibility.Visible;
+ }
+ }
+
+ if (_setting.Description == null)
+ {
+ _setting._descriptionPresenter.Visibility = Visibility.Collapsed;
+ }
+ else
+ {
+ _setting._descriptionPresenter.Visibility = Visibility.Visible;
+ }
+ }
+ }
+}
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/Setting/Setting.xaml b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/Setting/Setting.xaml
new file mode 100644
index 0000000000..7861d9da67
--- /dev/null
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/Setting/Setting.xaml
@@ -0,0 +1,93 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Microsoft.PowerToys.Settings.UI.csproj b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Microsoft.PowerToys.Settings.UI.csproj
index 2874a99aa3..e6adfa775e 100644
--- a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Microsoft.PowerToys.Settings.UI.csproj
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Microsoft.PowerToys.Settings.UI.csproj
@@ -99,6 +99,7 @@
HotkeySettingsControl.xaml
+
ShortcutTextControl.xaml
@@ -279,7 +280,7 @@
6.1.2
- 2.6.0-prerelease.210623001
+ 2.6.1-prerelease.210709001
2.0.1
@@ -310,6 +311,10 @@
Designer
MSBuild:Compile
+
+ Designer
+ MSBuild:Compile
+
Designer
MSBuild:Compile
@@ -390,6 +395,22 @@
MSBuild:Compile
Designer
+
+ Designer
+ MSBuild:Compile
+
+
+ Designer
+ MSBuild:Compile
+
+
+ Designer
+ MSBuild:Compile
+
+
+ Designer
+ MSBuild:Compile
+
MSBuild:Compile
Designer
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/Colors.xaml b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/Colors.xaml
new file mode 100644
index 0000000000..a3c1036e83
--- /dev/null
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/Colors.xaml
@@ -0,0 +1,27 @@
+
+
+
+
+
+
+
+ 1
+
+
+
+
+
+
+ 1
+
+
+
+
+
+
+ 2
+
+
+
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/Generic.xaml b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/Generic.xaml
new file mode 100644
index 0000000000..f387296dfc
--- /dev/null
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/Generic.xaml
@@ -0,0 +1,8 @@
+
+
+
+
+
+
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/SettingsExpanderStyles.xaml b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/SettingsExpanderStyles.xaml
new file mode 100644
index 0000000000..db6db64b31
--- /dev/null
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/SettingsExpanderStyles.xaml
@@ -0,0 +1,40 @@
+
+
+
+ 0
+
+ 56, 12, 40, 12
+
+
+
+
+
+ 0,0,8,0
+
+
+
+
+
+
+
+
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/SettingsSectionStyles.xaml b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/SettingsSectionStyles.xaml
new file mode 100644
index 0000000000..ceb5fd32e0
--- /dev/null
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/SettingsSectionStyles.xaml
@@ -0,0 +1,26 @@
+
+
+
+
+
+
+
+
+
+
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Views/GeneralPage.xaml b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Views/GeneralPage.xaml
index 88511022b6..f1368c2016 100644
--- a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Views/GeneralPage.xaml
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Views/GeneralPage.xaml
@@ -24,6 +24,8 @@
ModuleImageLink="https://aka.ms/powertoys">
+
+
+
+
+ Margin="0,0,48,0">
+
+