themes: consistent usage of primaryPressed

quickshell/Common/Theme.qml

@@ -647,11 +647,7 @@ Singleton {
         }
     }
 
-    property var widgetBaseHoverColor: {
+    property alias widgetBaseHoverColor: root.primaryPressed
-        const baseColor = widgetBaseBackgroundColor;
-        const factor = 1.2;
-        return isLightMode ? Qt.darker(baseColor, factor) : Qt.lighter(baseColor, factor);
-    }
 
     property color widgetIconColor: {
         if (typeof SettingsData === "undefined") {

quickshell/Modules/ControlCenter/Widgets/CompoundPill.qml

@@ -1,5 +1,4 @@
 import QtQuick
-import Quickshell
 import qs.Common
 import qs.Widgets
 
@@ -14,8 +13,8 @@ Rectangle {
     property bool isActive: false
     property bool showExpandArea: true
 
-    signal toggled()
+    signal toggled
-    signal expandClicked()
+    signal expandClicked
     signal wheelEvent(var wheelEvent)
 
     width: parent ? parent.width : 220
@@ -23,15 +22,15 @@ Rectangle {
     radius: Theme.cornerRadius
 
     function hoverTint(base) {
-        const factor = 1.2
+        const factor = 1.2;
-        return Theme.isLightMode ? Qt.darker(base, factor) : Qt.lighter(base, factor)
+        return Theme.isLightMode ? Qt.darker(base, factor) : Qt.lighter(base, factor);
     }
 
     readonly property color _containerBg: Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
 
     color: {
-        const baseColor = bodyMouse.containsMouse ? Theme.widgetBaseHoverColor : _containerBg
+        const baseColor = bodyMouse.containsMouse ? Theme.primaryPressed : _containerBg;
-        return baseColor
+        return baseColor;
     }
     border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.10)
     border.width: 0
@@ -41,14 +40,12 @@ Rectangle {
     readonly property color _labelSecondary: Theme.surfaceVariantText
     readonly property color _tileBgActive: Theme.primary
     readonly property color _tileBgInactive: {
-        const transparency = Theme.popupTransparency
+        const transparency = Theme.popupTransparency;
-        const surface = Theme.surfaceContainer || Qt.rgba(0.1, 0.1, 0.1, 1)
+        const surface = Theme.surfaceContainer || Qt.rgba(0.1, 0.1, 0.1, 1);
-        return Qt.rgba(surface.r, surface.g, surface.b, transparency)
+        return Qt.rgba(surface.r, surface.g, surface.b, transparency);
     }
-    readonly property color _tileRingActive:
+    readonly property color _tileRingActive: Qt.rgba(Theme.primaryText.r, Theme.primaryText.g, Theme.primaryText.b, 0.22)
-        Qt.rgba(Theme.primaryText.r, Theme.primaryText.g, Theme.primaryText.b, 0.22)
+    readonly property color _tileRingInactive: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.18)
-    readonly property color _tileRingInactive:
-        Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.18)
     readonly property color _tileIconActive: Theme.primaryText
     readonly property color _tileIconInactive: Theme.primary
 
@@ -65,7 +62,11 @@ Rectangle {
         color: hoverTint(_containerBg)
         opacity: 0.08
         antialiasing: true
-        Behavior on opacity { NumberAnimation { duration: Theme.shortDuration } }
+        Behavior on opacity {
+            NumberAnimation {
+                duration: Theme.shortDuration
+            }
+        }
     }
 
     Row {
@@ -94,7 +95,11 @@ Rectangle {
                 opacity: tileMouse.pressed ? 0.3 : (tileMouse.containsMouse ? 0.2 : 0.0)
                 visible: opacity > 0
                 antialiasing: true
-                Behavior on opacity { NumberAnimation { duration: Theme.shortDuration } }
+                Behavior on opacity {
+                    NumberAnimation {
+                        duration: Theme.shortDuration
+                    }
+                }
             }
 
             DankIcon {
@@ -149,22 +154,32 @@ Rectangle {
                 anchors.fill: parent
                 hoverEnabled: true
                 cursorShape: Qt.PointingHandCursor
-                onEntered: { rightHoverOverlay.visible = true; rightHoverOverlay.opacity = 0.08 }
+                onEntered: {
-                onExited:  { rightHoverOverlay.opacity = 0.0; rightHoverOverlay.visible = false }
+                    rightHoverOverlay.visible = true;
+                    rightHoverOverlay.opacity = 0.08;
+                }
+                onExited: {
+                    rightHoverOverlay.opacity = 0.0;
+                    rightHoverOverlay.visible = false;
+                }
                 onPressed: rightHoverOverlay.opacity = 0.16
                 onReleased: rightHoverOverlay.opacity = containsMouse ? 0.08 : 0.0
                 onClicked: root.expandClicked()
                 onWheel: function (ev) {
-                    root.wheelEvent(ev)
+                    root.wheelEvent(ev);
                 }
             }
-
         }
     }
 
     focus: true
     Keys.onPressed: function (ev) {
-        if (ev.key === Qt.Key_Space || ev.key === Qt.Key_Return) { root.toggled(); ev.accepted = true }
+        if (ev.key === Qt.Key_Space || ev.key === Qt.Key_Return) {
-        else if (ev.key === Qt.Key_Right) { root.expandClicked(); ev.accepted = true }
+            root.toggled();
+            ev.accepted = true;
+        } else if (ev.key === Qt.Key_Right) {
+            root.expandClicked();
+            ev.accepted = true;
+        }
     }
 }

quickshell/Modules/ControlCenter/Widgets/SmallBatteryButton.qml

@@ -1,5 +1,4 @@
 import QtQuick
-import Quickshell
 import qs.Common
 import qs.Services
 import qs.Widgets
@@ -10,31 +9,32 @@ Rectangle {
     property bool isActive: BatteryService.batteryAvailable && (BatteryService.isCharging || BatteryService.isPluggedIn)
     property bool enabled: BatteryService.batteryAvailable
 
-    signal clicked()
+    signal clicked
 
     width: parent ? ((parent.width - parent.spacing * 3) / 4) : 48
     height: 48
     radius: {
-        if (Theme.cornerRadius === 0) return 0
+        if (Theme.cornerRadius === 0)
-        return isActive ? Theme.cornerRadius : Theme.cornerRadius + 4
+            return 0;
+        return isActive ? Theme.cornerRadius : Theme.cornerRadius + 4;
     }
 
     function hoverTint(base) {
-        const factor = 1.2
+        const factor = 1.2;
-        return Theme.isLightMode ? Qt.darker(base, factor) : Qt.lighter(base, factor)
+        return Theme.isLightMode ? Qt.darker(base, factor) : Qt.lighter(base, factor);
     }
 
     readonly property color _tileBgActive: Theme.primary
     readonly property color _tileBgInactive: Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
-    readonly property color _tileRingActive:
+    readonly property color _tileRingActive: Qt.rgba(Theme.primaryText.r, Theme.primaryText.g, Theme.primaryText.b, 0.22)
-        Qt.rgba(Theme.primaryText.r, Theme.primaryText.g, Theme.primaryText.b, 0.22)
     readonly property color _tileIconActive: Theme.primaryText
     readonly property color _tileIconInactive: Theme.primary
 
     color: {
-        if (isActive) return _tileBgActive
+        if (isActive)
-        const baseColor = mouseArea.containsMouse ? Theme.widgetBaseHoverColor : _tileBgInactive
+            return _tileBgActive;
-        return baseColor
+        const baseColor = mouseArea.containsMouse ? Theme.primaryPressed : _tileBgInactive;
+        return baseColor;
     }
     border.color: isActive ? _tileRingActive : "transparent"
     border.width: isActive ? 1 : 0
@@ -48,7 +48,11 @@ Rectangle {
         opacity: mouseArea.pressed ? 0.3 : (mouseArea.containsMouse ? 0.2 : 0.0)
         visible: opacity > 0
         antialiasing: true
-        Behavior on opacity { NumberAnimation { duration: Theme.shortDuration } }
+        Behavior on opacity {
+            NumberAnimation {
+                duration: Theme.shortDuration
+            }
+        }
     }
 
     Row {
@@ -60,9 +64,9 @@ Rectangle {
             size: parent.parent.width * 0.25
             color: {
                 if (BatteryService.isLowBattery && !BatteryService.isCharging) {
-                    return Theme.error
+                    return Theme.error;
                 }
-                return isActive ? _tileIconActive : _tileIconInactive
+                return isActive ? _tileIconActive : _tileIconInactive;
             }
             anchors.verticalCenter: parent.verticalCenter
         }
@@ -73,9 +77,9 @@ Rectangle {
             font.weight: Font.Medium
             color: {
                 if (BatteryService.isLowBattery && !BatteryService.isCharging) {
-                    return Theme.error
+                    return Theme.error;
                 }
-                return isActive ? _tileIconActive : _tileIconInactive
+                return isActive ? _tileIconActive : _tileIconInactive;
             }
             anchors.verticalCenter: parent.verticalCenter
             visible: BatteryService.batteryAvailable

quickshell/Modules/ControlCenter/Widgets/SmallDiskUsageButton.qml

@@ -37,7 +37,7 @@ Rectangle {
 
     readonly property color _tileBg: Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
 
-    color: mouseArea.containsMouse ? Theme.widgetBaseHoverColor : _tileBg
+    color: mouseArea.containsMouse ? Theme.primaryPressed : _tileBg
     border.color: "transparent"
     border.width: 0
     antialiasing: true

quickshell/Modules/ControlCenter/Widgets/SmallToggleButton.qml

@@ -1,5 +1,4 @@
 import QtQuick
-import Quickshell
 import qs.Common
 import qs.Widgets
 
@@ -11,32 +10,33 @@ Rectangle {
     property bool enabled: true
     property real iconRotation: 0
 
-    signal clicked()
+    signal clicked
-    signal iconRotationCompleted()
+    signal iconRotationCompleted
 
     width: parent ? ((parent.width - parent.spacing * 3) / 4) : 48
     height: 48
     radius: {
-        if (Theme.cornerRadius === 0) return 0
+        if (Theme.cornerRadius === 0)
-        return isActive ? Theme.cornerRadius : Theme.cornerRadius + 4
+            return 0;
+        return isActive ? Theme.cornerRadius : Theme.cornerRadius + 4;
     }
 
     function hoverTint(base) {
-        const factor = 1.2
+        const factor = 1.2;
-        return Theme.isLightMode ? Qt.darker(base, factor) : Qt.lighter(base, factor)
+        return Theme.isLightMode ? Qt.darker(base, factor) : Qt.lighter(base, factor);
     }
 
     readonly property color _tileBgActive: Theme.primary
     readonly property color _tileBgInactive: Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
-    readonly property color _tileRingActive:
+    readonly property color _tileRingActive: Qt.rgba(Theme.primaryText.r, Theme.primaryText.g, Theme.primaryText.b, 0.22)
-        Qt.rgba(Theme.primaryText.r, Theme.primaryText.g, Theme.primaryText.b, 0.22)
     readonly property color _tileIconActive: Theme.primaryText
     readonly property color _tileIconInactive: Theme.primary
 
     color: {
-        if (isActive) return _tileBgActive
+        if (isActive)
-        const baseColor = mouseArea.containsMouse ? Theme.widgetBaseHoverColor : _tileBgInactive
+            return _tileBgActive;
-        return baseColor
+        const baseColor = mouseArea.containsMouse ? Theme.primaryPressed : _tileBgInactive;
+        return baseColor;
     }
     border.color: isActive ? _tileRingActive : "transparent"
     border.width: isActive ? 1 : 0
@@ -50,7 +50,11 @@ Rectangle {
         opacity: mouseArea.pressed ? 0.3 : (mouseArea.containsMouse ? 0.2 : 0.0)
         visible: opacity > 0
         antialiasing: true
-        Behavior on opacity { NumberAnimation { duration: Theme.shortDuration } }
+        Behavior on opacity {
+            NumberAnimation {
+                duration: Theme.shortDuration
+            }
+        }
     }
 
     DankIcon {

quickshell/Modules/ControlCenter/Widgets/ToggleButton.qml

@@ -1,5 +1,4 @@
 import QtQuick
-import Quickshell
 import qs.Common
 import qs.Widgets
 
@@ -13,33 +12,34 @@ Rectangle {
     property string secondaryText: ""
     property real iconRotation: 0
 
-    signal clicked()
+    signal clicked
-    signal iconRotationCompleted()
+    signal iconRotationCompleted
 
     width: parent ? parent.width : 200
     height: 60
     radius: {
-        if (Theme.cornerRadius === 0) return 0
+        if (Theme.cornerRadius === 0)
-        return isActive ? Theme.cornerRadius : Theme.cornerRadius + 4
+            return 0;
+        return isActive ? Theme.cornerRadius : Theme.cornerRadius + 4;
     }
 
     readonly property color _tileBgActive: Theme.primary
     readonly property color _tileBgInactive: Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
-    readonly property color _tileRingActive:
+    readonly property color _tileRingActive: Qt.rgba(Theme.primaryText.r, Theme.primaryText.g, Theme.primaryText.b, 0.22)
-        Qt.rgba(Theme.primaryText.r, Theme.primaryText.g, Theme.primaryText.b, 0.22)
 
     color: {
-        if (isActive) return _tileBgActive
+        if (isActive)
-        const baseColor = mouseArea.containsMouse ? Theme.widgetBaseHoverColor : _tileBgInactive
+            return _tileBgActive;
-        return baseColor
+        const baseColor = mouseArea.containsMouse ? Theme.primaryPressed : _tileBgInactive;
+        return baseColor;
     }
     border.color: isActive ? _tileRingActive : Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.08)
     border.width: 0
     opacity: enabled ? 1.0 : 0.6
 
     function hoverTint(base) {
-        const factor = 1.2
+        const factor = 1.2;
-        return Theme.isLightMode ? Qt.darker(base, factor) : Qt.lighter(base, factor)
+        return Theme.isLightMode ? Qt.darker(base, factor) : Qt.lighter(base, factor);
     }
 
     readonly property color _containerBg: Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
@@ -51,7 +51,9 @@ Rectangle {
         opacity: mouseArea.containsMouse ? 0.08 : 0.0
 
         Behavior on opacity {
-            NumberAnimation { duration: Theme.shortDuration }
+            NumberAnimation {
+                duration: Theme.shortDuration
+            }
         }
     }
 

quickshell/Modules/DankBar/Widgets/PrivacyIndicator.qml

@@ -86,7 +86,11 @@ Item {
                     return "transparent";
                 }
 
-                const baseColor = privacyArea.containsMouse ? Theme.widgetBaseHoverColor : Theme.widgetBaseBackgroundColor;
+                if (privacyArea.containsMouse) {
+                    return Theme.primaryPressed;
+                }
+
+                const baseColor = Theme.widgetBaseBackgroundColor;
                 const transparency = (root.barConfig && root.barConfig.widgetTransparency !== undefined) ? root.barConfig.widgetTransparency : 1.0;
                 return Theme.withAlpha(baseColor, transparency);
             }

quickshell/Modules/Plugins/BasePill.qml

@@ -93,7 +93,11 @@ Item {
                 }
 
                 const isHovered = mouseArea.containsMouse || (root.isHovered || false);
-                const baseColor = isHovered ? Theme.widgetBaseHoverColor : Theme.widgetBaseBackgroundColor;
+                if (isHovered) {
+                    return Theme.primaryPressed;
+                }
+
+                const baseColor = Theme.widgetBaseBackgroundColor;
                 const transparency = (root.barConfig && root.barConfig.widgetTransparency !== undefined) ? root.barConfig.widgetTransparency : 1.0;
                 if (Theme.widgetBackgroundHasAlpha) {
                     return Qt.rgba(baseColor.r, baseColor.g, baseColor.b, baseColor.a * transparency);

quickshell/Modules/Plugins/ColorSetting.qml

@@ -18,35 +18,36 @@ Column {
     property bool isInitialized: false
 
     function loadValue() {
-        const settings = findSettings()
+        const settings = findSettings();
         if (settings && settings.pluginService) {
-            const loadedValue = settings.loadValue(settingKey, defaultValue)
+            const loadedValue = settings.loadValue(settingKey, defaultValue);
-            value = loadedValue
+            value = loadedValue;
-            isInitialized = true
+            isInitialized = true;
         }
     }
 
     Component.onCompleted: {
-        Qt.callLater(loadValue)
+        Qt.callLater(loadValue);
     }
 
     onValueChanged: {
-        if (!isInitialized) return
+        if (!isInitialized)
-        const settings = findSettings()
+            return;
+        const settings = findSettings();
         if (settings) {
-            settings.saveValue(settingKey, value)
+            settings.saveValue(settingKey, value);
         }
     }
 
     function findSettings() {
-        let item = parent
+        let item = parent;
         while (item) {
             if (item.saveValue !== undefined && item.loadValue !== undefined) {
-                return item
+                return item;
             }
-            item = item.parent
+            item = item.parent;
         }
-        return null
+        return null;
     }
 
     StyledText {
@@ -82,12 +83,12 @@ Column {
                 cursorShape: Qt.PointingHandCursor
                 onClicked: {
                     if (PopoutService && PopoutService.colorPickerModal) {
-                        PopoutService.colorPickerModal.selectedColor = root.value
+                        PopoutService.colorPickerModal.selectedColor = root.value;
-                        PopoutService.colorPickerModal.pickerTitle = root.label
+                        PopoutService.colorPickerModal.pickerTitle = root.label;
-                        PopoutService.colorPickerModal.onColorSelectedCallback = function(selectedColor) {
+                        PopoutService.colorPickerModal.onColorSelectedCallback = function (selectedColor) {
-                            root.value = selectedColor
+                            root.value = selectedColor;
-                        }
+                        };
-                        PopoutService.colorPickerModal.show()
+                        PopoutService.colorPickerModal.show();
                     }
                 }
             }