feat(portal): mobile-responsive layout#915
Merged
Merged
Conversation
Add responsive styles and small-viewport behavior across the portal UI. Key changes: - app.scss: responsive paddings, loading margins, header layout and small-viewport positioning. - global.scss: add $BREAKPOINT_* variables, prevent iOS zoom on inputs, hide horizontal overflow. - Sidebar: overlay behavior below 1024px, backdrop element, mobile full-width sidebar and z-index (SCSS + Sidebar.tsx portal markup). - Table: enable horizontal scrolling on narrow screens and set CSS var --table-min-width computed in Table.tsx (adds fallback column width calculation). - MetricsBreakdown: constrain label widths on mobile. - Scenes (CreateDestination, Destination, DestinationSettings, Attempts, DestinationsList): multiple layout, wrapping, grid and spacing adjustments for tablet/mobile viewports; improved wrapping for long values and tooltips. These changes improve usability on tablet/phone widths and add safeguards for mobile browsers.
Contributor
|
Really nice! We'll do some minor tweaks and ship it 💪 |
alexluong
requested changes
May 27, 2026
Rename Table component variables to use camelCase (fallbackFlexColumnWidth, tableMinWidth) and update the CSS custom property usage accordingly. In global.scss, remove previously defined breakpoint variables and replace the breakpoint reference with a hardcoded 640px in the media query. These changes improve naming consistency in the React code and simplify the responsive media query reference.
alexbouchardd
approved these changes
May 28, 2026
alexluong
approved these changes
May 29, 2026
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
3 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.
Add responsive styles and small-viewport behavior across the portal UI. Key changes:
These changes improve usability on tablet/phone widths and add safeguards for mobile browsers.