From 247a69aaec2c3389b7061d22fabc3bd15838cb75 Mon Sep 17 00:00:00 2001 From: Fred Carlsen Date: Fri, 30 Nov 2018 14:55:17 +0100 Subject: Added 0x instant skeleton --- packages/website/ts/@next/components/text.tsx | 1 + .../ts/@next/icons/illustrations/tokens.svg | 1 + packages/website/ts/@next/pages/instant.tsx | 122 +++++++++++++++++++++ packages/website/ts/index.tsx | 2 + 4 files changed, 126 insertions(+) create mode 100644 packages/website/ts/@next/icons/illustrations/tokens.svg create mode 100644 packages/website/ts/@next/pages/instant.tsx (limited to 'packages') diff --git a/packages/website/ts/@next/components/text.tsx b/packages/website/ts/@next/components/text.tsx index 6c45cc211..a25936d8e 100644 --- a/packages/website/ts/@next/components/text.tsx +++ b/packages/website/ts/@next/components/text.tsx @@ -42,6 +42,7 @@ const HEADING_SIZES: HeadingSizes = { const PARAGRAPH_SIZES: ParagraphSizes = { default: '18px', + small: '14px', medium: '22px', large: '28px', }; diff --git a/packages/website/ts/@next/icons/illustrations/tokens.svg b/packages/website/ts/@next/icons/illustrations/tokens.svg new file mode 100644 index 000000000..053e421a4 --- /dev/null +++ b/packages/website/ts/@next/icons/illustrations/tokens.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/website/ts/@next/pages/instant.tsx b/packages/website/ts/@next/pages/instant.tsx new file mode 100644 index 000000000..4c8fa5a30 --- /dev/null +++ b/packages/website/ts/@next/pages/instant.tsx @@ -0,0 +1,122 @@ +import * as React from 'react'; +import styled from 'styled-components'; + +import {colors} from 'ts/style/colors'; + +import {Button} from 'ts/@next/components/button'; +import {Column, Section, Wrap, WrapCentered} from 'ts/@next/components/layout'; +import {SiteWrap} from 'ts/@next/components/siteWrap'; +import {Heading, Paragraph} from 'ts/@next/components/text'; + +import TokensIcon from 'ts/@next/icons/illustrations/tokens.svg'; +import LogoOutlined from 'ts/@next/icons/illustrations/logo-outlined.svg'; +import ProtocolIcon from 'ts/@next/icons/illustrations/protocol.svg'; + +export const Next0xInstant = () => ( + +
+ + + Introducing 0x Instant + A free and flexible way to offer simple crypto purchasing in any app or website + + + +
+ +
+ + Preview of payment widgets + +
+ +
+ + + + + + + Support ERC-20 and ERC-721 tokens + Seamlessly integrate token purchasing into your product experience by offering digital assets ranging from in-game items to stablecoins. + + + +
+
+ + + + + + + Generate revenue for your business + With just a few lines of code, you can earn up to 5% in affiliate fees on every transaction from your crypto wallet or dApp. + + + +
+
+ + + + + + + Easy and flexible integration + Use our out-of-the-box design or customize the user interface by integrating the AssetBuyer engine. You can also tap into 0x networked liquidity or choose your own liquidity pool. + + + +
+ +
+ + + 0x Instant Configurator + Liquidity Source + What tokens can users buy? (select all) + Transaction fee ETH address + Fee Percentage + + + + Code Snippet + Explore the Docs + <code snippet> + + +
+ +
+ + + Disclaimer: The laws and regulations applicable to the use and exchange of digital assets and blockchain-native tokens, including through any software developed using the licensed work created by ZeroEx Intl. (the “Work”), vary by jurisdiction. As set forth in the Apache License, Version 2.0 applicable to the Work, developers are “solely responsible for determining the appropriateness of using or redistributing the Work,” which includes responsibility for ensuring compliance with any such applicable laws and regulations. + See the Apache License, Version 2.0 for the specific language governing all applicable permissions and limitations. + + +
+ +); + +const ChapterLink = styled.a ` + font-size: 1.222222222rem; + display: block; + opacity: 0.8; + margin-bottom: 1.666666667rem; + + &:first-child { + opacity: 1; + } + + &:hover { + opacity: 1; + } +`; diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx index 39e8da177..82e7e1206 100644 --- a/packages/website/ts/index.tsx +++ b/packages/website/ts/index.tsx @@ -20,6 +20,7 @@ import { WebsiteLegacyPaths, WebsitePaths } from 'ts/types'; import { muiTheme } from 'ts/utils/mui_theme'; // Next (new website) routes. We should rename them later +import { Next0xInstant } from 'ts/@next/pages/instant'; import { NextLanding } from 'ts/@next/pages/landing'; import { NextWhy } from 'ts/@next/pages/why'; @@ -110,6 +111,7 @@ render( {/* Next (new site) routes */} +