From 53e495cf335d3c6b44361627288db252aae1f4ad Mon Sep 17 00:00:00 2001
From: Elias Nahum <nahumhbl@gmail.com>
Date: Thu, 28 Jan 2016 16:16:39 -0300
Subject: PLT-7: Refactoring frontend (chunk 4)

---
 web/react/components/authorize.jsx | 42 +++++++++++++++++++++++++++++++++-----
 1 file changed, 37 insertions(+), 5 deletions(-)

(limited to 'web/react/components/authorize.jsx')

diff --git a/web/react/components/authorize.jsx b/web/react/components/authorize.jsx
index 32e39fbff..90cbe3289 100644
--- a/web/react/components/authorize.jsx
+++ b/web/react/components/authorize.jsx
@@ -3,6 +3,8 @@
 
 import * as Client from '../utils/client.jsx';
 
+import {FormattedMessage} from 'mm-intl';
+
 export default class Authorize extends React.Component {
     constructor(props) {
         super(props);
@@ -35,25 +37,55 @@ export default class Authorize extends React.Component {
         return (
             <div className='authorize-box'>
                 <div className='authorize-inner'>
-                    <h3>{'An application would like to connect to your '}{this.props.teamName}{' account'}</h3>
-                    <label>{'The app '}{this.props.appName}{' would like the ability to access and modify your basic information.'}</label>
+                    <h3>
+                        <FormattedMessage
+                            id='authorize.title'
+                            defaultMessage='An application would like to connect to your {teamName} account'
+                            values={{
+                                teamName: this.props.teamName
+                            }}
+                        />
+                    </h3>
+                    <label>
+                        <FormattedMessage
+                            id='authorize.app'
+                            defaultMessage='The app {appName} would like the ability to access and modify your basic information.'
+                            values={{
+                                appName: this.props.appName
+                            }}
+                        />
+                    </label>
                     <br/>
                     <br/>
-                    <label>{'Allow '}{this.props.appName}{' access?'}</label>
+                    <label>
+                        <FormattedMessage
+                            id='authorize.access'
+                            defaultMessage='Allow {appName} access?'
+                            values={{
+                                appName: this.props.appName
+                            }}
+                        />
+                    </label>
                     <br/>
                     <button
                         type='submit'
                         className='btn authorize-btn'
                         onClick={this.handleDeny}
                     >
-                        {'Deny'}
+                        <FormattedMessage
+                            id='authorize.deny'
+                            defaultMessage='Deny'
+                        />
                     </button>
                     <button
                         type='submit'
                         className='btn btn-primary authorize-btn'
                         onClick={this.handleAllow}
                     >
-                        {'Allow'}
+                        <FormattedMessage
+                            id='authorize.allow'
+                            defaultMessage='Allow'
+                        />
                     </button>
                 </div>
             </div>
-- 
cgit v1.2.3-1-g7c22


From 6b7438b52fdaabe46cb298af1b325c3d8ece1af4 Mon Sep 17 00:00:00 2001
From: Elias Nahum <nahumhbl@gmail.com>
Date: Fri, 29 Jan 2016 13:48:12 -0300
Subject: PLT-7: Refactoring frontend (chunk 6) - Authorize - Signup Team
 Confirm - Footer

---
 web/react/components/authorize.jsx | 95 +++++++++++++++++++++-----------------
 1 file changed, 52 insertions(+), 43 deletions(-)

(limited to 'web/react/components/authorize.jsx')

diff --git a/web/react/components/authorize.jsx b/web/react/components/authorize.jsx
index 90cbe3289..4a4985268 100644
--- a/web/react/components/authorize.jsx
+++ b/web/react/components/authorize.jsx
@@ -3,7 +3,7 @@
 
 import * as Client from '../utils/client.jsx';
 
-import {FormattedMessage} from 'mm-intl';
+import {FormattedMessage, FormattedHTMLMessage} from 'mm-intl';
 
 export default class Authorize extends React.Component {
     constructor(props) {
@@ -35,58 +35,67 @@ export default class Authorize extends React.Component {
     }
     render() {
         return (
-            <div className='authorize-box'>
-                <div className='authorize-inner'>
-                    <h3>
-                        <FormattedMessage
-                            id='authorize.title'
-                            defaultMessage='An application would like to connect to your {teamName} account'
-                            values={{
-                                teamName: this.props.teamName
-                            }}
-                        />
-                    </h3>
-                    <label>
-                        <FormattedMessage
+            <div className='container-fluid'>
+                <div className='oauth-prompt'>
+                    <div className='prompt__heading'>
+                        <div className='prompt__app-icon'>
+                            <img
+                                src='/static/images/icon50x50.png'
+                                width='50'
+                                height='50'
+                                alt=''
+                            />
+                        </div>
+                        <div className='text'>
+                            <FormattedMessage
+                                id='authorize.title'
+                                defaultMessage='An application would like to connect to your {teamName} account'
+                                values={{
+                                    teamName: this.props.teamName
+                                }}
+                            />
+                        </div>
+                    </div>
+                    <p>
+                        <FormattedHTMLMessage
                             id='authorize.app'
-                            defaultMessage='The app {appName} would like the ability to access and modify your basic information.'
+                            defaultMessage='The app <strong>{appName}</strong> would like the ability to access and modify your basic information.'
                             values={{
                                 appName: this.props.appName
                             }}
                         />
-                    </label>
-                    <br/>
-                    <br/>
-                    <label>
-                        <FormattedMessage
+                    </p>
+                    <h2 className='prompt__allow'>
+                        <FormattedHTMLMessage
                             id='authorize.access'
-                            defaultMessage='Allow {appName} access?'
+                            defaultMessage='Allow <strong>{appName}</strong> access?'
                             values={{
                                 appName: this.props.appName
                             }}
                         />
-                    </label>
-                    <br/>
-                    <button
-                        type='submit'
-                        className='btn authorize-btn'
-                        onClick={this.handleDeny}
-                    >
-                        <FormattedMessage
-                            id='authorize.deny'
-                            defaultMessage='Deny'
-                        />
-                    </button>
-                    <button
-                        type='submit'
-                        className='btn btn-primary authorize-btn'
-                        onClick={this.handleAllow}
-                    >
-                        <FormattedMessage
-                            id='authorize.allow'
-                            defaultMessage='Allow'
-                        />
-                    </button>
+                    </h2>
+                    <div className='prompt__buttons'>
+                        <button
+                            type='submit'
+                            className='btn authorize-btn'
+                            onClick={this.handleDeny}
+                        >
+                            <FormattedMessage
+                                id='authorize.deny'
+                                defaultMessage='Deny'
+                            />
+                        </button>
+                        <button
+                            type='submit'
+                            className='btn btn-primary authorize-btn'
+                            onClick={this.handleAllow}
+                        >
+                            <FormattedMessage
+                                id='authorize.allow'
+                                defaultMessage='Allow'
+                            />
+                        </button>
+                    </div>
                 </div>
             </div>
         );
-- 
cgit v1.2.3-1-g7c22

