From 56bb1443c4e6f305e86829e5b4596395fc29336e Mon Sep 17 00:00:00 2001
From: Alexandre Flament <alex@al-f.net>
Date: Sun, 27 Feb 2022 19:48:21 +0100
Subject: [PATCH] [fix] simple: display "Click on the magnifier..." only the
 mouse over the categories

---
 searx/static/themes/simple/src/less/search.less | 14 ++++++++++++++
 searx/templates/simple/categories.html          |  2 +-
 2 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/searx/static/themes/simple/src/less/search.less b/searx/static/themes/simple/src/less/search.less
index dff7bd61..a9a00d58 100644
--- a/searx/static/themes/simple/src/less/search.less
+++ b/searx/static/themes/simple/src/less/search.less
@@ -73,6 +73,20 @@
 
 .search_categories {
   grid-area: categories;
+
+  .help {
+    display: none;
+  }
+
+  &:hover .help {
+    display: block;
+    position: absolute;
+    background: var(--color-base-background);
+    padding: 1rem 0.6rem 0.6rem 0;
+    z-index: 1000;
+    width: 100%;
+    left: -0.1rem;
+  }
 }
 
 .search_box {
diff --git a/searx/templates/simple/categories.html b/searx/templates/simple/categories.html
index 71a21190..cee9f1e3 100644
--- a/searx/templates/simple/categories.html
+++ b/searx/templates/simple/categories.html
@@ -13,7 +13,6 @@
 }  -%}
 <div id="categories" class="search_categories">{{- '' -}}
     <div id="categories_container">
-        {%- if display_tooltip %}<div class="help">{{ _('Click on the magnifier to perform search') }}</div>{% endif -%}
         {%- for category in categories_as_tabs -%}
         <div class="category"><input type="checkbox" id="checkbox_{{ category|replace(' ', '_') }}" name="category_{{ category }}"{% if category in selected_categories %} checked="checked"{% endif %}/>
             <label for="checkbox_{{ category|replace(' ', '_') }}" class="tooltips">
@@ -22,5 +21,6 @@
             </label>
         </div>
         {%- endfor -%}
+        {%- if display_tooltip %}<div class="help">{{ _('Click on the magnifier to perform search') }}</div>{% endif -%}
     </div>{{- '' -}}
 </div>