www: navigation layout changes

1 files changed, 13 insertions, 15 deletions

diff --git a/juick-www/src/main/assets/style.css b/juick-www/src/main/assets/style.css
index ce80e650..b6cc3f28 100644
--- a/juick-www/src/main/assets/style.css
+++ b/juick-www/src/main/assets/style.css
@@ -103,6 +103,10 @@ body > header {
     margin: 0 auto;
     width: 1000px;
     display: flex;
+    justify-content: space-between;
+    align-items: center;
+    flex-wrap: wrap;
+    padding: 4px;
 }
 #footer {
     clear: both;
@@ -148,7 +152,6 @@ body > header {
 
 #logo {
     height: 36px;
-    margin: 7px 25px 0 20px;
     width: 110px;
 }
 #logo a {
@@ -163,7 +166,6 @@ body > header {
     width: 110px;
 }
 #global {
-    flex-grow: 1;
     display: flex;
 }
 #global a {
@@ -182,25 +184,12 @@ body > header {
     cursor: pointer;
     transition: box-shadow 0.2s ease-in;
 }
-#search {
-    margin: 12px 20px 12px 0;
-}
 #search input {
     background: #FFF;
     border: 1px solid #DDDDD5;
     outline: none !important;
     padding: 4px;
 }
-@media screen and (max-width: 850px) {
-    #logo {
-        display: none;
-    }
-    #search {
-        display: inline-block;
-        float: none;
-        margin: 10px 10px;
-    }
-}
 
 /* #endregion */
 
@@ -485,6 +474,15 @@ article .tags > a,
 }
 
 @media screen and (max-width: 850px) {
+    #header_wrapper {
+        width: auto;
+    }
+    #wrapper {
+        margin-top: 150px;
+    }
+    #search {
+        padding: 4px;
+    }
     article {
         overflow: auto;
     }