diff options
| -rw-r--r-- | packages/website/public/images/@next/press/logo-techcrunch.png | bin | 0 -> 2332 bytes | |||
| -rw-r--r-- | packages/website/public/images/@next/press/logo-venturebeat.png | bin | 0 -> 2660 bytes | |||
| -rw-r--r-- | packages/website/ts/@next/pages/about/press.tsx | 87 |
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 Binary files differnew file mode 100644 index 000000000..7f260d0ea --- /dev/null +++ b/packages/website/public/images/@next/press/logo-techcrunch.png diff --git a/packages/website/public/images/@next/press/logo-venturebeat.png b/packages/website/public/images/@next/press/logo-venturebeat.png Binary files differnew file mode 100644 index 000000000..2086bf0b7 --- /dev/null +++ b/packages/website/public/images/@next/press/logo-venturebeat.png 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> |
