when focus is on search, dont highlight menu

Author: Erik2609

layouts/index.html

@@ -20,11 +20,13 @@
     width: 100%;
     height: 200vh;
     background-color: rgba(0, 0, 0, 0.35);
-    z-index: 1000;
+    z-index: 11000;
   }
 
   .algolia-search {
-    z-index: 5000;
+    &.isfocused {
+      z-index: 12000;
+    }
     position: relative;
     .search-panel {
       display: block;
@@ -217,6 +219,7 @@ <h3 class="color-blue search-result-title">${item._highlightResult.title.value}<
   docReady(function () {
     $("input.ais-SearchBox-input").on("focus", function () {
       $(".algolia-search").addClass("bg-lightblue");
+      $(".algolia-search").addClass("isfocused");
       $("#hits").addClass("d-block");
       $("#hits").removeClass("d-none");
       $(".search-overlay").removeClass("d-none");
@@ -225,6 +228,7 @@ <h3 class="color-blue search-result-title">${item._highlightResult.title.value}<
 
     $(".search-overlay").on("click", function () {
       $(".algolia-search").removeClass("bg-lightblue");
+      $(".algolia-search").removeClass("isfocused");
       $("#hits").removeClass("d-block");
       $("#hits").addClass("d-none");
       $(".search-overlay").addClass("d-none");