update header according to gui review

1 files changed, 18 insertions, 7 deletions

diff --git a/resources/assets/stylesheets/scss/layouts.scss b/resources/assets/stylesheets/scss/layouts.scss
index 07ec2ec..e4ce733 100644
--- a/resources/assets/stylesheets/scss/layouts.scss
+++ b/resources/assets/stylesheets/scss/layouts.scss
@@ -21,6 +21,7 @@ body {
 #main-header {
     grid-column: 1 / 3;
     grid-row: 1 / 2;
+    margin-bottom: 15px;
 }
 
 #top-bar {
@@ -68,7 +69,7 @@ body {
         top: 0;
         left: 0;
         bottom: 0;
-        width: $page-margin;
+        width: 10px;
     }
 
     .contextless & {
@@ -104,7 +105,6 @@ body {
         flex-wrap: nowrap;
         font-size: 0.9em;
         justify-content: space-between;
-        padding-left: 5px;
     }
 
     .contextless & {
@@ -117,6 +117,13 @@ body {
         }
     }
 }
+#navigation-level-2 {
+    margin-top: 5px;
+
+    #tabs {
+        font-size: 1.3em;
+    }
+}
 
 #tabs {
     width: 100%;
@@ -197,7 +204,7 @@ body {
     max-height: 25px;
     overflow: hidden;
 
-    background:var(--dark-gray-color-5);
+    background:var(--white);
 
     > .context-avatar {
         margin: 0 5px 0 12px;
@@ -291,14 +298,18 @@ body {
             flex-direction: row;
             align-items: stretch;
             justify-content: space-between;
-            background-color: var(--dark-gray-color-5);
+            background-color: var(--white);
             font-size: 0.9em;
             min-height: 2.3em;
-            border-bottom: 1px solid var(--dark-gray-color-20);
+            border-bottom: 3px solid var(--dark-gray-color-20);
+            margin: 0 $page-margin;
+        }
+        #navigation-level-3 {
+            .tabs_wrapper {
+                border: none;
+            }
         }
-
         #tabs { // row 1 of layout_page
-            padding-left: $page-margin;
             transition: margin-left;
             transition-duration: var(--transition-duration);
             transition-delay: 500ms;