fix(web): bento copy button size + leading whitespace in code blocks#25
Merged
lukeocodes merged 1 commit intomainfrom May 5, 2026
Merged
fix(web): bento copy button size + leading whitespace in code blocks#25lukeocodes merged 1 commit intomainfrom
lukeocodes merged 1 commit intomainfrom
Conversation
Two related issues from the registry-model bento section:
1. Leading whitespace on the first line of every code block. The
Astro source had {code} and <button> on separate lines inside a
div with white-space: pre, so the JSX source indentation between
them rendered as visible leading whitespace before the first line
of code.
2. Copy button looked oversized on tighter rows. The previous
implementation used absolute positioning with hover background,
which made it dominate the small code box.
Restructured the code box as a flex row of two siblings: a <code>
element holding the snippet (still white-space: pre), and the copy
button as a separate flex item with no absolute positioning and no
hover background. The whole container is on one source line so JSX
formatting whitespace stops leaking into the rendered output.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
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 free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
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.
Fixes the leading-whitespace bug (JSX source indent leaking into white-space: pre) and the oversized copy button on the bento step cards.
child for the text and a sibling button.