From 3be8bc53ff325ac1841b86122dc069d68954cb7b Mon Sep 17 00:00:00 2001
From: Paul-Christian Volkmer
Date: Wed, 10 Jan 2024 11:16:34 +0100
Subject: feat: add graphic to show connection state

---
 src/main/resources/static/style.css | 24 ++++++++++++++++++++++++
 1 file changed, 24 insertions(+)

(limited to 'src/main/resources/static/style.css')

diff --git a/src/main/resources/static/style.css b/src/main/resources/static/style.css
index e215eb0..c438c28 100644
--- a/src/main/resources/static/style.css
+++ b/src/main/resources/static/style.css
@@ -434,4 +434,28 @@ input.inline:focus-visible {
 
 .chart-50pc {
     width: calc(50% - 2.4rem - 4px);
+}
+
+.connection-display {
+    display: grid;
+    grid-template-columns: 10em 16em 10em;
+    place-items: center;
+    width: fit-content;
+    margin: 1em 0;
+}
+
+.connection-display > * {
+    text-align: center;
+    margin: auto 0;
+}
+
+.connection-display .connection {
+    display: block;
+    width: 100%;
+    height: 4px;
+    background: repeating-linear-gradient(to left, white, white 2px, transparent 2px, transparent 8px, white 8px) var(--bg-red);
+}
+
+.connection-display .connection.available {
+    background: var(--bg-green);
 }
\ No newline at end of file
-- 
cgit v1.2.3