Skip to content

Commit

Permalink
8248/fix toc layout (#8338)
Browse files Browse the repository at this point in the history
This PR adjusts the page padding site wide to ensure that the minimum
breakpoint at which the TOC appears allows embedded examples to show the
default desktop breakpoint. Previously this would show a tablet
breakpoint instead.
* Updated Page styles to reduce gap from `5rem` to `2.5rem` 
* Update Container styles to reduce horizontal padding from `4rem` to
`1.5rem`
  • Loading branch information
gwyneplaine committed Feb 21, 2023
1 parent 27b08bb commit 3bc410d
Show file tree
Hide file tree
Showing 2 changed files with 2 additions and 2 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
margin-left: auto;
margin-right: auto;
max-width: $pageMaxWidth;
padding: 0 4rem;
padding: 0 1.5rem;

@media screen and (max-width: $breakpointTablet) {
padding: 0 1.25rem;
Expand Down
2 changes: 1 addition & 1 deletion polaris.shopify.com/src/components/Page/Page.module.scss
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
.Page {
--toc-width: 16rem;
display: flex;
gap: 5rem;
gap: 2.5rem;
}

.Post {
Expand Down

0 comments on commit 3bc410d

Please sign in to comment.