Implement subscription form

1 files changed, 10 insertions, 28 deletions

diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx
index 016c62a30..0911bb2cf 100644
--- a/packages/website/ts/pages/landing/landing.tsx
+++ b/packages/website/ts/pages/landing/landing.tsx
@@ -1,7 +1,7 @@
 import { colors } from '@0xproject/react-shared';
 import * as _ from 'lodash';
-import RaisedButton from 'material-ui/RaisedButton';
 import * as React from 'react';
+import { CTA } from 'ts/components/ui/button';
 import DocumentTitle = require('react-document-title');
 import { Link } from 'react-router-dom';
 import { Footer } from 'ts/components/footer';
@@ -237,7 +237,7 @@ export class Landing extends React.Component<LandingProps, LandingState> {
             <div className="clearfix py4" style={{ backgroundColor: colors.heroGrey }}>
                 <div className="mx-auto max-width-4 clearfix">
                     {this._renderWhatsNew()}
-                    <div className="lg-pt4 md-pt4 sm-pt2 lg-pb4 md-pb4 lg-my4 md-my4 sm-mt2 sm-mb4 clearfix">
+                    <div className="lg-pt4 md-pt4 sm-pt2 lg-pb4 md-pb4 lg-mt4 md-mt4 sm-mt2 sm-mb4 clearfix">
                         <div className="col lg-col-5 md-col-5 col-12 sm-center">
                             <img src="/images/landing/hero_chip_image.png" height={isSmallScreen ? 300 : 395} />
                         </div>
@@ -272,13 +272,9 @@ export class Landing extends React.Component<LandingProps, LandingState> {
                                 <div className="pt3 clearfix sm-mx-auto" style={{ maxWidth: 389 }}>
                                     <div className="lg-pr2 md-pr2 col col-6 sm-center">
                                         <Link to={WebsitePaths.ZeroExJs} className="text-decoration-none">
-                                            <RaisedButton
-                                                style={{ borderRadius: 6, minWidth: 157.36 }}
-                                                buttonStyle={{ borderRadius: 6 }}
-                                                labelStyle={buttonLabelStyle}
-                                                label={this.props.translate.get(Key.BuildCallToAction, Deco.Cap)}
-                                                onClick={_.noop}
-                                            />
+                                            <CTA width="175px" type="light">
+                                                {this.props.translate.get(Key.BuildCallToAction, Deco.Cap)}
+                                            </CTA>
                                         </Link>
                                     </div>
                                     <div className="col col-6 sm-center">
@@ -287,23 +283,17 @@ export class Landing extends React.Component<LandingProps, LandingState> {
                                             target="_blank"
                                             className="text-decoration-none"
                                         >
-                                            <RaisedButton
-                                                style={{ borderRadius: 6, minWidth: 150 }}
-                                                buttonStyle={lightButtonStyle}
-                                                labelColor="white"
-                                                backgroundColor={colors.heroGrey}
-                                                labelStyle={buttonLabelStyle}
-                                                label={this.props.translate.get(Key.CommunityCallToAction, Deco.Cap)}
-                                                onClick={_.noop}
-                                            />
+                                            <CTA width="175px">
+                                                {this.props.translate.get(Key.CommunityCallToAction, Deco.Cap)}
+                                            </CTA>
                                         </a>
                                     </div>
                                 </div>
-                                <SubscribeForm />
                             </div>
                         </div>
                     </div>
                 </div>
+                <SubscribeForm />
             </div>
         );
     }
@@ -784,15 +774,7 @@ export class Landing extends React.Component<LandingProps, LandingState> {
                         </div>
                         <div className="sm-center sm-pt2 lg-table-cell md-table-cell">
                             <Link to={WebsitePaths.ZeroExJs} className="text-decoration-none">
-                                <RaisedButton
-                                    style={{ borderRadius: 6, minWidth: 150 }}
-                                    buttonStyle={lightButtonStyle}
-                                    labelColor={colors.white}
-                                    backgroundColor={colors.heroGrey}
-                                    labelStyle={buttonLabelStyle}
-                                    label={this.props.translate.get(Key.BuildCallToAction, Deco.Cap)}
-                                    onClick={_.noop}
-                                />
+                                <CTA fontSize="15px">{this.props.translate.get(Key.BuildCallToAction, Deco.Cap)}</CTA>
                             </Link>
                         </div>
                     </div>