Merge pull request #193 from cosmos/peng/fix-mobile-header-and-toolba…

…r-design Revert to the older page header and toolbar padding for smaller viewports
luniehq · Dec 7, 2017 · 49fa9c0 · 49fa9c0
2 parents 9316ebd + ba9f9d6
commit 49fa9c0
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 3 deletions.
diff --git a/app/src/renderer/components/common/NiPageHeader.vue b/app/src/renderer/components/common/NiPageHeader.vue
@@ -37,7 +37,7 @@ export default {
   flex 1
   display flex
   min-width 0 // fix truncation
-  padding 1.66rem 1rem 1rem 2rem // 1.66 to match logo
+  padding 1rem
 
   i.material-icons
     font-size 1.375 * x
@@ -60,6 +60,9 @@ export default {
   .ni-page-header-container
     display flex
 
+  .ni-page-header-text
+    padding 1.66rem 1rem 1rem 2rem // 1.66 to match logo
+
   .ni-page-header-menu
     display flex
     align-items center

diff --git a/app/src/renderer/components/common/NiToolBar.vue b/app/src/renderer/components/common/NiToolBar.vue
@@ -18,7 +18,6 @@ export default {
 @require '~variables'
 
 .ni-tool-bar-container
-  height 100%
   display flex
 
   .main
@@ -33,7 +32,6 @@ export default {
 
   a
     padding 1rem
-    margin-top 0.7rem
 
     user-select none
     cursor pointer
@@ -109,10 +107,13 @@ export default {
 
   .ni-tool-bar-container
     background app-bg-alpha
+    height 3rem + px
     border-top px solid bc
 
 @media screen and (min-width: 1024px)
   .ni-tool-bar-container
     .main
       justify-content flex-end
+    a
+      margin-top 0.7rem
 </style>