Fix for long homepage title words causing horizontal scrolling on mobile #322
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
With long unbroken strings in a title on the home page the mobile page has horizontal scroll where it shouldn't and has a bad user experiance. This should fix it so it doesn't continue to force horizontal scroll. This prefers text-wrap: pretty, but falls back to the more broadly adopted text-wrap: balance.
👷 Deploy request for photogabble pending review.Visit the deploys page to approve it
|
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.
Hey! My layout for the home page is slightly different than yours, so definitely test on your side, but I noticed that particularly long unbroken strings can cause the homepage to gain a horizontal scroll leading to a difficult reading experience. This is a problem I have because Pocket occasionally drops unbroken URLs into my Amplify block, but may not happen on your site, but could one day. This fixed it on my site, I think it should fix it on yours as well if it happens there.
I also added an
.editorconfigfile. I don't think you use it, but by having it in your repo, future contributors who leverage EditorConfig can make changes without accidentally changing a ton of spacing in the files they touch. Even so, this comes with a bunch of spacing changes, sorry!The main change is at the top of
.content-gridandmain > section.The double rule of
is there because
prettylooks better, but is not as broadly adopted across browsers asbalanceis.