- Update button styles

- Add satellite icon to login and buy buttons

2 files changed, 10 insertions, 2 deletions

diff --git a/app/components/Account.js b/app/components/Account.js
index 12f3c1b6a8..477b10e2d3 100644
--- a/app/components/Account.js
+++ b/app/components/Account.js
@@ -3,6 +3,7 @@ import React, { Component, PropTypes } from 'react';
 import { If, Then, Else } from 'react-if';
 import { Layout, Container, Header } from './Layout';
 import { formatAccount } from '../lib/formatters';
+import ExternalLinkSVG from '../assets/images/icon-extLink.svg';
 
 export default class Account extends Component {
 
@@ -66,7 +67,10 @@ export default class Account extends Component {
                   </div>
 
                   <div className="account__footer">
-                    <button className="button button--positive" onClick={ this.onExternalLink.bind(this, 'purchase') }>Buy more time</button>
+                    <button className="button button--positive" onClick={ this.onExternalLink.bind(this, 'purchase') }>
+                      <span className="button-label">Buy more time</span>
+                      <ExternalLinkSVG className="button-icon button-icon--16" />
+                    </button>
                     <button className="button button--negative" onClick={ ::this.onLogout }>Logout</button>
                   </div>
 
diff --git a/app/components/Login.js b/app/components/Login.js
index 3ede726a59..0d7a3e2535 100644
--- a/app/components/Login.js
+++ b/app/components/Login.js
@@ -3,6 +3,7 @@ import { If, Then } from 'react-if';
 import { Layout, Container, Header } from './Layout';
 import { LoginState } from '../enums';
 import AccountInput from './AccountInput';
+import ExternalLinkSVG from '../assets/images/icon-extLink.svg';
 
 export default class Login extends Component {
   static propTypes = {
@@ -174,7 +175,10 @@ export default class Login extends Component {
             </div>
             <div className={footerClass}>
               <div className="login-footer__prompt">Don't have an account number?</div>
-              <button className="button button--primary" onClick={ ::this.onCreateAccount }>Create account</button>
+              <button className="button button--primary" onClick={ ::this.onCreateAccount }>
+                <span className="button-label">Create account</span>
+                <ExternalLinkSVG className="button-icon button-icon--16" />
+              </button>
             </div>
           </div>
         </Container>