From fdc05ee4a0f7e8fe89d8f2f399853da616a72972 Mon Sep 17 00:00:00 2001
From: end-4 <97237370+end-4@users.noreply.github.com>
Date: Thu, 17 Jul 2025 23:43:20 +0700
Subject: [PATCH] right sidebar: volume mixer: use listview, add separator

---
 .../sidebarRight/volumeMixer/VolumeMixer.qml  | 56 +++++++++----------
 1 file changed, 27 insertions(+), 29 deletions(-)

diff --git a/.config/quickshell/ii/modules/sidebarRight/volumeMixer/VolumeMixer.qml b/.config/quickshell/ii/modules/sidebarRight/volumeMixer/VolumeMixer.qml
index 88f6da1b8..4141ec7f6 100644
--- a/.config/quickshell/ii/modules/sidebarRight/volumeMixer/VolumeMixer.qml
+++ b/.config/quickshell/ii/modules/sidebarRight/volumeMixer/VolumeMixer.qml
@@ -40,44 +40,33 @@ Item {
         Item {
             Layout.fillWidth: true
             Layout.fillHeight: true
-            Flickable {
-                id: flickable
-                anchors.fill: parent
-                contentHeight: volumeMixerColumnLayout.height
-
+            ListView {
+                id: listView
+                model: root.appPwNodes
                 clip: true
-                layer.enabled: true
-                layer.effect: OpacityMask {
-                    maskSource: Rectangle {
-                        width: flickable.width
-                        height: flickable.height
-                        radius: Appearance.rounding.normal
-                    }
+                anchors {
+                    fill: parent
+                    topMargin: 10
+                    bottomMargin: 10
                 }
+                spacing: 6
 
-                ColumnLayout {
-                    id: volumeMixerColumnLayout
-                    anchors.top: parent.top
-                    anchors.left: parent.left
-                    anchors.right: parent.right
-                    anchors.margins: 10
-                    spacing: 10
-
-                    Repeater {
-                        model: root.appPwNodes
-
-                        VolumeMixerEntry {
-                            Layout.fillWidth: true
-                            required property var modelData
-                            node: modelData
-                        }
+                delegate: VolumeMixerEntry {
+                    // Layout.fillWidth: true
+                    anchors {
+                        left: parent.left
+                        right: parent.right
+                        leftMargin: 10
+                        rightMargin: 10
                     }
+                    required property var modelData
+                    node: modelData
                 }
             }
 
             // Placeholder when list is empty
             Item {
-                anchors.fill: flickable
+                anchors.fill: listView
 
                 visible: opacity > 0
                 opacity: (root.appPwNodes.length === 0) ? 1 : 0
@@ -109,6 +98,15 @@ Item {
                 }
             }
         }
+
+        // Separator
+        Rectangle {
+            color: Appearance.m3colors.m3outlineVariant
+            implicitHeight: 1
+            Layout.fillWidth: true
+        }
+
+
         // Device selector
         ButtonGroup {
             id: deviceSelectorRowLayout