bar: add scroll actions to fillers

Also change the brightness osd icon depending on value

modules/bar/Bar.qml

@@ -45,12 +45,16 @@ Variants {
 
         Preset {
             presetName: "pills"
-            sourceComponent: Pills {}
+            sourceComponent: Pills {
+                screen: win.modelData
+            }
         }
 
         Preset {
             presetName: "panel"
-            sourceComponent: Panel {}
+            sourceComponent: Panel {
+                screen: win.modelData
+            }
         }
     }
 

modules/bar/Panel.qml

@@ -2,12 +2,15 @@ import "root:/widgets"
 import "root:/config"
 import "components"
 import "components/workspaces"
+import Quickshell
 import QtQuick
 import QtQuick.Layouts
 
 StyledRect {
     id: root
 
+    required property ShellScreen screen
+
     function get(horiz, vert) {
         return BarConfig.vertical ? vert : horiz;
     }
@@ -47,9 +50,29 @@ StyledRect {
             }
         }
 
-        Item {
+        MouseArea {
             Layout.fillWidth: true
             Layout.fillHeight: true
+
+            onWheel: event => {
+                if (event.angleDelta.y > 0)
+                    Audio.setVolume(Audio.volume + 0.1);
+                else if (event.angleDelta.y < 0)
+                    Audio.setVolume(Audio.volume - 0.1);
+            }
+        }
+
+        MouseArea {
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+
+            onWheel: event => {
+                const monitor = Brightness.getMonitorForScreen(root.screen);
+                if (event.angleDelta.y > 0)
+                    monitor.setBrightness(monitor.brightness + 0.1);
+                else if (event.angleDelta.y < 0)
+                    monitor.setBrightness(monitor.brightness - 0.1);
+            }
         }
 
         Module {

modules/bar/Pills.qml

@@ -1,13 +1,17 @@
 import "root:/widgets"
+import "root:/services"
 import "root:/config"
 import "components"
 import "components/workspaces"
+import Quickshell
 import QtQuick
 import QtQuick.Layouts
 
 BoxLayout {
     id: root
 
+    required property ShellScreen screen
+
     function get(horiz, vert) {
         return BarConfig.vertical ? vert : horiz;
     }
@@ -42,9 +46,16 @@ BoxLayout {
         }
     }
 
-    Item {
+    MouseArea {
         Layout.fillWidth: true
         Layout.fillHeight: true
+
+        onWheel: event => {
+            if (event.angleDelta.y > 0)
+                Audio.setVolume(Audio.volume + 0.1);
+            else if (event.angleDelta.y < 0)
+                Audio.setVolume(Audio.volume - 0.1);
+        }
     }
 
     Pill {
@@ -56,9 +67,17 @@ BoxLayout {
         }
     }
 
-    Item {
+    MouseArea {
         Layout.fillWidth: true
         Layout.fillHeight: true
+
+        onWheel: event => {
+            const monitor = Brightness.getMonitorForScreen(root.screen);
+            if (event.angleDelta.y > 0)
+                monitor.setBrightness(monitor.brightness + 0.1);
+            else if (event.angleDelta.y < 0)
+                monitor.setBrightness(monitor.brightness - 0.1);
+        }
     }
 
     Pill {

modules/osd/Content.qml

@@ -34,7 +34,7 @@ Column {
     }
 
     VerticalSlider {
-        icon: "brightness_6"
+        icon: `brightness_${(Math.round(value * 6) + 1)}`
         value: root.monitor?.brightness ?? 0
         onMoved: root.monitor?.setBrightness(value)
 

modules/osd/Osd.qml

@@ -99,7 +99,6 @@ Variants {
                 HoverHandler {
                     id: hoverHandler
 
-                    parent: win
                     onHoveredChanged: {
                         root.hovered = hovered;
                         if (hovered)