mirrors/searxng
1
0
Fork 0
mirror of https://github.com/searxng/searxng.git synced 2024-12-23 01:36:29 +00:00
Code Issues Projects Releases Wiki Activity

[fix] simple: detect touch screen using media query

Browse source 
related to https://github.com/searxng/searxng/issues/928
This commit is contained in:
Alexandre Flament 2022-02-27 11:27:25 +01:00
parent afde954df8
commit e435806505
2 changed files with 18 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
searx/static/themes/simple/src/js/head/00_init.js
View file

@ -4,7 +4,6 @@
* (C) Copyright Contributors to the searx project (2014 - 2021). * (C) Copyright Contributors to the searx project (2014 - 2021).
* SPDX-License-Identifier: AGPL-3.0-or-later * SPDX-License-Identifier: AGPL-3.0-or-later
*/ */
/* global DocumentTouch:readonly */
(function (w, d) { (function (w, d) {
'use strict'; 'use strict';
@ -16,7 +15,6 @@
// try to detect touch screen // try to detect touch screen
w.searxng = { w.searxng = {
touch: (("ontouchstart" in w) || w.DocumentTouch && document instanceof DocumentTouch) || false,
method: script.getAttribute('data-method'), method: script.getAttribute('data-method'),
autocompleter: script.getAttribute('data-autocompleter') === 'true', autocompleter: script.getAttribute('data-autocompleter') === 'true',
search_on_category_select: script.getAttribute('data-search-on-category-select') === 'true', search_on_category_select: script.getAttribute('data-search-on-category-select') === 'true',
@ -34,7 +32,4 @@
var hmtlElement = d.getElementsByTagName("html")[0]; var hmtlElement = d.getElementsByTagName("html")[0];
hmtlElement.classList.remove('no-js'); hmtlElement.classList.remove('no-js');
hmtlElement.classList.add('js'); hmtlElement.classList.add('js');
if (w.searxng.touch) {
hmtlElement.classList.add('touch');
}
})(window, document); })(window, document);

36
searx/static/themes/simple/src/less/search.less
View file

@ -200,26 +200,26 @@
margin-top: 2px; margin-top: 2px;
} }
} }
}
html.touch { @media screen and (max-width: @tablet) and (hover: none) {
#main_index, #main_index,
#main_results { #main_results {
#categories_container { #categories_container {
width: max-content; width: max-content;
.category { .category {
display: inline-block; display: inline-block;
width: auto; width: auto;
}
} }
}
#categories { #categories {
width: 100%; width: 100%;
.ltr-text-align-left(); .ltr-text-align-left();
overflow-x: scroll; overflow-x: scroll;
overflow-y: hidden; overflow-y: hidden;
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
}
} }
} }
} }
@ -262,8 +262,8 @@
} }
.category { .category {
display: block; display: inline-block;
width: 100%; width: auto;
margin: 0; margin: 0;
label { label {