1
0
mirror of https://github.com/pcvolkmer/etl-processor.git synced 2025-07-04 23:42:54 +00:00

feat: add graphic to show connection state

This commit is contained in:
2024-01-10 11:16:34 +01:00
parent fad2f33fd6
commit 3be8bc53ff
4 changed files with 41 additions and 3 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@ -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);
}