Several changes, fix messy behaviour for PillIndicator, fix System Settings size, fix logout button

Bar/Modules/Battery.qml

@@ -8,10 +8,15 @@ import qs.Settings
 Item {
     id: batteryWidget
 
+    // Test mode
+    property bool testMode: false
+    property int testPercent: 49
+    property bool testCharging: true
+
     property var battery: UPower.displayDevice
-    property bool isReady: battery && battery.ready && battery.isLaptopBattery && battery.isPresent
+    property bool isReady: testMode ? true : (battery && battery.ready && battery.isLaptopBattery && battery.isPresent)
-    property real percent: isReady ? (battery.percentage * 100) : 0
+    property real percent: testMode ? testPercent : (isReady ? (battery.percentage * 100) : 0)
-    property bool charging: isReady ? battery.state === UPowerDeviceState.Charging : false
+    property bool charging: testMode ? testCharging : (isReady ? battery.state === UPowerDeviceState.Charging : false)
     property bool show: isReady && percent > 0
 
     // Choose icon based on charge and charging state
@@ -25,26 +30,40 @@ Item {
         if (percent >= 95)
            return "battery_android_full";
 
-        var step = Math.round(percent / (100 / 6));        
+        // Hardcoded battery symbols
-        return "battery_android_" + step
+        if (percent >= 85)
+            return "battery_android_6";
+        if (percent >= 70)
+            return "battery_android_5";
+        if (percent >= 55)
+            return "battery_android_4";
+        if (percent >= 40)
+            return "battery_android_3";
+        if (percent >= 25)
+            return "battery_android_2";
+        if (percent >= 10)
+            return "battery_android_1";
+        if (percent >= 0)
+            return "battery_android_0";
     }
 
-    visible: isReady && battery.isLaptopBattery
+    visible: testMode || (isReady && battery.isLaptopBattery)
     width: pill.width
     height: pill.height
 
     PillIndicator {
         id: pill
-        icon: batteryIcon()
+        icon: batteryWidget.batteryIcon()
         text: Math.round(batteryWidget.percent) + "%"
         pillColor: Theme.surfaceVariant
         iconCircleColor: Theme.accentPrimary
+        iconTextColor: Theme.backgroundPrimary
         textColor: charging ? Theme.accentPrimary : Theme.textPrimary
         MouseArea {
             anchors.fill: parent
             hoverEnabled: true
             onEntered: {
-                pill.show();
+                pill.showDelayed();
                 batteryTooltip.tooltipVisible = true;
             }
             onExited: {

Bar/Modules/Brightness.qml

@@ -106,14 +106,13 @@ Item {
         iconCircleColor: Theme.accentPrimary
         iconTextColor: Theme.backgroundPrimary
         textColor: Theme.textPrimary
-        
         MouseArea {
             anchors.fill: parent
             hoverEnabled: true
             onEntered: {
                 getBrightness()
                 brightnessTooltip.tooltipVisible = true
-                pill.show()
+                pill.showDelayed()
             }
             onExited: {
                 brightnessTooltip.tooltipVisible = false

Bar/Modules/Volume.qml

@@ -85,7 +85,7 @@ Item {
             onEntered: {
                 volumeDisplay.containsMouse = true
                 pillIndicator.autoHide = false;
-            pillIndicator.show()
+                pillIndicator.showDelayed()
             }
             onExited: {
                 volumeDisplay.containsMouse = false

Components/PillIndicator.qml

@@ -180,5 +180,30 @@ Item {
         if (showPill) {
             hideAnim.start();
         }
+        // Stop the show timer if it's running
+        showTimer.stop();
+    }
+
+    function showDelayed() {
+        if (!showPill) {
+            shouldAnimateHide = autoHide;
+            // Add a 500ms delay before showing
+            showTimer.start();
+        } else {
+            // Reset hide timer if already shown
+            hideAnim.stop();
+            delayedHideAnim.restart();
+        }
+    }
+
+    // Timer for delayed show
+    Timer {
+        id: showTimer
+        interval: 500  // 500ms delay
+        onTriggered: {
+            if (!showPill) {
+                showAnim.start();
+            }
+        }
     }
 }

README.md

@@ -211,7 +211,7 @@ Contributions are welcome! Feel free to open issues or submit pull requests.
 #### Donation
 
 ---
-While I actually didn't want to accept donations, more and more people are asking to donate so... I still feel weird about taking any donations for this. However if you really feel like donating then I obviously highly appreciate it but **PLEASE** never feel forced to donate or anything. It won't change how I work on Noctalia, it's a project that I work on for fun in the end.
+While I actually didn't want to accept donations, more and more people are asking to donate so... I don't know, if you really feel like donating then I obviously highly appreciate it but **PLEASE** never feel forced to donate or anything. It won't change how I work on Noctalia, it's a project that I work on for fun in the end.
 
 [![ko-fi](https://ko-fi.com/img/githubbutton_sm.svg)](https://ko-fi.com/R6R01IX85B)
 ---

Widgets/Sidebar/Config/ProfileSettings.qml

@@ -7,7 +7,7 @@ import qs.Settings
 Rectangle {
     id: profileSettingsCard
     Layout.fillWidth: true
-    Layout.preferredHeight: 580
+    Layout.preferredHeight: 650
     color: Theme.surface
     radius: 18
 

Widgets/Sidebar/Panel/System.qml

@@ -7,6 +7,7 @@ import Quickshell.Io
 import qs.Settings
 import qs.Widgets
 import qs.Helpers
+import qs.Services
 import qs.Components
 
 Rectangle {