aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts/@next/components
diff options
context:
space:
mode:
Diffstat (limited to 'packages/website/ts/@next/components')
-rw-r--r--packages/website/ts/@next/components/newLayout.tsx3
-rw-r--r--packages/website/ts/@next/components/sections/landing/cta.tsx2
-rw-r--r--packages/website/ts/@next/components/siteWrap.tsx13
3 files changed, 5 insertions, 13 deletions
diff --git a/packages/website/ts/@next/components/newLayout.tsx b/packages/website/ts/@next/components/newLayout.tsx
index f4cf19e29..1ac9fccfc 100644
--- a/packages/website/ts/@next/components/newLayout.tsx
+++ b/packages/website/ts/@next/components/newLayout.tsx
@@ -80,6 +80,8 @@ export const WrapSticky = styled.div<WrapProps>`
`;
const SectionBase = styled.section<SectionProps>`
+ width: ${props => !props.isFullWidth && 'calc(100% - 60px)'};
+ max-width: 1500px;
margin: 0 auto;
padding: ${props => props.isPadded && '120px 0'};
background-color: ${props => props.theme[`${props.bgColor}BgColor`] || props.bgColor};
@@ -92,7 +94,6 @@ const SectionBase = styled.section<SectionProps>`
`;
const Wrap = styled(FlexWrap)<WrapProps>`
- width: calc(100% - 60px);
max-width: ${props => !props.isFullWidth && (props.maxWidth || '895px')};
text-align: ${props => props.isTextCentered && 'center'};
margin: 0 auto;
diff --git a/packages/website/ts/@next/components/sections/landing/cta.tsx b/packages/website/ts/@next/components/sections/landing/cta.tsx
index b90b4070e..b387c2418 100644
--- a/packages/website/ts/@next/components/sections/landing/cta.tsx
+++ b/packages/website/ts/@next/components/sections/landing/cta.tsx
@@ -15,8 +15,8 @@ interface Props {
export const SectionLandingCta = (props: Props) => (
<Section
isPadded={false}
- isFullWidth={true}
isFlex={true}
+ maxWidth="auto"
flexBreakpoint="900px"
>
<BlockIconLink
diff --git a/packages/website/ts/@next/components/siteWrap.tsx b/packages/website/ts/@next/components/siteWrap.tsx
index abbd27845..eb2569f3d 100644
--- a/packages/website/ts/@next/components/siteWrap.tsx
+++ b/packages/website/ts/@next/components/siteWrap.tsx
@@ -69,21 +69,12 @@ export const SiteWrap: React.StatelessComponent<Props> = props => {
<>
<GlobalStyles />
<Header />
- <Main>
+ <main>
{children}
- </Main>
+ </main>
<Footer/>
</>
</ThemeProvider>
</>
);
};
-
-export const Main = styled.main`
- max-width: 1500px;
- margin: 0 auto;
-
- @media (min-width: 768px) {
- width: calc(100% - 60px);
- }
-`;