Let the Civic Days paragraph fill its column on the About page - #354
Merged
Merged
Conversation
Same pattern as #352: CivicDaysSection's <p> had a redundant width (60% at 1280px, 45% at 1440px) stacked inside a grid column already sized by grid-template-columns: 1fr 3fr, leaving a large empty gap on the right — visible on the About page (this component only renders there; team.js and index.js both pass the 'home' prop, which hides it). Dropped the width overrides. Verified locally (gatsby develop) at 1470px viewport: the paragraph now fills ~98% of its column (963/983px, the remainder is the column's own padding) instead of being capped at 45%.
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.
Same pattern as #352: the "Civic Days" paragraph on /about/ stopped well short of the right edge of its column, on screens 1280px and wider.
Root cause:
CivicDaysSection's<p>(src/pages/team.js) had a redundantwidth— 60% at 1280px, 45% at 1440px — stacked inside a grid column already sized bygrid-template-columns: 1fr 3fr. At 1440px+ the text used less than half its column.Where it shows: this component is defined in
team.jsbut doesn't render on the Team page itself —team.jsandindex.jsboth call it with ahomeprop that hides this block. It's only live on /about/ (about.js:269), under the "Civic Days" heading.Fix: dropped the
width: 60%/width: 45%overrides.Verified: ran
gatsby developlocally and measured the rendered paragraph at a 1470px viewport — it now fills 963px of its 983px column (the remainder is the column's own padding), instead of being capped at 45%.