style: UI improvements to searchbar (#989)

* Clean up responsive search overrides

* Add responsive improvements to searchbar fixes #988, fixes #385

v1/lib/static/css/main.css

@@ -938,7 +938,9 @@ input#search_input_react:active {
  color: #fff;
  width: 220px;
 }
-
+.navigationSlider .slidingNav .navSearchWrapper .algolia-docsearch-footer a {
+ height: auto;
+}
 @media only screen and (max-width: 735px) {
  .navSearchWrapper {
  width: 40%;
@@ -1383,19 +1385,20 @@ input::placeholder {
  }
 
  .reactNavSearchWrapper .aa-dropdown-menu {
- background: #f9f9f9;
- border: 0px solid #f9f9f9;
- border-radius: 0;
- color: #393939;
  font-size: 12px;
  line-height: 2em;
- max-height: 140px;
- min-width: auto;
+ padding: 0;
+ border-width: 1px;
+ min-width: 500px;
+ }
+ .reactNavSearchWrapper .algolia-docsearch-suggestion__secondary {
+ border-top: none;
+ }
+ .aa-suggestions {
+ min-height: 140px;
+ max-height: 60vh;
  -webkit-overflow-scrolling: touch;
  overflow-y: scroll;
- padding: 0;
- position: relative !important;
- width: 100%;
  }
 
  #languages-dropdown {
@@ -1478,6 +1481,14 @@ input::placeholder {
  .navigationSlider .slidingNav ul::-webkit-scrollbar {
  display: none;
  }
+ .reactNavSearchWrapper .aa-dropdown-menu {
+ min-width: 400px;
+ }
+}
+@media only screen and (max-width: 475px) {
+ .reactNavSearchWrapper .aa-dropdown-menu {
+ min-width: 300px;
+ }
 }
 
 /* Start of Docs Main */