Skip to content

fix: replace invisible zero-width-space spacer text with CSS alignment - #119

Open
mzf11125 wants to merge 1 commit into
paradigmxyz:mainfrom
mzf11125:fix/block-config-spacer
Open

mzf11125 wants to merge 1 commit into
paradigmxyz:mainfrom
mzf11125:fix/block-config-spacer

Conversation

@mzf11125

Copy link
Copy Markdown

Replace the invisible zero-width-space character ({\u200e}) used as a vertical spacer in the Interval and Mine components of block-config.tsx with proper CSS alignment. Both occurrences were marked with a TODO: don't do this lol comment.

The fix uses alignVertical="bottom" on the Inline wrapper, which maps to align-items: flex-end and aligns the child buttons to the bottom of the row, matching the input fields without a phantom element.

Verified: biome check, tsc --noEmit, and bun run build all pass.

Closes #117

The Interval and Mine components used a zero-width-space character
inside a Text element as a vertical spacer to align buttons with
input fields. Both were marked with a TODO to remove the hack.

Replace it with alignVertical="bottom" on the Inline wrapper,
which aligns child elements to the bottom of the flex row via
align-items: flex-end. The buttons now sit flush with the bottom
of the input fields without a phantom element.

Closes paradigmxyz#117
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Replace invisible zero-width-space spacer text in block-config.tsx

1 participant