diff options
Diffstat (limited to 'packages/website/ts/@next/components')
-rw-r--r-- | packages/website/ts/@next/components/layout.tsx | 1 | ||||
-rw-r--r-- | packages/website/ts/@next/components/siteWrap.tsx | 13 |
2 files changed, 11 insertions, 3 deletions
diff --git a/packages/website/ts/@next/components/layout.tsx b/packages/website/ts/@next/components/layout.tsx index 32e92aa34..358120adc 100644 --- a/packages/website/ts/@next/components/layout.tsx +++ b/packages/website/ts/@next/components/layout.tsx @@ -75,7 +75,6 @@ const COLUMN_WIDTHS: ColumnWidths = { }; export const Main = styled.main` - width: calc(100% - 0); max-width: ${MAX_WIDTH}px; margin: 0 auto; diff --git a/packages/website/ts/@next/components/siteWrap.tsx b/packages/website/ts/@next/components/siteWrap.tsx index ae642f193..abbd27845 100644 --- a/packages/website/ts/@next/components/siteWrap.tsx +++ b/packages/website/ts/@next/components/siteWrap.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; -import { ThemeProvider } from 'styled-components'; +import styled, { ThemeProvider } from 'styled-components'; import { colors } from 'ts/style/colors'; + import { Footer } from 'ts/@next/components/footer'; import { Header } from 'ts/@next/components/header'; -import { Main } from 'ts/@next/components/layout'; import { GlobalStyles } from 'ts/@next/constants/globalStyle'; // Note(ez): We'll define the theme and provide it via a prop @@ -78,3 +78,12 @@ export const SiteWrap: React.StatelessComponent<Props> = props => { </> ); }; + +export const Main = styled.main` + max-width: 1500px; + margin: 0 auto; + + @media (min-width: 768px) { + width: calc(100% - 60px); + } +`; |