Align vertical bar widgets to the icon grid

shell/plugins/bar/widgets/Clock.qml

@@ -14,6 +14,8 @@ BarWidget {
   readonly property string activeFormat: alt
     ? setting("formatAlt", "d MMMM 'W'ww yyyy")
     : (bar && bar.vertical ? setting("verticalFormat", "HH\n—\nmm") : setting("format", "dddd HH:mm"))
+  readonly property string displayText: formatted(displayDate)
+  readonly property var verticalLines: displayText.split("\n")
 
   function refresh() {
     displayDate = new Date()
@@ -54,7 +56,10 @@ BarWidget {
     id: button
     anchors.fill: parent
     bar: root.bar
-    text: root.formatted(root.displayDate)
+    text: root.vertical ? "" : root.displayText
+    labelVisible: !root.vertical
+    hasVisualContent: root.vertical ? root.verticalLines.length > 0 : text !== ""
+    fixedHeight: root.vertical ? root.verticalLines.length * Style.bar.iconSlot : -1
     horizontalMargin: 8.75
     verticalPadding: 8.75
     onPressed: function(button) {
@@ -62,5 +67,24 @@ BarWidget {
       if (button === Qt.RightButton) root.bar.run("omarchy-menu-timezone")
       else root.alt = !root.alt
     }
+
+    Column {
+      visible: root.vertical
+      anchors.fill: parent
+
+      Repeater {
+        model: root.verticalLines
+
+        OpticalGlyph {
+          required property string modelData
+          width: button.width
+          height: Style.bar.iconSlot
+          text: modelData
+          fontFamily: button.fontFamily
+          fontSize: button.fontSize
+          color: button.foreground
+        }
+      }
+    }
   }
 }

shell/plugins/panels/weather/BarWidget.qml

@@ -37,7 +37,7 @@ BarWidget {
   }
 
   visible: panelLoader.item && panelLoader.item.label !== ""
-  implicitWidth: bar && bar.vertical ? button.implicitWidth : button.implicitWidth + Style.spacing.labelGap
+  implicitWidth: button.implicitWidth
   implicitHeight: button.implicitHeight
 
   onBarChanged: injectPanel()
@@ -54,16 +54,12 @@ BarWidget {
     }
   }
 
-  WidgetButton {
+  BarIconButton {
     id: button
-    anchors.verticalCenter: parent.verticalCenter
-    x: bar && bar.vertical ? Math.round((parent.width - width) / 2) : 0
-    width: implicitWidth
-    height: implicitHeight
+    anchors.fill: parent
     bar: root.bar
     text: panelLoader.item ? panelLoader.item.label : ""
     active: panelLoader.item && panelLoader.item.klass === "active"
-    horizontalMargin: 2.5
     // Tooltip suppressed because the panel is the detail view.
     tooltipText: ""