Text in button do not align on shrinkage of interface on Windows and Linux

[sshlien]

ABCarus version

36.1

OS

Linux

OS details

No response

What happened?

When the width of the interface is reduced, the text inside the buttons width do not adjust to accept the font.
See attached gif file ABCurasButtons.gif below.

What did you expect to happen?

The button's width should be specified in units of characters rather than pixels.

Reproduction steps

Start ABCarus and decrease the window width.

Minimal sample (recommended)

X: 1
T: The Kesh Jig
N: page 1
N: hexatonic
N: matches 161
R: jig
M: 6/8
L: 1/8
K: G
D \
| "G"~G3 GAB | "D"ABA ABd | "G"edd gdd | "Em"edB "G"dBA  |\
~G3 GAB |"D"ABA ABd | "G"edd gdB | "D"AGF "G"G2 ::
 A |"G"~B3 dBd | ege "G"dBG | ~B3 dBG | "D"ABA AGA  |\
 "G"BAB dBd| "Em"ege "G"dBd | gfg "D"aga | "G"bgf g2 :|

Debug dump / diagnostics (highly recommended)

Logs / error messages

Quick checks

• I can reproduce this on the latest release.
• I included clear repro steps.
• If this involves file writes/import/export, I have a backup of the affected file(s).

[topchyan]

Triage update (2026-04-13): confirmed as an active UI bug report.

Status:

• Open
• Priority: medium (UX/layout quality)
• Scope: toolbar/button responsive behavior at reduced window widths (Linux/Windows)

Proposed implementation direction:

• Rework toolbar wrapping/min-width rules to avoid text clipping/misalignment.
• Keep button labels readable under narrow widths without breaking control grouping.

No closure yet; this should be tracked as a real fix item.

[topchyan]

Update: I prepared a focused fix for this in branch fix-35-toolbar-responsive.

What changed:

• Toolbar buttons/controls in flex rows no longer shrink under narrow window widths (flex-shrink disabled for toolbar button-like controls).
• Button labels are now forced to single-line (white-space: nowrap) to avoid clipped/misaligned text rendering during window shrink.

This targets the exact symptom from the report: text deformation/misalignment when reducing app width on Linux/Windows.

Validation run:

• node scripts/check_renderer_build.mjs
• npm run -s test:settings

If you want, I can merge this immediately and include it in the next patch release.

[topchyan]

Update: this is now fixed and shipped in v0.37.1.

Release:
https://github.com/topchyan/abcarus/releases/tag/v0.37.1

What was fixed:

• Responsive toolbar wrapping on narrow windows no longer overlaps/deforms controls.
• File-header control row (New Tune, Templates, Errors, Follow, Globals) now wraps in a stable, coherent way instead of breaking into awkward single-button lines.

If you still see a specific bad-width case on Linux/Windows, please add one screenshot with window width details and I will tune that breakpoint precisely.