Revert "Theme: add a preference to center the results (Oscar)"

This reverts commit 4237f5fd50c2dc0e91513056d885f25038ef6787.

3 files changed, 77 insertions, 185 deletions

diff --git a/searx/static/themes/simple/src/less/definitions.less b/searx/static/themes/simple/src/less/definitions.less
index ef6b02b2c..dc2717067 100644
--- a/searx/static/themes/simple/src/less/definitions.less
+++ b/searx/static/themes/simple/src/less/definitions.less
@@ -243,7 +243,6 @@
 
 /// General Size
 @results-width: 45rem;
-@results-sidebar-width: 25rem;
 @results-offset: 10rem;
 @results-tablet-offset: 0.5rem;
 @results-gap: 5rem;
diff --git a/searx/static/themes/simple/src/less/style-center.less b/searx/static/themes/simple/src/less/style-center.less
deleted file mode 100644
index 749aab4e8..000000000
--- a/searx/static/themes/simple/src/less/style-center.less
+++ /dev/null
@@ -1,102 +0,0 @@
-/*
---center-page-width overrides the less variable @results-width when the results are centered
-see the CSS rules for #results in style.less ( grid-template-columns and gap).
-
-In this file, the --center-page-width values comes from the Oscar theme (Bootstrap 3).
-
-All rules starts with ".center-aligment-yes #main_results" to be enabled only
-on the /search URL and when the "center alignment" preference is enabled.
-*/
-
-@media screen and (min-width: @phone) {
-  .center-aligment-yes #main_results {
-    --center-page-width: 48rem;
-  }
-}
-
-@media screen and (min-width: 62rem) {
-  .center-aligment-yes #main_results {
-    --center-page-width: 60rem;
-  }
-}
-
-@media screen and (min-width: @tablet) {
-  .center-aligment-yes #main_results {
-    --center-page-width: 73rem;
-  }
-}
-
-@media screen and (min-width: @phone) and (max-width: @tablet) {
-  .center-aligment-yes #main_results {
-    #results {
-      grid-template-columns: 60% 1fr;
-      margin-left: 0;
-      margin-right: 0;
-    }
-
-    #urls {
-      .ltr-margin-left(3rem);
-    }
-
-    #sidebar {
-      .ltr-margin-right(1rem);
-    }
-
-    #backToTop {
-      .ltr-left(calc(60% + 1rem));
-    }
-  }
-}
-
-@media screen and (min-width: @tablet) {
-  .center-aligment-yes #main_results {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-
-    #search {
-      width: 100%;
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-    }
-
-    #search_header {
-      grid-template-columns: calc(50% - 4.5rem - var(--center-page-width) / 2) 3rem var(--center-page-width);
-      grid-template-areas: "na logo search" "na spacer categories";
-      width: 100%;
-      padding-left: 0;
-      padding-right: 0;
-    }
-
-    .search_filters {
-      .ltr-margin-left(0.5rem);
-      width: var(--center-page-width);
-    }
-
-    #results {
-      &.only_template_images,
-      &.image-detail-open {
-        // * grid-template-columns and .ltr-margin-left are set in style.less
-        // * With .image-detail-open.only_template_images, the width is set in detail.less
-        // * #results is going to be centered because of the #main_results rules,
-        //   align-self aligns the results on the left or right according to the language.
-        align-self: flex-start;
-      }
-
-      &:not(.only_template_images):not(.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;
-
-        #backToTop {
-          .ltr-left(calc(50% - @results-sidebar-width - @results-gap + 1rem + var(--center-page-width) / 2));
-        }
-      }
-
-      .result .content {
-        max-width: inherit;
-      }
-    }
-  }
-}
diff --git a/searx/static/themes/simple/src/less/style.less b/searx/static/themes/simple/src/less/style.less
index 6777cbadc..45c6eb204 100644
--- a/searx/static/themes/simple/src/less/style.less
+++ b/searx/static/themes/simple/src/less/style.less
@@ -29,9 +29,6 @@
 // Search-Field
 @import "search.less";
 
-// to center the results
-@import "style-center.less";
-
 // ion-icon
 .ion-icon {
   display: inline-block;
@@ -463,7 +460,7 @@ 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-columns: @results-width 25rem;
   grid-template-rows: min-content min-content 1fr min-content;
   gap: 0 @results-gap;
   grid-template-areas:
@@ -702,105 +699,103 @@ article[data-vim-selected].category-social {
 }
 
 @media screen and (max-width: @tablet) {
-  .center-aligment-no {
-    .page_with_header {
-      margin: 2rem 0.5rem;
-      width: auto;
-    }
+  .page_with_header {
+    margin: 2rem 0.5rem;
+    width: auto;
+  }
 
-    #infoboxes {
-      position: inherit;
-      max-width: inherit;
-
-      .infobox {
-        clear: both;
-
-        img {
-          .ltr-float-left();
-          max-width: 10em;
-          margin-top: 0.5em;
-          .ltr-margin-right(0.5em);
-          margin-bottom: 0.5em;
-          .ltr-margin-left(0);
-        }
-      }
-    }
+  #infoboxes {
+    position: inherit;
+    max-width: inherit;
 
-    #sidebar {
-      margin: 0 @results-tablet-offset @results-margin @results-tablet-offset;
-      padding: 0;
-      float: none;
-      border: none;
-      width: auto;
+    .infobox {
+      clear: both;
 
-      input {
-        border: 0;
+      img {
+        .ltr-float-left();
+        max-width: 10em;
+        margin-top: 0.5em;
+        .ltr-margin-right(0.5em);
+        margin-bottom: 0.5em;
+        .ltr-margin-left(0);
       }
     }
+  }
 
-    #apis {
-      display: none;
-    }
+  #sidebar {
+    margin: 0 @results-tablet-offset @results-margin @results-tablet-offset;
+    padding: 0;
+    float: none;
+    border: none;
+    width: auto;
 
-    #search_url {
-      display: none;
+    input {
+      border: 0;
     }
+  }
 
-    .result {
-      .thumbnail {
-        max-width: 98%;
-      }
+  #apis {
+    display: none;
+  }
 
-      .url {
-        span.url {
-          display: block;
-          white-space: nowrap;
-          text-overflow: ellipsis;
-          overflow: hidden;
-          width: 100%;
-        }
-      }
+  #search_url {
+    display: none;
+  }
 
-      .engines {
-        .ltr-float-right();
-        padding: 0 0 3px 0;
+  .result {
+    .thumbnail {
+      max-width: 98%;
+    }
+
+    .url {
+      span.url {
+        display: block;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        overflow: hidden;
+        width: 100%;
       }
     }
 
-    .result-images {
-      border-bottom: none !important;
+    .engines {
+      .ltr-float-right();
+      padding: 0 0 3px 0;
     }
+  }
 
-    .image_result {
-      max-width: 98%;
+  .result-images {
+    border-bottom: none !important;
+  }
 
-      img {
-        max-width: 98%;
-      }
-    }
+  .image_result {
+    max-width: 98%;
 
-    #backToTop {
-      display: none;
+    img {
+      max-width: 98%;
     }
+  }
 
-    #pagination {
-      margin: 2rem 0 0 0 !important;
-    }
+  #backToTop {
+    display: none;
+  }
 
-    #main_results div#results {
-      margin: 1rem auto 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;
-      gap: 0;
-      grid-template-areas:
-        "corrections"
-        "answers"
-        "sidebar"
-        "urls"
-        "pagination";
-    }
+  #pagination {
+    margin: 2rem 0 0 0 !important;
+  }
+
+  #main_results div#results {
+    margin: 1rem auto 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;
+    gap: 0;
+    grid-template-areas:
+      "corrections"
+      "answers"
+      "sidebar"
+      "urls"
+      "pagination";
   }
 }