From 0b520d97ac938a647895c5999326d6c3a6a71437 Mon Sep 17 00:00:00 2001
From: Andre Padez <andre.padez@gmail.com>
Date: Mon, 17 Aug 2026 18:01:17 +0100
Subject: [PATCH] Size the bar icon to match, and close the gap to the label

Three separate contributors, only one of which was the obvious one:

- The glyph rendered at Style.bar.iconFont (26px at base-size 24), noticeably
  smaller than the Offscale mark beside it. Now space(20) = 40px, with the
  canvas sized to hold it.

- The label sat ~19px from the icon. Most of that was not the Row spacing but
  WidgetButton's own horizontalMargin, which defaults to 8.5 and lands at
  ~17px per side at this scale. Trimming the slot and the spacing barely moved
  it until that came down too.

- Trimming the slot flush to the glyph left nothing between this icon and the
  Offscale mark to its left: bar sections lay out with spacing: 0, so
  separation only ever comes from slack each widget reserves. Hence an
  explicit leading spacer rather than relying on the section.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
---
 Panel.qml | 28 +++++++++++++++++++++++++++-
 1 file changed, 27 insertions(+), 1 deletion(-)

diff --git a/Panel.qml b/Panel.qml
index 0740899..0d063a0 100644
--- a/Panel.qml
+++ b/Panel.qml
@@ -391,7 +391,17 @@ Panel {
   Row {
     id: barContent
     anchors.fill: parent
-    spacing: Style.space(4)
+    spacing: Style.space(1)
+
+    // Bar sections lay their widgets out with spacing: 0, so separation between
+    // neighbouring widgets comes from whatever slack each one reserves. The
+    // slot is trimmed tight to the glyph below, which leaves nothing between
+    // this icon and the Offscale mark to its left — hence an explicit spacer.
+    Item {
+      width: Style.space(7)
+      height: 1
+      anchors.verticalCenter: parent.verticalCenter
+    }
 
     BarIconButton {
       id: button
@@ -399,6 +409,18 @@ Panel {
       bar: root.bar
       text: "󱚣"
       active: root.alarming
+      // Stock draws this glyph at Style.bar.iconFont (26px at base-size 24)
+      // inside a Style.bar.iconCanvas box (32px), in a Style.bar.iconSlot of
+      // reserved width (54px). That left the mark small next to the Offscale
+      // logo, and ~11px of dead slot either side of it — which read as the
+      // label floating away from the icon.
+      //
+      // Sized to match the Offscale mark (32px), with the canvas just big
+      // enough to hold it and the slot trimmed to the canvas so the label sits
+      // right beside the glyph rather than beyond its padding.
+      fontSize: Style.space(20)
+      opticalSize: Style.space(21)
+      slotSize: Style.space(21)
       onPressed: function(buttonCode) {
         if (buttonCode === Qt.RightButton) root.launchAgent()
         else if (buttonCode === Qt.MiddleButton) root.selectProvider(root.providerIndex + 1)
@@ -419,6 +441,10 @@ Panel {
       // A step below the icon font: it is a label, not a glyph, and the bar is
       // crowded.
       fontSize: Style.font.bodySmall
+      // WidgetButton defaults horizontalMargin to 8.5, which at this scale is
+      // ~17px of padding on each side — that, not the Row spacing, was what
+      // held the label away from the icon.
+      horizontalMargin: 1
       anchors.verticalCenter: parent.verticalCenter
       onPressed: function(buttonCode) {
         if (buttonCode === Qt.RightButton) root.launchAgent()