From a12b03ad6bd03014f373570d66cfe58de1069915 Mon Sep 17 00:00:00 2001
From: Deepjyoti Barman <deep.barman30@gmail.com>
Date: Sat, 24 Apr 2021 18:33:02 +0530
Subject: [PATCH] Add function to update the autocomplete highlight color

---
 config.json |  3 ++-
 js/main.js  | 23 +++++++++++++++++++++++
 2 files changed, 25 insertions(+), 1 deletion(-)

diff --git a/config.json b/config.json
index 7431208..f6df028 100644
--- a/config.json
+++ b/config.json
@@ -57,7 +57,8 @@
     "searchColor": "#fff",
     "searchBackgroundColor": "#2e2e2e",
     "squareColor": "#9e9e9e",
-    "squareBackgroundColor": "#2e2e2e"
+    "squareBackgroundColor": "#2e2e2e",
+    "autocompleteHighlightBackgroundColor": "#3B3B3B"
   },
   "backgroundColor": "#212121"
 }
diff --git a/js/main.js b/js/main.js
index ce8f291..504a16c 100644
--- a/js/main.js
+++ b/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) {
     /**