4 files changed, 20 insertions, 13 deletions
diff --git a/web-ui/src/login/login.css b/web-ui/src/login/login.css
index 5116875e..9628932f 100644
--- a/web-ui/src/login/login.css
+++ b/web-ui/src/login/login.css
@@ -25,6 +25,11 @@ body {
   background-repeat: repeat;
 }
 
+#root {
+  margin-top: 3%;
+  margin-bottom: 3%;
+}
+
 .disclaimer {
   display: block;
   width: 90%;
diff --git a/web-ui/src/login/login.js b/web-ui/src/login/login.js
index b1d895ae..c8e08762 100644
--- a/web-ui/src/login/login.js
+++ b/web-ui/src/login/login.js
@@ -18,17 +18,21 @@
 import React from 'react';
 import { render } from 'react-dom';
 import a11y from 'react-a11y';
-import { I18nextProvider } from 'react-i18next';
 
-import AppWrapper from './app';
-import i18n from '../i18n';
+import App from 'src/common/app';
+import PageWrapper from './page';
 import { hasQueryParameter } from '../util';
 
 if (process.env.NODE_ENV === 'development') a11y(React);
 
 render(
-  <I18nextProvider i18n={i18n}>
-    <AppWrapper authError={hasQueryParameter('auth-error')} error={hasQueryParameter('error')} />
-  </I18nextProvider>,
+  <App
+    child={
+      <PageWrapper
+        authError={hasQueryParameter('auth-error')}
+        error={hasQueryParameter('error')}
+      />
+    }
+  />,
   document.getElementById('root')
 );
diff --git a/web-ui/src/login/app.js b/web-ui/src/login/page.js
index 3259f7b5..f0a7188b 100644
--- a/web-ui/src/login/app.js
+++ b/web-ui/src/login/page.js
@@ -23,7 +23,7 @@ import AuthError from 'src/login/error/auth_error';
 import GenericError from 'src/login/error/generic_error';
 import PixelatedWelcome from 'src/login/about/pixelated_welcome';
 
-import './app.scss';
+import './page.scss';
 
 const errorMessage = (t, authError) => {
   if (authError) return <AuthError />;
@@ -35,7 +35,7 @@ const rightPanel = (t, error) => {
   return <PixelatedWelcome />;
 };
 
-export const App = ({ t, authError, error }) => (
+export const Page = ({ t, authError, error }) => (
   <div className='login'>
     <img
       className={error ? 'logo small-logo' : 'logo'}
@@ -52,10 +52,10 @@ export const App = ({ t, authError, error }) => (
   </div>
 );
 
-App.propTypes = {
+Page.propTypes = {
   t: React.PropTypes.func.isRequired,
   authError: React.PropTypes.bool,
   error: React.PropTypes.bool
 };
 
-export default translate('', { wait: true })(App);
+export default translate('', { wait: true })(Page);
diff --git a/web-ui/src/login/app.scss b/web-ui/src/login/page.scss
index 32e3b979..14e2d131 100644
--- a/web-ui/src/login/app.scss
+++ b/web-ui/src/login/page.scss
@@ -23,8 +23,6 @@
   margin: auto;
   max-width: 400px;
   padding: 2em 0;
-  margin-top: 3%;
-  margin-bottom: 3%;
   background-color: $white;
   display: flex;
   flex-direction: column;
@@ -84,7 +82,7 @@
       content: '';
       height: 22em;
       position: absolute;
-      margin-top: inherit;
+      margin-top: 3%;
       top: 2.5em;
       left: 50%;
       border: 1px solid $lighter_gray;