[simple theme] make url clickable and cleanup result article header

* url in article head is clickable
* url is bigger now 0.96em font
* url is now left floating on tablet and phone
* there is a 8px top and bottom margin on h3 result heading

2 files changed, 3 insertions, 14 deletions

diff --git a/searx/static/themes/simple/src/less/style.less b/searx/static/themes/simple/src/less/style.less
index 1f6bb4516..261e36792 100644
--- a/searx/static/themes/simple/src/less/style.less
+++ b/searx/static/themes/simple/src/less/style.less
@@ -152,7 +152,7 @@ article.result-images[data-vim-selected]::before {
   h3 {
     font-size: 1.1em;
     word-wrap: break-word;
-    margin: 5px 0 1px 0;
+    margin: 8px 0 8px 0 !important;
     padding: 0;
     margin-bottom: 0;
 
@@ -207,7 +207,7 @@ article.result-images[data-vim-selected]::before {
   }
 
   .url {
-    font-size: 0.9em;
+    font-size: 0.96em;
     margin: 0 0 3px 0;
     padding: 0;
     max-width: 54em;
@@ -613,10 +613,6 @@ article.result-images[data-vim-selected]::before {
   }
 
   .result {
-    h3 {
-      margin: 0 0 1px 0;
-    }
-
     .thumbnail {
       max-width: 98%;
     }
@@ -629,11 +625,6 @@ article.result-images[data-vim-selected]::before {
         overflow: hidden;
         width: 100%;
       }
-
-      a {
-        float: right;
-        padding: 0 0.5em;
-      }
     }
 
     .engines {
diff --git a/searx/templates/simple/macros.html b/searx/templates/simple/macros.html
index 4fc4f0d00..92c6c9ef2 100644
--- a/searx/templates/simple/macros.html
+++ b/searx/templates/simple/macros.html
@@ -27,9 +27,7 @@
 <!-- Draw result header -->
 {% macro result_header(result, favicons, image_proxify) -%}
 <article class="result {% if result['template'] %}result-{{ result.template|replace('.html', '') }}{% else %}result-default{% endif %} {% if result['category'] %}category-{{ result['category'] }}{% endif %}{% for e in result.engines %} {{ e }}{% endfor %}">
-  <p class="url">
-    <span class="url">{{ result.pretty_url }}</span>
-  </p>{{- '' -}}
+  <p class="url">{{ result_link(result.url, result.pretty_url, 'url') }}</p>
   {%- if result.img_src %}{{ result_open_link(result.url) }}<img class="image" src="{{ image_proxify(result.img_src) }}" alt="{{ result.title|striptags }}" title="{{ result.title|striptags }}" class="image" />{{ result_close_link() }}{% endif -%}
   {%- if result.thumbnail %}{{ result_open_link(result.url) }}<img class="thumbnail" src="{{ image_proxify(result.thumbnail) }}" title="{{ result.title|striptags }}" alt="{{ result.title|striptags }}"/>{{ result_close_link() }}{% endif -%}
   <h3>{{ result_link(result.url, result.title|safe) }}</h3>