From ae84dc1504625a27dafeacf4becf26610a63bbe2 Mon Sep 17 00:00:00 2001 From: funman300 Date: Fri, 8 May 2026 09:52:55 -0700 Subject: [PATCH] fix(engine): clear top-bar overlap by aligning action buttons to TYPE_BODY MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The post-Option-D screenshot showed the left-anchored HUD column ("Score: 0 Moves: 0 0:00") and the right-anchored action button row colliding mid-screen at portrait/narrow window widths. Both were absolute-positioned siblings without a shared flex parent, so Bevy 0.15's UI couldn't auto-arrange them when their natural widths exceeded the available horizontal space. The action button text was a hardcoded `font_size: 16.0` literal — a miss from the typography migration audit, since every other text element in `hud_plugin.rs` already routes through the `TYPE_*` tokens. Switching to `TYPE_BODY` (14.0) brings the button row in line with the design system *and* trims roughly 12% off label widths. Pairs with a horizontal-padding cut from VAL_SPACE_3 to VAL_SPACE_2: 8px less on each side, six buttons, ~96px total reclaimed across the row. Vertical padding stays at VAL_SPACE_2 so button height tracks the rest of the chrome band. Combined effect: the action button row narrows by ~150-200px, which is enough margin to clear typical portrait window widths without requiring a structural refactor (a shared SpaceBetween flex parent for HUD+actions would be more robust but touches many query sites and was out of scope for the visual-polish pass). cargo clippy + cargo test --workspace clean. Co-Authored-By: Claude Opus 4.7 --- solitaire_engine/src/hud_plugin.rs | 15 +++++++++++++-- 1 file changed, 13 insertions(+), 2 deletions(-) diff --git a/solitaire_engine/src/hud_plugin.rs b/solitaire_engine/src/hud_plugin.rs index b270e5d..9d541ee 100644 --- a/solitaire_engine/src/hud_plugin.rs +++ b/solitaire_engine/src/hud_plugin.rs @@ -571,7 +571,13 @@ fn spawn_hud(font_res: Option>, mut commands: Commands) { fn spawn_action_buttons(font_res: Option>, mut commands: Commands) { let font = TextFont { font: font_res.as_ref().map(|f| f.0.clone()).unwrap_or_default(), - font_size: 16.0, + // TYPE_BODY (14.0) — was a hardcoded `16.0` until the + // top-bar-overlap fix. Aligns with the rest of `hud_plugin`'s + // text (which already routes through the `TYPE_*` tokens) and + // reclaims horizontal space so the action button row doesn't + // collide with the left-anchored HUD column at narrow window + // widths. + font_size: TYPE_BODY, ..default() }; commands @@ -695,7 +701,12 @@ fn spawn_action_button( order, }, Node { - padding: UiRect::axes(VAL_SPACE_3, VAL_SPACE_2), + // Horizontal padding stepped down from VAL_SPACE_3 to + // VAL_SPACE_2 to reclaim ~96px across the 6-button row at + // narrow window widths (see top-bar-overlap fix in the + // companion commit). Vertical padding stays at VAL_SPACE_2 + // so button height tracks the rest of the chrome band. + padding: UiRect::axes(VAL_SPACE_2, VAL_SPACE_2), justify_content: JustifyContent::Center, align_items: AlignItems::Center, border_radius: BorderRadius::all(Val::Px(RADIUS_MD)),