fix(ui): stop the hero value from wrapping mid-number - #16
Merged
Conversation
The latest updates on your projects. Learn more about Vercel for GitHub.
|
codecov-commenter
commented
Aug 2, 2026
Codecov Report✅ All modified and coverable lines are covered by tests. 📢 Thoughts on this report? Let us know! |
This comment was marked as resolved.
This comment was marked as resolved.
Sorry, something went wrong.
Uh oh!
There was an error while loading. Please reload this page.
The value used a fixed text-8xl with break-words, so anything longer than about nine characters broke inside the number itself: "R$ 58.480,37" rendered with the trailing "7" alone on a second line. Size it against the panel instead of the viewport: the wrapper becomes a container and the font scales with the character count, clamped between 1.5rem and the previous 6rem. Measured in Chromium at 375, 768, 1280, 1536 and 2560 px with values up to "R$ 926.150,68" - one line, no overflow, at every size. The size travels as a custom property because jsdom drops a fontSize holding clamp() with cqi, which would leave the behaviour untestable. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Dividing by value.length gave Infinity for an empty string, so the custom property became clamp(1.5rem, Infinitycqi, 6rem) - invalid CSS that the browser drops entirely, falling back to the inherited size. The test now reads the custom property off element.style rather than regexing outerHTML, which would have matched any cqi in the subtree. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
devRMAforce-pushed
the
fix/hero-panel-value-overflow
branch
from
August 2, 2026 18:46
8427171 to
4c772f7CompareUh oh!
There was an error while loading. Please reload this page.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for freeto join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
The value used a fixed text-8xl with break-words, so anything longer
than about nine characters broke inside the number itself: "R$ 58.480,37"
rendered with the trailing "7" alone on a second line.
Size it against the panel instead of the viewport: the wrapper becomes a
container and the font scales with the character count, clamped between
1.5rem and the previous 6rem. Measured in Chromium at 375, 768, 1280,
1536 and 2560 px with values up to "R$ 926.150,68" - one line, no
overflow, at every size.
The size travels as a custom property because jsdom drops a fontSize
holding clamp() with cqi, which would leave the behaviour untestable.
Co-Authored-By: Claude Opus 5 noreply@anthropic.com
Stack created with GitHub Stacks CLI • Give Feedback 💬