MrBlake/mrb-netbox-topology-views
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

style: use green cable highlights in light mode

Browse Source
This commit is contained in:
MrBlake
2026-07-28 14:43:20 +02:00
parent 1f80ae5099
commit cff9282a60
2 changed files with 10 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
netbox_topology_views/static/netbox_topology_views/css/rack_elevation.css
+8 -2
View File
@@ -100,12 +100,18 @@ html[data-netbox-color-mode="dark"] .rack-device {
transition: opacity .12s, stroke .12s, filter .12s, stroke-width .12s;
}
.rack-topology-edge.is-highlighted {
stroke: #fff !important;
stroke: #22c55e !important;
stroke-width: 5;
opacity: 1;
filter: drop-shadow(0 0 5px #fff);
filter: drop-shadow(0 0 5px #22c55e);
}
.rack-topology-edge.is-dimmed { opacity: .12; }
html[data-bs-theme="dark"] .rack-topology-edge.is-highlighted,
body[data-bs-theme="dark"] .rack-topology-edge.is-highlighted,
html[data-netbox-color-mode="dark"] .rack-topology-edge.is-highlighted {
stroke: #fff !important;
filter: drop-shadow(0 0 5px #fff);
}
.rack-topology-edge.is-wireless {
stroke-dasharray: 7 7;
stroke-linecap: round;
netbox_topology_views/static_dev/css/app.scss
+2 -1
View File
@@ -62,7 +62,7 @@ html[data-netbox-color-mode=dark] #visgraph {
.rack-topology-node strong, .rack-topology-node small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rack-topology-node small { opacity: .7; }
.rack-topology-edge { fill: none; stroke-width: 3; opacity: .8; pointer-events: stroke; cursor: pointer; transition: opacity .12s, stroke .12s, filter .12s, stroke-width .12s; }
.rack-topology-edge.is-highlighted { stroke: #fff !important; stroke-width: 5; opacity: 1; filter: drop-shadow(0 0 5px #fff); }
.rack-topology-edge.is-highlighted { stroke: #22c55e !important; stroke-width: 5; opacity: 1; filter: drop-shadow(0 0 5px #22c55e); }
.rack-topology-edge.is-dimmed { opacity: .12; }
.rack-topology-tooltip { display: none; position: absolute; z-index: 10; width: max-content; max-width: 28rem; padding: .65rem .8rem; border: 1px solid var(--tblr-border-color, #ced4da); border-radius: .35rem; background: var(--tblr-bg-surface, #fff); box-shadow: 0 4px 18px rgba(0,0,0,.25); pointer-events: none; }
.rack-topology-tooltip.is-visible { display: block; }
@@ -85,6 +85,7 @@ html[data-netbox-color-mode=dark] #visgraph {
html[data-bs-theme="dark"], body[data-bs-theme="dark"], html[data-netbox-color-mode="dark"] {
.rack-frame { border-color: #3b4654; background-color: #212b36; }
.rack-device { background: #162e45; color: #fff; }
.rack-topology-edge.is-highlighted { stroke: #fff !important; filter: drop-shadow(0 0 5px #fff); }
}
@media (max-width: 700px) {