8 files changed, 46 insertions, 50 deletions
diff --git a/web-ui/src/account_recovery/account_recovery.js b/web-ui/src/account_recovery/account_recovery.js
index 6c12e326..d4e0f4e8 100644
--- a/web-ui/src/account_recovery/account_recovery.js
+++ b/web-ui/src/account_recovery/account_recovery.js
@@ -15,21 +15,21 @@
  * along with Pixelated. If not, see <http://www.gnu.org/licenses/>.
  */
 
-import React from 'react'
-import { render } from 'react-dom'
-import a11y from 'react-a11y'
-import { I18nextProvider } from 'react-i18next'
+import React from 'react';
+import { render } from 'react-dom';
+import a11y from 'react-a11y';
+import { I18nextProvider } from 'react-i18next';
 
-import Page from './page'
-import i18n from '../i18n'
+import 'font-awesome/scss/font-awesome.scss';
 
-import 'font-awesome/scss/font-awesome.scss'
+import PageWrapper from './page';
+import i18n from '../i18n';
 
-if(process.env.NODE_ENV === 'development') a11y(React);
+if (process.env.NODE_ENV === 'development') a11y(React);
 
 render(
-  <I18nextProvider i18n={ i18n }>
-    <Page/>
+  <I18nextProvider i18n={i18n}>
+    <PageWrapper />
   </I18nextProvider>,
   document.getElementById('root')
 );
diff --git a/web-ui/src/account_recovery/page.js b/web-ui/src/account_recovery/page.js
index d1bcb464..ac01529d 100644
--- a/web-ui/src/account_recovery/page.js
+++ b/web-ui/src/account_recovery/page.js
@@ -15,12 +15,12 @@
  * along with Pixelated. If not, see <http://www.gnu.org/licenses/>.
  */
 
-import React from 'react'
-import { translate } from 'react-i18next'
-import SubmitButton from 'src/common/submit_button/submit_button'
-import InputField from 'src/common/input_field/input_field'
+import React from 'react';
+import { translate } from 'react-i18next';
+import SubmitButton from 'src/common/submit_button/submit_button';
+import InputField from 'src/common/input_field/input_field';
 
-import './page.scss'
+import './page.scss';
 
 export const Page = ({ t }) => (
   <div className='container'>
@@ -32,13 +32,17 @@ export const Page = ({ t }) => (
       <InputField name='email' label={t('backup-account.input-label')} />
       <SubmitButton buttonText={t('backup-account.button')} />
       <div>
-        <a href="/">
-          <i className="fa fa-angle-left" aria-hidden="true"></i>
+        <a href='/'>
+          <i className='fa fa-angle-left' aria-hidden='true' />
           <span>{t('back-to-inbox')}</span>
         </a>
       </div>
     </form>
   </div>
-)
+);
 
-export default translate('', { wait: true })(Page)
+Page.propTypes = {
+  t: React.PropTypes.func.isRequired
+};
+
+export default translate('', { wait: true })(Page);
diff --git a/web-ui/src/account_recovery/page.scss b/web-ui/src/account_recovery/page.scss
index c928d815..619d1105 100644
--- a/web-ui/src/account_recovery/page.scss
+++ b/web-ui/src/account_recovery/page.scss
@@ -65,18 +65,13 @@ a {
   width: 84%;
   margin: 3% auto;
   padding: 6% 5%;
-
-  -webkit-display: flex;
   display: flex;
-  -webkit-align-items: flex-start;
   align-items: flex-start;
-  -webkit-flex-direction: column;
   flex-direction: column;
 }
 
 img {
   width: 50%;
-  -webkit-align-self: center;
   align-self: center;
 }
 
@@ -87,13 +82,10 @@ img {
 
   form {
     display: flex;
-    -webkit-display: flex;
-    -webkit-flex-direction: column;
     flex-direction: column;
 
     div {
       width: 70%;
-      -webkit-align-self: center;
       align-self: center;
     }
   }
@@ -103,9 +95,7 @@ img {
   .container{
     width: 60%;
     padding: 3%;
-    -webkit-align-items: flex-start;
     align-items: flex-start;
-    -webkit-flex-direction: row;
     flex-direction: row;
     max-width: 700px;
   }
@@ -115,7 +105,6 @@ img {
 
     div {
       width: 300px;
-      -webkit-align-self: flex-start;
       align-self: flex-start;
     }
   }
diff --git a/web-ui/src/common/input_field/input-field.scss b/web-ui/src/common/input_field/input-field.scss
index 6ec827ab..dd8e8927 100644
--- a/web-ui/src/common/input_field/input-field.scss
+++ b/web-ui/src/common/input_field/input-field.scss
@@ -33,8 +33,6 @@
   left: 6px;
   top:10px;
   transition:0.2s ease all;
-  -moz-transition:0.2s ease all;
-  -webkit-transition:0.2s ease all;
 }
 
 .input-field {
@@ -61,7 +59,6 @@
 @media only screen and (min-width : 500px) {
   .input-field-group {
     width: 70%;
-    -webkit-align-self: center;
     align-self: center;
   }
 }
@@ -69,7 +66,6 @@
 @media only screen and (min-width : 960px) {
   .input-field-group {
     width: 300px;
-    -webkit-align-self: flex-start;
     align-self: flex-start;
     margin-top: 3em;
     font-size: 1em;
diff --git a/web-ui/src/common/input_field/input_field.js b/web-ui/src/common/input_field/input_field.js
index 43899419..1378ba74 100644
--- a/web-ui/src/common/input_field/input_field.js
+++ b/web-ui/src/common/input_field/input_field.js
@@ -15,15 +15,20 @@
  * along with Pixelated. If not, see <http://www.gnu.org/licenses/>.
  */
 
-import React from 'react'
+import React from 'react';
 
-import './input-field.scss'
+import './input-field.scss';
 
 const InputField = ({ label, name }) => (
   <div className='input-field-group'>
     <input type='text' name={name} className='input-field' required />
     <label className='input-field-label' htmlFor={name}>{label}</label>
   </div>
-)
+);
 
-export default InputField
+InputField.propTypes = {
+  label: React.PropTypes.string.isRequired,
+  name: React.PropTypes.string.isRequired
+};
+
+export default InputField;
diff --git a/web-ui/src/common/submit_button/submit-button.scss b/web-ui/src/common/submit_button/submit-button.scss
index ccd0bef4..13cb7607 100644
--- a/web-ui/src/common/submit_button/submit-button.scss
+++ b/web-ui/src/common/submit_button/submit-button.scss
@@ -32,7 +32,6 @@
 @media only screen and (min-width : 500px) {
   .submit-button {
     width: 70%;
-    -webkit-align-self: center;
     align-self: center;
   }
 }
@@ -40,7 +39,6 @@
 @media only screen and (min-width : 960px) {
   .submit-button {
     width: 300px;
-    -webkit-align-self: flex-start;
     align-self: flex-start;
     font-size: 0.8em;
     margin-bottom: 1em;
diff --git a/web-ui/src/common/submit_button/submit_button.js b/web-ui/src/common/submit_button/submit_button.js
index 89cfc55b..fb87bf7d 100644
--- a/web-ui/src/common/submit_button/submit_button.js
+++ b/web-ui/src/common/submit_button/submit_button.js
@@ -15,12 +15,16 @@
  * along with Pixelated. If not, see <http://www.gnu.org/licenses/>.
  */
 
-import React from 'react'
+import React from 'react';
 
-import './submit-button.scss'
+import './submit-button.scss';
 
 const SubmitButton = ({ buttonText }) => (
   <input type='submit' className='submit-button' value={buttonText} />
-)
+);
 
-export default SubmitButton
+SubmitButton.propTypes = {
+  buttonText: React.PropTypes.string.isRequired
+};
+
+export default SubmitButton;
diff --git a/web-ui/src/i18n.js b/web-ui/src/i18n.js
index 9c6ad550..bbbe2dcd 100644
--- a/web-ui/src/i18n.js
+++ b/web-ui/src/i18n.js
@@ -14,15 +14,15 @@
  * You should have received a copy of the GNU Affero General Public License
  * along with Pixelated. If not, see <http://www.gnu.org/licenses/>.
  */
-import i18n from 'i18next'
-import i18nBackend from 'i18nextXHRBackend'
-import i18nDetector from 'i18nextBrowserLanguageDetector'
+import i18n from 'i18next';
+import i18nBackend from 'i18nextXHRBackend';
+import I18nDetector from 'i18nextBrowserLanguageDetector';
 
-const detector = new i18nDetector();
+const detector = new I18nDetector();
 const detect = detector.detect.bind(detector);
 
-detector.detect = function(detectionOrder)  {
-  let result = detect(detectionOrder);
+detector.detect = (detectionOrder) => {
+  const result = detect(detectionOrder);
   return result.replace('-', '_');
 };