group modules

modules/Bar.qml

@@ -72,19 +72,41 @@ PanelWindow {
             Item {
                 Layout.fillWidth: true
             }
-            M.Mpris {}
+
-            M.Volume { visible: M.Modules.volume }
+            // Media
-            M.Bluetooth {}
+            M.BarGroup {
-            M.Backlight {}
+                M.Mpris {}
-            M.Network { visible: M.Modules.network }
+                M.Volume { visible: M.Modules.volume }
-            M.PowerProfile { visible: M.Modules.powerProfile }
+            }
-            M.IdleInhibitor { visible: M.Modules.idleInhibitor }
+
-            M.Weather { visible: M.Modules.weather }
+            // Connectivity
-            M.Temperature { visible: M.Modules.temperature }
+            M.BarGroup {
-            M.Cpu { visible: M.Modules.cpu }
+                M.Network { visible: M.Modules.network }
-            M.Memory { visible: M.Modules.memory }
+                M.Bluetooth {}
-            M.Disk { visible: M.Modules.disk }
+            }
-            M.Battery {}
+
+            // Controls
+            M.BarGroup {
+                M.Backlight {}
+                M.PowerProfile { visible: M.Modules.powerProfile }
+                M.IdleInhibitor { visible: M.Modules.idleInhibitor }
+            }
+
+            // System
+            M.BarGroup {
+                M.Cpu { visible: M.Modules.cpu }
+                M.Memory { visible: M.Modules.memory }
+                M.Temperature { visible: M.Modules.temperature }
+            }
+
+            // Status
+            M.BarGroup {
+                M.Weather { visible: M.Modules.weather }
+                M.Disk { visible: M.Modules.disk }
+                M.Battery {}
+            }
+
+            // Power
             M.Wlogout { bar: bar; visible: M.Modules.wlogout }
         }
     }

modules/BarGroup.qml

@@ -0,0 +1,26 @@
+import QtQuick
+import "." as M
+
+Rectangle {
+    id: root
+
+    default property alias content: row.children
+
+    color: "transparent"
+    border.color: M.Theme.base02
+    border.width: 1
+    radius: M.Theme.radius
+
+    visible: row.visibleChildren.length > 0
+
+    implicitWidth: row.implicitWidth + _pad * 2
+    implicitHeight: row.implicitHeight + _pad * 2
+
+    readonly property int _pad: 6
+
+    Row {
+        id: row
+        anchors.centerIn: parent
+        spacing: M.Theme.moduleSpacing + 2
+    }
+}

modules/Wlogout.qml

@@ -1,5 +1,6 @@
 import QtQuick
 import Quickshell
+import Quickshell.Io
 import "." as M
 
 M.BarIcon {

modules/qmldir

@@ -4,6 +4,7 @@ singleton FlyoutState 1.0 FlyoutState.qml
 singleton OsdState 1.0 OsdState.qml
 singleton Modules 1.0 Modules.qml
 Bar 1.0 Bar.qml
+BarGroup 1.0 BarGroup.qml
 BarSection 1.0 BarSection.qml
 Flyout 1.0 Flyout.qml
 Workspaces 1.0 Workspaces.qml