namespace tweaks for blur and layer targets

Common/SettingsData.qml

@@ -262,6 +262,8 @@ Singleton {
     property bool popupGapsAuto: true
     property int popupGapsManual: 4
 
+    property bool modalDarkenBackground: true
+
     property bool lockScreenShowPowerActions: true
     property bool enableFprint: false
     property int maxFprintTries: 3
@@ -549,6 +551,7 @@ Singleton {
                 dankBarBorderThickness = settings.dankBarBorderThickness !== undefined ? settings.dankBarBorderThickness : 1
                 popupGapsAuto = settings.popupGapsAuto !== undefined ? settings.popupGapsAuto : true
                 popupGapsManual = settings.popupGapsManual !== undefined ? settings.popupGapsManual : 4
+                modalDarkenBackground = settings.modalDarkenBackground !== undefined ? settings.modalDarkenBackground : true
                 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
@@ -724,6 +727,7 @@ Singleton {
                                                 "dankBarBorderThickness": dankBarBorderThickness,
                                                 "popupGapsAuto": popupGapsAuto,
                                                 "popupGapsManual": popupGapsManual,
+                                                "modalDarkenBackground": modalDarkenBackground,
                                                 "dankBarPosition": dankBarPosition,
                                                 "lockScreenShowPowerActions": lockScreenShowPowerActions,
                                                 "enableFprint": enableFprint,
@@ -780,7 +784,7 @@ Singleton {
     }
 
     function cleanupUnusedKeys() {
-        const validKeys = ["currentThemeName", "customThemeFile", "matugenScheme", "runUserMatugenTemplates", "matugenTargetMonitor", "dankBarTransparency", "dankBarWidgetTransparency", "popupTransparency", "dockTransparency", "use24HourClock", "showSeconds", "useFahrenheit", "nightModeEnabled", "weatherLocation", "weatherCoordinates", "useAutoLocation", "weatherEnabled", "showLauncherButton", "showWorkspaceSwitcher", "showFocusedWindow", "showWeather", "showMusic", "showClipboard", "showCpuUsage", "showMemUsage", "showCpuTemp", "showGpuTemp", "selectedGpuIndex", "enabledGpuPciIds", "showSystemTray", "showClock", "showNotificationButton", "showBattery", "showControlCenterButton", "controlCenterShowNetworkIcon", "controlCenterShowBluetoothIcon", "controlCenterShowAudioIcon", "controlCenterWidgets", "showWorkspaceIndex", "workspaceScrolling", "showWorkspacePadding", "showWorkspaceApps", "maxWorkspaceIcons", "workspacesPerMonitor", "dwlShowAllTags", "workspaceNameIcons", "waveProgressEnabled", "clockCompactMode", "focusedWindowCompactMode", "runningAppsCompactMode", "keyboardLayoutNameCompactMode", "runningAppsCurrentWorkspace", "runningAppsGroupByApp", "clockDateFormat", "lockDateFormat", "mediaSize", "dankBarLeftWidgets", "dankBarCenterWidgets", "dankBarRightWidgets", "appLauncherViewMode", "spotlightModalViewMode", "sortAppsAlphabetically", "networkPreference", "vpnLastConnected", "iconTheme", "launcherLogoMode", "launcherLogoCustomPath", "launcherLogoColorOverride", "launcherLogoColorInvertOnMode", "launcherLogoBrightness", "launcherLogoContrast", "launcherLogoSizeOffset", "fontFamily", "monoFontFamily", "fontWeight", "fontScale", "dankBarFontScale", "notepadUseMonospace", "notepadFontFamily", "notepadFontSize", "notepadShowLineNumbers", "notepadTransparencyOverride", "notepadLastCustomTransparency", "soundsEnabled", "useSystemSoundTheme", "soundNewNotification", "soundVolumeChanged", "soundPluggedIn", "gtkThemingEnabled", "qtThemingEnabled", "syncModeWithPortal", "showDock", "dockAutoHide", "dockGroupByApp", "dockOpenOnOverview", "dockPosition", "dockSpacing", "dockBottomGap", "dockIconSize", "dockIndicatorStyle", "cornerRadius", "notificationOverlayEnabled", "dankBarAutoHide", "dankBarOpenOnOverview", "dankBarVisible", "dankBarSpacing", "dankBarBottomGap", "dankBarInnerPadding", "dankBarSquareCorners", "dankBarNoBackground", "dankBarGothCornersEnabled", "dankBarBorderEnabled", "dankBarBorderColor", "dankBarBorderOpacity", "dankBarBorderThickness", "popupGapsAuto", "popupGapsManual", "dankBarPosition", "lockScreenShowPowerActions", "enableFprint", "maxFprintTries", "hideBrightnessSlider", "widgetBackgroundColor", "surfaceBase", "wallpaperFillMode", "blurredWallpaperLayer", "blurWallpaperOnOverview", "notificationTimeoutLow", "notificationTimeoutNormal", "notificationTimeoutCritical", "notificationPopupPosition", "osdAlwaysShowValue", "powerActionConfirm", "customPowerActionLock", "customPowerActionLogout", "customPowerActionSuspend", "customPowerActionHibernate", "customPowerActionReboot", "customPowerActionPowerOff", "updaterUseCustomCommand", "updaterCustomCommand", "updaterTerminalAdditionalParams", "screenPreferences", "showOnLastDisplay", "animationSpeed", "customAnimationDuration", "acMonitorTimeout", "acLockTimeout", "acSuspendTimeout", "acHibernateTimeout", "batteryMonitorTimeout", "batteryLockTimeout", "batterySuspendTimeout", "batteryHibernateTimeout", "lockBeforeSuspend", "loginctlLockIntegration", "launchPrefix", "brightnessDevicePins", "configVersion"]
+        const validKeys = ["currentThemeName", "customThemeFile", "matugenScheme", "runUserMatugenTemplates", "matugenTargetMonitor", "dankBarTransparency", "dankBarWidgetTransparency", "popupTransparency", "dockTransparency", "use24HourClock", "showSeconds", "useFahrenheit", "nightModeEnabled", "weatherLocation", "weatherCoordinates", "useAutoLocation", "weatherEnabled", "showLauncherButton", "showWorkspaceSwitcher", "showFocusedWindow", "showWeather", "showMusic", "showClipboard", "showCpuUsage", "showMemUsage", "showCpuTemp", "showGpuTemp", "selectedGpuIndex", "enabledGpuPciIds", "showSystemTray", "showClock", "showNotificationButton", "showBattery", "showControlCenterButton", "controlCenterShowNetworkIcon", "controlCenterShowBluetoothIcon", "controlCenterShowAudioIcon", "controlCenterWidgets", "showWorkspaceIndex", "workspaceScrolling", "showWorkspacePadding", "showWorkspaceApps", "maxWorkspaceIcons", "workspacesPerMonitor", "dwlShowAllTags", "workspaceNameIcons", "waveProgressEnabled", "clockCompactMode", "focusedWindowCompactMode", "runningAppsCompactMode", "keyboardLayoutNameCompactMode", "runningAppsCurrentWorkspace", "runningAppsGroupByApp", "clockDateFormat", "lockDateFormat", "mediaSize", "dankBarLeftWidgets", "dankBarCenterWidgets", "dankBarRightWidgets", "appLauncherViewMode", "spotlightModalViewMode", "sortAppsAlphabetically", "networkPreference", "vpnLastConnected", "iconTheme", "launcherLogoMode", "launcherLogoCustomPath", "launcherLogoColorOverride", "launcherLogoColorInvertOnMode", "launcherLogoBrightness", "launcherLogoContrast", "launcherLogoSizeOffset", "fontFamily", "monoFontFamily", "fontWeight", "fontScale", "dankBarFontScale", "notepadUseMonospace", "notepadFontFamily", "notepadFontSize", "notepadShowLineNumbers", "notepadTransparencyOverride", "notepadLastCustomTransparency", "soundsEnabled", "useSystemSoundTheme", "soundNewNotification", "soundVolumeChanged", "soundPluggedIn", "gtkThemingEnabled", "qtThemingEnabled", "syncModeWithPortal", "showDock", "dockAutoHide", "dockGroupByApp", "dockOpenOnOverview", "dockPosition", "dockSpacing", "dockBottomGap", "dockIconSize", "dockIndicatorStyle", "cornerRadius", "notificationOverlayEnabled", "dankBarAutoHide", "dankBarOpenOnOverview", "dankBarVisible", "dankBarSpacing", "dankBarBottomGap", "dankBarInnerPadding", "dankBarSquareCorners", "dankBarNoBackground", "dankBarGothCornersEnabled", "dankBarBorderEnabled", "dankBarBorderColor", "dankBarBorderOpacity", "dankBarBorderThickness", "popupGapsAuto", "popupGapsManual", "modalDarkenBackground", "dankBarPosition", "lockScreenShowPowerActions", "enableFprint", "maxFprintTries", "hideBrightnessSlider", "widgetBackgroundColor", "surfaceBase", "wallpaperFillMode", "blurredWallpaperLayer", "blurWallpaperOnOverview", "notificationTimeoutLow", "notificationTimeoutNormal", "notificationTimeoutCritical", "notificationPopupPosition", "osdAlwaysShowValue", "powerActionConfirm", "customPowerActionLock", "customPowerActionLogout", "customPowerActionSuspend", "customPowerActionHibernate", "customPowerActionReboot", "customPowerActionPowerOff", "updaterUseCustomCommand", "updaterCustomCommand", "updaterTerminalAdditionalParams", "screenPreferences", "showOnLastDisplay", "animationSpeed", "customAnimationDuration", "acMonitorTimeout", "acLockTimeout", "acSuspendTimeout", "acHibernateTimeout", "batteryMonitorTimeout", "batteryLockTimeout", "batterySuspendTimeout", "batteryHibernateTimeout", "lockBeforeSuspend", "loginctlLockIntegration", "launchPrefix", "brightnessDevicePins", "configVersion"]
 
         try {
             const content = settingsFile.text()
@@ -1808,6 +1812,11 @@ Singleton {
         saveSettings()
     }
 
+    function setModalDarkenBackground(enabled) {
+        modalDarkenBackground = enabled
+        saveSettings()
+    }
+
     function setNotificationTimeoutLow(timeout) {
         notificationTimeoutLow = timeout
         saveSettings()

Modals/Common/DankModal.qml

@@ -8,7 +8,8 @@ import qs.Services
 PanelWindow {
     id: root
 
-    WlrLayershell.namespace: "quickshell:modal"
+    property string blurNamespace: "dms:modal"
+    WlrLayershell.namespace: blurNamespace
 
     property alias content: contentLoader.sourceComponent
     property alias contentLoader: contentLoader
@@ -110,24 +111,24 @@ PanelWindow {
         bottom: true
     }
 
+    MouseArea {
+        anchors.fill: parent
+        enabled: root.closeOnBackgroundClick && root.shouldBeVisible
+        onClicked: mouse => {
+                       const localPos = mapToItem(contentContainer, mouse.x, mouse.y)
+                       if (localPos.x < 0 || localPos.x > contentContainer.width || localPos.y < 0 || localPos.y > contentContainer.height) {
+                           root.backgroundClicked()
+                       }
+                   }
+    }
+
     Rectangle {
         id: background
 
         anchors.fill: parent
         color: "black"
-        opacity: root.showBackground ? (root.shouldBeVisible ? root.backgroundOpacity : 0) : 0
+        opacity: root.showBackground && SettingsData.modalDarkenBackground ? (root.shouldBeVisible ? root.backgroundOpacity : 0) : 0
-        visible: root.showBackground
+        visible: root.showBackground && SettingsData.modalDarkenBackground
-
-        MouseArea {
-            anchors.fill: parent
-            enabled: root.closeOnBackgroundClick
-            onClicked: mouse => {
-                           const localPos = mapToItem(contentContainer, mouse.x, mouse.y)
-                           if (localPos.x < 0 || localPos.x > contentContainer.width || localPos.y < 0 || localPos.y > contentContainer.height) {
-                               root.backgroundClicked()
-                           }
-                       }
-        }
 
         Behavior on opacity {
             NumberAnimation {

Modals/Settings/SettingsModal.qml

@@ -36,6 +36,7 @@ DankModal {
     objectName: "settingsModal"
     width: Math.min(800, screenWidth * 0.9)
     height: Math.min(800, screenHeight * 0.85)
+    backgroundColor: Theme.popupBackground()
     visible: false
     onBackgroundClicked: () => {
         return hide();

Modals/Settings/SettingsSidebar.qml

@@ -55,7 +55,7 @@ Rectangle {
 
     width: 270
     height: parent.height
-    color: Theme.surfaceContainer
+    color: Theme.popupBackground()
     radius: Theme.cornerRadius
 
     DankFlickable {

Modules/DankDash/DankDashPopout.qml

@@ -105,7 +105,7 @@ DankPopout {
             id: mainContainer
 
             implicitHeight: contentColumn.height + Theme.spacingM * 2
-            color: Theme.surfaceContainer
+            color: Theme.popupBackground()
             radius: Theme.cornerRadius
             focus: true
 

Modules/Settings/ThemeColorsTab.qml

@@ -866,7 +866,6 @@ Item {
                         }
                     }
 
-
                     Rectangle {
                         width: parent.width
                         height: 1
@@ -901,6 +900,49 @@ Item {
                                                   }
                         }
                     }
+
+                    Rectangle {
+                        width: parent.width
+                        height: 1
+                        color: Theme.outline
+                        opacity: 0.2
+                    }
+
+                    Row {
+                        width: parent.width
+                        height: 40
+                        spacing: Theme.spacingM
+
+                        Column {
+                            width: parent.width - modalBackgroundToggle.width - parent.spacing
+                            anchors.verticalCenter: parent.verticalCenter
+                            spacing: 2
+
+                            StyledText {
+                                text: I18n.tr("Darken Modal Background")
+                                font.pixelSize: Theme.fontSizeMedium
+                                color: Theme.surfaceText
+                                font.weight: Font.Medium
+                            }
+
+                            StyledText {
+                                text: I18n.tr("Show darkened overlay behind modal dialogs")
+                                font.pixelSize: Theme.fontSizeSmall
+                                color: Theme.surfaceVariantText
+                            }
+                        }
+
+                        DankToggle {
+                            id: modalBackgroundToggle
+                            width: 48
+                            height: 24
+                            anchors.verticalCenter: parent.verticalCenter
+                            checked: SettingsData.modalDarkenBackground
+                            onToggled: checked => {
+                                SettingsData.setModalDarkenBackground(checked)
+                            }
+                        }
+                    }
                 }
             }
 

Widgets/AppLauncherGridDelegate.qml

@@ -36,7 +36,7 @@ Rectangle {
     width: cellWidth - cellPadding
     height: cellHeight - cellPadding
     radius: Theme.cornerRadius
-    color: currentIndex === index ? Theme.primaryPressed : mouseArea.containsMouse ? Theme.primaryHoverLight : Theme.surfaceContainerHigh
+    color: currentIndex === index ? Theme.surfaceContainerHighest : mouseArea.containsMouse ? Theme.surfaceContainerHighest : Theme.surfaceContainerHigh
 
     Column {
         anchors.centerIn: parent

Widgets/AppLauncherListDelegate.qml

@@ -34,7 +34,7 @@ Rectangle {
     width: listView.width
     height: itemHeight
     radius: Theme.cornerRadius
-    color: isCurrentItem ? Theme.primaryPressed : mouseArea.containsMouse ? Theme.primaryHoverLight : Theme.surfaceContainerHigh
+    color: isCurrentItem ? Theme.surfaceContainerHighest : mouseArea.containsMouse ? Theme.surfaceContainerHighest : Theme.surfaceContainerHigh
 
     Row {
         anchors.fill: parent

Widgets/DankOSD.qml

@@ -3,10 +3,14 @@ import QtQuick.Effects
 import Quickshell
 import Quickshell.Wayland
 import qs.Common
+import qs.Services
 
 PanelWindow {
     id: root
 
+    property string blurNamespace: "dms:osd"
+    WlrLayershell.namespace: blurNamespace
+
     property alias content: contentLoader.sourceComponent
     property alias contentLoader: contentLoader
     property var modelData
@@ -63,6 +67,14 @@ PanelWindow {
     WlrLayershell.keyboardFocus: WlrKeyboardFocus.None
     color: "transparent"
 
+    readonly property real dpr: CompositorService.getScreenScale(screen)
+    readonly property real screenWidth: screen.width
+    readonly property real screenHeight: screen.height
+    readonly property real alignedWidth: Theme.px(osdWidth, dpr)
+    readonly property real alignedHeight: Theme.px(osdHeight, dpr)
+    readonly property real alignedX: Theme.snap((screenWidth - alignedWidth) / 2, dpr)
+    readonly property real alignedY: Theme.snap(screenHeight - alignedHeight - Theme.spacingM, dpr)
+
     anchors {
         top: true
         left: true
@@ -95,23 +107,25 @@ PanelWindow {
         }
     }
 
-    Rectangle {
+    Item {
         id: osdContainer
+        x: alignedX
+        y: alignedY
+        width: alignedWidth
+        height: alignedHeight
+        opacity: shouldBeVisible ? 1 : 0
+        scale: shouldBeVisible ? 1 : 0.9
 
         property bool childHovered: false
 
-        width: osdWidth
+        Rectangle {
-        height: osdHeight
+            id: osdBackground
-        anchors.horizontalCenter: parent.horizontalCenter
+            anchors.fill: parent
-        anchors.bottom: parent.bottom
+            color: Theme.popupBackground()
-        anchors.bottomMargin: Theme.spacingM
+            radius: Theme.cornerRadius
-        color: Theme.popupBackground()
+            border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.08)
-        radius: Theme.cornerRadius
+            border.width: 1
-        border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.08)
+        }
-        border.width: 1
-        opacity: shouldBeVisible ? 1 : 0
-        scale: shouldBeVisible ? 1 : 0.9
-        layer.enabled: true
 
         MouseArea {
             id: mouseArea
@@ -132,14 +146,6 @@ PanelWindow {
             asynchronous: false
         }
 
-        layer.effect: MultiEffect {
-            shadowEnabled: true
-            shadowHorizontalOffset: 0
-            shadowVerticalOffset: 4
-            shadowBlur: 0.8
-            shadowColor: Qt.rgba(0, 0, 0, 0.3)
-        }
-
         Behavior on opacity {
             NumberAnimation {
                 duration: animationDuration
@@ -156,6 +162,6 @@ PanelWindow {
     }
 
     mask: Region {
-        item: osdContainer
+        item: osdBackground
     }
 }

Widgets/DankPopout.qml

@@ -8,7 +8,8 @@ import qs.Services
 PanelWindow {
     id: root
 
-    WlrLayershell.namespace: "quickshell:popout"
+    property string blurNamespace: "dms:popout"
+    WlrLayershell.namespace: blurNamespace
 
     property alias content: contentLoader.sourceComponent
     property alias contentLoader: contentLoader