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/static/themes/simple/src/less/style.less | 58 ++++++++++++++++++--------
 1 file changed, 41 insertions(+), 17 deletions(-)

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

diff --git a/searx/static/themes/simple/src/less/style.less b/searx/static/themes/simple/src/less/style.less
index a26c57db1..a5c050f20 100644
--- a/searx/static/themes/simple/src/less/style.less
+++ b/searx/static/themes/simple/src/less/style.less
@@ -168,7 +168,7 @@ article[data-vim-selected].category-social {
   border-left: 0.2rem solid transparent;
 
   h3 {
-    font-size: 1.1em;
+    font-size: 1.2rem;
     word-wrap: break-word;
     margin: 0.4rem 0 0.4rem 0;
     padding: 0;
@@ -221,13 +221,39 @@ article[data-vim-selected].category-social {
     }
   }
 
-  .url {
-    font-size: 0.96em;
-    margin: 0 0 3px 0;
-    padding: 0;
-    max-width: 54em;
-    word-wrap: break-word;
+  .url_wrapper {
+    display: flex;
+    font-size: 1rem;
     color: var(--color-result-url-font);
+    flex-wrap: nowrap;
+    overflow: hidden;
+    flex-direction: row;
+    margin: 0;
+    padding: 0;
+
+    .url_o1 {
+      white-space: nowrap;
+      flex-shrink: 1;
+    }
+
+    .url_o1::after {
+      content: " ";
+      width: 1ch;
+      display: inline-block;
+    }
+
+    .url_o2 {
+      overflow: hidden;
+      white-space: nowrap;
+      flex-basis: content;
+      flex-grow: 0;
+      flex-shrink: 1;
+      text-align: right;
+
+      .url_i2 {
+        float: right;
+      }
+    }
   }
 
   .published_date {
@@ -238,17 +264,15 @@ article[data-vim-selected].category-social {
   img {
     &.thumbnail {
       float: left;
-      padding: 0 5px 10px 0;
-      width: 20em;
-      min-width: 20em;
-      min-height: 8em;
+      padding: 0.6rem 1rem 0 0;
+      width: 20rem;
     }
 
     &.image {
       float: left;
-      padding: 0 5px 10px 0;
-      width: 100px;
-      max-height: 100px;
+      padding: 0.6rem 1rem 0 0;
+      width: 7rem;
+      max-height: 7rem;
       object-fit: scale-down;
       object-position: right top;
     }
@@ -367,7 +391,7 @@ article[data-vim-selected].category-social {
 }
 
 #results {
-  margin: 2rem 2rem 0 @results-offset;
+  margin: 1rem 2rem 0 @results-offset;
   display: grid;
   grid-template-columns: @results-width 25rem;
   grid-template-rows: min-content min-content 1fr min-content;
@@ -686,7 +710,7 @@ article[data-vim-selected].category-social {
   }
 
   #main_results div#results {
-    margin: 2rem auto 0 auto;
+    margin: 1rem auto 0 auto;
     justify-content: center;
     display: grid;
     grid-template-columns: @results-width;
@@ -702,7 +726,7 @@ article[data-vim-selected].category-social {
 }
 
 #main_results div#results.only_template_images {
-  margin: 2rem @results-tablet-offset 0 @results-tablet-offset;
+  margin: 1rem @results-tablet-offset 0 @results-tablet-offset;
   display: grid;
   grid-template-columns: 100%;
   grid-template-rows: min-content min-content 1fr min-content min-content;
-- 
cgit v1.2.3