spotlight: restore darken background option

fixes #1126

quickshell/Common/SettingsData.qml

@@ -312,6 +312,8 @@ Singleton {
     property int overviewColumns: 5
     property real overviewScale: 0.16
 
+    property bool modalDarkenBackground: true
+
     property bool lockScreenShowPowerActions: true
     property bool lockScreenShowSystemIcons: true
     property bool lockScreenShowTime: true

quickshell/Common/settings/SettingsSpec.js

@@ -211,6 +211,8 @@ var SPEC = {
     overviewColumns: { def: 5, persist: false },
     overviewScale: { def: 0.16, persist: false },
 
+    modalDarkenBackground: { def: true },
+
     lockScreenShowPowerActions: { def: true },
     lockScreenShowSystemIcons: { def: true },
     lockScreenShowTime: { def: true },

quickshell/Modals/Common/DankModal.qml

@@ -19,6 +19,8 @@ Item {
     readonly property real screenWidth: effectiveScreen?.width ?? 1920
     readonly property real screenHeight: effectiveScreen?.height ?? 1080
     readonly property real dpr: effectiveScreen ? CompositorService.getScreenScale(effectiveScreen) : 1
+    property bool showBackground: true
+    property real backgroundOpacity: 0.5
     property string positioning: "center"
     property point customPosition: Qt.point(0, 0)
     property bool closeOnEscapeKey: true
@@ -46,7 +48,8 @@ Item {
     readonly property alias contentWindow: contentWindow
     readonly property alias clickCatcher: clickCatcher
     readonly property bool useHyprlandFocusGrab: CompositorService.useHyprlandFocusGrab
-    readonly property bool useSingleWindow: useHyprlandFocusGrab
+    readonly property bool useBackground: showBackground && SettingsData.modalDarkenBackground
+    readonly property bool useSingleWindow: useHyprlandFocusGrab || useBackground
 
     signal opened
     signal dialogClosed
@@ -272,6 +275,23 @@ Item {
             onClicked: root.backgroundClicked()
         }
 
+        Rectangle {
+            anchors.fill: parent
+            z: -1
+            color: "black"
+            opacity: root.useBackground ? (root.shouldBeVisible ? root.backgroundOpacity : 0) : 0
+            visible: root.useBackground
+
+            Behavior on opacity {
+                enabled: root.animationsEnabled
+                NumberAnimation {
+                    duration: root.animationDuration
+                    easing.type: Easing.BezierSpline
+                    easing.bezierCurve: root.shouldBeVisible ? root.animationEnterCurve : root.animationExitCurve
+                }
+            }
+        }
+
         Item {
             id: modalContainer
             x: root.useSingleWindow ? root.alignedX : shadowBuffer

quickshell/Modules/Settings/ThemeColorsTab.qml

@@ -876,6 +876,21 @@ Item {
                 }
             }
 
+            SettingsCard {
+                tab: "theme"
+                tags: ["modal", "darken", "background", "overlay"]
+
+                SettingsToggleRow {
+                    tab: "theme"
+                    tags: ["modal", "darken", "background", "overlay"]
+                    settingKey: "modalDarkenBackground"
+                    text: I18n.tr("Darken Modal Background")
+                    description: I18n.tr("Show darkened overlay behind modal dialogs")
+                    checked: SettingsData.modalDarkenBackground
+                    onToggled: checked => SettingsData.set("modalDarkenBackground", checked)
+                }
+            }
+
             SettingsCard {
                 tab: "theme"
                 tags: ["applications", "portal", "dark", "terminal"]