fix(storybook): prevent Docs args table overflow on mobile #1809
+6
−0
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.
Fix Storybook Docs Args table overflow on mobile
What does this PR do?
Fixes a mobile layout issue in Storybook Docs where the Args/Props table overflows the viewport, causing the entire Docs page to scroll horizontally.
On small screens, long type definitions and controls force the table width beyond the viewport, breaking the mobile experience.
How is it fixed?
Wraps Storybook Docs content in a scoped container
Applies a mobile-only horizontal overflow rule so only the Args table scrolls
Keeps desktop layout and dark mode behavior unchanged
Why this change is needed
Prevents page-level horizontal scrolling on mobile
Improves readability and usability of Docs on small screens
Maintains backward compatibility with existing Storybook setup
Testing
Ran Storybook locally using yarn storybook
Verified behavior on mobile viewport (~375px width)
Confirmed no visual regression on desktop
Verified dark mode still works correctly