[web] style start menu

3 files changed, 18 insertions, 4 deletions

diff --git a/web/src/css/header.less b/web/src/css/header.less
index 90907ec7..c90e91c4 100644
--- a/web/src/css/header.less
+++ b/web/src/css/header.less
@@ -57,10 +57,24 @@ header {
 @menu-main-gutter-width: 5px;
 .menu-main {
     .make-row(@menu-main-gutter-width);
+    padding: 2px 5px;
 }
 
 .filter-input {
-    .make-sm-column(4, @menu-main-gutter-width);
+    .make-sm-column(5, @menu-main-gutter-width);
+    padding: 2.5px;
+
+    @media (max-width: @screen-xs-max) {
+
+        padding: 2px 2.5px;
+
+        >.form-control,> .input-group-addon, > .input-group-btn>.btn {
+          height: 23.5px;
+          padding: 1px 5px;
+          font-size: 12px;
+          line-height: 1.5;
+        }
+    }
 }
 
 .filter-input .popover {
diff --git a/web/src/js/components/Header/FilterDocs.jsx b/web/src/js/components/Header/FilterDocs.jsx
index c237e230..49fb5fbc 100644
--- a/web/src/js/components/Header/FilterDocs.jsx
+++ b/web/src/js/components/Header/FilterDocs.jsx
@@ -47,7 +47,7 @@ export default class FilterDocs extends Component {
                             <a href="http://docs.mitmproxy.org/en/stable/features/filters.html"
                                 target="_blank">
                                 <i className="fa fa-external-link"></i>
-                            &nbsp mitmproxy docs</a>
+                            &nbsp; mitmproxy docs</a>
                         </td>
                     </tr>
                 </tbody>
diff --git a/web/src/js/ducks/ui/header.js b/web/src/js/ducks/ui/header.js
index 1eff3ef6..25dfe602 100644
--- a/web/src/js/ducks/ui/header.js
+++ b/web/src/js/ducks/ui/header.js
@@ -4,7 +4,7 @@ export const SET_ACTIVE_MENU = 'UI_SET_ACTIVE_MENU'
 
 
 const defaultState = {
-    activeMenu: 'Options',
+    activeMenu: 'Start',
     isFlowSelected: false,
 }
 
@@ -22,7 +22,7 @@ export default function reducer(state = defaultState, action) {
             if (action.flowIds.length && !state.isFlowSelected) {
                 return {
                     ...state,
-                    activeMenu: 'Options',
+                    activeMenu: 'Flow',
                     isFlowSelected: true,
                 }
             }