added max width to base layout to match component layout width (#623)

* added max width to base layout to match component layout width * Create tasty-snakes-end.md * Update theme/src/components/layout.js * Update tasty-snakes-end.md * Update theme/src/components/layout.js * width test * fixed
primer · Aug 18, 2023 · d03feaa · d03feaa
1 parent 8ba78e5
commit d03feaa
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 0 deletions.
diff --git a/.changeset/tasty-snakes-end.md b/.changeset/tasty-snakes-end.md
@@ -0,0 +1,5 @@
+---
+"@primer/gatsby-theme-doctocat": patch
+---
+
+- Add maxWidth: '1200' to the base layout container so that content widths are consistent across primer.style docs
diff --git a/theme/src/components/layout.js b/theme/src/components/layout.js
@@ -82,6 +82,8 @@ function Layout({children, pageContext, path}) {
             justifyContent: 'center',
             flexDirection: 'row-reverse',
             display: 'flex',
+            maxWidth: '1200px',
+            mx: 'auto',
             width: '100%',
             p: [4, 5, 6, 7]
           }}