Fixed footer and watermark overlapping cards on narrow screens - #73
Merged
Merged
Conversation
Below ~900px, main no longer has enough side margin to keep the fixed corner watermark and footer bar clear of the cards, so as the page scrolls they end up pinned on top of card content. Take them out of fixed positioning on narrow screens so they flow below the page instead, and drop the redundant watermark logo (already shown in the header). Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01UFyi1FScacF1T8SDaaqzEt
|
Tip All tests passed and all changes approved!🟢 UI Tests: bbqs-uploader-playwright: 2 changes accepted as baselines |
|
Tip All tests passed and all changes approved!🟢 UI Tests: bbqs-uploader-storybook: 36 tests unchanged |
|
CodyCBakerPhD
marked this pull request as ready for review
August 7, 2026 05:29
The 900px guess kicked in well after cards actually started overlapping the footer. Measured against the built page: main tops out at an 828px content box, and the footer's left column needs about 270px of margin on each side to clear it, so overlap becomes geometrically possible around 1368px wide (the CON logo's own margin need is narrower, so it's covered by the same threshold). Moved the breakpoint to 1400px, just past that measured point. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01UFyi1FScacF1T8SDaaqzEt
CI's integration job was failing: Playwright's default 1280x720 viewport falls under the new max-width: 1400px breakpoint, so the watermark logo this test checks for is now intentionally hidden there. Pin the test to a wide viewport so it exercises the desktop layout it's meant to cover. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01UFyi1FScacF1T8SDaaqzEt
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
2 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.
Fixed an issue where the fixed-position corner watermark and footer bar would overlap card content on screens narrower than ~900px, obscuring the page content as users scrolled.
Changes:
mainto accommodate the repositioned footerVersion bumped to 1.1.5
https://claude.ai/code/session_01UFyi1FScacF1T8SDaaqzEt