Get rid of horizontal scrollbar on dashboard page #906
Conversation
This file contains 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
jessepinho
commented
Apr 8, 2024
| @@ -43,7 +43,7 @@ export default function AssetsTable() { | |||
| <TableHeader key={account.account} className='group'> | |||
| <TableRow> | |||
| <TableHead colSpan={2}> | |||
| <div className='flex max-w-full flex-col justify-center gap-2 md:flex-row pt-8 group-[:first-of-type]:pt-0'> | |||
| <div className='flex max-w-full flex-col justify-center gap-2 pt-8 group-[:first-of-type]:pt-0 md:flex-row'> | |||
There was a problem hiding this comment.
This was just one of those tailwind class-order linting things. Figured I'd fix it while I was investigating this.
jessepinho
commented
Apr 8, 2024
| @@ -35,7 +35,7 @@ export const Layout = () => { | |||
| return ( | |||
| <> | |||
| <HeadTag /> | |||
| <div className='flex min-h-screen w-screen flex-col'> | |||
| <div className='flex min-h-screen w-full flex-col'> | |||
There was a problem hiding this comment.
This is the actual fix. w-screen was setting the div's width to 100vw, which causes overflow when there's a vertical scrollbar. w-full sets it to 100%, which accounts for the vertical scrollbar.
The reason we only saw this problem on the dashboard, is that the dashboard was the only page with a vertical scrollbar!
jessepinho
requested review from
turbocrime,
grod220,
Valentine1898 and
TalDerei
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.
See inline code comments.
Before
Note the horizontal scrollbar at the bottom.
After
Closes #899