fix(app): mobile prompt input buttons overflow on narrow viewports #11615
Conversation
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
Contributor
|
The following comment was made by an LLM, it may be inaccurate: No duplicate PRs found |
athal7
force-pushed
the
fix/mobile-prompt-input-buttons
branch
from
5fb8165 to
178bfc2
Compare
Contributor
|
@athal7 please add screenshots |
Contributor
Author
|
@adamdotdevin Sorry they got overwritten when I tagged more issues. Added back now |
athal7
force-pushed
the
fix/mobile-prompt-input-buttons
branch
from
178bfc2 to
7265fd3
Compare
Contributor
Author
|
Updated with a simpler approach that works with the current upstream/dev (post-#11675 UI refresh). Changes:
This avoids modifying the Select component or changing the thinking variant from Button to Select dropdown - just CSS/class tweaks. Screenshots have been updated. Typecheck failure is from upstream |
- Use tighter gap spacing on mobile (gap-1 vs gap-2 on desktop) - Add shrink-0 to prevent buttons from compressing - Add min-w-0 to left section to allow proper flex shrinking - Hide text labels on mobile for model and thinking selectors - Remove absolute positioning from right button group Tested at 320px (iPhone SE) and 375px (iPhone) viewports. Fixes anomalyco#11613
athal7
force-pushed
the
fix/mobile-prompt-input-buttons
branch
from
7265fd3 to
2ec1ec3
Compare
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
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.
Summary
Fixes mobile layout for prompt input button bar where buttons overflow or clip on narrow viewports (320-375px).
Changes:
gap-1vsgap-2on desktop)shrink-0to prevent buttons from compressingmin-w-0to left section to allow proper flex shrinkingTested at 320px (iPhone SE) and 375px (iPhone 12/13/14) viewports.
Screenshots
Fixes #11613
Partially addresses: