Hide when workout done

Workout.js

@@ -256,6 +256,12 @@ update_active_item() {
         buttons.forEach(function(bttn, bidx) {
             bttn.disabled = true;
         });
+        const wo_done = this.text_element("div", "");
+        wo_done.setAttribute("id", "workout-done");
+        const wo_done_txt = this.text_element("div", "Workout done!");
+        wo_done_txt.classList.add("workout-done-txt");
+        wo_done.appendChild(wo_done_txt);
+        this.container.appendChild(wo_done);
     }
 }
 

style.css

@@ -156,6 +156,30 @@ html {
     color: grey;
 }
 
+/* Workout done sheet that covers everything */
+#workout-done {
+    position: fixed;
+    top: 0%;
+    left: 0%;
+    height: 100%;
+    width: 100%;
+    background-color: rgba(200,200,200,0.5);
+    z-index: 2000;
+    backdrop-filter: blur(0.5em);
+}
+
+#workout-done .workout-done-txt {
+    position: absolute;
+    top: 45%;
+    width: 100%;
+    text-align: center;
+    font-family: "Boldonse", system-ui;
+    font-weight: 400;
+    font-size: xx-large;
+    color: white;
+    text-shadow: var(--indicator-done-grade) 0.5em 0.5em 1em;
+}
+
 /* Floating Action Buttons */
 #fab-wrapper {
     position: fixed;