[theme] simple - improve rendering of the "Answers" box

Signed-off-by: Markus Heiser <markus.heiser@darmarit.de>

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

@@ -49,8 +49,9 @@
   --color-autocomplete-background: #fff;
   --color-autocomplete-background-hover: #f7f7f7;
   /// Answer Colors
-  --color-answer-border: #ddd;
-  --color-answer-font: #000;
+  --color-answer-border: #ddd; // same as --color-header-border
+  --color-answer-font: #444;  // same as --color-base-font
+  --color-answer-background: #f7f7f7; // same as --color-header-background:
   /// Results Colors
   --color-result-shadow: #ccc;
   --color-result-border: #ddd;
@@ -150,8 +151,9 @@
     --color-autocomplete-background: #222;
     --color-autocomplete-background-hover: #181818;
     /// Answer Colors
-    --color-answer-border: #ddd;
-    --color-answer-font: #fff;
+    --color-answer-border: #333; // same as --color-header-border
+    --color-answer-font: #bbb; // same as --color-base-font
+    --color-answer-background: #181818; // same as --color-header-background:
     /// Results Colors
     --color-result-shadow: #444;
     --color-result-border: #333;

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

@@ -425,6 +425,7 @@ article.result-images[data-vim-selected] {
 #answers {
   grid-area: answers;
   border: 1px solid var(--color-answer-border);
+  background: var(--color-answer-background);
   padding: 0.9em;
   margin-bottom: @results-margin;
   color: var(--color-answer-font);
@@ -436,8 +437,6 @@ article.result-images[data-vim-selected] {
 
   .answer {
     display: block;
-    font-size: 1.2em;
-    font-weight: bold;
   }
 }
 
@@ -730,7 +729,7 @@ article.result-images[data-vim-selected] {
 
   #corrections,
   #answers {
-    margin: 0 5px 1em 5px;
+    margin: 1rem @results-tablet-offset;
     box-shadow: 0 0 5px var(--color-result-shadow);
   }