aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--packages/website/public/images/@next/press/logo-techcrunch.pngbin0 -> 2332 bytes
-rw-r--r--packages/website/public/images/@next/press/logo-venturebeat.pngbin0 -> 2660 bytes
-rw-r--r--packages/website/ts/@next/pages/about/press.tsx87
3 files changed, 48 insertions, 39 deletions
diff --git a/packages/website/public/images/@next/press/logo-techcrunch.png b/packages/website/public/images/@next/press/logo-techcrunch.png
new file mode 100644
index 000000000..7f260d0ea
--- /dev/null
+++ b/packages/website/public/images/@next/press/logo-techcrunch.png
Binary files differ
diff --git a/packages/website/public/images/@next/press/logo-venturebeat.png b/packages/website/public/images/@next/press/logo-venturebeat.png
new file mode 100644
index 000000000..2086bf0b7
--- /dev/null
+++ b/packages/website/public/images/@next/press/logo-venturebeat.png
Binary files differ
diff --git a/packages/website/ts/@next/pages/about/press.tsx b/packages/website/ts/@next/pages/about/press.tsx
index db2a631e7..80307a98f 100644
--- a/packages/website/ts/@next/pages/about/press.tsx
+++ b/packages/website/ts/@next/pages/about/press.tsx
@@ -1,12 +1,57 @@
import * as React from 'react';
-import { Link as ReactRouterLink } from 'react-router-dom';
+import * as _ from 'lodash';
import styled from 'styled-components';
import { ChapterLink } from 'ts/@next/components/chapter_link';
import { Column, Section, Wrap } from 'ts/@next/components/layout';
+import { Link } from 'ts/@next/components/link';
+import { Separator } from 'ts/@next/components/separator';
import { SiteWrap } from 'ts/@next/components/siteWrap';
import { Heading, Paragraph } from 'ts/@next/components/text';
+interface HighlightInterface {
+ logo: string;
+ title?: string;
+ text: string;
+ href: string;
+}
+
+const highlights: HighlightInterface[] = [
+ {
+ logo: '/images/@next/press/logo-venturebeat.png',
+ title: 'VentureBeat',
+ text: '0x leads the way for ‘tokenization’ of the world, and collectible game items are next',
+ href: '#',
+ },
+ {
+ logo: '/images/@next/press/logo-fortune.png',
+ title: 'Fortune',
+ text: 'In the future, many traditional investments like real estate and corporate shares will come in the form of digital tokens that are bought and transferred on a blockchain. ',
+ href: '#',
+ },
+ {
+ logo: '/images/@next/press/logo-techcrunch.png',
+ title: 'TechCrunch',
+ text: '0x allows any developer to quickly build their own decentralized cryptocurrency exchange and decide their own fees.',
+ href: '#',
+ },
+];
+
+const Highlight = ({ highlight }) => (
+ <>
+ <Wrap>
+ <Column colWidth="1/3">
+ <img src={highlight.logo} alt={highlight.title} />
+ </Column>
+ <Column colWidth="2/3">
+ <Paragraph isMuted={false}>{highlight.text}</Paragraph>
+ <Link href={highlight.href}>Read Article</Link>
+ </Column>
+ </Wrap>
+ <Separator/>
+ </>
+);
+
export const NextAboutPress = () => (
<SiteWrap theme="light">
<Section>
@@ -21,45 +66,9 @@ export const NextAboutPress = () => (
<Heading size="medium">Press Highlights</Heading>
<Paragraph size="medium">Want to write about 0x? Get in touch, or download our press kit.</Paragraph>
- <Wrap>
- <Column colWidth="1/3">
- <img src="/images/@next/press/logo-fortune.png" width="100" alt="Fortune"/>
- </Column>
- <Column colWidth="2/3">
- <Paragraph isMuted={false}>The difference is that 0x is decentralized, operating as a series of anonymous nodes...</Paragraph>
- <a href="#">Read Article</a>
- </Column>
- </Wrap>
-
- <Wrap>
- <Column colWidth="1/3">
- <img src="/images/@next/press/logo-fortune.png" width="100" alt="Fortune"/>
- </Column>
- <Column colWidth="2/3">
- <Paragraph isMuted={false}>The difference is that 0x is decentralized, operating as a series of anonymous nodes...</Paragraph>
- <a href="#">Read Article</a>
- </Column>
- </Wrap>
-
- <Wrap>
- <Column colWidth="1/3">
- <img src="/images/@next/press/logo-fortune.png" width="100" alt="Fortune"/>
- </Column>
- <Column colWidth="2/3">
- <Paragraph isMuted={false}>The difference is that 0x is decentralized, operating as a series of anonymous nodes...</Paragraph>
- <a href="#">Read Article</a>
- </Column>
- </Wrap>
+ <Separator/>
- <Wrap>
- <Column colWidth="1/3">
- <img src="/images/@next/press/logo-fortune.png" width="100" alt="Fortune"/>
- </Column>
- <Column colWidth="2/3">
- <Paragraph isMuted={false}>The difference is that 0x is decentralized, operating as a series of anonymous nodes...</Paragraph>
- <a href="#">Read Article</a>
- </Column>
- </Wrap>
+ {_.map(highlights, (highlight, index) => <Highlight key={`highlight-${index}`} highlight={highlight} /> )}
</Column>
</Wrap>
</Section>