Everything in Bar

Modules/Background/Background.qml

@@ -6,7 +6,7 @@ import qs.Services
 Variants {
   model: Quickshell.screens
 
-  PanelWindow {
+  delegate: PanelWindow {
     required property ShellScreen modelData
     property string wallpaperSource: Qt.resolvedUrl(
                                        "../../Assets/Tests/wallpaper.png")

Modules/Background/Overview.qml

@@ -7,7 +7,7 @@ import qs.Services
 Variants {
   model: Quickshell.screens
 
-  PanelWindow {
+  delegate: PanelWindow {
     required property ShellScreen modelData
     property string wallpaperSource: Qt.resolvedUrl(
                                        "../../Assets/Tests/wallpaper.png")

Modules/Bar/Bar.qml

@@ -1,104 +1,119 @@
 import QtQuick
-import Quickshell
 import QtQuick.Controls
 import QtQuick.Layouts
-import qs.Widgets
+import Quickshell
 import qs.Services
+import qs.Widgets
 
-PanelWindow {
+Variants {
-  id: root
+    model: Quickshell.screens
 
-  readonly property real scaling: Scaling.scale(screen)
+    delegate: PanelWindow {
-  property var modelData
+        id: root
 
-  screen: modelData
+        required property ShellScreen modelData
-  implicitHeight: Style.barHeight * scaling
+        readonly property real scaling: Scaling.scale(screen)
-  color: "transparent"
-  visible: Settings.data.bar.monitors.includes(modelData.name)
-           || (Settings.data.bar.monitors.length === 0)
 
-  anchors {
+        screen: modelData
-    top: true
+        implicitHeight: Style.barHeight * scaling
-    left: true
+        color: "transparent"
-    right: true
+        visible: Settings.data.bar.monitors.includes(modelData.name) || (Settings.data.bar.monitors.length === 0)
-  }
 
-  Item {
+        anchors {
-    anchors.fill: parent
+            top: true
-    clip: true
+            left: true
-
+            right: true
-    // Background fill
-    Rectangle {
-      id: bar
-      anchors.fill: parent
-      color: Colors.backgroundPrimary
-      layer.enabled: true
-    }
-
-    Row {
-      id: leftSection
-      height: parent.height
-      anchors.left: parent.left
-      anchors.leftMargin: Style.marginSmall * scaling
-      anchors.verticalCenter: parent.verticalCenter
-      spacing: Style.marginSmall * scaling
-
-      NText {
-        text: screen.name
-        anchors.verticalCenter: parent.verticalCenter
-      }
-    }
-
-    Row {
-      id: centerSection
-      height: parent.height
-      anchors.horizontalCenter: parent.horizontalCenter
-      anchors.verticalCenter: parent.verticalCenter
-      spacing: Style.marginSmall * scaling
-
-      Workspace {}
-    }
-
-    Row {
-      id: rightSection
-      height: parent.height
-      anchors.right: bar.right
-      anchors.rightMargin: Style.marginSmall * scaling
-      anchors.verticalCenter: bar.verticalCenter
-      spacing: Style.marginSmall * scaling
-
-      Clock {
-        anchors.verticalCenter: parent.verticalCenter
-      }
-
-      NIconButton {
-        id: demoPanelToggle
-        icon: "experiment"
-        anchors.verticalCenter: parent.verticalCenter
-        onClicked: function () {
-          demoPanel.isLoaded = !demoPanel.isLoaded
         }
-      }
 
-      NIconButton {
+        Item {
-        id: sidePanelToggle
+            anchors.fill: parent
-        icon: "widgets"
+            clip: true
-        anchors.verticalCenter: parent.verticalCenter
+
-        onClicked: function () {
+            // Background fill
-          // Map this button's center to the screen and open the side panel below it
+            Rectangle {
-          const localCenterX = width / 2
+                id: bar
-          const localCenterY = height / 2
+
-          const globalPoint = mapToItem(null, localCenterX, localCenterY)
+                anchors.fill: parent
-          if (sidePanel.isLoaded) {
+                color: Colors.backgroundPrimary
-            sidePanel.isLoaded = false
+                layer.enabled: true
-          } else if (sidePanel.openAt) {
+            }
-            sidePanel.openAt(globalPoint.x, screen)
+
-          } else {
+            Row {
-            // Fallback: toggle if API unavailable
+                id: leftSection
-            sidePanel.isLoaded = true
+
-          }
+                height: parent.height
+                anchors.left: parent.left
+                anchors.leftMargin: Style.marginSmall * scaling
+                anchors.verticalCenter: parent.verticalCenter
+                spacing: Style.marginSmall * scaling
+
+                NText {
+                    text: screen.name
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+
+            }
+
+            Row {
+                id: centerSection
+
+                height: parent.height
+                anchors.horizontalCenter: parent.horizontalCenter
+                anchors.verticalCenter: parent.verticalCenter
+                spacing: Style.marginSmall * scaling
+
+                Workspace {
+                }
+
+            }
+
+            Row {
+                id: rightSection
+
+                height: parent.height
+                anchors.right: bar.right
+                anchors.rightMargin: Style.marginSmall * scaling
+                anchors.verticalCenter: bar.verticalCenter
+                spacing: Style.marginSmall * scaling
+
+                Clock {
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+
+                NIconButton {
+                    id: demoPanelToggle
+
+                    icon: "experiment"
+                    anchors.verticalCenter: parent.verticalCenter
+                    onClicked: function() {
+                        demoPanel.isLoaded = !demoPanel.isLoaded;
+                    }
+                }
+
+                NIconButton {
+                    id: sidePanelToggle
+
+                    icon: "widgets"
+                    anchors.verticalCenter: parent.verticalCenter
+                    onClicked: function() {
+                        // Map this button's center to the screen and open the side panel below it
+                        const localCenterX = width / 2;
+                        const localCenterY = height / 2;
+                        const globalPoint = mapToItem(null, localCenterX, localCenterY);
+                        if (sidePanel.isLoaded)
+                            sidePanel.isLoaded = false;
+                        else if (sidePanel.openAt)
+                            sidePanel.openAt(globalPoint.x, screen);
+                        else
+                            // Fallback: toggle if API unavailable
+                            sidePanel.isLoaded = true;
+                    }
+                }
+
+            }
+
         }
-      }
+
     }
-  }
+
 }

Modules/Bar/Bars.qml

@@ -1,10 +0,0 @@
-import Quickshell
-import qs.Modules.Bar
-
-Variants {
-  model: Quickshell.screens
-
-  delegate: Bar {
-    modelData: item
-  }
-}

shell.qml

@@ -17,7 +17,7 @@ ShellRoot {
   Background {}
   Overview {}
   ScreenCorners {}
-  Bars {}
+  Bar {}
 
   DemoPanel {
     id: demoPanel