From f3aff26086dda1c2610c9aa845db119ad413006f Mon Sep 17 00:00:00 2001
From: mrpaulblack <paul@paulgo.io>
Date: Sun, 21 Nov 2021 21:38:00 +0100
Subject: =?UTF-8?q?[simple=20theme]=20rework=20select;=20add=20safesearch?=
 =?UTF-8?q?=20to=20search=20and=20replace=20/=20with=20=E2=80=BA=20in=20ar?=
 =?UTF-8?q?ticle=20url?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* rework selection UI in pref (fix based on: https://github.com/twelsby/searx/commit/78643e9f43a103c523f112e9f3ce26a5c7bb3a0f)
* moved search filters underneath categories
* cut params from url and replace / with ›
* make h3 and url in article bigger
* add safe search select to search filter (this will not override settings and only be valid while on result page in a session)
* make search form button not overlap each other when js is disabled
* 1rem padding around preview image and thumbnail in default article template
---
 searx/templates/simple/categories.html         |  2 +-
 searx/templates/simple/filters/languages.html  |  8 ++++++++
 searx/templates/simple/filters/safesearch.html |  5 +++++
 searx/templates/simple/filters/time_range.html | 17 ++++++++++++++++
 searx/templates/simple/languages.html          |  8 --------
 searx/templates/simple/macros.html             |  6 +++++-
 searx/templates/simple/search.html             | 28 +++++++++++++-------------
 searx/templates/simple/simple_search.html      |  6 +++---
 searx/templates/simple/time-range.html         | 17 ----------------
 9 files changed, 53 insertions(+), 44 deletions(-)
 create mode 100644 searx/templates/simple/filters/languages.html
 create mode 100644 searx/templates/simple/filters/safesearch.html
 create mode 100644 searx/templates/simple/filters/time_range.html
 delete mode 100644 searx/templates/simple/languages.html
 delete mode 100644 searx/templates/simple/time-range.html

(limited to 'searx/templates/simple')

diff --git a/searx/templates/simple/categories.html b/searx/templates/simple/categories.html
index 29616f127..ae8b2ec09 100644
--- a/searx/templates/simple/categories.html
+++ b/searx/templates/simple/categories.html
@@ -13,6 +13,7 @@
 }  -%}
 <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 -%}
         <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">
@@ -21,6 +22,5 @@
             </label>
         </div>
         {%- endfor -%}
-        {%- if display_tooltip %}<div class="help">{{ _('Click on the magnifier to perform search') }}</div>{% endif -%}
     </div>{{- '' -}}
 </div>
diff --git a/searx/templates/simple/filters/languages.html b/searx/templates/simple/filters/languages.html
new file mode 100644
index 000000000..710c18c92
--- /dev/null
+++ b/searx/templates/simple/filters/languages.html
@@ -0,0 +1,8 @@
+<select class="language" id="language" name="language" tabindex="1">{{- '' -}}
+	<option value="all" {% if current_language == 'all' %}selected="selected"{% endif %}>{{ _('Default language') }}</option>
+	{%- for lang_id,lang_name,country_name,english_name in language_codes | sort(attribute=1) -%}
+	<option value="{{ lang_id }}" {% if lang_id == current_language %}selected="selected"{% endif %}>
+		{{- lang_name }} {% if country_name %}({{ country_name }}) {% endif %}- {{ lang_id -}}
+	</option>
+	{%- endfor -%}
+</select>
diff --git a/searx/templates/simple/filters/safesearch.html b/searx/templates/simple/filters/safesearch.html
new file mode 100644
index 000000000..a146e6710
--- /dev/null
+++ b/searx/templates/simple/filters/safesearch.html
@@ -0,0 +1,5 @@
+<select  name="safesearch" id="safesearch" class="safesearch" tabindex="3">
+    <option value="2" {% if safesearch == '2' %}selected="selected"{% endif %}>{{ _("SafeSearch") + ": " + _('Strict') }}</option>
+    <option value="1" {% if safesearch == '1' %}selected="selected"{% endif %}>{{ _("SafeSearch") + ": " + _('Moderate') }}</option>
+    <option value="0" {% if safesearch == '0' %}selected="selected"{% endif %}>{{ _("SafeSearch") + ": " + _('None') }}</option>
+</select>
diff --git a/searx/templates/simple/filters/time_range.html b/searx/templates/simple/filters/time_range.html
new file mode 100644
index 000000000..2c85edf92
--- /dev/null
+++ b/searx/templates/simple/filters/time_range.html
@@ -0,0 +1,17 @@
+<select name="time_range" id="time_range" class="time_range" tabindex="2">{{- '' -}}
+    <option id="time-range-anytime" value="" {{ "selected" if time_range=="" or not time_range  else ""}}>
+        {{- _('Anytime') -}}
+    </option>{{- '' -}}
+    <option id="time-range-day" value="day" {{ "selected" if time_range=="day" else ""}}>
+        {{- _('Last day') -}}
+    </option>{{- '' -}}
+    <option id="time-range-week" value="week" {{ "selected" if time_range=="week" else ""}}>
+        {{- _('Last week') -}}
+    </option>{{- '' -}}
+    <option id="time-range-month" value="month" {{ "selected" if time_range=="month" else ""}}>
+        {{- _('Last month') -}}
+    </option>{{- '' -}}
+    <option id="time-range-year" value="year" {{ "selected" if time_range=="year" else ""}}>
+        {{- _('Last year') -}}
+    </option>{{- '' -}}
+</select>
diff --git a/searx/templates/simple/languages.html b/searx/templates/simple/languages.html
deleted file mode 100644
index dd928ff68..000000000
--- a/searx/templates/simple/languages.html
+++ /dev/null
@@ -1,8 +0,0 @@
-<select class="language" id="language" name="language" tabindex="2">{{- '' -}}
-	<option value="all" {% if current_language == 'all' %}selected="selected"{% endif %}>{{ _('Default language') }}</option>
-	{%- for lang_id,lang_name,country_name,english_name in language_codes | sort(attribute=1) -%}
-	<option value="{{ lang_id }}" {% if lang_id == current_language %}selected="selected"{% endif %}>
-		{{- lang_name }} {% if country_name %}({{ country_name }}) {% endif %}- {{ lang_id -}}
-	</option>
-	{%- endfor -%}
-</select>
diff --git a/searx/templates/simple/macros.html b/searx/templates/simple/macros.html
index 26aa71891..7a3a4ff9f 100644
--- a/searx/templates/simple/macros.html
+++ b/searx/templates/simple/macros.html
@@ -18,7 +18,11 @@
 <!-- Draw result header -->
 {% macro result_header(result, favicons, image_proxify) -%}
 <article class="result {% if result['template'] %}result-{{ result.template|replace('.html', '') }}{% else %}result-default{% endif %} {% if result['category'] %}category-{{ result['category'] }}{% endif %}{% for e in result.engines %} {{ e }}{% endfor %}">
-  <p class="url">{{ result_link(result.url, result.pretty_url, 'url') }}</p>
+  {{- result_open_link(result.url, "url_wrapper") -}}
+  {%- for part in get_pretty_url(result.parsed_url) -%}
+  <span class="url_o{{loop.index}}"><span class="url_i{{loop.index}}">{{- part -}}</span></span>
+  {%- endfor %}
+  {{- result_close_link() -}}
   {%- if result.img_src %}{{ result_open_link(result.url) }}<img class="image" src="{{ image_proxify(result.img_src) }}" alt="{{ result.title|striptags }}" title="{{ result.title|striptags }}" class="image" />{{ result_close_link() }}{% endif -%}
   {%- if result.thumbnail %}{{ result_open_link(result.url) }}<img class="thumbnail" src="{{ image_proxify(result.thumbnail) }}" title="{{ result.title|striptags }}" alt="{{ result.title|striptags }}"/>{{ result_close_link() }}{% endif -%}
   <h3>{{ result_link(result.url, result.title|safe) }}</h3>
diff --git a/searx/templates/simple/search.html b/searx/templates/simple/search.html
index c231d7b35..1df55e782 100644
--- a/searx/templates/simple/search.html
+++ b/searx/templates/simple/search.html
@@ -1,22 +1,22 @@
 <form id="search" method="{{ method or 'POST' }}" action="{{ url_for('search') }}">
-  <a id="search_logo" href="{{ url_for('index') }}">
-    <span hidden>SearXNG</span>
-    {% include '__common__/searxng-wordmark.min.svg' without context %}
-  </a>
-  <div id="search_wrapper">
+  <div id="search_header">
+    <a id="search_logo" href="{{ url_for('index') }}">
+      <span hidden>SearXNG</span>
+      {% include '__common__/searxng-wordmark.min.svg' without context %}
+    </a>
     <div class="search_box">
       <input id="q" autofocus name="q" type="text" placeholder="{{ _('Search for...') }}" tabindex="1" autocomplete="off" spellcheck="false" dir="auto" {% if q %}value="{{ q }}"{% endif %} >
-      <button id="clear_search" type="button" tabindex="-1"><span class="hide_if_nojs">{{ icon_big('close') }}</span><span class="show_if_nojs">{{ _('Clear search') }}</span></button>
-      <button id="send_search" type="submit" tabindex="-1"><span class="hide_if_nojs">{{ icon_big('search-outline') }}</span><span class="show_if_nojs">{{ _('Start search') }}</span></button>
-    </div>
-    <div class="search_filters">
-      {% include 'simple/languages.html' %}
-      {% include 'simple/time-range.html' %}
+      <button id="clear_search" type="button" tabindex="-1"><span class="hide_if_nojs">{{ icon_big('close') }}</span><span class="show_if_nojs">{{ _('clear') }}</span></button>
+      <button id="send_search" type="submit" tabindex="-1"><span class="hide_if_nojs">{{ icon_big('search-outline') }}</span><span class="show_if_nojs">{{ _('search') }}</span></button>
     </div>
+    {% set display_tooltip = true %}
+    {% include 'simple/categories.html' %}
+  </div>
+  <div class="search_filters">
+    {% include 'simple/filters/languages.html' %}
+    {% include 'simple/filters/time_range.html' %}
+    {% include 'simple/filters/safesearch.html' %}
   </div>
-  {% set display_tooltip = true %}
-  {% include 'simple/categories.html' %}
-  <input type="hidden" name="safesearch" value="{{ safesearch }}" >
   <input type="hidden" name="theme" value="{{ theme }}" >
   {% if timeout_limit %}<input type="hidden" name="timeout_limit" value="{{ timeout_limit|e }}" >{% endif %}
 </form>
diff --git a/searx/templates/simple/simple_search.html b/searx/templates/simple/simple_search.html
index 8612ceca6..6a5cdd9e7 100644
--- a/searx/templates/simple/simple_search.html
+++ b/searx/templates/simple/simple_search.html
@@ -1,9 +1,9 @@
 <form id="search" method="{{ method or 'POST' }}" action="{{ url_for('search') }}">
-  <div id="search_wrapper">
+  <div id="search_header">
     <div class="search_box">
       <input id="q" autofocus name="q" type="text" placeholder="{{ _('Search for...') }}" tabindex="1" autocomplete="off" spellcheck="false" dir="auto" {% if q %}value="{{ q }}"{% endif %} >
-      <button id="clear_search" type="button" tabindex="-1"><span class="hide_if_nojs">{{ icon_big('close') }}</span><span class="show_if_nojs">{{ _('Clear search') }}</span></button>
-      <button id="send_search" type="submit" tabindex="-1"><span class="hide_if_nojs">{{ icon_big('search-outline') }}</span><span class="show_if_nojs">{{ _('Start search') }}</span></button>
+      <button id="clear_search" type="button" tabindex="-1"><span class="hide_if_nojs">{{ icon_big('close') }}</span><span class="show_if_nojs">{{ _('clear') }}</span></button>
+      <button id="send_search" type="submit" tabindex="-1"><span class="hide_if_nojs">{{ icon_big('search-outline') }}</span><span class="show_if_nojs">{{ _('search') }}</span></button>
     </div>
   </div>
 </form>
diff --git a/searx/templates/simple/time-range.html b/searx/templates/simple/time-range.html
deleted file mode 100644
index a9fc9f165..000000000
--- a/searx/templates/simple/time-range.html
+++ /dev/null
@@ -1,17 +0,0 @@
-<select name="time_range" id="time_range" class="time_range" tabindex="3">{{- '' -}}
-    <option id="time-range-anytime" value="" {{ "selected" if time_range=="" or not time_range  else ""}}>
-        {{- _('Anytime') -}}
-    </option>{{- '' -}}
-    <option id="time-range-day" value="day" {{ "selected" if time_range=="day" else ""}}>
-        {{- _('Last day') -}}
-    </option>{{- '' -}}
-    <option id="time-range-week" value="week" {{ "selected" if time_range=="week" else ""}}>
-        {{- _('Last week') -}}
-    </option>{{- '' -}}
-    <option id="time-range-month" value="month" {{ "selected" if time_range=="month" else ""}}>
-        {{- _('Last month') -}}
-    </option>{{- '' -}}
-    <option id="time-range-year" value="year" {{ "selected" if time_range=="year" else ""}}>
-        {{- _('Last year') -}}
-    </option>{{- '' -}}
-</select>
-- 
cgit v1.2.3