diff options
-rw-r--r-- | packages/website/ts/@next/pages/landing.tsx | 4 | ||||
-rw-r--r-- | packages/website/ts/@next/pages/why.tsx | 228 |
2 files changed, 116 insertions, 116 deletions
diff --git a/packages/website/ts/@next/pages/landing.tsx b/packages/website/ts/@next/pages/landing.tsx index d207bd9ff..451c70d3e 100644 --- a/packages/website/ts/@next/pages/landing.tsx +++ b/packages/website/ts/@next/pages/landing.tsx @@ -39,14 +39,14 @@ export const NextLanding = () => ( </Column> <Column colWidth="1/2"> - <Icon as={logoOutlined as 'svg'} /> + <Icon as={LogoOutlined as 'svg'} /> </Column> </Wrap> </Section> <Section bgColor={colors.backgroundDark}> <WrapCentered width="narrow"> - <Icon as={protocol as 'svg'} /> + <Icon as={ProtocolIcon as 'svg'} /> <Paragraph size="large" center> 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. diff --git a/packages/website/ts/@next/pages/why.tsx b/packages/website/ts/@next/pages/why.tsx index ce2ad5308..44eb8fde3 100644 --- a/packages/website/ts/@next/pages/why.tsx +++ b/packages/website/ts/@next/pages/why.tsx @@ -1,114 +1,114 @@ -import * as React from 'react'; -import styled from 'styled-components'; - -import { colors } from 'ts/style/colors'; - -import { Column, Section, Wrap, WrapCentered } from 'ts/@next/components/layout'; -import { SiteWrap } from 'ts/@next/components/siteWrap'; -import { Heading, Intro, Text } from 'ts/@next/components/text'; - -import CoinIcon from 'ts/@next/icons/illustrations/coin.svg'; -import CustomizeIcon from 'ts/@next/icons/illustrations/customize.svg'; -import LogoOutlined from 'ts/@next/icons/illustrations/logo-outlined.svg'; -import ProtocolIcon from 'ts/@next/icons/illustrations/protocol.svg'; - -export const NextWhy = () => ( - <SiteWrap> - <Section> - <WrapCentered> - <Column colWidth="2/3"> - <Heading size="medium" center>The exchange layer for the crypto economy</Heading> - <Intro center>The world's assets are becoming tokenized on public blockchains. 0x Protocol is free, open-source infrastructure that allows anyone in the world to build products that enable the purchasing and trading of crypto tokens.</Intro> - <Text center>Build on 0x (arrow)</Text> - </Column> - </WrapCentered> - </Section> - - <Section bgColor={colors.backgroundDark}> - <Wrap> - <Column colWidth="1/3"> - <ProtocolIcon width="150" /> - <Heading>Support for all Ethereum Standards</Heading> - <Text>0x Protocol facilitates the decentralized exchange of a growing number of Ethereum-based tokens, including all ERC-20 and ERC-721 assets. Additional ERC standards can be added to the protocol...</Text> - </Column> - - <Column colWidth="1/3"> - <LogoOutlined width="150" /> - <Heading>Shared Networked Liquidity</Heading> - <Text>0x is building a layer of networked liquidity that will lower the barriers to entry. By enabling businesses to tap into a shared pool of digital assets, it will create a more stable financial system.</Text> - </Column> - - <Column colWidth="1/3"> - <CustomizeIcon width="150" /> - <Heading>Customize the User Experience</Heading> - <Text>Relayers are businesses around the world that utilize 0x to integrate exchange functionality into a wide variety of products including order books, games, and digital art marketplaces.</Text> - </Column> - </Wrap> - </Section> - - <Section> - <Wrap> - <Column colWidth="1/3"> - <ChapterLink href="#">Benefits</ChapterLink> - <ChapterLink href="#">Use Cases</ChapterLink> - <ChapterLink href="#">Features</ChapterLink> - </Column> - - <Column colWidth="2/3"> - <Heading size="medium">What 0x offers</Heading> - <CoinIcon width="150" /> - <Heading>A Standard for Exchange</Heading> - <Text muted>0x provides developers with a technical standard for trading Ethereum-based tokens such as ERC 20 and ERC 721.</Text> - - <CoinIcon width="150" /> - <Heading>Robust Smart Contracts</Heading> - <Text muted>0x Protocol's smart contracts have been put through two rounds of rigorous security audits.</Text> - - <CoinIcon width="150" /> - <Heading>Extensible Architecture</Heading> - <Text muted>0x's modular pipeline enables you to plug in your own smart contracts through an extensible API.</Text> - - <CoinIcon width="150" /> - <Heading>Efficient Design</Heading> - <Text muted>0x’s off-chain order relay with on-chain settlement is a gas efficient approach to p2p exchange, reducing blockchain bloat.</Text> - - <Heading size="medium">Use Cases</Heading> - <Text muted>slider</Text> - - <Heading size="medium">Exchange Functionality</Heading> - - <CoinIcon width="150" /> - <Heading>Secure Non-custodial Trading</Heading> - <Text muted>Enable tokens to be traded wallet-to-wallet with no deposits or withdrawals.</Text> - - <CoinIcon width="150" /> - <Heading>Flexible Order Types</Heading> - <Text muted>Choose to sell assets at a specific “buy it now” price or allow potential buyers to submit bids.</Text> - - <CoinIcon width="150" /> - <Heading>Build a Business</Heading> - <Text muted>Monetize your product by taking fees on each transaction and join a growing number of relayers in the 0x ecosystem.</Text> - - <CoinIcon width="150" /> - <Heading>Networked Liquidity</Heading> - <Text muted>Allow your assets to appear on other 0x-based marketplaces by sharing your liquidity through an open order book.</Text> - </Column> - </Wrap> - </Section> - </SiteWrap> -); - -const ChapterLink = styled.a` - font-size: 1.222222222rem; - display: block; - opacity: 0.8; - margin-bottom: 1.666666667rem; - - &:first-child { - opacity: 1; - } - - &:hover { - opacity: 1; - } -`; +// import * as React from 'react'; +// import styled from 'styled-components'; +// +// import { colors } from 'ts/style/colors'; +// +// import { Column, Section, Wrap, WrapCentered } from 'ts/@next/components/layout'; +// import { SiteWrap } from 'ts/@next/components/siteWrap'; +// import { Heading, Intro, Text } from 'ts/@next/components/text'; +// +// import CoinIcon from 'ts/@next/icons/illustrations/coin.svg'; +// import CustomizeIcon from 'ts/@next/icons/illustrations/customize.svg'; +// import LogoOutlined from 'ts/@next/icons/illustrations/logo-outlined.svg'; +// import ProtocolIcon from 'ts/@next/icons/illustrations/protocol.svg'; +// +// export const NextWhy = () => ( +// <SiteWrap> +// <Section> +// <WrapCentered> +// <Column colWidth="2/3"> +// <Heading size="medium" center>The exchange layer for the crypto economy</Heading> +// <Intro center>The world's assets are becoming tokenized on public blockchains. 0x Protocol is free, open-source infrastructure that allows anyone in the world to build products that enable the purchasing and trading of crypto tokens.</Intro> +// <Text center>Build on 0x (arrow)</Text> +// </Column> +// </WrapCentered> +// </Section> +// +// <Section bgColor={colors.backgroundDark}> +// <Wrap> +// <Column colWidth="1/3"> +// <ProtocolIcon width="150" /> +// <Heading>Support for all Ethereum Standards</Heading> +// <Text>0x Protocol facilitates the decentralized exchange of a growing number of Ethereum-based tokens, including all ERC-20 and ERC-721 assets. Additional ERC standards can be added to the protocol...</Text> +// </Column> +// +// <Column colWidth="1/3"> +// <LogoOutlined width="150" /> +// <Heading>Shared Networked Liquidity</Heading> +// <Text>0x is building a layer of networked liquidity that will lower the barriers to entry. By enabling businesses to tap into a shared pool of digital assets, it will create a more stable financial system.</Text> +// </Column> +// +// <Column colWidth="1/3"> +// <CustomizeIcon width="150" /> +// <Heading>Customize the User Experience</Heading> +// <Text>Relayers are businesses around the world that utilize 0x to integrate exchange functionality into a wide variety of products including order books, games, and digital art marketplaces.</Text> +// </Column> +// </Wrap> +// </Section> +// +// <Section> +// <Wrap> +// <Column colWidth="1/3"> +// <ChapterLink href="#">Benefits</ChapterLink> +// <ChapterLink href="#">Use Cases</ChapterLink> +// <ChapterLink href="#">Features</ChapterLink> +// </Column> +// +// <Column colWidth="2/3"> +// <Heading size="medium">What 0x offers</Heading> +// <CoinIcon width="150" /> +// <Heading>A Standard for Exchange</Heading> +// <Text muted>0x provides developers with a technical standard for trading Ethereum-based tokens such as ERC 20 and ERC 721.</Text> +// +// <CoinIcon width="150" /> +// <Heading>Robust Smart Contracts</Heading> +// <Text muted>0x Protocol's smart contracts have been put through two rounds of rigorous security audits.</Text> +// +// <CoinIcon width="150" /> +// <Heading>Extensible Architecture</Heading> +// <Text muted>0x's modular pipeline enables you to plug in your own smart contracts through an extensible API.</Text> +// +// <CoinIcon width="150" /> +// <Heading>Efficient Design</Heading> +// <Text muted>0x’s off-chain order relay with on-chain settlement is a gas efficient approach to p2p exchange, reducing blockchain bloat.</Text> +// +// <Heading size="medium">Use Cases</Heading> +// <Text muted>slider</Text> +// +// <Heading size="medium">Exchange Functionality</Heading> +// +// <CoinIcon width="150" /> +// <Heading>Secure Non-custodial Trading</Heading> +// <Text muted>Enable tokens to be traded wallet-to-wallet with no deposits or withdrawals.</Text> +// +// <CoinIcon width="150" /> +// <Heading>Flexible Order Types</Heading> +// <Text muted>Choose to sell assets at a specific “buy it now” price or allow potential buyers to submit bids.</Text> +// +// <CoinIcon width="150" /> +// <Heading>Build a Business</Heading> +// <Text muted>Monetize your product by taking fees on each transaction and join a growing number of relayers in the 0x ecosystem.</Text> +// +// <CoinIcon width="150" /> +// <Heading>Networked Liquidity</Heading> +// <Text muted>Allow your assets to appear on other 0x-based marketplaces by sharing your liquidity through an open order book.</Text> +// </Column> +// </Wrap> +// </Section> +// </SiteWrap> +// ); +// +// const ChapterLink = styled.a` +// font-size: 1.222222222rem; +// display: block; +// opacity: 0.8; +// margin-bottom: 1.666666667rem; +// +// &:first-child { +// opacity: 1; +// } +// +// &:hover { +// opacity: 1; +// } +// `; |