redesigns page to fit inside 800x600

.github/workflows/ci.yaml

@@ -62,9 +62,9 @@ jobs:
           git config user.name "gitea"
           git add ./pom.xml
           git commit -m "[no ci] release ${{ steps.version.outputs.VERSION }}"
-          git tag ${{ steps.version.outputs.VERSION }} -m "release ${{ steps.version.outputs.VERSION }}"
           ./mvnw -B --no-transfer-progress clean validate -Pnew-snapshot
           git add ./pom.xml
           git commit -m "[no ci] prepare new Version"
+          git tag ${{ steps.version.outputs.VERSION }} -m "release ${{ steps.version.outputs.VERSION }}"
           git push origin main
           git push origin ${{ steps.version.outputs.VERSION }}

pom.xml

@@ -4,7 +4,7 @@
     <modelVersion>4.0.0</modelVersion>
     <groupId>de.arindy</groupId>
     <artifactId>dice-tower</artifactId>
-    <version>1.0.6</version>
+    <version>1.0.5-SNAPSHOT</version>
 
     <properties>
         <compiler-plugin.version>3.13.0</compiler-plugin.version>

src/main/resources/templates/index.html

@@ -304,7 +304,7 @@
     </div>
     <div id="results" hidden class="w3-panel w3-theme-l6 w3-card w3-display-container"
          style="padding: 25px; flex-grow: 1; margin-bottom: auto">
-        <iframe id="resultFrame" title="results" style="width: 100%; height: 100%; overflow: hidden; border: 0"
+        <iframe id="resultFrame" title="results" style="width: 100%; height: 85%; overflow: hidden; border: 0"
                 onload="this.height=this.contentWindow.document.body.scrollHeight;"></iframe>
     </div>
 
@@ -364,13 +364,13 @@
         <p>Shows only my Results in this room</p>
     </div>
     <div hidden id="save-dice-hint">
-        <p>This saves your current theme and theme color for <a id="save-dice-hint-name"></a></p>
+        This saves your current theme and theme color for current Name
     </div>
     <div hidden id="command-hint">
-        <p>Example Commands: "1d6", "2d8 1d100", "1d4 and 1d6", "2d20 & 1d2, "5d6+10"</p>
+        Example Commands: "1d6", "2d8 1d100", "1d4 and 1d6", "2d20 & 1d2, "5d6+10"
     </div>
     <div hidden id="room-hint">
-        <p>How is your character called?</p>
+        How is your character called?
     </div>
 
     <div style="margin-top: 20px; flex-grow: 1" id="how-to">
@@ -435,11 +435,10 @@
             document.getElementById('all-results').hidden = !document.getElementById('gm').checked;
             document.getElementById('all-results-urls').style.display = document.getElementById('gm').checked ? 'fles' : 'none';
             document.getElementById('nameH').innerHTML = '<strong style="font-size:x-large;">' + document.getElementById('name').value + '</strong>';
-            document.getElementById('save-dice-hint-name').innerHTML = '<strong>' + document.getElementById('name').value + '</strong>';
             document.getElementById('roomLabel').hidden = true;
             document.getElementById('nameLabel').hidden = true;
             document.getElementById('nameH').hidden = false;
-            document.getElementById('room-hint').innerHTML = '<p>Room: <strong style="font-size:medium;">' + document.getElementById('room').value + '</strong></p>';
+            document.getElementById('room-hint').innerHTML = 'Room: <strong style="font-size:medium;">' + document.getElementById('room').value + '</strong>';
             document.getElementById('overlayLabel').innerHTML = 'Dice-Overlay for <strong>' + document.getElementById('name').value + '</strong>';
             document.title = document.getElementById('name').value + ' - Dice-Tower';
 
@@ -524,9 +523,19 @@
     }
 
     if (localStorage.getItem('last-name') && localStorage.getItem('last-room')) {
+        let rejoin = document.createElement('button');
+        rejoin.id = 'rejoin';
+        rejoin.style.alignSelf = 'center';
+        rejoin.style.marginTop = '20px';
+        rejoin.style.marginRight = '20px';
+        rejoin.innerHTML = 'Rejoin as <strong>' + (localStorage.getItem('last-gm') === 'true' ? 'GM ' : '') + localStorage.getItem('last-name') + '</strong> in <strong>' + localStorage.getItem('last-room') + '</strong> <i class="fa-solid fa-right-to-bracket"></i>'
+        rejoin.onclick = () => {
             document.getElementById('name').value = localStorage.getItem('last-name');
             document.getElementById('room').value = localStorage.getItem('last-room');
             document.getElementById('gm').checked = localStorage.getItem('last-gm') === 'true';
+            start();
+        }
+        document.getElementById('start-container').appendChild(rejoin)
     }
 
     function configurePopover() {
@@ -535,7 +544,7 @@
         popover.forEach((e) => {
             const target = document.querySelector("#" + e.getAttribute("popovertarget"));
             e.addEventListener("mouseover", () => {
-                showSnackbar(target.innerHTML);
+                showSnackbar(target.innerHTML, true);
             });
 
             e.addEventListener("mouseout", () => {
@@ -568,12 +577,17 @@
         showSnackbar("<i class='fa-regular fa-copy'></i> Link copied to clipboard: <br/>" + copyText.value);
     }
 
-    function showSnackbar(message) {
+    function showSnackbar(message, keepOpen = false) {
         let snackbar = document.getElementById("snackbar");
         let snackbarContainer = document.getElementById("snackbar-container");
         snackbar.innerHTML = message;
         snackbar.className = "show";
         snackbarContainer.className = "show";
+        if (!keepOpen) {
+            setTimeout(function () {
+                hideSnackbar();
+            }, 5000);
+        }
     }
 
     function hideSnackbar() {