Fixing disappearing hamburger menu for narrow screens (#3929)

* Made top search bar more scalable for (physically) narrow screens

Removing `flex: auto` on `.top-left-block` for screens narrower than
`350px`allows the search bar to resize to fill up the remaining space.
Setting `width: 70px` on `#typeahead-container input` for mobile widths
prevents the hamburger button from being squished at certain widths.
Given that the padding adds up to `50px`, setting what amounts to the
minimum width of the search field to `70px` seems reasonable.

Fixes #3199.

* Making hamburger button margin and spacing narrower for mobile

The clickable area is restricted to the icon anyway, and the extra space
benefits the search field width on narrow screens.

1 files changed, 1 insertions, 1 deletions

diff --git a/client/src/app/header/search-typeahead.component.scss b/client/src/app/header/search-typeahead.component.scss
index f8d68e986..a60aa38d6 100644
--- a/client/src/app/header/search-typeahead.component.scss
+++ b/client/src/app/header/search-typeahead.component.scss
@@ -86,7 +86,7 @@ li.suggestion {
     flex: 1;
 
     input {
-      width: unset;
+      width: 70px;
     }
   }