creates chatoverlay

src/main/resources/META-INF/resources/app.js

@@ -27,6 +27,7 @@ function start(event = undefined) {
         document.getElementById('name').hidden = true;
         document.getElementById('room').hidden = true;
         document.getElementById('how-to').hidden = true;
+        document.getElementById('chatOverlay').hidden = true;
         document.getElementById('results').hidden = false;
         document.getElementById('all-results').hidden = !document.getElementById('gm').checked;
         document.getElementById('all-results-urls').style.display = document.getElementById('gm').checked ? 'fles' : 'none';
@@ -178,6 +179,8 @@ document.addEventListener("DOMContentLoaded", async () => {
         }
     })
 
+    document.getElementById('chatOverlayLink').href = url() + '/chatoverlay'
+
     document.addEventListener("DOMContentLoaded", async () => {
         if (!localStorage.getItem("userId")) {
             localStorage.setItem("userId", self.crypto.randomUUID());

src/main/resources/META-INF/resources/overlay/style.css

@@ -24,3 +24,13 @@ body {
     width: 100%;
     height: 100%;
 }
+
+.tooltip {
+    position: fixed;
+    border-radius: 0.5rem;
+    padding: 15px;
+    max-width: 80%;
+    font-size: 400%;
+    color: #fff; !important;
+    background-color: #333333dd; !important
+}