diff options
| author | Ezekiel Aquino <ezekiel@bakkenbaeck.no> | 2018-12-10 21:26:32 +0800 |
|---|---|---|
| committer | Ezekiel Aquino <ezekiel@bakkenbaeck.no> | 2018-12-10 21:26:32 +0800 |
| commit | 55ed406746e3a1bd5cca6010e438b8f2a3550a3c (patch) | |
| tree | 08bd10307354c0b10f9771a3cbf63c8396e78967 /packages/website/ts/@next/components/layout.tsx | |
| parent | f93e77e77cede2ef87db8bfc2d40d5a9b842e9d7 (diff) | |
| download | dexon-sol-tools-55ed406746e3a1bd5cca6010e438b8f2a3550a3c.tar dexon-sol-tools-55ed406746e3a1bd5cca6010e438b8f2a3550a3c.tar.gz dexon-sol-tools-55ed406746e3a1bd5cca6010e438b8f2a3550a3c.tar.bz2 dexon-sol-tools-55ed406746e3a1bd5cca6010e438b8f2a3550a3c.tar.lz dexon-sol-tools-55ed406746e3a1bd5cca6010e438b8f2a3550a3c.tar.xz dexon-sol-tools-55ed406746e3a1bd5cca6010e438b8f2a3550a3c.tar.zst dexon-sol-tools-55ed406746e3a1bd5cca6010e438b8f2a3550a3c.zip | |
Use defined paddings
Diffstat (limited to 'packages/website/ts/@next/components/layout.tsx')
| -rw-r--r-- | packages/website/ts/@next/components/layout.tsx | 6 |
1 files changed, 3 insertions, 3 deletions
diff --git a/packages/website/ts/@next/components/layout.tsx b/packages/website/ts/@next/components/layout.tsx index 6584f3fa4..a8734aec8 100644 --- a/packages/website/ts/@next/components/layout.tsx +++ b/packages/website/ts/@next/components/layout.tsx @@ -1,5 +1,5 @@ import styled from 'styled-components'; -import { getCSSPadding, PaddingInterface } from 'ts/@next/constants/utilities'; +import {getCSSPadding, PADDING_SIZES, PaddingInterface} from 'ts/@next/constants/utilities'; interface WrapWidths { default: string; @@ -83,7 +83,7 @@ export const Main = styled.main` // just <Section asElement?="div/section/footer/header/whatever" /> ? export const Section = styled.section<SectionProps>` width: ${props => props.isFullWidth ? `calc(100% + ${GUTTER * 2}px)` : '100%'}; - padding: ${props => !props.isNoPadding && (props.isPadLarge ? '60px 30px' : '30px')}; + padding: ${props => !props.isNoPadding && (props.isPadLarge ? `${PADDING_SIZES.large} ${PADDING_SIZES.default}` : PADDING_SIZES.default)}; background-color: ${props => props.bgColor}; position: ${props => props.isRelative && 'relative'}; overflow: ${props => props.isRelative && 'hidden'}; @@ -132,7 +132,7 @@ export const Column = styled.div<ColumnProps>` background-color: ${props => props.bgColor}; @media (min-width: ${BREAKPOINTS.mobile}) { - padding: ${props => !props.isNoPadding && (props.isPadLarge ? '60px 30px' : '30px')}; + padding: ${props => !props.isNoPadding && (props.isPadLarge ? `${PADDING_SIZES.large} ${PADDING_SIZES.default}` : PADDING_SIZES.default)}; width: ${props => props.colWidth ? COLUMN_WIDTHS[props.colWidth] : '100%'}; } |