[chore] stylelint: fix reported errors

searx/static/themes/simple/src/less/definitions.less

@@ -85,8 +85,8 @@
   --color-result-detail-background: #242424;
   --color-result-detail-hr: #555;
   --color-result-detail-link: #8af;
-  --color-result-detail-loader-border: rgba(255, 255, 255, 0.2);
-  --color-result-detail-loader-borderleft: rgba(0, 0, 0, 0);
+  --color-result-detail-loader-border: rgb(255 255 255 / 20%);
+  --color-result-detail-loader-borderleft: rgb(0 0 0 / 0%);
   /// Toolkit Colors
   --color-toolkit-badge-font: #fff;
   --color-toolkit-badge-background: #545454;
@@ -111,16 +111,16 @@
   --color-toolkit-checkbox-input-border: #3050ff;
   --color-toolkit-engine-tooltip-border: #ddd;
   --color-toolkit-engine-tooltip-background: #fff;
-  --color-toolkit-loader-border: rgba(0, 0, 0, 0.2);
-  --color-toolkit-loader-borderleft: rgba(255, 255, 255, 0);
+  --color-toolkit-loader-border: rgb(0 0 0 / 20%);
+  --color-toolkit-loader-borderleft: rgb(255 255 255 / 0%);
   --color-doc-code: #003;
   --color-doc-code-background: #ddeaff;
   /// Other misc colors
   --color-bar-chart-primary: #5bc0de;
   --color-bar-chart-secondary: #deb15b;
-  --color-image-resolution-background: rgba(0, 0, 0, 50%);
+  --color-image-resolution-background: rgb(0 0 0 / 50%);
   --color-image-resolution-font: #fff;
-  --color-loading-indicator: rgba(255, 255, 255, 0.2);
+  --color-loading-indicator: rgb(255 255 255 / 20%);
   --color-loading-indicator-gap: #fff;
   --color-line-number: #64708d;
   // Favicons Colors
@@ -200,8 +200,8 @@
   --color-result-detail-background: #1a1a1c;
   --color-result-detail-hr: #555;
   --color-result-detail-link: #8af;
-  --color-result-detail-loader-border: rgba(255, 255, 255, 0.2);
-  --color-result-detail-loader-borderleft: rgba(0, 0, 0, 0);
+  --color-result-detail-loader-border: rgb(255 255 255 / 20%);
+  --color-result-detail-loader-borderleft: rgb(0 0 0 / 0%);
   // Images Colors
   --color-result-image-span-font: #bbb;
   --color-result-image-span-font-selected: #222;
@@ -234,8 +234,8 @@
   --color-toolkit-checkbox-input-border: #58f;
   --color-toolkit-engine-tooltip-border: #333;
   --color-toolkit-engine-tooltip-background: #222;
-  --color-toolkit-loader-border: rgba(255, 255, 255, 0.2);
-  --color-toolkit-loader-borderleft: rgba(0, 0, 0, 0);
+  --color-toolkit-loader-border: rgb(255 255 255 / 20%);
+  --color-toolkit-loader-borderleft: rgb(0 0 0 / 0%);
   --color-doc-code: #ddd;
   --color-doc-code-background: #4d5a6f;
   // Favicons Colors

searx/static/themes/simple/src/less/detail.less

@@ -93,8 +93,7 @@ article.result-images .detail {
 
     p.result-url {
       white-space: nowrap;
-      overflow-x: hidden;
-      overflow-y: hidden;
+      overflow: hidden hidden;
       text-overflow: ellipsis;
     }
 

searx/static/themes/simple/src/less/search.less

@@ -15,8 +15,7 @@
   background: var(--color-header-background);
   border-bottom: 1px solid var(--color-header-border);
   display: grid;
-  column-gap: 1.2rem;
-  row-gap: 1rem;
+  gap: 1rem 1.2rem;
   grid-template-columns: 3rem 1fr;
   grid-template-areas:
     "logo search"
@@ -268,8 +267,7 @@ html.no-js #clear_search.hide_if_nojs {
     #categories {
       width: 100%;
       .ltr-text-align-left();
-      overflow-x: scroll;
-      overflow-y: hidden;
+      overflow: scroll hidden;
       -webkit-overflow-scrolling: touch;
     }
   }
@@ -280,8 +278,7 @@ html.no-js #clear_search.hide_if_nojs {
     width: 100%;
     margin: 0;
     padding: 0.1rem 0 0 0;
-    column-gap: 0;
-    row-gap: 0;
+    gap: 0 0;
     grid-template-areas:
       "logo search"
       "categories categories";

searx/static/themes/simple/src/less/style-center.less

@@ -14,7 +14,7 @@ on the /search URL and when the "center alignment" preference is enabled.
   }
 }
 
-@media screen and (min-width: 62rem) {
+@media screen and (width >= 62rem) {
   .center-alignment-yes #main_results {
     --center-page-width: 60rem;
   }
@@ -91,7 +91,7 @@ on the /search URL and when the "center alignment" preference is enabled.
         align-self: flex-start;
       }
 
-      &:not(.only_template_images):not(.image-detail-open) {
+      &:not(.only_template_images, .image-detail-open) {
         // the gap is set in style.less
         .ltr-margin-left(1.5rem);
         grid-template-columns: calc(var(--center-page-width) - @results-gap - @results-sidebar-width) @results-sidebar-width;

searx/static/themes/simple/src/less/style.less

@@ -244,9 +244,8 @@ article[data-vim-selected].category-social {
     align-items: center;
     font-size: 1rem;
     color: var(--color-result-url-font);
-    flex-wrap: nowrap;
+    flex-flow: row nowrap;
     overflow: hidden;
-    flex-direction: row;
     margin: 0;
     padding: 0;
 
@@ -269,9 +268,7 @@ article[data-vim-selected].category-social {
     .url_o2 {
       overflow: hidden;
       white-space: nowrap;
-      flex-basis: content;
-      flex-grow: 0;
-      flex-shrink: 1;
+      flex: 0 1 content;
       text-align: right;
       padding-bottom: 1px;
 
@@ -546,14 +543,8 @@ article[data-vim-selected].category-social {
   margin-bottom: 0;
   .ltr-margin-left(@results-offset);
   display: grid;
-  grid-template-columns: @results-width @results-sidebar-width;
-  grid-template-rows: min-content min-content 1fr min-content;
+  grid-template: "corrections sidebar" min-content "answers sidebar" min-content "urls sidebar" 1fr "pagination sidebar" min-content / @results-width @results-sidebar-width;
   gap: 0 @results-gap;
-  grid-template-areas:
-    "corrections sidebar"
-    "answers sidebar"
-    "urls sidebar"
-    "pagination sidebar";
 }
 
 #results #sidebar *:first-child {
@@ -676,10 +667,7 @@ summary.title {
   }
 
   .answer-url {
-    margin-left: auto;
-    margin-top: 5px;
-    margin-right: 10px;
-    margin-bottom: 10px;
+    margin: 5px 10px 10px auto;
   }
 }
 
@@ -979,19 +967,12 @@ summary.title {
     margin: 0 auto;
     justify-content: center;
     display: grid;
-    grid-template-columns: @results-width;
-    grid-template-rows: min-content min-content min-content 1fr min-content min-content;
+    grid-template: "corrections" min-content "answers" min-content "sidebar" min-content "urls" 1fr "pagination" min-content min-content / @results-width;
     gap: 0;
-    grid-template-areas:
-      "corrections"
-      "answers"
-      "sidebar"
-      "urls"
-      "pagination";
   }
 }
 
-@media screen and (max-width: calc(@tablet - 0.5px)) {
+@media screen and (width <= calc(@tablet - 0.5px)) {
   #links_on_top {
     span {
       display: none;
@@ -999,7 +980,7 @@ summary.title {
   }
 }
 
-@media screen and (max-width: 52rem) {
+@media screen and (width <= 52rem) {
   body.results_endpoint {
     #links_on_top {
       .link_on_top_about,
@@ -1024,15 +1005,8 @@ summary.title {
 #main_results div#results.only_template_images {
   margin: 1rem @results-tablet-offset 0 @results-tablet-offset;
   display: grid;
-  grid-template-columns: 100%;
-  grid-template-rows: min-content min-content min-content 1fr min-content;
+  grid-template: "corrections" min-content "answers" min-content "sidebar" min-content "urls" 1fr "pagination" min-content / 100%;
   gap: 0;
-  grid-template-areas:
-    "corrections"
-    "answers"
-    "sidebar"
-    "urls"
-    "pagination";
 
   #sidebar {
     display: none;

searx/static/themes/simple/src/less/toolkit.less

@@ -217,8 +217,7 @@ div.selectable_url {
 
 //
 .scrollx {
-  overflow-x: auto;
-  overflow-y: hidden;
+  overflow: auto hidden;
   display: block;
   padding: 0;
   margin: 0;
@@ -505,7 +504,7 @@ input.checkbox-onoff.reversed-checkbox[type="checkbox"] {
   }
 
   // if not checked and possible to checked then display a "light" check mark on hover
-  input.checkbox[type=checkbox]:not(:checked):not([disabled]):not(.checkbox-onoff):hover::after {
+  input.checkbox[type=checkbox]:not(:checked, [disabled], .checkbox-onoff):hover::after {
     opacity: 0.5;
   }
 }
@@ -593,8 +592,7 @@ td:hover .engine-tooltip,
   width: -moz-available;
   width: -webkit-fill-available;
   width: fill;
-  flex-direction: row;
-  flex-wrap: nowrap;
+  flex-flow: row nowrap;
   align-items: center;
   display: inline-flex;
 }