From 7ec576e6909110c4a84c6843e76ba5ca99f22f7c Mon Sep 17 00:00:00 2001
From: Stephan Porada <sporada@uni-bielefeld.de>
Date: Thu, 23 Jul 2020 16:07:12 +0200
Subject: [PATCH] Add important feature!

---
 web/app/templates/nopaque.html.j2 | 38 +++++++++++++++++++++++++++++++
 1 file changed, 38 insertions(+)

diff --git a/web/app/templates/nopaque.html.j2 b/web/app/templates/nopaque.html.j2
index a0000020..19acfa16 100644
--- a/web/app/templates/nopaque.html.j2
+++ b/web/app/templates/nopaque.html.j2
@@ -135,10 +135,48 @@
 
     {% if parallax %}
       <main>
+        <noscript>
+          <div class="container">
+            <div class="row">
+              <div class="col s12">
+                <div class="card red darken-1">
+                  <div class="card-content white-text">
+                    <span class="card-title">JavaScript is disabled</span>
+                    <p>You have JavaScript disabled. Nopaque uses javascript and sockets to send data in realtime to you. For example showing you the status of your jobs and your corpora. Please activate JavaScript to make full use of nopaque.</p>
+                    <p>Some services are still useable without Javascript.</p>
+                  </div>
+                  <div class="card-action">
+                    <a href="#">What services can I still use?</a>
+                    <a href="#">What services and functions are not available?</a>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </noscript>
         {{ insert_page_content() }}
       </main>
     {% else %}
       <main class="grey lighten-5">
+        <noscript>
+          <div class="container">
+            <div class="row">
+              <div class="col s12">
+                <div class="card red darken-1">
+                  <div class="card-content white-text">
+                    <span class="card-title">JavaScript is disabled</span>
+                    <p>You have JavaScript disabled. Nopaque uses javascript and sockets to send data in realtime to you. For example showing you the status of your jobs and your corpora. Please activate JavaScript to make full use of nopaque.</p>
+                    <p>Some services are still useable without Javascript.</p>
+                  </div>
+                  <div class="card-action">
+                    <a href="#">What services can I still use?</a>
+                    <a href="#">What services and functions are not available?</a>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </noscript>
         {% if not full_width %}
         <div class="container">
         {% endif %}