From 945cb5e1309553a4f9e4fc9ad603c659a34c52f4 Mon Sep 17 00:00:00 2001
From: stephan <sporada@uni-bielefeld.de>
Date: Mon, 24 Feb 2020 11:50:05 +0100
Subject: [PATCH] Poster

---
 app/templates/main/poster.html.j2 | 81 +++++++++++++++++--------------
 1 file changed, 44 insertions(+), 37 deletions(-)

diff --git a/app/templates/main/poster.html.j2 b/app/templates/main/poster.html.j2
index c871558c..37afffce 100644
--- a/app/templates/main/poster.html.j2
+++ b/app/templates/main/poster.html.j2
@@ -162,13 +162,20 @@
         <i class="material-icons prefix">search</i>
         <input class="search" placeholder='"fox" "jumps" "over" []* "dog"' type="search"></input>
       </div>
+      <i class="material-icons left" style="padding-left: 10px;">subdirectory_arrow_right</i>
       <p>
-        <i class="material-icons left" style="padding-left: 10px;">subdirectory_arrow_right</i>
-        <span class="chip">The</span> <span class="chip">quick</span>
-        <span class="chip">brown</span>&nbsp;|&nbsp;&nbsp;<span class="chip">fox</span>
-        <span class="chip">jumps</span> <span class="chip">over</span>
-        <span class="chip">the</span> <span class="chip">lazy</span>
-        <span class="chip" id="tooltipped">dog</span>&nbsp;|&nbsp;&nbsp;<span class="chip">.</span>
+        <span class="chip">The | DET</span>
+        <span class="chip">quick | ADJ</span>
+        <span class="chip">brown | ADJ</span>
+        <span class="chip light-green">fox | PROPN</span>
+        <span class="chip light-green">jumps | VERB</span>
+        <span class="chip light-green">over | ADP</span>
+        <span class="chip light-green">the | DET</span>
+        <span class="chip light-green">lazy | ADJ</span>
+        <span style="padding-left:48px;">
+          <span class="chip light-green" id="tooltipped">dog | NOUN</span>
+        </span>
+        <span class="chip">. | PUNCT</span>
       </p>
     </div>
   </div>
@@ -200,37 +207,37 @@
 </div>
 
 <script>
-  document.addEventListener("DOMContentLoaded", function() {
-    tooltippedElement = document.getElementById("tooltipped");
-    tooltip = M.Tooltip.init(
-      tooltippedElement,
-      {"html": `<table>
-                  <tr>
-                    <th>Token information</th>
-                    <th>Source information</th>
-                  </tr>
-                  <tr>
-                    <td class="left-align">
-                      Word: dog<br>
-                      Lemma: dog<br>
-                      POS: NN<br>
-                      Simple POS: NOUN<br>
-                      NER: NULL
-                    </td>
-                    <td class="left-align">
-                      Title: Current Notes<br>
-                      Author: Unknown<br>
-                      Publishing year: 1885
-                    </td>
-                  </tr>
-                </table>`,
-       "inDuration": 1500,
-       "margin": 15,
-       "position": "bottom",
-       "transitionMovement": 0}
-    );
-    tooltip.open();
-  });
+  // document.addEventListener("DOMContentLoaded", function() {
+  //   tooltippedElement = document.getElementById("tooltipped");
+  //   tooltip = M.Tooltip.init(
+  //     tooltippedElement,
+  //     {"html": `<table>
+  //                 <tr>
+  //                   <th>Token information</th>
+  //                   <th>Source information</th>
+  //                 </tr>
+  //                 <tr>
+  //                   <td class="left-align">
+  //                     Word: dog<br>
+  //                     Lemma: dog<br>
+  //                     POS: NN<br>
+  //                     Simple POS: NOUN<br>
+  //                     NER: NULL
+  //                   </td>
+  //                   <td class="left-align">
+  //                     Title: Current Notes<br>
+  //                     Author: Unknown<br>
+  //                     Publishing year: 1885
+  //                   </td>
+  //                 </tr>
+  //               </table>`,
+  //      "inDuration": 1500,
+  //      "margin": 15,
+  //      "position": "bottom",
+  //      "transitionMovement": 0}
+  //   );
+  //   tooltip.open();
+  // });
   //DarkReader.enable({"brightness": 100, "contrast": 100, "sepia": 0});
 </script>
 {% endblock %}