From e435806505d58f3ad77223dcafee2f99ca427e00 Mon Sep 17 00:00:00 2001
From: Alexandre Flament <alex@al-f.net>
Date: Sun, 27 Feb 2022 11:27:25 +0100
Subject: [fix] simple: detect touch screen using media query

related to https://github.com/searxng/searxng/issues/928
---
 searx/static/themes/simple/src/less/search.less | 36 ++++++++++++-------------
 1 file changed, 18 insertions(+), 18 deletions(-)

(limited to 'searx/static/themes/simple/src/less')

diff --git a/searx/static/themes/simple/src/less/search.less b/searx/static/themes/simple/src/less/search.less
index 3e18e0b12..dff7bd612 100644
--- a/searx/static/themes/simple/src/less/search.less
+++ b/searx/static/themes/simple/src/less/search.less
@@ -200,26 +200,26 @@
       margin-top: 2px;
     }
   }
+}
 
-  html.touch {
-    #main_index,
-    #main_results {
-      #categories_container {
-        width: max-content;
+@media screen and (max-width: @tablet) and (hover: none) {
+  #main_index,
+  #main_results {
+    #categories_container {
+      width: max-content;
 
-        .category {
-          display: inline-block;
-          width: auto;
-        }
+      .category {
+        display: inline-block;
+        width: auto;
       }
+    }
 
-      #categories {
-        width: 100%;
-        .ltr-text-align-left();
-        overflow-x: scroll;
-        overflow-y: hidden;
-        -webkit-overflow-scrolling: touch;
-      }
+    #categories {
+      width: 100%;
+      .ltr-text-align-left();
+      overflow-x: scroll;
+      overflow-y: hidden;
+      -webkit-overflow-scrolling: touch;
     }
   }
 }
@@ -262,8 +262,8 @@
   }
 
   .category {
-    display: block;
-    width: 100%;
+    display: inline-block;
+    width: auto;
     margin: 0;
 
     label {
-- 
cgit v1.2.3