Add popup gaps override + math min 4 logic to match existing code

Common/SettingsData.qml

@@ -159,6 +159,8 @@ Singleton {
     property string dankBarBorderColor: "surfaceText"
     property real dankBarBorderOpacity: 1.0
     property real dankBarBorderThickness: 1
+    property bool popupGapsAuto: true
+    property int popupGapsManual: 4
 
     onDankBarBorderColorChanged: saveSettings()
     onDankBarBorderOpacityChanged: saveSettings()
@@ -426,6 +428,8 @@ Singleton {
                 dankBarBorderColor = settings.dankBarBorderColor !== undefined ? settings.dankBarBorderColor : "surfaceText"
                 dankBarBorderOpacity = settings.dankBarBorderOpacity !== undefined ? settings.dankBarBorderOpacity : 1.0
                 dankBarBorderThickness = settings.dankBarBorderThickness !== undefined ? settings.dankBarBorderThickness : 1
+                popupGapsAuto = settings.popupGapsAuto !== undefined ? settings.popupGapsAuto : true
+                popupGapsManual = settings.popupGapsManual !== undefined ? settings.popupGapsManual : 4
                 dankBarPosition = settings.dankBarPosition !== undefined ? settings.dankBarPosition : (settings.dankBarAtBottom !== undefined ? (settings.dankBarAtBottom ? SettingsData.Position.Bottom : SettingsData.Position.Top) : (settings.topBarAtBottom !== undefined ? (settings.topBarAtBottom ? SettingsData.Position.Bottom : SettingsData.Position.Top) : SettingsData.Position.Top))
                 lockScreenShowPowerActions = settings.lockScreenShowPowerActions !== undefined ? settings.lockScreenShowPowerActions : true
                 hideBrightnessSlider = settings.hideBrightnessSlider !== undefined ? settings.hideBrightnessSlider : false
@@ -556,6 +560,8 @@ Singleton {
                                                 "dankBarBorderColor": dankBarBorderColor,
                                                 "dankBarBorderOpacity": dankBarBorderOpacity,
                                                 "dankBarBorderThickness": dankBarBorderThickness,
+                                                "popupGapsAuto": popupGapsAuto,
+                                                "popupGapsManual": popupGapsManual,
                                                 "dankBarPosition": dankBarPosition,
                                                 "lockScreenShowPowerActions": lockScreenShowPowerActions,
                                                 "hideBrightnessSlider": hideBrightnessSlider,
@@ -1309,6 +1315,16 @@ Singleton {
         saveSettings()
     }
 
+    function setPopupGapsAuto(enabled) {
+        popupGapsAuto = enabled
+        saveSettings()
+    }
+
+    function setPopupGapsManual(value) {
+        popupGapsManual = value
+        saveSettings()
+    }
+
     function setDankBarPosition(position) {
         dankBarPosition = position
         if (position === SettingsData.Position.Bottom && dockPosition === SettingsData.Position.Bottom && showDock) {

Common/Theme.qml

@@ -16,8 +16,10 @@ Singleton {
 
     readonly property bool envDisableMatugen: Quickshell.env("DMS_DISABLE_MATUGEN") === "1" || Quickshell.env("DMS_DISABLE_MATUGEN") === "true"
 
-    // ! TODO - Synchronize with niri/hyprland gaps?
+    readonly property real popupDistance: {
-    readonly property real popupDistance: SettingsData.dankBarSpacing
+        if (typeof SettingsData === "undefined") return 4
+        return SettingsData.popupGapsAuto ? Math.max(4, SettingsData.dankBarSpacing) : SettingsData.popupGapsManual
+    }
 
     property string currentTheme: "blue"
     property string currentThemeCategory: "generic"

Modules/Settings/DankBarTab.qml

@@ -1154,6 +1154,105 @@ Item {
                         }
                     }
 
+                    Column {
+                        width: parent.width
+                        spacing: Theme.spacingM
+
+                        DankToggle {
+                            width: parent.width
+                            text: I18n.tr("Auto Popup Gaps")
+                            description: I18n.tr("Automatically calculate popup distance from bar edge.")
+                            checked: SettingsData.popupGapsAuto
+                            onToggled: checked => {
+                                SettingsData.setPopupGapsAuto(checked)
+                            }
+                        }
+
+                        Column {
+                            width: parent.width
+                            leftPadding: Theme.spacingM
+                            spacing: Theme.spacingM
+                            visible: !SettingsData.popupGapsAuto
+
+                            Rectangle {
+                                width: parent.width - parent.leftPadding
+                                height: 1
+                                color: Theme.outline
+                                opacity: 0.2
+                            }
+
+                            Column {
+                                width: parent.width - parent.leftPadding
+                                spacing: Theme.spacingS
+
+                                Row {
+                                    width: parent.width
+                                    spacing: Theme.spacingS
+
+                                    StyledText {
+                                        text: I18n.tr("Manual Gap Size")
+                                        font.pixelSize: Theme.fontSizeSmall
+                                        color: Theme.surfaceText
+                                        font.weight: Font.Medium
+                                        anchors.verticalCenter: parent.verticalCenter
+                                    }
+
+                                    Item {
+                                        width: parent.width - manualGapSizeText.implicitWidth - resetManualGapSizeBtn.width - Theme.spacingS - Theme.spacingM
+                                        height: 1
+
+                                        StyledText {
+                                            id: manualGapSizeText
+                                            visible: false
+                                            text: I18n.tr("Manual Gap Size")
+                                            font.pixelSize: Theme.fontSizeSmall
+                                        }
+                                    }
+
+                                    DankActionButton {
+                                        id: resetManualGapSizeBtn
+                                        buttonSize: 20
+                                        iconName: "refresh"
+                                        iconSize: 12
+                                        backgroundColor: Theme.surfaceContainerHigh
+                                        iconColor: Theme.surfaceText
+                                        anchors.verticalCenter: parent.verticalCenter
+                                        onClicked: {
+                                            SettingsData.setPopupGapsManual(4)
+                                        }
+                                    }
+
+                                    Item {
+                                        width: Theme.spacingS
+                                        height: 1
+                                    }
+                                }
+
+                                DankSlider {
+                                    id: popupGapsManualSlider
+                                    width: parent.width
+                                    height: 24
+                                    value: SettingsData.popupGapsManual
+                                    minimum: 0
+                                    maximum: 50
+                                    unit: ""
+                                    showValue: true
+                                    wheelEnabled: false
+                                    thumbOutlineColor: Theme.surfaceContainerHigh
+                                    onSliderValueChanged: newValue => {
+                                        SettingsData.setPopupGapsManual(newValue)
+                                    }
+
+                                    Binding {
+                                        target: popupGapsManualSlider
+                                        property: "value"
+                                        value: SettingsData.popupGapsManual
+                                        restoreMode: Binding.RestoreBinding
+                                    }
+                                }
+                            }
+                        }
+                    }
 
                     DankToggle {
                         width: parent.width