implement SOS dialog

1 files changed, 22 insertions, 1 deletions

diff --git a/ui/css/style.css b/ui/css/style.css
index 1f51921..12ef3fd 100644
--- a/ui/css/style.css
+++ b/ui/css/style.css
@@ -54,7 +54,6 @@ body, html {
 	position: sticky;
 	top: 0; /* Stick the table header to the top */
 	background-color: #f0f0f0; /* Set background color for the sticky header */
-	z-index: 1; /* Ensure it stays above other content */
 	width: 100%; /* Ensure table header takes full width */
 }
 
@@ -145,3 +144,25 @@ input[type="range"] {
 	width: 100%;
 }
 
+dialog {
+	z-index: 999;
+	min-width: 320px;
+	text-align: center;
+}
+::backdrop {
+  background-color: #000;
+  opacity: 0.75;
+}
+
+dialog h1 {
+	animation-name: blink;
+	animation-duration: 150ms;
+	animation-direction: alternate;
+	animation-iteration-count: infinite;
+	animation-timing-function: linear;
+}
+
+@keyframes blink {
+  from { color: red; }
+  to { color: black; }
+}