aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts/components/sections
diff options
context:
space:
mode:
authorHsuan Lee <hsuan@cobinhood.com>2019-01-19 18:42:04 +0800
committerHsuan Lee <hsuan@cobinhood.com>2019-01-19 18:42:04 +0800
commit7ae38906926dc09bc10670c361af0d2bf0050426 (patch)
tree5fb10ae366b987db09e4ddb4bc3ba0f75404ad08 /packages/website/ts/components/sections
parentb5fd3c72a08aaa6957917d74c333387a16edf66b (diff)
downloaddexon-sol-tools-7ae38906926dc09bc10670c361af0d2bf0050426.tar
dexon-sol-tools-7ae38906926dc09bc10670c361af0d2bf0050426.tar.gz
dexon-sol-tools-7ae38906926dc09bc10670c361af0d2bf0050426.tar.bz2
dexon-sol-tools-7ae38906926dc09bc10670c361af0d2bf0050426.tar.lz
dexon-sol-tools-7ae38906926dc09bc10670c361af0d2bf0050426.tar.xz
dexon-sol-tools-7ae38906926dc09bc10670c361af0d2bf0050426.tar.zst
dexon-sol-tools-7ae38906926dc09bc10670c361af0d2bf0050426.zip
Update dependency packages
Diffstat (limited to 'packages/website/ts/components/sections')
-rw-r--r--packages/website/ts/components/sections/landing/about.tsx81
-rw-r--r--packages/website/ts/components/sections/landing/clients.tsx110
-rw-r--r--packages/website/ts/components/sections/landing/cta.tsx29
-rw-r--r--packages/website/ts/components/sections/landing/hero.tsx31
4 files changed, 0 insertions, 251 deletions
diff --git a/packages/website/ts/components/sections/landing/about.tsx b/packages/website/ts/components/sections/landing/about.tsx
deleted file mode 100644
index 9c369d83a..000000000
--- a/packages/website/ts/components/sections/landing/about.tsx
+++ /dev/null
@@ -1,81 +0,0 @@
-import * as React from 'react';
-import styled from 'styled-components';
-
-import { Button } from 'ts/components/button';
-import { Icon, InlineIconWrap } from 'ts/components/icon';
-import { Column, FlexWrap, Section } from 'ts/components/newLayout';
-import { Paragraph } from 'ts/components/text';
-import { WebsitePaths } from 'ts/types';
-
-interface FigureProps {
- value: string;
- description: string;
-}
-
-export const SectionLandingAbout = () => (
- <Section bgColor="dark" isTextCentered={true}>
- <InlineIconWrap>
- <Icon name="descriptionCoin" size="small" />
- <Icon name="descriptionCopy" size="small" />
- <Icon name="descriptionFlask" size="small" />
- <Icon name="descriptionBolt" size="small" />
- </InlineIconWrap>
-
- <Paragraph size="large" isCentered={true} isMuted={1} padding={['large', 0, 'default', 0]}>
- 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 never existed before.
- </Paragraph>
-
- <DeveloperLink href={`${WebsitePaths.Why}#cases`} isWithArrow={true} isAccentColor={true}>
- Discover how developers use 0x
- </DeveloperLink>
-
- <hr
- style={{
- width: '100%',
- maxWidth: '340px',
- borderColor: '#3C4746',
- margin: '60px auto',
- }}
- />
-
- <FlexWrap as="dl">
- <Figure value="353K" description="Total Transactions" />
-
- <Figure value="$447M" description="Total Volume" />
-
- <Figure value="30+" description="Total Projects" />
- </FlexWrap>
- </Section>
-);
-
-const Figure = (props: FigureProps) => (
- <Column padding="0 30px">
- <FigureValue>{props.value}</FigureValue>
- <FigureDescription>{props.description}</FigureDescription>
- </Column>
-);
-
-const DeveloperLink = styled(Button)`
- @media (max-width: 500px) {
- && {
- white-space: pre-wrap;
- line-height: 1.3;
- }
- }
-`;
-
-const FigureValue = styled.dt`
- font-size: 50px;
- font-weight: 300;
- margin-bottom: 15px;
-
- @media (max-width: 768px) {
- font-size: 40px;
- }
-`;
-
-const FigureDescription = styled.dd`
- font-size: 18px;
- color: #999999;
-`;
diff --git a/packages/website/ts/components/sections/landing/clients.tsx b/packages/website/ts/components/sections/landing/clients.tsx
deleted file mode 100644
index 4d83a1d2f..000000000
--- a/packages/website/ts/components/sections/landing/clients.tsx
+++ /dev/null
@@ -1,110 +0,0 @@
-import * as _ from 'lodash';
-import * as React from 'react';
-import styled from 'styled-components';
-import { Heading } from 'ts/components/text';
-
-import { Section, WrapGrid } from 'ts/components/newLayout';
-
-interface ProjectLogo {
- name: string;
- imageUrl?: string;
- persistOnMobile?: boolean;
-}
-
-interface StyledProjectInterface {
- isOnMobile?: boolean;
-}
-
-const projects: ProjectLogo[] = [
- {
- name: 'Radar Relay',
- imageUrl: 'images/clients/radar-relay.svg',
- persistOnMobile: true,
- },
- {
- name: 'Paradex',
- imageUrl: 'images/clients/paradex.svg',
- persistOnMobile: true,
- },
- {
- name: 'Star Bit Ex',
- imageUrl: 'images/clients/starbitex.svg',
- },
- {
- name: 'LedgerDex',
- imageUrl: 'images/clients/ledgerdex.svg',
- },
- {
- name: 'OpenRelay',
- imageUrl: 'images/clients/openrelay.svg',
- persistOnMobile: true,
- },
- {
- name: 'Bamboo Relay',
- imageUrl: 'images/clients/bamboo.svg',
- persistOnMobile: true,
- },
- {
- name: 'dEX',
- imageUrl: 'images/clients/ercdex.svg',
- persistOnMobile: true,
- },
- {
- name: 'emoon',
- imageUrl: 'images/clients/emoon.svg',
- persistOnMobile: true,
- },
- {
- name: 'Gods Unchained',
- imageUrl: 'images/clients/godsUnchained.svg',
- },
- {
- name: 'Instex',
- imageUrl: 'images/clients/instex.svg',
- },
- {
- name: 'Lake Trade',
- imageUrl: 'images/clients/laketrade.svg',
- },
- {
- name: 'Veil',
- imageUrl: 'images/clients/veil.svg',
- },
-];
-
-export const SectionLandingClients = () => (
- <Section isTextCentered={true}>
- <Heading size="small">Join the growing number of projects developing on 0x</Heading>
-
- <WrapGrid isWrapped={true}>
- {_.map(projects, (item: ProjectLogo, index) => (
- <StyledProject key={`client-${index}`} isOnMobile={item.persistOnMobile}>
- <img src={item.imageUrl} alt={item.name} />
- </StyledProject>
- ))}
- </WrapGrid>
- </Section>
-);
-
-const StyledProject = styled.div<StyledProjectInterface>`
- flex-shrink: 0;
-
- img {
- object-fit: contain;
- width: 100%;
- height: 100%;
- }
-
- @media (min-width: 768px) {
- width: auto;
- height: 50px;
- margin: 30px;
- }
-
- @media (max-width: 768px) {
- width: auto;
- height: 42px;
- margin: 15px;
- display: ${props => !props.isOnMobile && 'none'};
- }
-`;
diff --git a/packages/website/ts/components/sections/landing/cta.tsx b/packages/website/ts/components/sections/landing/cta.tsx
deleted file mode 100644
index ec5a58a58..000000000
--- a/packages/website/ts/components/sections/landing/cta.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import * as React from 'react';
-
-import { BlockIconLink } from 'ts/components/blockIconLink';
-import { Section } from 'ts/components/newLayout';
-
-import { AnimatedChatIcon } from 'ts/components/animatedChatIcon';
-import { AnimatedCompassIcon } from 'ts/components/animatedCompassIcon';
-import { WebsitePaths } from 'ts/types';
-
-interface Props {
- onContactClick?: () => void;
-}
-
-export const SectionLandingCta = (props: Props) => (
- <Section isPadded={false} isFlex={true} maxWidth="auto" wrapWidth="100%" flexBreakpoint="900px">
- <BlockIconLink
- iconComponent={<AnimatedCompassIcon />}
- title="Ready to build on 0x?"
- linkLabel="Get Started"
- linkUrl={WebsitePaths.Docs}
- />
- <BlockIconLink
- iconComponent={<AnimatedChatIcon />}
- title="Want help from the 0x team?"
- linkLabel="Get in Touch"
- linkAction={props.onContactClick}
- />
- </Section>
-);
diff --git a/packages/website/ts/components/sections/landing/hero.tsx b/packages/website/ts/components/sections/landing/hero.tsx
deleted file mode 100644
index 489757286..000000000
--- a/packages/website/ts/components/sections/landing/hero.tsx
+++ /dev/null
@@ -1,31 +0,0 @@
-import * as React from 'react';
-
-import { Button } from 'ts/components/button';
-import { Hero } from 'ts/components/hero';
-import { LandingAnimation } from 'ts/components/heroImage';
-
-import { HeroAnimation } from 'ts/components/heroAnimation';
-import { WebsitePaths } from 'ts/types';
-
-export const SectionLandingHero = () => (
- <Hero
- title="Powering Decentralized Exchange"
- isLargeTitle={true}
- isFullWidth={true}
- description="0x is an open protocol that enables the peer-to-peer exchange of assets on the Ethereum blockchain."
- figure={<LandingAnimation image={<HeroAnimation />} />}
- actions={<HeroActions />}
- />
-);
-
-const HeroActions = () => (
- <>
- <Button href="https://0x.org/docs" isInline={true}>
- Get Started
- </Button>
-
- <Button to={WebsitePaths.Why} isTransparent={true} isInline={true}>
- Learn More
- </Button>
- </>
-);