From ad208378bb78a35746db432011bcc08b4ffd708f Mon Sep 17 00:00:00 2001
From: Markus Heiser <markus.heiser@darmarit.de>
Date: Fri, 15 May 2020 10:16:49 +0200
Subject: [PATCH] [fix] oscar theme, remove inline style attributes (CSP
 compliants)

Inline styles are blocked by default with Content Security Policy (CSP).  Move
the rest of inline styles to CSS and correct the HTML template of the oscar
preference page.

Signed-off-by: Markus Heiser <markus.heiser@darmarit.de>
---
 .../oscar/less/logicodev/preferences.less     | 12 +++++++
 searx/templates/oscar/preferences.html        | 32 +++++++++++--------
 2 files changed, 31 insertions(+), 13 deletions(-)

diff --git a/searx/static/themes/oscar/less/logicodev/preferences.less b/searx/static/themes/oscar/less/logicodev/preferences.less
index 9672d5011..82ce16310 100644
--- a/searx/static/themes/oscar/less/logicodev/preferences.less
+++ b/searx/static/themes/oscar/less/logicodev/preferences.less
@@ -1,3 +1,15 @@
 .table > tbody > tr > td, .table > tbody > tr > th {
     vertical-align: middle !important;
 }
+
+.nav-tabs.nav-justified{
+  margin-bottom: 20px;
+}
+
+p {
+    margin: 10px 0;
+}
+
+input.cursor-text {
+    margin: 10px 0;
+}
diff --git a/searx/templates/oscar/preferences.html b/searx/templates/oscar/preferences.html
index b03929df3..5f6979590 100644
--- a/searx/templates/oscar/preferences.html
+++ b/searx/templates/oscar/preferences.html
@@ -9,7 +9,7 @@
     <form method="post" action="{{ url_for('preferences') }}" id="search_form">
 
         <!-- Nav tabs -->
-        <ul class="nav nav-tabs nav-justified hide_if_nojs" role="tablist" style="margin-bottom:20px;">
+        <ul class="nav nav-tabs nav-justified hide_if_nojs" role="tablist">
           <li class="active"><a href="#tab_general" role="tab" data-toggle="tab">{{ _('General') }}</a></li>
           <li><a href="#tab_engine" role="tab" data-toggle="tab">{{ _('Engines') }}</a></li>
           <li><a href="#tab_plugins" role="tab" data-toggle="tab">{{ _('Plugins') }}</a></li>
@@ -143,7 +143,7 @@
             <div class="tab-pane active_if_nojs" id="tab_engine">
 
                 <!-- Nav tabs -->
-                <ul class="nav nav-tabs nav-justified hide_if_nojs" role="tablist" style="margin-bottom:20px;">
+                <ul class="nav nav-tabs nav-justified hide_if_nojs" role="tablist">
                     {% for categ in all_categories %}
                     <li{% if loop.first %} class="active"{% endif %}><a href="#tab_engine_{{ categ|replace(' ', '_') }}" role="tab" data-toggle="tab">{{ _(categ) }}</a></li>
                     {% endfor %}
@@ -251,7 +251,7 @@
                 <noscript>
                     <h3>{{ _('Answerers') }}</h3>
                 </noscript>
-                <p class="text-muted" style="margin:20px 0;">
+                <p class="text-muted">
                     {{ _('This is the list of searx\'s instant answering modules.') }}
                 </p>
                 <table class="table table-striped">
@@ -278,20 +278,20 @@
                 <noscript>
                     <h3>{{ _('Cookies') }}</h3>
                 </noscript>
-                <p class="text-muted" style="margin:20px 0;">
+                <p class="text-muted">
                     {{ _('This is the list of cookies and their values searx is storing on your computer.') }}<br />
                     {{ _('With that list, you can assess searx transparency.') }}<br />
                 </p>
                 {% if cookies %}
                 <table class="table table-striped">
                     <tr>
-                        <th class="text-muted" style="padding-right:40px;">{{ _('Cookie name') }}</th>
+                        <th class="text-muted">{{ _('Cookie name') }}</th>
                         <th class="text-muted">{{ _('Value') }}</th>
                     </tr>
 
                     {% for cookie in cookies %}
                     <tr>
-                        <td class="text-muted" style="padding-right:40px;">{{ cookie }}</td>
+                        <td class="text-muted">{{ cookie }}</td>
                         <td class="text-muted">{{ cookies[cookie] }}</td>
                     </tr>
                     {% endfor %}
@@ -301,17 +301,23 @@
                 {% endif %}
             </div>
         </div>
-        <p class="text-muted" style="margin:20px 0;">{{ _('These settings are stored in your cookies, this allows us not to store this data about you.') }}
-        <br />
-        {{ _("These cookies serve your sole convenience, we don't use these cookies to track you.") }}
-        </p>
-        <p style="margin:20px 0;">{{ _('Search URL of the currently saved preferences') }} <small class="text-muted">({{ _('Note: specifying custom settings in the search URL can reduce privacy by leaking data to the clicked result sites.') }})</small>:<br/>
-          <input readonly="" class="form-control select-all-on-click cursor-text" type="url" value="{{ url_for('index', _external=True) }}?preferences={{ preferences_url_params|e }}{% raw %}&amp;q=%s{% endraw %}">
+
+	<p class="text-muted">
+	  {{ _('These settings are stored in your cookies, this allows us not to store this data about you.') }}
+          {{ _("These cookies serve your sole convenience, we don't use these cookies to track you.") }}
         </p>
 
-        <input type="submit" class="btn btn-primary" value="{{ _('save') }}" />
+        <p>
+	  {{ _('Search URL of the currently saved preferences') }}
+	  <small class="text-muted">({{ _('Note: specifying custom settings in the search URL can reduce privacy by leaking data to the clicked result sites.') }})</small>:
+        </p>
+
+	<div class="tab-pane">
+          <input readonly="" class="form-control select-all-on-click cursor-text" type="url" value="{{ url_for('index', _external=True) }}?preferences={{ preferences_url_params|e }}{% raw %}&amp;q=%s{% endraw %}">
+          <input type="submit" class="btn btn-primary" value="{{ _('save') }}" />
         <a href="{{ url_for('index') }}"><div class="btn btn-default">{{ _('back') }}</div></a>
         <a href="{{ url_for('clear_cookies') }}"><div class="btn btn-default">{{ _('Reset defaults') }}</div></a>
+	</div>
     </form>
 </div>
 {% endblock %}