Fixes: Scroll to top behavior when changing pages

Fixes: Different max-width on docs and other content

frontend/components/CenteredContent/CenteredContent.js

@@ -12,7 +12,7 @@ const Container = styled.div`
 `;
 
 const Content = styled.div`
-  max-width: 740px;
+  max-width: 50em;
   margin: 0 auto;
 `;
 

frontend/components/Editor/Editor.scss

@@ -3,7 +3,7 @@
   font-size: 1em;
   line-height: 1.7em;
   width: 100%;
-  color: #1b2631;
+  color: #1b2830;
 
   h1,
   h2,

frontend/components/Layout/Layout.js

@@ -252,13 +252,8 @@ const Container = styled(Flex)`
 `;
 
 const Content = styled(Flex)`
-  overflow: scroll;
+  margin-left: ${props => (props.editMode ? 0 : layout.sidebarWidth)};
-  position: absolute;
+  transition: margin-left 200ms ease-in-out;
-  top: 0;
-  bottom: 0;
-  right: 0;
-  left: ${props => (props.editMode ? 0 : layout.sidebarWidth)};
-  transition: left 200ms ease-in-out;
 `;
 
 const MenuLink = styled(Link)`
@@ -266,10 +261,13 @@ const MenuLink = styled(Link)`
 `;
 
 const Sidebar = styled(Flex)`
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  left: ${props => (props.editMode ? `-${layout.sidebarWidth}` : 0)};
   width: ${layout.sidebarWidth};
-  margin-left: ${props => (props.editMode ? `-${layout.sidebarWidth}` : 0)};
   background: ${color.smoke};
-  transition: margin-left 200ms ease-in-out;
+  transition: left 200ms ease-in-out;
 `;
 
 const LinkSection = styled(Flex)`

frontend/styles/base.scss

@@ -27,11 +27,6 @@ body {
   color: #617180;
   background-color: #fff;
   display: flex;
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
 
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;