Apply the same logic to other two pills (Brightness and Volume)

Bar/Modules/Battery.qml

@@ -40,7 +40,6 @@ Item {
         pillColor: Theme.surfaceVariant
         iconCircleColor: Theme.accentPrimary
         textColor: charging ? Theme.accentPrimary : Theme.textPrimary
-        autoHide: false
         MouseArea {
             anchors.fill: parent
             hoverEnabled: true
@@ -76,19 +75,4 @@ Item {
             delay: 1500
         }
     }
-
-    Timer {
-        id: hideTimer
-        interval: 2000
-        running: true
-        onTriggered: {
-            pill.hide();
-        }
-    }
-
-    Component.onCompleted: {
-        if (isReady && battery.isLaptopBattery) {
-            pill.show();
-        }
-    }
 }

Bar/Modules/Brightness.qml

@@ -13,6 +13,7 @@ Item {
     property bool isSettingBrightness: false
     property bool hasPendingSet: false
     property int pendingSetValue: -1
+    property bool firstChange: true 
 
     width: pill.width
     height: pill.height
@@ -30,7 +31,13 @@ Item {
                     previousBrightness = brightness
                     brightness = val
                     pill.text = brightness + "%"
-                    pill.show()
+
+                    if (firstChange) {
+                        firstChange = false;
+                    }
+                    else {
+                        pill.show()
+                    }
                 }
             }
         }
@@ -94,14 +101,19 @@ Item {
         iconCircleColor: Theme.accentPrimary
         iconTextColor: Theme.backgroundPrimary
         textColor: Theme.textPrimary
+        
         MouseArea {
             anchors.fill: parent
             hoverEnabled: true
             onEntered: {
                 getBrightness()
                 brightnessTooltip.tooltipVisible = true
+                pill.show()
+            }
+            onExited: {
+                brightnessTooltip.tooltipVisible = false
+                pill.hide()
             }
-            onExited: brightnessTooltip.tooltipVisible = false
             
             onWheel: function(wheel) {
                 const delta = wheel.angleDelta.y > 0 ? 5 : -5
@@ -114,14 +126,11 @@ Item {
             text: "Brightness: " + brightness + "%"
             tooltipVisible: false
             targetItem: pill
-            delay: 200
+            delay: 1500
         }
     }
 
     Component.onCompleted: {
         getBrightness()
-        if (brightness >= 0) {
-            pill.show()
-        }
     }
 }

Bar/Modules/Volume.qml

@@ -8,6 +8,7 @@ Item {
     id: volumeDisplay
     property var shell
     property int volume: 0
+    property bool firstChange: true
 
     width: pillIndicator.width
     height: pillIndicator.height
@@ -23,13 +24,14 @@ Item {
         iconCircleColor: Theme.accentPrimary
         iconTextColor: Theme.backgroundPrimary
         textColor: Theme.textPrimary
+        autoHide: true
 
         StyledTooltip {
             id: volumeTooltip
             text: "Volume: " + volume + "%\nScroll up/down to change volume.\nLeft click to open the input/output selection."
             tooltipVisible: !ioSelector.visible && volumeDisplay.containsMouse
             targetItem: pillIndicator
-            delay: 200
+            delay: 1500
         }
 
         MouseArea {
@@ -57,7 +59,13 @@ Item {
                     pillIndicator.icon = shell.defaultAudioSink && shell.defaultAudioSink.audio && shell.defaultAudioSink.audio.muted
                         ? "volume_off"
                         : (volume === 0 ? "volume_off" : (volume < 30 ? "volume_down" : "volume_up"));
-                    pillIndicator.show();
+
+                    if (firstChange) {
+                        firstChange = false
+                    }
+                    else {
+                        pillIndicator.show();
+                    }
                 }
             }
         }
@@ -66,7 +74,6 @@ Item {
     Component.onCompleted: {
         if (shell && shell.volume !== undefined) {
             volume = Math.max(0, Math.min(100, shell.volume));
-            pillIndicator.show();
         }
     }
 
@@ -75,8 +82,16 @@ Item {
         hoverEnabled: true
         acceptedButtons: Qt.NoButton
         propagateComposedEvents: true
-        onEntered: volumeDisplay.containsMouse = true
-        onExited: volumeDisplay.containsMouse = false
+        onEntered: {
+            volumeDisplay.containsMouse = true
+            pillIndicator.autoHide = false;
+            pillIndicator.show()
+        }
+        onExited: {
+            volumeDisplay.containsMouse = false
+            pillIndicator.autoHide = true;
+            pillIndicator.hide()
+        }
         cursorShape: Qt.PointingHandCursor
         onWheel: (wheel) => {
             if (!shell) return;

Components/PillIndicator.qml

@@ -15,7 +15,7 @@ Item {
     property int pillHeight: 22
     property int iconSize: 22
     property int pillPaddingHorizontal: 14
-    property bool autoHide: true
+    property bool autoHide: false
 
     // Internal state
     property bool showPill: false