modules/bar/Volume.qml

@@ -1,5 +1,4 @@
 import Quickshell.Io
-import QtQuick.Layouts
 import QtQuick
 import Quickshell.Services.Pipewire
 import qs.settings
@@ -7,65 +6,71 @@ import qs.reusables
 import qs
 
 Rectangle {
-    id: root
+    id: container
     radius: implicitHeight / 2
     color: pavuArea.containsMouse ? Colors.primaryContainer : Colors.surfaceContainer
     anchors.verticalCenter: parent.verticalCenter
-    implicitWidth: textRow.implicitWidth + 20
+    implicitWidth: root.implicitWidth + 20
-    implicitHeight: Settings.config.barHeight - 8
+    implicitHeight: Settings.config.barHeight - 10
-    property var sink: Pipewire.defaultAudioSink
+    Item {
-    function getVolumeIcon() {
+        id: root
-        // Safety check: if Pipewire is dead or sink is missing
-        if (!sink)
-            return "volume_off";
-
-        // If muted, show the hush icon
-        if (sink.audio.muted)
-            return "volume_off";
-
-        // Volume is usually 0.0 to 1.0 (0% to 100%)
-        const vol = sink.audio.volume;
-
-        if (vol <= 0.25)
-            return "volume_mute";
-        if (vol < 0.75)
-            return "volume_down";
-        if (vol <= 1.00)
-            return "volume_up";
-
-        // If it's loud, prepare the ears!
-        return "volume_up";
-    }
-    RowLayout {
-        id: textRow
-        spacing: 2
         anchors.centerIn: parent
-        CustomText {
+        implicitWidth: textRow.width
-            id: volumeText
+        implicitHeight: Settings.config.barHeight
+        property var sink: Pipewire.defaultAudioSink
+        function getVolumeIcon() {
+            // Safety check: if Pipewire is dead or sink is missing
+            if (!sink)
+                return "volume_off";
 
-            PwObjectTracker {
+            // If muted, show the hush icon
-                objects: Pipewire.ready ? Pipewire.defaultAudioSink : []
+            if (sink.audio.muted)
+                return "volume_off";
+
+            // Volume is usually 0.0 to 1.0 (0% to 100%)
+            const vol = sink.audio.volume;
+
+            if (vol <= 0.25)
+                return "volume_mute";
+            if (vol < 0.75)
+                return "volume_down";
+            if (vol <= 1.00)
+                return "volume_up";
+
+            // If it's loud, prepare the ears!
+            return "volume_up";
+        }
+        Row {
+            id: textRow
+            anchors.centerIn: root
+            spacing: 5
+            CustomText {
+                id: volumeText
+                anchors.verticalCenter: parent.verticalCenter
+                PwObjectTracker {
+                    objects: Pipewire.ready ? Pipewire.defaultAudioSink : []
+                }
+                text: Pipewire.ready ? Math.round(root.sink.audio.volume * 100) + "%" : "failure"
+                opacity: Pipewire.ready ? root.sink.audio.muted ? 0.5 : 1 : 0
+            }
+            CustomIcon {
+                id: volumeIcon
+                anchors.verticalCenter: parent.verticalCenter
+                opacity: Pipewire.ready ? root.sink.audio.muted ? 0.5 : 1 : 0
+                text: Pipewire.ready ? root.getVolumeIcon() : null
             }
-            text: Pipewire.ready ? Math.round(root.sink.audio.volume * 100) + "%" : "failure"
-            opacity: Pipewire.ready ? root.sink.audio.muted ? 0.5 : 1 : 0
         }
-        CustomIcon {
+        MouseArea {
-            id: volumeIcon
+            id: pavuArea
-            Layout.alignment: Qt.AlignVCenter
+            Process {
-            opacity: Pipewire.ready ? root.sink.audio.muted ? 0.5 : 1 : 0
+                id: pavuLauncher
-            text: Pipewire.ready ? root.getVolumeIcon() : null
+                command: ["sh", "-c", "pavucontrol"]
+            }
+            anchors.fill: parent
+            onClicked: pavuLauncher.exec(pavuLauncher.command)
+            acceptedButtons: Qt.LeftButton
+            cursorShape: Qt.PointingHandCursor
+            hoverEnabled: true
         }
     }
-    MouseArea {
-        id: pavuArea
-        Process {
-            id: pavuLauncher
-            command: ["sh", "-c", "pavucontrol"]
-        }
-        anchors.fill: parent
-        onClicked: pavuLauncher.exec(pavuLauncher.command)
-        acceptedButtons: Qt.LeftButton
-        cursorShape: Qt.PointingHandCursor
-        hoverEnabled: true
-    }
 }

reusables/CustomIcon.qml

@@ -3,11 +3,9 @@ import qs.settings
 import qs
 
 Text {
-    verticalAlignment: Text.AlignVCenter
     property bool fill: true
     font.family: fill ? "Material Symbols Rounded Filled" : "Material Symbols Rounded"
     color: Colors.onSurfaceColor
-    font.pixelSize: Settings.config.fontSize + 2
     font.variableAxes: ({
             GRAD: 100,
             opsz: fill ? 48 : 20,

reusables/CustomText.qml

@@ -3,7 +3,6 @@ import qs
 import qs.settings
 
 Text {
-    verticalAlignment: Text.AlignVCenter
     color: Colors.onSurfaceColor
     font.family: Settings.config.font
     font.pixelSize: Settings.config.fontSize