aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts
diff options
context:
space:
mode:
authorEzekiel Aquino <ezekiel@bakkenbaeck.no>2018-12-12 22:19:11 +0800
committerEzekiel Aquino <ezekiel@bakkenbaeck.no>2018-12-12 22:19:11 +0800
commit94c90cc49a556438a6eb298ddac7c0fb36163fde (patch)
treefe2b4f6fb6bfd3f496ae78164f82a6607d54136a /packages/website/ts
parentd8e03b87d6e3152878902348f613ad006697c224 (diff)
downloaddexon-sol-tools-94c90cc49a556438a6eb298ddac7c0fb36163fde.tar
dexon-sol-tools-94c90cc49a556438a6eb298ddac7c0fb36163fde.tar.gz
dexon-sol-tools-94c90cc49a556438a6eb298ddac7c0fb36163fde.tar.bz2
dexon-sol-tools-94c90cc49a556438a6eb298ddac7c0fb36163fde.tar.lz
dexon-sol-tools-94c90cc49a556438a6eb298ddac7c0fb36163fde.tar.xz
dexon-sol-tools-94c90cc49a556438a6eb298ddac7c0fb36163fde.tar.zst
dexon-sol-tools-94c90cc49a556438a6eb298ddac7c0fb36163fde.zip
Cleanup press page, siteWrap
Diffstat (limited to 'packages/website/ts')
-rw-r--r--packages/website/ts/@next/components/layout.tsx1
-rw-r--r--packages/website/ts/@next/components/siteWrap.tsx13
-rw-r--r--packages/website/ts/@next/pages/about/press.tsx30
3 files changed, 26 insertions, 18 deletions
diff --git a/packages/website/ts/@next/components/layout.tsx b/packages/website/ts/@next/components/layout.tsx
index 32e92aa34..358120adc 100644
--- a/packages/website/ts/@next/components/layout.tsx
+++ b/packages/website/ts/@next/components/layout.tsx
@@ -75,7 +75,6 @@ const COLUMN_WIDTHS: ColumnWidths = {
};
export const Main = styled.main`
- width: calc(100% - 0);
max-width: ${MAX_WIDTH}px;
margin: 0 auto;
diff --git a/packages/website/ts/@next/components/siteWrap.tsx b/packages/website/ts/@next/components/siteWrap.tsx
index ae642f193..abbd27845 100644
--- a/packages/website/ts/@next/components/siteWrap.tsx
+++ b/packages/website/ts/@next/components/siteWrap.tsx
@@ -1,10 +1,10 @@
import * as React from 'react';
-import { ThemeProvider } from 'styled-components';
+import styled, { ThemeProvider } from 'styled-components';
import { colors } from 'ts/style/colors';
+
import { Footer } from 'ts/@next/components/footer';
import { Header } from 'ts/@next/components/header';
-import { Main } from 'ts/@next/components/layout';
import { GlobalStyles } from 'ts/@next/constants/globalStyle';
// Note(ez): We'll define the theme and provide it via a prop
@@ -78,3 +78,12 @@ export const SiteWrap: React.StatelessComponent<Props> = props => {
</>
);
};
+
+export const Main = styled.main`
+ max-width: 1500px;
+ margin: 0 auto;
+
+ @media (min-width: 768px) {
+ width: calc(100% - 60px);
+ }
+`;
diff --git a/packages/website/ts/@next/pages/about/press.tsx b/packages/website/ts/@next/pages/about/press.tsx
index 68af1cb0f..259618d13 100644
--- a/packages/website/ts/@next/pages/about/press.tsx
+++ b/packages/website/ts/@next/pages/about/press.tsx
@@ -4,7 +4,7 @@ import styled from 'styled-components';
import { AboutPageLayout } from 'ts/@next/components/aboutPageLayout';
import { Link } from 'ts/@next/components/button';
-import { Column, Section, Wrap } from 'ts/@next/components/layout';
+import { Column, FlexWrap, Section } from 'ts/@next/components/newLayout';
import { Separator } from 'ts/@next/components/separator';
import { Heading, Paragraph } from 'ts/@next/components/text';
@@ -45,8 +45,6 @@ export const NextAboutPress = () => (
Want to write about 0x? Get in touch, or download our press kit.
</Paragraph>
- <Separator/>
-
{_.map(highlights, (highlight, index) => (
<Highlight key={`highlight-${index}`} highlight={highlight} />
))}
@@ -56,17 +54,19 @@ export const NextAboutPress = () => (
);
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} isWithArrow={true} isNoBorder={true}>Read Article</Link>
- </Column>
- </Wrap>
+ <HighlightWrap>
+ <Column>
+ <img src={highlight.logo} alt={highlight.title} />
+ </Column>
- <Separator/>
- </>
+ <Column width="60%" maxWidth="560px">
+ <Paragraph isMuted={false}>{highlight.text}</Paragraph>
+ <Link href={highlight.href} isWithArrow={true} isNoBorder={true}>Read Article</Link>
+ </Column>
+ </HighlightWrap>
);
+
+const HighlightWrap = styled(FlexWrap)`
+ border-top: 1px solid #eaeaea;
+ padding: 30px 0;
+`;