Settings: New Dock tab.

Commons/IconsSets/TablerIcons.qml

@@ -94,7 +94,8 @@ Singleton {
     "brightness-low": "brightness-down-filled",
     "brightness-high": "brightness-up-filled",
     "settings-general": "adjustments-horizontal",
-    "settings-bar": "capsule-horizontal",
+    "settings-bar": "capsule-horizontal-filled",
+    "settings-dock": "layout-bottombar",
     "settings-launcher": "rocket",
     "settings-audio": "device-speaker",
     "settings-display": "device-desktop",

Commons/Settings.qml

@@ -383,6 +383,7 @@ Singleton {
         property bool autoHide: false
         property bool exclusive: false
         property real backgroundOpacity: 1.0
+        property real floatingRatio: 1.0
         property list<string> monitors: []
       }
 

Modules/Dock/Dock.qml

@@ -32,7 +32,6 @@ Variants {
 
       screen: modelData
 
-
       readonly property bool autoHide: Settings.data.dock.autoHide
       readonly property int hideDelay: 500
       readonly property int showDelay: 100
@@ -41,7 +40,7 @@ Variants {
       readonly property int peekHeight: 7 * scaling
       readonly property int fullHeight: dockContainer.height
       readonly property int iconSize: 36 * scaling
-      readonly property int floatingMargin: 12 * scaling // Margin to make dock float
+      readonly property int floatingMargin: Settings.data.dock.floatingRatio * Style.marginL * scaling // Margin to make dock float
 
       // Bar detection and positioning properties
       readonly property bool hasBar: modelData.name ? (Settings.data.bar.monitors.includes(modelData.name)
@@ -65,7 +64,7 @@ Variants {
       WlrLayershell.exclusionMode: Settings.data.dock.exclusive ? ExclusionMode.Auto : ExclusionMode.Ignore
 
       // Set the window size - include extra height only if bar is at bottom
-      implicitWidth: dockContainer.width + (floatingMargin * 2)
+      implicitWidth: dockContainer.width + (Style.marginM * 2 * scaling)
       implicitHeight: fullHeight + floatingMargin + (barAtBottom ? barHeight + dockSpacing : 0)
 
       // Position the entire window above the bar only when bar is at bottom

Modules/SettingsPanel/SettingsPanel.qml

@@ -26,6 +26,7 @@ NPanel {
     About,
     Audio,
     Bar,
+    Dock,
     Hooks,
     Launcher,
     Brightness,
@@ -67,7 +68,6 @@ NPanel {
     id: barTab
     Tabs.BarTab {}
   }
-
   Component {
     id: audioTab
     Tabs.AudioTab {}
@@ -112,6 +112,10 @@ NPanel {
     id: hooksTab
     Tabs.HooksTab {}
   }
+  Component {
+    id: dockTab
+    Tabs.DockTab {}
+  }
 
   // Order *DOES* matter
   function updateTabsModel() {
@@ -125,6 +129,11 @@ NPanel {
                      "label": "Bar",
                      "icon": "settings-bar",
                      "source": barTab
+                   }, {
+                     "id": SettingsPanel.Tab.Dock,
+                     "label": "Dock",
+                     "icon": "settings-dock",
+                     "source": dockTab
                    }, {
                      "id": SettingsPanel.Tab.Launcher,
                      "label": "Launcher",

Modules/SettingsPanel/Tabs/DockTab.qml

@@ -0,0 +1,84 @@
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+import qs.Commons
+import qs.Services
+import qs.Widgets
+
+ColumnLayout {
+  id: contentColumn
+  spacing: Style.marginL * scaling
+  width: root.width
+
+  NToggle {
+    label: "Auto-hide"
+    description: "Automatically hide when not in use."
+    checked: Settings.data.dock.autoHide
+    onToggled: checked => Settings.data.dock.autoHide = checked
+  }
+
+  NToggle {
+    label: "Exclusive Zone"
+    description: "Ensure windows don't open underneath."
+    checked: Settings.data.dock.exclusive
+    onToggled: checked => Settings.data.dock.exclusive = checked
+  }
+
+  ColumnLayout {
+    spacing: Style.marginXXS * scaling
+    Layout.fillWidth: true
+
+    NLabel {
+      label: "Background Opacity"
+      description: "Adjust the background opacity."
+    }
+
+    RowLayout {
+      NSlider {
+        Layout.fillWidth: true
+        from: 0
+        to: 1
+        stepSize: 0.01
+        value: Settings.data.dock.backgroundOpacity
+        onMoved: Settings.data.dock.backgroundOpacity = value
+        cutoutColor: Color.mSurface
+      }
+
+      NText {
+        text: Math.floor(Settings.data.dock.backgroundOpacity * 100) + "%"
+        Layout.alignment: Qt.AlignVCenter
+        Layout.leftMargin: Style.marginS * scaling
+        color: Color.mOnSurface
+      }
+    }
+  }
+
+  // ColumnLayout {
+  //   spacing: Style.marginXXS * scaling
+  //   Layout.fillWidth: true
+
+  //   NLabel {
+  //     label: "Dock Floating Distance"
+  //     description: "Adjust the floating distance from the screen edge."
+  //   }
+
+  //   RowLayout {
+  //     NSlider {
+  //       Layout.fillWidth: true
+  //       from: 0
+  //       to: 4
+  //       stepSize: 0.01
+  //       value: Settings.data.dock.floatingRatio
+  //       onMoved: Settings.data.dock.floatingRatio = value
+  //       cutoutColor: Color.mSurface
+  //     }
+
+  //     NText {
+  //       text: Math.floor(Settings.data.dock.floatingRatio * 100) + "%"
+  //       Layout.alignment: Qt.AlignVCenter
+  //       Layout.leftMargin: Style.marginS * scaling
+  //       color: Color.mOnSurface
+  //     }
+  //   }
+  // }
+}

Modules/SettingsPanel/Tabs/GeneralTab.qml

@@ -183,77 +183,6 @@ ColumnLayout {
     Layout.bottomMargin: Style.marginXL * scaling
   }
 
-  // Dock
-  ColumnLayout {
-    spacing: Style.marginL * scaling
-    Layout.fillWidth: true
-    NText {
-      text: "Dock"
-      font.pointSize: Style.fontSizeXXL * scaling
-      font.weight: Style.fontWeightBold
-      color: Color.mSecondary
-      Layout.bottomMargin: Style.marginS * scaling
-    }
-
-    NToggle {
-      label: "Auto-hide Dock"
-      description: "Automatically hide the dock when not in use."
-      checked: Settings.data.dock.autoHide
-      onToggled: checked => Settings.data.dock.autoHide = checked
-    }
-
-    NToggle {
-      label: "Exclusive Dock"
-      description: "Ensure windows don't open underneath the Dock."
-      checked: Settings.data.dock.exclusive
-      onToggled: checked => Settings.data.dock.exclusive = checked
-    }
-
-    ColumnLayout {
-      spacing: Style.marginXXS * scaling
-      Layout.fillWidth: true
-
-      NText {
-        text: "Dock Background Opacity"
-        font.pointSize: Style.fontSizeL * scaling
-        font.weight: Style.fontWeightBold
-        color: Color.mOnSurface
-      }
-
-      NText {
-        text: "Adjust the background opacity of the dock."
-        font.pointSize: Style.fontSizeXS * scaling
-        color: Color.mOnSurfaceVariant
-        wrapMode: Text.WordWrap
-        Layout.fillWidth: true
-      }
-
-      RowLayout {
-        NSlider {
-          Layout.fillWidth: true
-          from: 0
-          to: 1
-          stepSize: 0.01
-          value: Settings.data.dock.backgroundOpacity
-          onMoved: Settings.data.dock.backgroundOpacity = value
-          cutoutColor: Color.mSurface
-        }
-
-        NText {
-          text: Math.floor(Settings.data.dock.backgroundOpacity * 100) + "%"
-          Layout.alignment: Qt.AlignVCenter
-          Layout.leftMargin: Style.marginS * scaling
-          color: Color.mOnSurface
-        }
-      }
-    }
-  }
-  NDivider {
-    Layout.fillWidth: true
-    Layout.topMargin: Style.marginXL * scaling
-    Layout.bottomMargin: Style.marginXL * scaling
-  }
-
   // Fonts
   ColumnLayout {
     spacing: Style.marginL * scaling