diff options
| author | Fred Carlsen <fred@sjelfull.no> | 2018-11-30 16:57:49 +0800 |
|---|---|---|
| committer | Fred Carlsen <fred@sjelfull.no> | 2018-11-30 16:58:20 +0800 |
| commit | d6b92e5786b311f16b72411b75900c5aa1fe8394 (patch) | |
| tree | 13c187025affccf4310dc98aa39135422875b27b | |
| parent | ab24dcc29098c7b0c65c0e19be89a15bec3426af (diff) | |
| download | dexon-sol-tools-d6b92e5786b311f16b72411b75900c5aa1fe8394.tar dexon-sol-tools-d6b92e5786b311f16b72411b75900c5aa1fe8394.tar.gz dexon-sol-tools-d6b92e5786b311f16b72411b75900c5aa1fe8394.tar.bz2 dexon-sol-tools-d6b92e5786b311f16b72411b75900c5aa1fe8394.tar.lz dexon-sol-tools-d6b92e5786b311f16b72411b75900c5aa1fe8394.tar.xz dexon-sol-tools-d6b92e5786b311f16b72411b75900c5aa1fe8394.tar.zst dexon-sol-tools-d6b92e5786b311f16b72411b75900c5aa1fe8394.zip | |
Add center prop to text
| -rw-r--r-- | packages/website/ts/@next/components/text.tsx | 54 |
1 files changed, 36 insertions, 18 deletions
diff --git a/packages/website/ts/@next/components/text.tsx b/packages/website/ts/@next/components/text.tsx index 1d4fdcef8..911417639 100644 --- a/packages/website/ts/@next/components/text.tsx +++ b/packages/website/ts/@next/components/text.tsx @@ -8,10 +8,41 @@ interface Props { center?: boolean; } +export const Heading: React.StatelessComponent<Props> = ({ children, ...props }) => ( + <StyledHeading {...props}>{children}</StyledHeading> +); + +export const Intro: React.StatelessComponent<Props> = ({ children, ...props }) => ( + <StyledIntro {...props}>{children}</StyledIntro> +); + +export const Text: React.StatelessComponent<Props> = ({ children, ...props }) => ( + <StyledText {...props}>{children}</StyledText> +); + +Heading.defaultProps = { + size: 'normal', + center: false, +}; + +Intro.defaultProps = { + size: 'normal', + center: false, +}; + +Text.defaultProps = { + size: 'normal', + center: false, +}; + const StyledHeading = styled.h1` color: ${colors.white}; font-size: 80px; line-height: 1em; + + ${(props: Props) => props.center && ` + text-align: center + `} `; const StyledIntro = styled.p` @@ -19,6 +50,10 @@ const StyledIntro = styled.p` opacity: 0.75; font-size: 22px; line-height: 1.823529412em; + + ${(props: Props) => props.center && ` + text-align: center + `} `; const StyledText = styled.p<Props>` @@ -31,21 +66,4 @@ const StyledText = styled.p<Props>` ${(props: Props) => props.center && ` text-align: center `} -`; - -export const Heading: React.StatelessComponent<Props> = ({ children }) => ( - <StyledHeading>{children}</StyledHeading> -); - -export const Intro: React.StatelessComponent<Props> = ({ children }) => ( - <StyledIntro>{children}</StyledIntro> -); - -export const Text: React.StatelessComponent<Props> = ({ children, ...props }) => ( - <StyledText {...props}>{children}</StyledText> -); - -Text.defaultProps = { - size: 'normal', - center: false, -}; +`;
\ No newline at end of file |