theater/tendrils
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve visual consistency of bubbles and nodes

Browse Source 
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Ian Gulliver
2026-01-26 11:51:45 -08:00
parent 5666f85b01
commit 608c9f1b30
1 changed files with 33 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
static/index.html
View File

@@ -127,16 +127,15 @@
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
font-size: 9px; font-size: 9px;
background: #444; background: #555;
color: #ccc; color: #fff;
padding: 1px 6px; padding: 1px 6px;
border-radius: 8px; border-radius: 8px;
white-space: nowrap; white-space: nowrap;
} }
.node .switch-port.external { .node .switch-port.external {
background: #633; border: 1px dashed #c9f;
color: #f99;
} }
.node .switch-port .error-info, .node .switch-port .error-info,
@@ -146,6 +145,8 @@
opacity: 0.8; opacity: 0.8;
white-space: pre; white-space: pre;
text-align: left; text-align: left;
margin-top: 2px;
padding-bottom: 2px;
} }
.node .switch-port:hover .error-info, .node .switch-port:hover .error-info,
@@ -166,8 +167,8 @@
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
font-size: 9px; font-size: 9px;
background: #446; background: #555;
color: #aaf; color: #fff;
padding: 1px 6px; padding: 1px 6px;
border-radius: 8px; border-radius: 8px;
white-space: nowrap; white-space: nowrap;
@@ -179,54 +180,42 @@
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
font-size: 9px; font-size: 9px;
background: #664; background: #864;
color: #ffa; color: #fff;
padding: 1px 6px; padding: 1px 6px;
border-radius: 8px; border-radius: 8px;
white-space: nowrap; white-space: nowrap;
} }
.node .switch-port.speed-10g,
.node .uplink.speed-10g {
background: #468;
}
.node .switch-port.speed-1g,
.node .uplink.speed-1g {
background: #486;
}
.node .switch-port.speed-100m,
.node .uplink.speed-100m {
background: #864;
}
.node .switch-port.speed-slow,
.node .uplink.speed-slow {
background: #844;
}
.node:hover { .node:hover {
filter: brightness(1.2); filter: brightness(1.2);
} }
.node.switch { .node.switch {
background: #2a2; background: #2a2;
border: 2px solid #4f4;
font-weight: bold; font-weight: bold;
} }
.node .switch-port.speed-10g {
border: 1px solid #4ff;
}
.node .switch-port.speed-1g {
border: 1px solid #4f4;
}
.node .switch-port.speed-100m {
border: 1px solid #fa0;
}
.node .switch-port.speed-slow {
border: 1px solid #f44;
}
.node .uplink.speed-10g {
border: 1px solid #4ff;
}
.node .uplink.speed-1g {
border: 1px solid #4f4;
}
.node .uplink.speed-100m {
border: 1px solid #fa0;
}
.node .uplink.speed-slow {
border: 1px solid #f44;
}
.node.copied { .node.copied {
outline: 2px solid #fff; outline: 2px solid #fff;
@@ -291,13 +280,11 @@
body.dante-mode .node.dante-tx { body.dante-mode .node.dante-tx {
opacity: 1; opacity: 1;
background: #d62; background: #d62;
border: 2px solid #f84;
} }
body.dante-mode .node.dante-rx { body.dante-mode .node.dante-rx {
opacity: 1; opacity: 1;
background: #26d; background: #26d;
border: 2px solid #48f;
} }
body.dante-mode .node.dante-tx.dante-rx { body.dante-mode .node.dante-tx.dante-rx {
@@ -340,13 +327,13 @@
} }
.node .dante-info.tx-info { .node .dante-info.tx-info {
background: #fca; background: #864;
color: #630; color: #fff;
} }
.node .dante-info.rx-info { .node .dante-info.rx-info {
background: #acf; background: #468;
color: #036; color: #fff;
} }
body.dante-mode .node.dante-tx .dante-info, body.dante-mode .node.dante-tx .dante-info,