[enh] simple theme: RTL support

* mirror all inline SVGs so that direction SVGs display correctly on RTL
* set the bold list element in info box to RTL so the colon gets displayed on the right side
* set correct .ltr function for the left border on the search button in #q
* move text to the right in autocomplete
* move search form in lign with result article on RTL
* add the correct padding for img thumbnails in categories like music on RTL
* apply RTL to result table for map results
* align text in tables part of /preferences on RTL
* move burger menu on index page to the left on RTL
* fix positioning of drop down arrow on select boxes on RTL
* align result URL on the right (written LTR)
* align vim hotkeys help on the left since it is not translated
* image detail:
  * labels (author, format, URL, etc...) are written on the right,
    values are on the left.
  * URL are written LTR and overflow on the right

1 files changed, 131 insertions, 3 deletions

diff --git a/searx/static/themes/simple/src/less/style-rtl.less b/searx/static/themes/simple/src/less/style-rtl.less
index 21c05424f..92eda0c10 100644
--- a/searx/static/themes/simple/src/less/style-rtl.less
+++ b/searx/static/themes/simple/src/less/style-rtl.less
@@ -1,6 +1,134 @@
+.ltr-left(@offset) {
+  right: @offset;
+}
+
+.ltr-right(@offset) {
+  left: @offset;
+}
+
+.ltr-margin-right(@offset) {
+  margin-left: @offset;
+}
+
+.ltr-margin-left(@offset) {
+  margin-right: @offset;
+}
+
+.ltr-border-right(@offset) {
+  border-left: @offset;
+}
+
+.ltr-border-left(@offset) {
+  border-right: @offset;
+}
+
+.ltr-padding-right(@offset) {
+  padding-left: @offset;
+}
+
+.ltr-padding-left(@offset) {
+  padding-right: @offset;
+}
+
+.ltr-float-left() {
+  float: right;
+}
+
+.ltr-float-right() {
+  float: left;
+}
+
+.ltr-text-align-right() {
+  text-align: left;
+}
+
+.ltr-rounded-left-corners(@radius: 10px) {
+  border-radius: 0 @radius @radius 0;
+}
+
+.ltr-rounded-right-corners(@radius: 10px) {
+  border-radius: @radius 0 0 @radius;
+}
+
+.ltr-text-align-left() {
+  text-align: right;
+}
+
+.ltr-border-left-width(@offset) {
+  border-right-width: @offset;
+}
+
+.ltr-border-right-width(@offset) {
+  border-left-width: @offset;
+}
+
+.ltr-transform() {
+  transform: scale(-1, 1);
+}
+
 @import "style.less";
 
-#search_submit {
-  left: 1px;
-  right: auto;
+#q,
+#sidebar .infobox dt bdi {
+  direction: rtl;
+}
+
+// URL are displayed LTR but align on the right
+#urls {
+  direction: initial;
+  text-align: right;
+
+  .result .url_wrapper {
+    justify-content: end;
+  }
+}
+
+// Image detail
+#results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels p {
+  direction: rtl;
+
+  &.result-url {
+    // Display URL using the LTR direction
+    direction: ltr;
+
+    span {
+      // And put the label on the right
+      direction: rtl;
+      float: right;
+    }
+  }
+}
+
+// select HTML element
+@supports ((background-position-x: 100%) and ((appearance: none) or (-webkit-appearance: none) or (-moz-appearance: none))) {
+  select {
+    border-width: 0 0 0 2rem;
+    background-position-x: -2rem;
+  }
+}
+
+// vim hotkey helps is not translated
+#vim-hotkeys-help table {
+  direction: ltr;
+  text-align: left;
+}
+
+// Logo on the right
+#main_preferences h1,
+#main_stats h1 {
+  background-position-x: 100%;
+}
+
+// patch of searx/static/themes/__common__/less/stats.less
+.bar-chart-serie1,
+.bar-chart-serie2 {
+  float: right;
+}
+
+.engine-stats .engine-name,
+.engine-stats .engine-score,
+.engine-stats .result-count,
+.engine-stats .response-time,
+.engine-stats .engine-reliability {
+  text-align: right;
 }