fix(layout): pin the footer to the viewport bottom on short pages - #93
Merged
Merged
Conversation
- Make body a min-height:100vh flex column so .primer-layout grows to fill leftover space, landing the footer on the window's bottom edge instead of right under short content -- previously only .primer-sidebar's fixed height achieved this by accident, and that stopped applying once the sidebar hides below 1011.98px. - Stretch .primer-sidebar to its grid row (capped with max-height) instead of a flat 100vh, so it stops overshooting the footer by its own height on tall windows while still scrolling its own nav list on long pages. Closes #92 Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
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
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
bodyamin-height: 100vhflex column so.primer-layoutgrows to fill leftover space, landing the footer on the window's bottom edge on short pages instead of right under the content. Previously this only happened by accident, via.primer-sidebar's fixed height — which stopped applying once the sidebar hides below 1011.98px, leaving a dead gap under the footer on mobile/tablet..primer-sidebarto its actual grid row (capped withmax-height) instead of a flat100vh, so on desktop it no longer overshoots the footer by its own height on short pages (which pushed the footer below the fold on tall windows), while still scrolling a long nav list within its own box on long pages.Closes #92
Test plan