Add function to update the autocomplete highlight color

config.json

@@ -57,7 +57,8 @@
     "searchColor": "#fff",
     "searchBackgroundColor": "#2e2e2e",
     "squareColor": "#9e9e9e",
-    "squareBackgroundColor": "#2e2e2e"
+    "squareBackgroundColor": "#2e2e2e",
+    "autocompleteHighlightBackgroundColor": "#3B3B3B"
   },
   "backgroundColor": "#212121"
 }

js/main.js

@@ -285,6 +285,9 @@ function parseAndCreate(jsonData) {
         if (styleData["searchPlaceholderColor"]) {
             document.getElementById(searchBarId).classList.add(createPlaceholderStyleClass(styleData["searchPlaceholderColor"]));
         }
+        if (styleData["autocompleteHighlightBackgroundColor"]) {
+            addAutocompleteStyleClass(styleData["autocompleteHighlightBackgroundColor"]);
+        }
         if (styleData["squareBackgroundColor"]) {
             elements = document.getElementsByClassName("sqr")
             var i;
@@ -471,6 +474,26 @@ function createPlaceholderStyleClass(color) {
     return newClassName;
 }
 
+function addAutocompleteStyleClass(color) {
+    /**
+     * Add some colors for the autocomplete classes in order to
+     * keep. We need to add styles for :hover property so it is
+     * easier to just inject some CSS.
+     */
+    var style = document.createElement("style");
+    style.type = "text/css";
+    style.innerHTML = `
+    .autocomplete-item:hover {
+        background: ${color} !important;
+    }
+
+    .autocomplete-active {
+        background: ${color} !important;
+    }
+    `;
+    document.getElementsByTagName('head')[0].appendChild(style);
+}
+
 
 function extractQuickLinks(passedSqrs, style) {
     /**