diff options
Diffstat (limited to 'packages/website/ts/@next/components/sections/landing/about.tsx')
-rw-r--r-- | packages/website/ts/@next/components/sections/landing/about.tsx | 133 |
1 files changed, 37 insertions, 96 deletions
diff --git a/packages/website/ts/@next/components/sections/landing/about.tsx b/packages/website/ts/@next/components/sections/landing/about.tsx index 0efa25215..4c246ec3e 100644 --- a/packages/website/ts/@next/components/sections/landing/about.tsx +++ b/packages/website/ts/@next/components/sections/landing/about.tsx @@ -1,105 +1,46 @@ import * as React from 'react'; import {Button, ButtonWrap, Link} from 'ts/@next/components/button'; import {Icon, InlineIconWrap} from 'ts/@next/components/icon'; -import {Column, Section, Wrap, WrapCentered, WrapGrid} from 'ts/@next/components/layout'; import {Heading, Paragraph} from 'ts/@next/components/text'; import {colors} from 'ts/style/colors'; -export const SectionLandingAbout = () => ( - <Section bgColor={colors.backgroundDark} isPadLarge={true}> - <WrapCentered width="narrow"> - <InlineIconWrap> - <Icon name="coin" size="small" /> - <Icon name="coin" size="small" /> - <Icon name="coin" size="small" /> - <Icon name="coin" size="small" /> - </InlineIconWrap> - - <Paragraph - size="large" - isCentered={true} - padding={['large', 0, 'default', 0]} - > - 0x is an open protocol that enables the peer-to-peer exchange of Ethereum-based - tokens. Anyone in the world can use 0x to service a wide variety of markets - ranging from gaming items to financial instruments to assets that could have - near existed before. - </Paragraph> - - <Link - href="#" - isTransparent={true} - isWithArrow={true} - isAccentColor={true} - > - Discover how developers use 0x - </Link> - - <hr - style={{ - width: '340px', - borderColor: '#3C4746', - margin: '60px auto 0 auto', - }} - /> - </WrapCentered> - - {/* Note you can also pass in a string "large/default" or a number for custom margins */} - <Wrap padding={['large', 0, 0, 0]}> - {/* NOTE: this probably should be withComponent as part of a <dl> */} - <Column colWidth="1/3" isNoPadding={true}> - <Heading - size="medium" - isCentered={true} - marginBottom="20px" - > - 873,435 - </Heading> +import {Section} from 'ts/@next/components/newLayout'; - <Paragraph - isMuted={0.4} - isCentered={true} - isNoMargin={true} - > - Number of transactions - </Paragraph> - </Column> - - <Column colWidth="1/3" isNoPadding={true}> - <Heading - size="medium" - isCentered={true} - marginBottom="20px" - > - $203M - </Heading> - - <Paragraph - isMuted={0.4} - isCentered={true} - marginBottom="20px" - > - Total volume - </Paragraph> - </Column> - - <Column colWidth="1/3" isNoPadding={true}> - <Heading - size="medium" - isCentered={true} - isNoMargin={true} - > - 227,372 - </Heading> - - <Paragraph - isMuted={0.4} - isCentered={true} - isNoMargin={true} - > - Number of relayers - </Paragraph> - </Column> - </Wrap> +export const SectionLandingAbout = () => ( + <Section bgColor="dark"> + <InlineIconWrap> + <Icon name="coin" size="small" /> + <Icon name="coin" size="small" /> + <Icon name="coin" size="small" /> + <Icon name="coin" size="small" /> + </InlineIconWrap> + + <Paragraph + size="large" + isCentered={true} + padding={['large', 0, 'default', 0]} + > + 0x is an open protocol that enables the peer-to-peer exchange of Ethereum-based + tokens. Anyone in the world can use 0x to service a wide variety of markets + ranging from gaming items to financial instruments to assets that could have + near existed before. + </Paragraph> + + <Link + href="#" + isTransparent={true} + isWithArrow={true} + isAccentColor={true} + > + Discover how developers use 0x + </Link> + + <hr + style={{ + width: '340px', + borderColor: '#3C4746', + margin: '60px auto 0 auto', + }} + /> </Section> ); |