From 443667197e16dcabd2d89641d65e0b1d029640c6 Mon Sep 17 00:00:00 2001
From: Patrick Jentsch <pjentsch@sfb1288inf-Laptop.fritz.box>
Date: Tue, 25 Aug 2020 15:37:45 +0200
Subject: [PATCH] Adding colors on more places

---
 web/app/templates/main/dashboard.html.j2      | 24 ++++++++++++++-----
 web/app/templates/nopaque.html.j2             |  1 -
 .../services/corpus_analysis.html.j2          |  6 ++---
 web/app/templates/services/file-setup.html.j2 |  6 ++---
 web/app/templates/services/nlp.html.j2        |  6 ++---
 web/app/templates/services/ocr.html.j2        |  6 ++---
 6 files changed, 30 insertions(+), 19 deletions(-)

diff --git a/web/app/templates/main/dashboard.html.j2 b/web/app/templates/main/dashboard.html.j2
index d59eb21b..175ec175 100644
--- a/web/app/templates/main/dashboard.html.j2
+++ b/web/app/templates/main/dashboard.html.j2
@@ -119,8 +119,12 @@
         <div class="col s12 m4">
           <a href="{{ url_for('services.service', service='file-setup') }}" style="color: rgba(0,0,0,0.87);">
             <div class="card-panel center-align hoverable">
-              <i class="large material-icons" style="color: #ee6e73;">burst_mode</i>
-              <p>File setup</p>
+              <br>
+              <a href="{{ url_for('services.service', service='file-setup') }}" class="btn-floating btn-large file-setup-color darken waves-effect waves-light" style="transform: scale(2);">
+                <i class="material-icons service" data-service="file-setup"></i>
+              </a>
+              <p>&nbsp;</p>
+              <p class="file-setup-color-text"><b>File setup</b></p>
               <p class="light">Digital copies of text based research data (books, letters, etc.) often comprise various files and formats. nopaque converts and merges those files to facilitate further processing and the application of other services.</p>
             </div>
           </a>
@@ -128,8 +132,12 @@
         <div class="col s12 m4">
           <a href="{{ url_for('services.service', service='ocr') }}" style="color: rgba(0,0,0,0.87);">
             <div class="card-panel center-align hoverable">
-              <i class="large material-icons" style="color: #ee6e73;">find_in_page</i>
-              <p>Optical Character Recognition</p>
+              <br>
+              <a class="btn-floating btn-large ocr-color darken waves-effect waves-light" style="transform: scale(2);">
+                <i class="material-icons service" data-service="ocr"></i>
+              </a>
+              <p>&nbsp;</p>
+              <p class="ocr-color-text"><b>Optical Character Recognition</b></p>
               <p class="light">nopaque converts your image data – like photos or scans – into text data through a process called OCR. This step enables you to proceed with further computational analysis of your documents.</p>
             </div>
           </a>
@@ -137,8 +145,12 @@
         <div class="col s12 m4">
           <a href="{{ url_for('services.service', service='nlp') }}" style="color: rgba(0,0,0,0.87);">
             <div class="card-panel center-align hoverable">
-              <i class="large material-icons" style="color: #ee6e73;">format_textdirection_l_to_r</i>
-              <p>Natural Language Processing</p>
+              <br>
+              <a href="{{ url_for('services.service', service='nlp') }}" class="btn-floating btn-large nlp-color darken waves-effect waves-light" style="transform: scale(2);">
+                <i class="material-icons service" data-service="nlp"></i>
+              </a>
+              <p>&nbsp;</p>
+              <p class="nlp-color-text"><b>Natural Language Processing</b></p>
               <p class="light">By means of computational linguistic data processing (tokenization, lemmatization, part-of-speech tagging and named-entity recognition) nopaque extracts additional information from your text.</p>
             </div>
           </a>
diff --git a/web/app/templates/nopaque.html.j2 b/web/app/templates/nopaque.html.j2
index 1717b658..0a4b03ec 100644
--- a/web/app/templates/nopaque.html.j2
+++ b/web/app/templates/nopaque.html.j2
@@ -105,7 +105,6 @@
         }
         /* ### End sidenav-fixed offset ### */
       {% endif %}
-      {% block style_additions %}{% endblock %}
     </style>
     <script src="{{ url_for('static', filename='js/JSONPatch.js/jsonpatch.min.js') }}"></script>
     <script src="{{ url_for('static', filename='js/Dark_Reader/darkreader.js') }}"></script>
diff --git a/web/app/templates/services/corpus_analysis.html.j2 b/web/app/templates/services/corpus_analysis.html.j2
index d339cc90..8e94fe1e 100644
--- a/web/app/templates/services/corpus_analysis.html.j2
+++ b/web/app/templates/services/corpus_analysis.html.j2
@@ -2,11 +2,11 @@
 
 {% set main_class = 'corpus-analysis-color lighten' %}
 
-{% block style_additions %}
+{% block page_content %}
+<style>
   main button, main .btn, main .btn-floating {background-color: {{ corpus_analysis_color_darken }};}
-{% endblock %}
+</style>
 
-{% block page_content %}
 <div class="col s12 m3 push-m9">
   <div class="center-align">
     <a class="btn-floating btn-large waves-effect waves-light" style="transform: scale(2);">
diff --git a/web/app/templates/services/file-setup.html.j2 b/web/app/templates/services/file-setup.html.j2
index 3a4961a5..abc1ed9b 100644
--- a/web/app/templates/services/file-setup.html.j2
+++ b/web/app/templates/services/file-setup.html.j2
@@ -2,11 +2,11 @@
 
 {% set main_class = 'file-setup-color lighten' %}
 
-{% block style_additions %}
+{% block page_content %}
+<style>
   main button, main .btn, main .btn-floating {background-color: {{ file_setup_color_darken }};}
-{% endblock %}
+</style>
 
-{% block page_content %}
 <div class="col s12 m3 push-m9">
   <div class="center-align">
     <p class="hide-on-small-only">&nbsp;</p>
diff --git a/web/app/templates/services/nlp.html.j2 b/web/app/templates/services/nlp.html.j2
index b86d01bb..7a032dd9 100644
--- a/web/app/templates/services/nlp.html.j2
+++ b/web/app/templates/services/nlp.html.j2
@@ -2,11 +2,11 @@
 
 {% set main_class = 'nlp-color lighten' %}
 
-{% block style_additions %}
+{% block page_content %}
+<style>
   main button, main .btn, main .btn-floating {background-color: {{ nlp_color_darken }};}
-{% endblock %}
+</style>
 
-{% block page_content %}
 <div class="col s12 m3 push-m9">
   <div class="center-align">
     <p class="hide-on-small-only">&nbsp;</p>
diff --git a/web/app/templates/services/ocr.html.j2 b/web/app/templates/services/ocr.html.j2
index d4cbaec6..1c68f503 100644
--- a/web/app/templates/services/ocr.html.j2
+++ b/web/app/templates/services/ocr.html.j2
@@ -2,11 +2,11 @@
 
 {% set main_class = 'ocr-color lighten' %}
 
-{% block style_additions %}
+{% block page_content %}
+<style>
   main button, main .btn, main .btn-floating {background-color: {{ ocr_color_darken }};}
-{% endblock %}
+</style>
 
-{% block page_content %}
 <div class="col s12 m3 push-m9">
   <div class="center-align">
     <p class="hide-on-small-only">&nbsp;</p>
-- 
GitLab