From b461147389537b4808c60bcd3206e6dfce76f017 Mon Sep 17 00:00:00 2001
From: Ezekiel Aquino <ezekiel@bakkenbaeck.no>
Date: Thu, 29 Nov 2018 15:51:27 +0100
Subject: Adds buttonWrapper

---
 packages/website/ts/@next/components/button.tsx | 10 ++++++++++
 packages/website/ts/@next/pages/landing.tsx     |  7 ++++---
 2 files changed, 14 insertions(+), 3 deletions(-)

(limited to 'packages')

diff --git a/packages/website/ts/@next/components/button.tsx b/packages/website/ts/@next/components/button.tsx
index f69589373..39e30105a 100644
--- a/packages/website/ts/@next/components/button.tsx
+++ b/packages/website/ts/@next/components/button.tsx
@@ -18,6 +18,16 @@ export const Button: React.StatelessComponent<ButtonInterface> = props => {
     return <Component {...props}>{ props.children }</Component>;
 };
 
+// Added this, & + & doesnt really work since we switch with element types...
+export const ButtonWrap = styled.div`
+  button + button,
+  a + a,
+  a + button,
+  button + a {
+    margin-left: 10px;
+  }
+`;
+
 const StyledButton = styled.button<ButtonInterface>`
     appearance: none;
     border: 0;
diff --git a/packages/website/ts/@next/pages/landing.tsx b/packages/website/ts/@next/pages/landing.tsx
index eb8adbde9..766eb809b 100644
--- a/packages/website/ts/@next/pages/landing.tsx
+++ b/packages/website/ts/@next/pages/landing.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import styled from 'styled-components';
 
 import { colors } from 'ts/style/colors'
-import { Button } from 'ts/@next/components/button';
+import { Button, ButtonWrap } from 'ts/@next/components/button';
 import { Column, Section, Wrap, WrapCentered } from 'ts/@next/components/layout';
 import { SiteWrap } from 'ts/@next/components/siteWrap';
 import { Heading, Intro, Text } from 'ts/@next/components/text';
@@ -22,7 +22,8 @@ export const NextLanding = () => (
         <Column colWidth="2/3">
           <Heading>Powering Decentralized Exchange</Heading>
           <Intro>0x is the best solution for adding exchange functionality to your business.</Intro>
-          <div>
+
+          <ButtonWrap>
             <Button inline>
               Get Started
             </Button>
@@ -30,7 +31,7 @@ export const NextLanding = () => (
             <Button transparent inline>
               Learn More
             </Button>
-          </div>
+          </ButtonWrap>
         </Column>
 
         <Column colWidth="1/3">
-- 
cgit v1.2.3