From 7845fdbd9c221502c5c58ddd57dfaeeca51bdc7d Mon Sep 17 00:00:00 2001 From: Ezekiel Aquino Date: Wed, 12 Dec 2018 16:13:09 +0100 Subject: introduces wrapwidth to section component --- packages/website/ts/@next/components/newLayout.tsx | 2 ++ packages/website/ts/@next/components/sections/landing/cta.tsx | 1 + 2 files changed, 3 insertions(+) (limited to 'packages/website/ts/@next/components') diff --git a/packages/website/ts/@next/components/newLayout.tsx b/packages/website/ts/@next/components/newLayout.tsx index 9ada9862d..685672733 100644 --- a/packages/website/ts/@next/components/newLayout.tsx +++ b/packages/website/ts/@next/components/newLayout.tsx @@ -4,6 +4,7 @@ import styled from 'styled-components'; interface WrapProps { offsetTop?: string; maxWidth?: string; + wrapWidth?: string; isFullWidth?: boolean; isTextCentered?: boolean; isCentered?: boolean; @@ -94,6 +95,7 @@ const SectionBase = styled.section` `; const Wrap = styled(FlexWrap)` + width: ${props => props.wrapWidth || '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 b387c2418..da49861e6 100644 --- a/packages/website/ts/@next/components/sections/landing/cta.tsx +++ b/packages/website/ts/@next/components/sections/landing/cta.tsx @@ -17,6 +17,7 @@ export const SectionLandingCta = (props: Props) => ( isPadded={false} isFlex={true} maxWidth="auto" + wrapWidth="100%" flexBreakpoint="900px" >