diff options
author | Ezekiel Aquino <ezekiel@bakkenbaeck.no> | 2018-12-12 16:47:55 +0800 |
---|---|---|
committer | Ezekiel Aquino <ezekiel@bakkenbaeck.no> | 2018-12-12 20:32:20 +0800 |
commit | c5db8f25d31d45ac3ff9fff78f7e1fde348d81d4 (patch) | |
tree | 0ec31d48290d5bb84d833cf70e51c0886b8dffdf /packages/website/ts/@next/components/sections/landing/hero.tsx | |
parent | 965b1ff32fac0eaf91731b9f6b3d0a9ce94e6bb9 (diff) | |
download | dexon-0x-contracts-c5db8f25d31d45ac3ff9fff78f7e1fde348d81d4.tar dexon-0x-contracts-c5db8f25d31d45ac3ff9fff78f7e1fde348d81d4.tar.gz dexon-0x-contracts-c5db8f25d31d45ac3ff9fff78f7e1fde348d81d4.tar.bz2 dexon-0x-contracts-c5db8f25d31d45ac3ff9fff78f7e1fde348d81d4.tar.lz dexon-0x-contracts-c5db8f25d31d45ac3ff9fff78f7e1fde348d81d4.tar.xz dexon-0x-contracts-c5db8f25d31d45ac3ff9fff78f7e1fde348d81d4.tar.zst dexon-0x-contracts-c5db8f25d31d45ac3ff9fff78f7e1fde348d81d4.zip |
WIP
Diffstat (limited to 'packages/website/ts/@next/components/sections/landing/hero.tsx')
-rw-r--r-- | packages/website/ts/@next/components/sections/landing/hero.tsx | 47 |
1 files changed, 19 insertions, 28 deletions
diff --git a/packages/website/ts/@next/components/sections/landing/hero.tsx b/packages/website/ts/@next/components/sections/landing/hero.tsx index 9e7ed7402..9c6ff7151 100644 --- a/packages/website/ts/@next/components/sections/landing/hero.tsx +++ b/packages/website/ts/@next/components/sections/landing/hero.tsx @@ -1,39 +1,30 @@ import * as React from 'react'; import {Button, ButtonWrap} from 'ts/@next/components/button'; +import {LandingAnimation} from 'ts/@next/components/heroImage'; import {Column, Section, Wrap, WrapCentered, WrapGrid} from 'ts/@next/components/layout'; import {Heading, Paragraph} from 'ts/@next/components/text'; +import {Hero} from 'ts/@next/components/hero'; + import LogoOutlined from 'ts/@next/icons/illustrations/logo-outlined.svg'; export const SectionLandingHero = () => ( - <Section isPadLarge={true}> - <Wrap isReversed={true}> - <Column colWidth="1/2"> - <WrapCentered> - <LogoOutlined/> - </WrapCentered> - </Column> - - <Column colWidth="1/2" isMobileCentered={true}> - <Heading size="large"> - Powering Decentralized Exchange - </Heading> - - <Paragraph size="medium" isMuted={true}> - 0x is the best solution for adding<br /> - exchange functionality to your business. - </Paragraph> + <Hero + title="Powering Decentralized Exchange" + description="0x is the best solution for adding exchange functionality to your business." + figure={<LandingAnimation image={<LogoOutlined />} />} + actions={<Actions />} + /> +); - <ButtonWrap> - <Button isInline={true}> - Get Started - </Button> +const Actions = () => ( + <> + <Button isInline={true}> + Get Started + </Button> - <Button isTransparent={true} isInline={true}> - Learn More - </Button> - </ButtonWrap> - </Column> - </Wrap> - </Section> + <Button isTransparent={true} isInline={true}> + Learn More + </Button> + </> ); |