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>
This commit is contained in:
@@ -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()
|
||||
|
||||
Reference in New Issue
Block a user