vertical bar

.config/quickshell/ii/modules/bar/SysTray.qml

@@ -4,19 +4,18 @@ import QtQuick
 import QtQuick.Layouts
 import Quickshell.Services.SystemTray
 
-// TODO: More fancy animation
 Item {
     id: root
+    implicitWidth: gridLayout.implicitWidth
+    implicitHeight: gridLayout.implicitHeight
+    property bool vertical: false
 
-    height: parent.height
-    implicitWidth: rowLayout.implicitWidth
-    Layout.leftMargin: Appearance.rounding.screenRounding
-
-    RowLayout {
-        id: rowLayout
-
+    GridLayout {
+        id: gridLayout
+        columns: root.vertical ? 1 : -1
         anchors.fill: parent
-        spacing: 15
+        rowSpacing: 10
+        columnSpacing: 15
 
         Repeater {
             model: SystemTray.items
@@ -24,12 +23,14 @@ Item {
             SysTrayItem {
                 required property SystemTrayItem modelData
                 item: modelData
+                Layout.fillHeight: !root.vertical
+                Layout.fillWidth: root.vertical
             }
 
         }
 
         StyledText {
-            Layout.alignment: Qt.AlignVCenter
+            Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
             font.pixelSize: Appearance.font.pixelSize.larger
             color: Appearance.colors.colSubtext
             text: "•"

.config/quickshell/ii/modules/bar/SysTrayItem.qml

@@ -13,11 +13,10 @@ MouseArea {
     property var bar: root.QsWindow.window
     required property SystemTrayItem item
     property bool targetMenuOpen: false
-    property int trayItemWidth: Appearance.font.pixelSize.larger
 
     acceptedButtons: Qt.LeftButton | Qt.RightButton
-    Layout.fillHeight: true
-    implicitWidth: trayItemWidth
+    implicitWidth: 20
+    implicitHeight: 20
     onClicked: (event) => {
         switch (event.button) {
         case Qt.LeftButton:
@@ -35,10 +34,11 @@ MouseArea {
 
         menu: root.item.menu
         anchor.window: bar
-        anchor.rect.x: root.x + bar.width
-        anchor.rect.y: root.y
+        anchor.rect.x: root.x + (Config.options.bar.vertical ? 0 : bar.width)
+        anchor.rect.y: root.y + (Config.options.bar.vertical ? bar.height : 0)
         anchor.rect.height: root.height
-        anchor.edges: Edges.Bottom
+        anchor.rect.width: root.width
+        anchor.edges: Config.options.bar.bottom ? (Edges.Top | Edges.Left) : (Edges.Bottom | Edges.Right)
     }
 
     IconImage {