Fix styling in initialization

2 files changed, 14 insertions, 5 deletions

diff --git a/ui/app/app.js b/ui/app/app.js
index c6fce0e47..3fca8ccc1 100644
--- a/ui/app/app.js
+++ b/ui/app/app.js
@@ -3,6 +3,8 @@ const Component = require('react').Component
 const connect = require('react-redux').connect
 const h = require('react-hyperscript')
 const actions = require('./actions')
+const classnames = require('classnames')
+
 // mascara
 const MascaraFirstTime = require('../../mascara/src/app/first-time').default
 const MascaraBuyEtherScreen = require('../../mascara/src/app/first-time/buy-ether-screen').default
@@ -243,7 +245,9 @@ App.prototype.renderAppBar = function () {
     }, [
 
       h('.app-header.flex-row.flex-space-between', {
-        style: {},
+        className: classnames({
+          'app-header--initialized': !isOnboarding,
+        }),
       }, [
         h('div.app-header-contents', {}, [
           h('div.left-menu-wrapper', {
diff --git a/ui/app/css/itcss/components/header.scss b/ui/app/css/itcss/components/header.scss
index a6332f819..e27444084 100644
--- a/ui/app/css/itcss/components/header.scss
+++ b/ui/app/css/itcss/components/header.scss
@@ -17,7 +17,16 @@
   @media screen and (min-width: 576px) {
     height: 75px;
     justify-content: center;
+  }
+
+  .metafox-icon {
+    cursor: pointer;
+  }
+}
 
+.app-header--initialized {
+
+  @media screen and (min-width: 576px) {
     &::after {
       content: '';
       position: absolute;
@@ -27,10 +36,6 @@
       bottom: -32px;
     }
   }
-
-  .metafox-icon {
-    cursor: pointer;
-  }
 }
 
 .app-header-contents {