diff options
| author | Fred Carlsen <fred@sjelfull.no> | 2018-11-30 19:05:56 +0800 |
|---|---|---|
| committer | Fred Carlsen <fred@sjelfull.no> | 2018-11-30 19:05:56 +0800 |
| commit | 4d7db045e9c6faa69fc8018c6c36e63fe562973c (patch) | |
| tree | ae482516de4f8f5593879eb78814bc1cb170b062 /packages/website | |
| parent | 849b7441856eff50375b46f4d88897c7029ae07b (diff) | |
| download | dexon-sol-tools-4d7db045e9c6faa69fc8018c6c36e63fe562973c.tar dexon-sol-tools-4d7db045e9c6faa69fc8018c6c36e63fe562973c.tar.gz dexon-sol-tools-4d7db045e9c6faa69fc8018c6c36e63fe562973c.tar.bz2 dexon-sol-tools-4d7db045e9c6faa69fc8018c6c36e63fe562973c.tar.lz dexon-sol-tools-4d7db045e9c6faa69fc8018c6c36e63fe562973c.tar.xz dexon-sol-tools-4d7db045e9c6faa69fc8018c6c36e63fe562973c.tar.zst dexon-sol-tools-4d7db045e9c6faa69fc8018c6c36e63fe562973c.zip | |
Tweak text
Diffstat (limited to 'packages/website')
| -rw-r--r-- | packages/website/ts/@next/components/text.tsx | 21 |
1 files changed, 18 insertions, 3 deletions
diff --git a/packages/website/ts/@next/components/text.tsx b/packages/website/ts/@next/components/text.tsx index 911417639..4c6765cf6 100644 --- a/packages/website/ts/@next/components/text.tsx +++ b/packages/website/ts/@next/components/text.tsx @@ -5,6 +5,7 @@ import { colors } from 'ts/style/colors'; interface Props { size?: 'normal' | 'medium' | 'large'; + muted?: any; center?: boolean; } @@ -37,12 +38,22 @@ Text.defaultProps = { const StyledHeading = styled.h1` color: ${colors.white}; - font-size: 80px; - line-height: 1em; + font-size: 1.111111111rem; + line-height: 1.4em; ${(props: Props) => props.center && ` text-align: center `} + + ${(props: Props) => props.size === 'medium' && ` + font-size: 3.222222222rem; // 50px + line-height: 1.16em; + `} + + ${(props: Props) => props.size === 'large' && ` + font-size: 4.444444444rem; // 80px + line-height: 1em; + `} `; const StyledIntro = styled.p` @@ -66,4 +77,8 @@ const StyledText = styled.p<Props>` ${(props: Props) => props.center && ` text-align: center `} -`;
\ No newline at end of file + + ${(props: Props) => props.muted && ` + opacity: ${typeof props.muted === 'string' ? props.muted : '0.8'}; + `} +`; |