Update copy on the banner

packages/website/ts/pages/governance/governance.tsx

@@ -55,7 +55,7 @@ const riskLabels: LabelInterface = {
 
 const proposalData = {
     zeipId: 23,
-    title: 'ZEIP23: Trading Bundles of Assets',
+    title: 'ZEIP-23: Trading Bundles of Assets',
     summary: `This ZEIP introduces the MultiAssetProxy, which adds support for trading arbitrary bundles of assets to 0x protocol. Historically, only a single asset could be traded per each side of a trade. With the introduction of the MultiAssetProxy, users will be able to trade multiple ERC721 assets or even mix ERC721 and ERC20 assets within a single order.`,
     url: 'https://blog.0xproject.com/zeip-23-trade-bundles-of-assets-fe69eb3ed960',
     votingDeadline: 1551052800,
@@ -184,9 +184,10 @@ export class Governance extends React.Component {
                 </Section>
 
                 <Banner
-                    heading="Need ZRX to vote?"
-                    subline="Use 0x Instant to quickly trade ETH to ZRX for voting"
-                    secondaryCta={{ text: 'Launch Instant', onClick: this._onLaunchInstantClick.bind(this) }}
+                    heading="Vote with ZRX on ZEIP-23"
+                    subline="Use 0x Instant to quickly purchase ZRX for voting"
+                    mainCta={{ text: 'Get ZRX', onClick: this._onLaunchInstantClick.bind(this) }}
+                    secondaryCta={{ text: 'Vote', onClick: this._onOpenVoteModal.bind(this) }}
                 />
                 <ModalContact isOpen={this.state.isContactModalOpen} onDismiss={this._onDismissContactModal} />
                 <ModalVote

packages/website/ts/pages/governance/modal_vote.tsx

@@ -120,9 +120,14 @@ export class ModalVote extends React.Component<Props> {
                             <Paragraph isMuted={true} color={colors.textDarkPrimary}>
                                 You voted from {selectedAddress} with {formattedBalance} ZRX
                             </Paragraph>
-                            <Button type="button" onClick={this._onDone.bind(this)}>
-                                Done
-                            </Button>
+                            <ButtonWrap>
+                                <Button type="button" onClick={this._shareViaTwitterAsync.bind(this)}>
+                                    Tweet
+                                </Button>
+                                <Button type="button" onClick={this._onDone.bind(this)}>
+                                    Done
+                                </Button>
+                            </ButtonWrap>
                         </Confirmation>
                         <ButtonClose type="button" onClick={this.props.onDismiss}>
                             <span>Close</span>
@@ -147,6 +152,10 @@ export class ModalVote extends React.Component<Props> {
                 return this._renderConnectWalletFormContent();
         }
     }
+    private _shareViaTwitterAsync(): void {
+        const tweetText = encodeURIComponent(`I voted on ZEIP-23! 🗳️#VoteWithZRX https://0x.org/vote`);
+        window.open(`https://twitter.com/intent/tweet?text=${tweetText}`, 'Share your vote', 'width=500,height=400');
+    }
     private _renderConnectWalletFormContent(): React.ReactNode {
         const { web3Wrapper } = this.state;
         return (
@@ -298,3 +307,25 @@ const Confirmation = styled.div<FormProps>`
         margin-right: auto;
     }
 `;
+
+const ButtonWrap = styled.div`
+    display: inline-block;
+
+    @media (min-width: 768px) {
+        * + * {
+            margin-left: 15px;
+        }
+    }
+
+    @media (max-width: 768px) {
+        a,
+        button {
+            display: block;
+            width: 220px;
+        }
+
+        * + * {
+            margin-top: 15px;
+        }
+    }
+`;

packages/website/ts/pages/governance/vote_stats.tsx

@@ -1,15 +1,11 @@
-import * as _ from 'lodash';
-import * as React from 'react';
-
-import { TallyInterface } from 'ts/pages/governance/governance';
-
-import { Heading, Paragraph } from 'ts/components/text';
-import { VoteBar } from 'ts/pages/governance/vote_bar';
-
-import { colors } from 'ts/style/colors';
-
 import { BigNumber } from '@0x/utils';
 import { Web3Wrapper } from '@0x/web3-wrapper';
+import * as React from 'react';
+
+import { Heading, Paragraph } from 'ts/components/text';
+import { TallyInterface } from 'ts/pages/governance/governance';
+import { VoteBar } from 'ts/pages/governance/vote_bar';
+import { colors } from 'ts/style/colors';
 import { configs } from 'ts/utils/configs';
 
 interface VoteStatsProps {