yuris/garage
1
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages 1 Wiki Activity Actions

fix(store): prevent cart summary total overflow at 24px root font #120

Merged
yuris merged 1 commit from fix/93-cart-summary-overflow into main 2026-09-28 20:51:06 +00:00
Conversation 1 Commits 1 Files changed 2 +4 -3
yuris commented 2026-09-28 20:50:42 +00:00
Owner
Copy link

Resolves #93

Summary

  • Adds flex-wrap: wrap; to .total-row in tokens.css so .total-label and .price wrap cleanly when container space is constrained.
  • Sets .total-row .price font size to clamp(1.2rem, 5vw, 1.6rem) so large totals (e.g. Rp 13.070.000) fit within the 254px summary content box at a 24px root font on a 320px viewport (WCAG 1.4.10 Reflow).
  • Regenerated apps/store/app/globals.css via pnpm --filter garage-store port-design.

Verification

  • Tested with headless Chromium at 320px viewport with 24px root font and Rp 13.070.000 total: document.documentElement.scrollWidth === document.documentElement.clientWidth (320px, zero horizontal scroll).
  • Verified responsive layout across 320px (16px & 24px root), 375px (24px root), and 1280px (16px root).
  • Ran pnpm --filter garage-store test (111 passed, 0 failed).
  • Ran pnpm --filter garage-store lint (Biome clean, 0 findings).
Resolves #93 ### Summary - Adds `flex-wrap: wrap;` to `.total-row` in `tokens.css` so `.total-label` and `.price` wrap cleanly when container space is constrained. - Sets `.total-row .price` font size to `clamp(1.2rem, 5vw, 1.6rem)` so large totals (e.g. `Rp 13.070.000`) fit within the 254px summary content box at a 24px root font on a 320px viewport (WCAG 1.4.10 Reflow). - Regenerated `apps/store/app/globals.css` via `pnpm --filter garage-store port-design`. ### Verification - Tested with headless Chromium at 320px viewport with 24px root font and `Rp 13.070.000` total: `document.documentElement.scrollWidth === document.documentElement.clientWidth` (320px, zero horizontal scroll). - Verified responsive layout across 320px (16px & 24px root), 375px (24px root), and 1280px (16px root). - Ran `pnpm --filter garage-store test` (111 passed, 0 failed). - Ran `pnpm --filter garage-store lint` (Biome clean, 0 findings).
fix(store): prevent cart summary total overflow at 24px root font (#93)
All checks were successful
Checks / typecheck apps/management (pull_request) Successful in 1m36s
Details
Checks / test @garage/catalog (pull_request) Successful in 1m13s
Details
Checks / test garage (pull_request) Successful in 1m21s
Details
Checks / test garage-store (pull_request) Successful in 1m18s
Details
Checks / lint (biome) (pull_request) Successful in 11s
Details
Checks / typecheck apps/store (pull_request) Successful in 1m21s
Details
14256f89ca
yuris reviewed 2026-09-28 20:51:01 +00:00
yuris left a comment
Copy link

VERDICT: approve

  • Adds flex-wrap: wrap to .total-row and clamp(1.2rem, 5vw, 1.6rem) to .price in tokens.css.
  • Regenerated cleanly with port-design.mjs.
  • Verified at 320px viewport with 24px root font: no horizontal scroll, satisfying WCAG 1.4.10 reflow.
VERDICT: approve - Adds `flex-wrap: wrap` to `.total-row` and `clamp(1.2rem, 5vw, 1.6rem)` to `.price` in `tokens.css`. - Regenerated cleanly with `port-design.mjs`. - Verified at 320px viewport with 24px root font: no horizontal scroll, satisfying WCAG 1.4.10 reflow.
yuris merged commit d21c567486 into main 2026-09-28 20:51:06 +00:00
yuris changed title from fix(store): prevent cart summary total overflow at 24px root font (#93) to fix(store): prevent cart summary total overflow at 24px root font 2026-09-28 21:09:18 +00:00
Sign in to join this conversation.
Reviewers
No reviewers
Labels
Clear labels
No items
No labels
Milestone
Clear milestone
No items
No milestone
Projects
Clear projects
No items
No project
Assignees
Clear assignees
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
yuris/garage!120
No description provided.