Updates margins in why, change link component

3 files changed, 8 insertions, 4 deletions

diff --git a/packages/website/ts/@next/components/button.tsx b/packages/website/ts/@next/components/button.tsx
index 24da860ba..cd14c80ba 100644
--- a/packages/website/ts/@next/components/button.tsx
+++ b/packages/website/ts/@next/components/button.tsx
@@ -52,7 +52,7 @@ export const Link = (props: ButtonInterface) => {
     const Component = Button.withComponent(ReactRouterLink);
 
     return (
-        <Component to={href} {...props}>
+        <Component to={href} isTransparent={true} {...props}>
             {children}
 
             { isWithArrow &&
diff --git a/packages/website/ts/@next/components/header.tsx b/packages/website/ts/@next/components/header.tsx
index e4add9ecf..144eb5eb2 100644
--- a/packages/website/ts/@next/components/header.tsx
+++ b/packages/website/ts/@next/components/header.tsx
@@ -58,7 +58,9 @@ export class Header extends React.Component<HeaderProps, HeaderState> {
                 <ReactRouterLink to="/next">
                     <Logo/>
                 </ReactRouterLink>
+
                 <Hamburger isOpen={this.state.isOpen} onClick={this._onMenuButtonClick.bind(this)}/>
+
                 <Nav>
                     <MobileProductLinksWrap>
                         <Paragraph isNoMargin={true} isMuted={0.5} size="small">Products</Paragraph>
@@ -73,9 +75,10 @@ export class Header extends React.Component<HeaderProps, HeaderState> {
                             </StyledLink>
                         ))}
                     </MobileProductLinksWrap>
-                  <StyledButtonWrap>
+
+                    <StyledButtonWrap>
                       {_.map(navItems, (link, index) => this._getNavItem(link, index))}
-                  </StyledButtonWrap>
+                    </StyledButtonWrap>
                 </Nav>
                 <TradeButton href="#">Trade on 0x</TradeButton>
               </HeaderWrap>
diff --git a/packages/website/ts/@next/components/text.tsx b/packages/website/ts/@next/components/text.tsx
index d300031dc..a434c325f 100644
--- a/packages/website/ts/@next/components/text.tsx
+++ b/packages/website/ts/@next/components/text.tsx
@@ -17,6 +17,7 @@ interface HeadingProps extends BaseTextInterface {
 
 interface ParagraphProps extends BaseTextInterface {
     isNoMargin?: boolean;
+    marginBottom?: string; // maybe we should remove isNoMargin
     isMuted?: boolean | number;
 }
 
@@ -56,7 +57,7 @@ export const Heading: React.StatelessComponent<HeadingProps> = props => {
 // for literally anything =
 export const Paragraph = styled.p<ParagraphProps>`
     font-size: ${props => `var(--${props.size || 'default'}Paragraph)`};
-    margin-bottom: ${props => !props.isNoMargin && '30px'};
+    margin-bottom: ${props => !props.isNoMargin && (props.marginBottom || '30px')};
     padding: ${props => props.padding && getCSSPadding(props.padding)};
     color: ${props => props.color || props.theme.textColor};
     opacity: ${props => typeof props.isMuted === 'boolean' ? 0.75 : props.isMuted};