wactioncenter: bluetooth menu

dots/.config/quickshell/ii/modules/waffle/looks/Looks.qml

@@ -17,7 +17,7 @@ Singleton {
     property string iconsPath: `${Directories.assetsPath}/icons/fluent`
     property bool dark: Appearance.m3colors.darkmode
 
-    property real backgroundTransparency: 0.13
+    property real backgroundTransparency: 0.11
     property real panelBackgroundTransparency: 0.12
     property real panelLayerTransparency: root.dark ? 0.9 : 0.7
     property real contentTransparency: root.dark ? 0.9 : 0.5
@@ -48,6 +48,7 @@ Singleton {
         property color fg: "#000000"
         property color fg1: "#626262"
         property color inactiveIcon: "#C4C4C4"
+        property color controlBgInactive: '#555458'
         property color controlBg: '#807F85'
         property color controlBgHover: '#57575B'
         property color controlFg: "#FFFFFF"
@@ -74,6 +75,7 @@ Singleton {
         property color fg: "#FFFFFF"
         property color fg1: "#D1D1D1"
         property color inactiveIcon: "#494949"
+        property color controlBgInactive: "#CDCECF"
         property color controlBg: "#9B9B9B"
         property color controlBgHover: "#CFCED1"
         property color controlFg: "#454545"
@@ -104,6 +106,7 @@ Singleton {
         property color fg: root.dark ? root.darkColors.fg : root.lightColors.fg
         property color fg1: root.dark ? root.darkColors.fg1 : root.lightColors.fg1
         property color inactiveIcon: root.dark ? root.darkColors.inactiveIcon : root.lightColors.inactiveIcon
+        property color controlBgInactive: root.dark ? root.darkColors.controlBgInactive : root.lightColors.controlBgInactive
         property color controlBg: root.dark ? root.darkColors.controlBg : root.lightColors.controlBg
         property color controlBgHover: root.dark ? root.darkColors.controlBgHover : root.lightColors.controlBgHover
         property color controlFg: root.dark ? root.darkColors.controlFg : root.lightColors.controlFg

dots/.config/quickshell/ii/modules/waffle/looks/WButton.qml

@@ -19,6 +19,7 @@ Button {
     property color colForegroundToggled: Looks.colors.accentFg
     property alias backgroundOpacity: backgroundRect.opacity
     property color color: {
+        if (!root.enabled) return colBackground;
         if (root.checked) {
             if (root.down) {
                 return root.colBackgroundToggledActive;

dots/.config/quickshell/ii/modules/waffle/looks/WIcons.qml

@@ -107,4 +107,20 @@ Singleton {
         icon = AppSearch.guessIcon(node?.properties["node.name"] ?? "");
         return icon;
     }
+
+    function bluetoothDeviceIcon(device) {
+        const systemIconName = device?.icon || "";
+        if (systemIconName.includes("headset") || systemIconName.includes("headphones"))
+            return "headphones";
+        if (systemIconName.includes("audio"))
+            return "speaker";
+        if (systemIconName.includes("phone"))
+            return "phone";
+        if (systemIconName.includes("mouse"))
+            return "bluetooth";
+        if (systemIconName.includes("keyboard"))
+            return "keyboard";
+        return "bluetooth";
+    }
+
 }

dots/.config/quickshell/ii/modules/waffle/looks/WIndeterminateProgressBar.qml

@@ -0,0 +1,22 @@
+import QtQuick
+import Qt5Compat.GraphicalEffects
+import qs
+import qs.services
+import qs.services.network
+import qs.modules.common
+import qs.modules.common.widgets
+import qs.modules.waffle.looks
+
+StyledIndeterminateProgressBar {
+    id: progressBar
+    implicitHeight: 3
+    background: null
+    layer.enabled: true
+    layer.effect: OpacityMask {
+        maskSource: Rectangle {
+            width: progressBar.width
+            height: progressBar.height
+            radius: progressBar.height / 2
+        }
+    }
+}

dots/.config/quickshell/ii/modules/waffle/looks/WPanelFooterButton.qml

@@ -16,6 +16,7 @@ Button {
     property color color
     property color colForeground: Looks.colors.fg
     color: {
+        if (!root.enabled) return colBackground;
         if (root.down) {
             return root.colBackgroundActive
         } else if ((root.hovered && !root.down) || root.checked) {

dots/.config/quickshell/ii/modules/waffle/looks/WSwitch.qml

@@ -0,0 +1,69 @@
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Controls
+import qs.modules.common
+import qs.modules.common.widgets
+import qs.modules.waffle.looks
+
+Switch {
+    id: root
+    
+    PointingHandInteraction {}
+
+    implicitWidth: 40
+    implicitHeight: 20
+    property real indicatorHeight: 12
+    property real indicatorPressedHeight: 14
+    property real indicatorPressedWidth: 17
+    property color checkedColor: Looks.colors.accent
+    property color uncheckedColor: Looks.colors.bg1
+    property color borderColor: Looks.colors.controlBgInactive
+
+    readonly property real indicatorPressedWidthDiff: indicatorPressedWidth - indicatorHeight
+    
+    background: Rectangle {
+        width: parent.width
+        height: parent.height
+        radius: height / 2
+        color: root.checked ? root.checkedColor : root.uncheckedColor
+        border.width: 1
+        border.color: root.checked ? root.checkedColor : root.borderColor
+
+        Behavior on color {
+            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
+        }
+        Behavior on border.color {
+            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
+        }
+    }
+
+    // Custom thumb styling
+    indicator: Rectangle {
+        implicitWidth: (root.pressed || root.down) ? root.indicatorPressedWidth : root.indicatorHeight
+        implicitHeight: (root.pressed || root.down) ? root.indicatorPressedHeight : root.indicatorHeight
+        radius: height / 2
+        color: root.checked ? Looks.colors.accentFg : root.borderColor
+        anchors.verticalCenter: parent.verticalCenter
+        anchors.left: parent.left
+        anchors.leftMargin: {
+            if (root.checked) {
+                return 24 - (root.pressed || root.down ? root.indicatorPressedWidthDiff : 0);
+            } else {
+                return (root.pressed || root.down) ? 3 : 4
+            }
+        }
+
+        Behavior on anchors.leftMargin {
+            animation: Looks.transition.enter.createObject(this)
+        }
+        Behavior on implicitWidth {
+            animation: Looks.transition.resize.createObject(this)
+        }
+        Behavior on implicitHeight {
+            animation: Looks.transition.resize.createObject(this)
+        }
+        Behavior on color {
+            animation: Looks.transition.color.createObject(this)
+        }
+    }
+}