Repository navigation
Conversation
The dialog passed `className="max-w-2xl"`, but the base DialogContent hard-codes `sm:max-w-sm`. Because `max-w-2xl` is a base utility and `sm:max-w-sm` is a responsive one, tailwind-merge keeps BOTH — and on desktop the `sm:` rule wins, so the box clamped to 384px while the form (title/description/PR rows) is laid out for 672px. The content overflowed to the right past the faint bg-black/10 backdrop — "out of bounds, transparent on the right." Fix: use `sm:max-w-2xl` so it overrides the base `sm:max-w-sm`, matching how every other wide dialog in the codebase sets its width. Proven via tailwind-merge: cn(base, "max-w-2xl") -> max-w-sm max-w-2xl (sm:max-w-sm wins on desktop) cn(base, "sm:max-w-2xl") -> calc(100%-2rem) 2xl (correct: 672px at sm+) views typecheck + eslint clean; create-release-dialog tests (6) pass. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This branch has not been deployed
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
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 bug
The Create release modal rendered its form out of the dialog's bounds — the inputs and PR rows spilled off the right side, over the faint backdrop (looked transparent on the right).
Root cause: the dialog sets
className="max-w-2xl", but the baseDialogContenthard-codessm:max-w-sm(384px).max-w-2xlis a base utility andsm:max-w-smis a responsive one, so tailwind-merge keeps both — and on desktop thesm:rule wins. The box clamped to 384px while the form is built for 672px, so the content overflowed.Proven with the project's own
tailwind-merge:The fix
One line:
max-w-2xl→sm:max-w-2xl, matching how every other wide dialog in the codebase already does it (sm:max-w-xl,sm:max-w-lg,sm:max-w-2xl, …).Test plan
create-release-dialog.test.tsx(6) pass.Same latent pattern elsewhere (not in this PR)
issues/.../label-picker.tsxalso uses baremax-w-2xl(same 384px clamp — though its short content mostly fits), andskill-add-dialog.tsx/ship-concierge-setup-dialog.tsxuse baremax-w-md(clamp 448→384, minor). Worth a sweep tosm:-prefix them, but they're not visibly broken like this one.🤖 Generated with Claude Code