fix(mobile): wrap forms-list actions and space the schedule banner#184
Merged
Conversation
- Forms list (dashboard): the per-form action buttons sat in a non-wrapping shrink-0 row and ran off the right edge on narrow screens. The row now stacks below the form info on mobile and the buttons wrap; on sm+ it stays a right-aligned row. The header actions wrap too. - Public form page: the "closes at" / "ending soon" banner had no gap to the form below, so it crowded the multi-step progress. Added bottom spacing.
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.
Two mobile layout fixes from screenshots.
1. Forms list action buttons overflow on mobile
On the dashboard Forms list, each form's action buttons (Export CSV/XLSX/JSON/PDF, Export JSON, Preview, Edit, Replace JSON, Delete) lived in a non-wrapping
shrink-0row and ran off the right edge of the card on narrow screens.Now the row stacks below the form info on mobile and the buttons wrap; on
sm+it stays a right-aligned single row as before. The header actions (Import JSON / New form / ...) wrap too.2. Schedule banner crowds the form
On the public form page, the "Closes at" / "Ending soon" banner had no gap to the form below it, so it crowded the multi-step progress ("Step 1 / 2"). Added bottom spacing so the banner sits clear of the form.
Layout-only (responsive Tailwind classes). Lint and build green.