audio popout color feedback when muting specific tracks

Components/CustomSlider.qml

@@ -5,13 +5,15 @@ import qs.Config
 Slider {
 	id: root
 
+	property color color: DynamicColors.palette.m3primary
+
 	background: Item {
 		CustomRect {
 			anchors.bottom: parent.bottom
 			anchors.left: parent.left
 			anchors.top: parent.top
 			bottomRightRadius: root.implicitHeight / 6
-			color: DynamicColors.palette.m3primary
+			color: root.color
 			implicitWidth: root.handle.x - root.implicitHeight / 2
 			radius: Appearance.rounding.full
 			topRightRadius: root.implicitHeight / 6
@@ -30,7 +32,7 @@ Slider {
 	}
 	handle: CustomRect {
 		anchors.verticalCenter: parent.verticalCenter
-		color: DynamicColors.palette.m3primary
+		color: root.color
 		implicitHeight: 15
 		implicitWidth: 5
 		radius: Appearance.rounding.full

Modules/AudioPopup.qml

@@ -401,23 +401,25 @@ CustomRect {
 						Layout.alignment: Qt.AlignVCenter
 						Layout.preferredHeight: 40
 						Layout.preferredWidth: 40
-						color: DynamicColors.palette.m3primary
+						color: appBox.modelData.audio.muted ? DynamicColors.palette.m3error : DynamicColors.palette.m3primary
 						radius: Appearance.rounding.full
 
 						MaterialIcon {
 							id: icon
 
 							anchors.centerIn: parent
-							color: DynamicColors.palette.m3onPrimary
+							animate: true
+							color: appBox.modelData.audio.muted ? DynamicColors.palette.m3onError : DynamicColors.palette.m3onPrimary
 							font.pointSize: 22
-							text: "volume_up"
+							text: appBox.modelData.audio.muted ? "volume_off" : "volume_up"
+						}
 
-							StateLayer {
-								radius: Appearance.rounding.full
+						StateLayer {
+							color: appBox.modelData.audio.muted ? DynamicColors.palette.m3onError : DynamicColors.palette.m3onPrimary
+							radius: Appearance.rounding.full
 
-								onClicked: {
-									appBox.modelData.audio.muted = !appBox.modelData.audio.muted;
-								}
+							onClicked: {
+								appBox.modelData.audio.muted = !appBox.modelData.audio.muted;
 							}
 						}
 					}
@@ -463,6 +465,7 @@ CustomRect {
 							CustomSlider {
 								anchors.left: parent.left
 								anchors.right: parent.right
+								color: appBox.modelData.audio.muted ? DynamicColors.palette.m3error : DynamicColors.palette.m3primary
 								implicitHeight: 10
 								value: appBox.modelData.audio.volume
 

Modules/Dashboard/Dash.qml

@@ -11,22 +11,12 @@ GridLayout {
 	id: root
 
 	readonly property bool dashboardVisible: visibilities.dashboard
-	property int radius: 6
+	property int radius: Appearance.rounding.smallest
 	required property PersistentProperties state
 	required property PersistentProperties visibilities
 
 	columnSpacing: Appearance.spacing.smaller
-	opacity: 0
 	rowSpacing: Appearance.spacing.smaller
-	scale: 0.9
-
-	onDashboardVisibleChanged: {
-		if (dashboardVisible) {
-			openAnim.start();
-		} else {
-			closeAnim.start();
-		}
-	}
 
 	ParallelAnimation {
 		id: openAnim
@@ -110,7 +100,6 @@ GridLayout {
 
 		Resources {
 			id: resources
-
 		}
 	}
 
@@ -124,7 +113,6 @@ GridLayout {
 
 		Media {
 			id: media
-
 		}
 	}