Skip to content

fix(PageLayout): add maxWidth to container - #2502

Merged
joshblack merged 4 commits into
mainfrom
fix/update-page-layout-container
Oct 31, 2022
Merged

fix(PageLayout): add maxWidth to container#2502
joshblack merged 4 commits into
mainfrom
fix/update-page-layout-container

Conversation

@joshblack

Copy link
Copy Markdown
Member

This PR updates the container used to wrap PageLayout.Pane and PageLayout.Content to match their previous parent element which set max-width: 100%.

Without this property, the PageLayout.Content pane would extend passed the edge of the page and trigger overflow. This lead to issues as described here where the position: sticky was triggered due to the overflow.

To reproduce this issue, you can visit the reivew lab from that Slack thread and reduce the size of the browser to where the symbol pane overlaps the code area. Adding in max-width: 100% to the container of the main and Pane addresses the issue.

@joshblack
joshblack requested review from a team and JoshBowdenConceptsOctober 31, 2022 17:47
@changeset-bot

changeset-botBot commented Oct 31, 2022

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 45e0a79

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
NameType
@primer/reactPatch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@github-actions

github-actionsBot commented Oct 31, 2022

Copy link
Copy Markdown
Contributor

size-limit report 📦

PathSize
dist/browser.esm.js78.14 KB (+0.01% 🔺)
dist/browser.umd.js78.79 KB (+0.01% 🔺)

@joshblack
joshblack temporarily deployed to github-pages October 31, 2022 17:57 Inactive
@joshblack
joshblack temporarily deployed to github-pages October 31, 2022 18:23 Inactive

@colebemiscolebemis left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚢

@joshblack
joshblack enabled auto-merge (squash) October 31, 2022 18:47
@joshblack
joshblack temporarily deployed to github-pages October 31, 2022 18:53 Inactive
@joshblack
joshblack merged commit 6199b10 into mainOct 31, 2022
@joshblack
joshblack deleted the fix/update-page-layout-container branch October 31, 2022 18:55
@primer-cssprimer-css mentioned this pull request Oct 31, 2022
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

@joshblack@jdrush89@colebemis