polish: polish footer and header

Author: xuechunL

Diff for: src/less/footer.less

@@ -161,8 +161,12 @@
 
 //iPhone4、iPhone5、iPhone6
 @media (max-width: 600px) {
-  .footer .qr_code_outer {
-    left: 45%;
-    margin-top: -50%;
+  // .footer .qr_code_outer {
+  //   left: 45%;
+  //   margin-top: -50%;
+  // }
+  // TODO: sidebar
+  .footer {
+    display: none;
   }
 }

Diff for: src/less/header.less

@@ -338,7 +338,6 @@ nav.mobile-sidebar {
 @media only screen and (max-width: 600px) {
   .header {
     .container {
-      padding: 5px;
       justify-content: space-between;
     }
     .nav-brand {
@@ -350,17 +349,29 @@ nav.mobile-sidebar {
   }
 
   .nav-btn {
+    text-align: center;
     background-color: rgba(0, 0, 0, 0.175);
   }
 }
 
-@media only screen and (max-width: 360px) {
+@media only screen and (max-width: 375px) {
   .header {
     .nav-brand {
       height: 24px;
     }
     .search-wrapper {
-      width: 10rem;
+      width: 11rem;
+    }
+  }
+}
+
+@media only screen and (max-width: 320px) {
+  .header {
+    .nav-brand {
+      height: 22px;
+    }
+    .search-wrapper {
+      width: 9rem;
     }
   }
 }