Search style

Author: josevalim

assets/css/autocomplete.css

@@ -48,7 +48,7 @@
 
 .autocomplete-container {
   position: absolute;
-  top: 15px;
+  top: 5px;
   width: 100%;
   z-index: 200;
 }

assets/css/search-bar.css

@@ -102,13 +102,14 @@
 
 .top-search .search-settings .engine-dropdown {
   position: absolute;
-  top: calc(100% + 4px);
+  top: calc(100% + 10px);
   right: 0;
   min-width: 200px;
+  max-width: 50vh;
+  width: max-content;
   background-color: var(--autocompleteBackground);
   border-radius: var(--borderRadius-base);
   box-shadow: 0px 8px 24px 0px var(--autocompleteBorder);
-  padding: 4px;
   z-index: 200;
 }
 
@@ -121,16 +122,20 @@
   width: 100%;
   text-align: left;
   background-color: transparent;
-  border: none;
-  border-radius: var(--borderRadius-base);
+  border: 0;
   color: var(--textHeaders);
   cursor: pointer;
-  padding: 8px 12px;
+  padding: 10px 12px;
   transition: var(--transition-colors);
 }
 
-.top-search .search-settings .engine-option:hover,
+.top-search .search-settings .engine-option:hover {
+  background-color: var(--autocompleteHover);
+}
+
 .top-search .search-settings .engine-option:focus {
+  border-left: 2px solid var(--main);
+  padding-left: 10px;
   background-color: var(--autocompleteHover);
   outline: none;
 }