wbar: add tooltip and stuff

dots/.config/quickshell/ii/modules/waffle/bar/AppButton.qml

@@ -1,5 +1,6 @@
 import QtQuick
 import QtQuick.Layouts
+import Qt5Compat.GraphicalEffects
 import org.kde.kirigami as Kirigami
 import qs.services
 import qs.modules.common
@@ -9,7 +10,9 @@ BarButton {
     id: root
 
     required property string iconName
+    property bool multiple: false
     property bool separateLightDark: false
+    property alias tryCustomIcon: iconWidget.tryCustomIcon
     leftInset: 2
     rightInset: 2
     implicitWidth: height - topInset - bottomInset + leftInset + rightInset
@@ -20,9 +23,37 @@ BarButton {
         contentItem.scale = root.down ? 5/6 : 1 // If/When we do dragging, the scale is 1.25
     }
 
+    background: Item {
+        BackgroundAcrylicRectangle {
+            id: mainBgRect
+            anchors.fill: parent
+            layer.enabled: root.multiple
+            layer.effect: OpacityMask {
+                invert: true
+                maskSource: Item {
+                    width: mainBgRect.width
+                    height: mainBgRect.height
+                    Rectangle {
+                        anchors.fill: parent
+                        anchors.rightMargin: 3
+                        radius: mainBgRect.radius
+                    }
+                }
+            }
+        }
+        Loader {
+            anchors.fill: parent
+            anchors.rightMargin: 5
+            active: root.multiple
+            sourceComponent: BackgroundAcrylicRectangle {
+                
+            }
+        }
+    }
+
     contentItem: Item {
         id: contentItem
-        anchors.centerIn: root.background
+        anchors.centerIn: parent
 
         implicitHeight: iconWidget.implicitHeight
         implicitWidth: iconWidget.implicitWidth
@@ -41,4 +72,15 @@ BarButton {
             separateLightDark: root.separateLightDark
         }
     }
+
+    component BackgroundAcrylicRectangle: AcrylicRectangle {
+        shiny: ((root.hovered && !root.down) || root.checked)
+        color: root.colBackground
+        border.width: 1
+        border.color: root.colBackgroundBorder
+
+        Behavior on border.color {
+            animation: Looks.transition.color.createObject(this)
+        }
+    }
 }