diff options
| author | Ezekiel Aquino <ezekiel@bakkenbaeck.no> | 2018-12-11 23:18:10 +0800 |
|---|---|---|
| committer | Ezekiel Aquino <ezekiel@bakkenbaeck.no> | 2018-12-11 23:18:27 +0800 |
| commit | bc64c9566c4f1410dc7c22e287533473a6052085 (patch) | |
| tree | 4bd7f7a4faed4f15b45a44adbf5ba6508ae9470e /packages/website/ts/@next/components/layout.tsx | |
| parent | d068956b695b1eef7a721e9b428375e73380c747 (diff) | |
| download | dexon-sol-tools-bc64c9566c4f1410dc7c22e287533473a6052085.tar dexon-sol-tools-bc64c9566c4f1410dc7c22e287533473a6052085.tar.gz dexon-sol-tools-bc64c9566c4f1410dc7c22e287533473a6052085.tar.bz2 dexon-sol-tools-bc64c9566c4f1410dc7c22e287533473a6052085.tar.lz dexon-sol-tools-bc64c9566c4f1410dc7c22e287533473a6052085.tar.xz dexon-sol-tools-bc64c9566c4f1410dc7c22e287533473a6052085.tar.zst dexon-sol-tools-bc64c9566c4f1410dc7c22e287533473a6052085.zip | |
Header changes, mobile alignments
Diffstat (limited to 'packages/website/ts/@next/components/layout.tsx')
| -rw-r--r-- | packages/website/ts/@next/components/layout.tsx | 4 |
1 files changed, 3 insertions, 1 deletions
diff --git a/packages/website/ts/@next/components/layout.tsx b/packages/website/ts/@next/components/layout.tsx index 682ffbc5a..bba21d593 100644 --- a/packages/website/ts/@next/components/layout.tsx +++ b/packages/website/ts/@next/components/layout.tsx @@ -35,6 +35,7 @@ interface ColumnProps { isNoPadding?: boolean; isPadLarge?: boolean; isFlexGrow?: boolean; + isMobileCentered?: boolean; bgColor?: string; } @@ -97,7 +98,7 @@ export const Section = styled.section<SectionProps>` @media (max-width: ${BREAKPOINTS.mobile}) { margin-bottom: ${props => !props.isNoMargin && `${GUTTER / 2}px`}; - padding: ${PADDING_SIZES.default}; + padding: ${props => props.isPadLarge ? `${PADDING_SIZES.large} ${PADDING_SIZES.default}` : PADDING_SIZES.default}; } `; @@ -148,6 +149,7 @@ export const Column = styled.div<ColumnProps>` @media (max-width: ${BREAKPOINTS.mobile}) { padding: ${props => !props.isNoPadding && (props.isPadLarge ? '40px 30px' : '15px')}; margin-bottom: 20px; + text-align: ${props => props.isMobileCentered && 'center'}; } `; |