From fff4dd7e947f7f66e0854dea5d192c72b9e3d674 Mon Sep 17 00:00:00 2001 From: Fred Carlsen Date: Fri, 30 Nov 2018 12:05:08 +0100 Subject: Export svgs as typed pure components --- packages/website/ts/@next/pages/landing.tsx | 9 ++-- packages/website/ts/@next/pages/why.tsx | 76 ++++++++++++++++++++++++----- 2 files changed, 68 insertions(+), 17 deletions(-) (limited to 'packages/website/ts/@next/pages') diff --git a/packages/website/ts/@next/pages/landing.tsx b/packages/website/ts/@next/pages/landing.tsx index 766eb809b..9be2ee4da 100644 --- a/packages/website/ts/@next/pages/landing.tsx +++ b/packages/website/ts/@next/pages/landing.tsx @@ -7,9 +7,8 @@ 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 logoOutlined from 'ts/@next/icons/illustrations/logo-outlined.svg'; -import protocol from 'ts/@next/icons/illustrations/protocol.svg'; - +import LogoOutlined from 'ts/@next/icons/illustrations/logo-outlined.svg'; +import ProtocolIcon from 'ts/@next/icons/illustrations/protocol.svg'; const Icon = styled.div` flex-shrink: 0; @@ -35,14 +34,14 @@ export const NextLanding = () => ( - +
- + 0x is the best solution for adding exchange functionality to your business. Discover how developers use 0x (need arrow + line under) diff --git a/packages/website/ts/@next/pages/why.tsx b/packages/website/ts/@next/pages/why.tsx index ec13d40c5..ce2ad5308 100644 --- a/packages/website/ts/@next/pages/why.tsx +++ b/packages/website/ts/@next/pages/why.tsx @@ -3,22 +3,21 @@ import styled from 'styled-components'; import { colors } from 'ts/style/colors'; -import { Button, ButtonTransparent } from 'ts/@next/components/button'; import { Column, Section, Wrap, WrapCentered } from 'ts/@next/components/layout'; -import { Heading, Intro, Text } from 'ts/@next/components/text'; import { SiteWrap } from 'ts/@next/components/siteWrap'; -import { Icon } from 'ts/@next/components/icon'; +import { Heading, Intro, Text } from 'ts/@next/components/text'; -import protocol from 'ts/@next/icons/illustrations/protocol.svg'; -import customize from 'ts/@next/icons/illustrations/customize.svg'; -import logoOutlined from 'ts/@next/icons/illustrations/logo-outlined.svg'; +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 = () => (
- The exchange layer for the crypto economy + The exchange layer for the crypto economy 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. Build on 0x (arrow) @@ -28,19 +27,19 @@ export const NextWhy = () => (
- + Support for all Ethereum Standards 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... - + Shared Networked Liquidity 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. - + Customize the User Experience 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. @@ -50,13 +49,66 @@ export const NextWhy = () => (
- This is a 1 COLUMN section + Benefits + Use Cases + Features - This is a 2 COLUMN section + What 0x offers + + A Standard for Exchange + 0x provides developers with a technical standard for trading Ethereum-based tokens such as ERC 20 and ERC 721. + + + Robust Smart Contracts + 0x Protocol's smart contracts have been put through two rounds of rigorous security audits. + + + Extensible Architecture + 0x's modular pipeline enables you to plug in your own smart contracts through an extensible API. + + + Efficient Design + 0x’s off-chain order relay with on-chain settlement is a gas efficient approach to p2p exchange, reducing blockchain bloat. + + Use Cases + slider + + Exchange Functionality + + + Secure Non-custodial Trading + Enable tokens to be traded wallet-to-wallet with no deposits or withdrawals. + + + Flexible Order Types + Choose to sell assets at a specific “buy it now” price or allow potential buyers to submit bids. + + + Build a Business + Monetize your product by taking fees on each transaction and join a growing number of relayers in the 0x ecosystem. + + + Networked Liquidity + Allow your assets to appear on other 0x-based marketplaces by sharing your liquidity through an open order book.
); + +const ChapterLink = styled.a` + font-size: 1.222222222rem; + display: block; + opacity: 0.8; + margin-bottom: 1.666666667rem; + + &:first-child { + opacity: 1; + } + + &:hover { + opacity: 1; + } +`; -- cgit v1.2.3