fix mpris text

modules/bar/Mpris.qml

@@ -6,44 +6,43 @@ import qs.settings
 import qs.reusables
 
 Rectangle {
-    id: container
+    id: root
     visible: root.spotify != null
     radius: implicitHeight / 2
-    color: clickHandler.containsMouse ? Colors.primaryContainer : Colors.surfaceContainer
-    implicitWidth: root.implicitWidth + 20
     implicitHeight: Settings.config.barHeight - 10
-    Item {
+    color: clickHandler.containsMouse ? Colors.primary : Colors.surfaceContainer
-        id: root
+    implicitWidth: statusRow.width + 20
-        anchors.centerIn: parent
-        property var spotify: root.getSpotify()
-        function getSpotify() {
-            for (let i = 0; i < Mpris.players.values.length; i++) {
-                if (Mpris.players.values[i].identity.toLowerCase() === "spotify") {
-                    return Mpris.players.values[i];
-                }
-            }
-            return null;
-        }
-        implicitWidth: statusRow.implicitWidth
-        implicitHeight: statusRow.implicitHeight
 
-        RowLayout {
+    property var spotify: root.getSpotify()
-            id: statusRow
+    function getSpotify() {
-            spacing: 5
+        for (let i = 0; i < Mpris.players.values.length; i++) {
-            anchors.verticalCenter: parent.verticalCenter
+            if (Mpris.players.values[i].identity.toLowerCase() === "spotify") {
-            property var combinedText: root.spotify != null ? root.spotify.trackArtist + " - " + root.spotify.trackTitle : ""
+                return Mpris.players.values[i];
-            property var status: root.spotify != null ? !root.spotify.isPlaying ? "play_arrow" : "pause" : ""
-            CustomText {
-                id: mprisText
-                Layout.topMargin: 2
-                text: root.spotify != null ? parent.combinedText : ""
-            }
-            CustomIcon {
-                id: mprisStatus
-                Layout.topMargin: 2
-                text: root.spotify != null ? parent.status : ""
             }
         }
+        return null;
+    }
+
+    RowLayout {
+        id: statusRow
+        spacing: 5
+        anchors.centerIn: parent
+        property var combinedText: root.spotify != null ? root.spotify.trackArtist + " - " + root.spotify.trackTitle : ""
+        property var status: root.spotify != null ? !root.spotify.isPlaying ? "play_arrow" : "pause" : ""
+        CustomText {
+            id: mprisText
+            Layout.maximumWidth: 300
+            Layout.topMargin: 2
+            text: root.spotify != null ? parent.combinedText : ""
+            elide: Text.ElideRight
+            color: clickHandler.containsMouse ? Colors.onPrimaryColor : Colors.onSurfaceColor
+        }
+        CustomIcon {
+            id: mprisStatus
+            color: clickHandler.containsMouse ? Colors.onPrimaryColor : Colors.onSurfaceColor
+            Layout.topMargin: 2
+            text: root.spotify != null ? parent.status : ""
+        }
     }
     MouseArea {
         id: clickHandler