From 2935232387bddb6cbbfd71a702a9ae5060840f33 Mon Sep 17 00:00:00 2001 From: iamjohnnymac <33052970+iamjohnnymac@users.noreply.github.com> Date: Tue, 19 May 2026 08:36:54 +0800 Subject: [PATCH] fix: TIA-598 colour badges + core-tracer node legibility (v0.3.4) Polish-pass hotfix from the v0.3.x project audit. Two UX issues: 1. TIA-598 strand colour badges: NetBox's default palette renders blue as a muted grey on dark theme, black is invisible, and white has poor contrast. Strand colour codes are FUNCTIONAL info -- you identify a fibre by its position colour -- so accuracy matters. Added CSS overrides for .badge.text-bg-blue (#1976d2), .badge.text-bg-black (#1a1a1a + light text + outline), and .badge.text-bg-white (light bg + dark text + outline). Global by design -- boosting these three is a net improvement everywhere. 2. Core tracer hop nodes were cramped at typical viewport widths. Bumped min-width 120 -> 160 px, font-size 12 -> 13 px, sub-font sizes 10/11 -> 11/12 px. No template / JS change. Both spotted during the project-wide Chrome walkthrough on CT 109. --- CHANGELOG.md | 22 ++++++++++- netbox_osp/__init__.py | 2 +- .../static/netbox_osp/css/netbox-osp.css | 37 ++++++++++++++++--- pyproject.toml | 2 +- 4 files changed, 54 insertions(+), 9 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 1b72230..3813719 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,25 @@ Per-release NetBox / Python compatibility lives in ## [Unreleased] +## [0.3.4] — 2026-05-19 + +### Fixed + +- **TIA-598 strand colour badges now legible on dark theme.** NetBox's + default palette desaturated `blue` to near-grey, `black` was + invisible, and `white` rendered with poor contrast. Added explicit + CSS overrides for `.badge.text-bg-blue` (vivid `#1976d2`), + `.badge.text-bg-black` (`#1a1a1a` + light text + outline), and + `.badge.text-bg-white` (light bg + dark text + outline). Strand + colour codes are functional information — operators identify a + fibre by its position colour — so badge fidelity matters. + Overrides intentionally apply globally; boosting these three is a + net improvement across all NetBox badges. +- **Core tracer hop nodes are easier to read.** Bumped + `.osp-tracer-node` `min-width` from 120 → 160 px, `font-size` + 12 → 13 px, and increased the kind / meta sub-font sizes for + better legibility at typical viewport widths. + ## [0.3.3] — 2026-05-19 ### Fixed @@ -368,7 +387,8 @@ GPS markers. - PyPI name-reservation placeholder. Not functional. -[Unreleased]: https://github.com/iamjohnnymac/netbox-osp/compare/v0.3.3...HEAD +[Unreleased]: https://github.com/iamjohnnymac/netbox-osp/compare/v0.3.4...HEAD +[0.3.4]: https://github.com/iamjohnnymac/netbox-osp/releases/tag/v0.3.4 [0.3.3]: https://github.com/iamjohnnymac/netbox-osp/releases/tag/v0.3.3 [0.3.2]: https://github.com/iamjohnnymac/netbox-osp/releases/tag/v0.3.2 [0.3.1]: https://github.com/iamjohnnymac/netbox-osp/releases/tag/v0.3.1 diff --git a/netbox_osp/__init__.py b/netbox_osp/__init__.py index 11b824a..0440f1d 100644 --- a/netbox_osp/__init__.py +++ b/netbox_osp/__init__.py @@ -5,7 +5,7 @@ class NetBoxOspConfig(PluginConfig): name = "netbox_osp" verbose_name = "NetBox OSP" description = "Outside-plant fibre management — cables, splice closures, fibre links with loss budgets, and an offline-capable Leaflet plant map." - version = "0.3.3" + version = "0.3.4" author = "John McKean" author_email = "33052970+iamjohnnymac@users.noreply.github.com" base_url = "osp" diff --git a/netbox_osp/static/netbox_osp/css/netbox-osp.css b/netbox_osp/static/netbox_osp/css/netbox-osp.css index bffb57c..ee26131 100644 --- a/netbox_osp/static/netbox_osp/css/netbox-osp.css +++ b/netbox_osp/static/netbox_osp/css/netbox-osp.css @@ -261,12 +261,12 @@ background: var(--nbx-color-surface, #1f2330); border: 2px solid #6c757d; border-radius: 6px; - padding: 8px 10px; + padding: 10px 12px; color: #eeeeee; font-family: inherit; - font-size: 12px; - min-width: 120px; - max-width: 240px; + font-size: 13px; + min-width: 160px; + max-width: 280px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); cursor: pointer; } @@ -278,7 +278,7 @@ .osp-tracer-node__kind { font-weight: 600; text-transform: uppercase; - font-size: 10px; + font-size: 11px; letter-spacing: 0.05em; } @@ -292,11 +292,36 @@ .osp-tracer-node__meta { margin-top: 4px; color: #9aa0a6; - font-size: 11px; + font-size: 12px; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, "Cascadia Mono", "Roboto Mono", Consolas, monospace; } +/* ---- TIA-598 strand colour badges ------------------------------------- */ +/* Strand colour codes are FUNCTIONAL information (operators identify a + strand by its position colour). NetBox's default badge palette + desaturates "blue" on the dark theme to near-grey, and "black" / "white" + render with poor contrast. Override the three problem cases with + explicit accessible values so a Blue strand looks blue at a glance. + These overrides intentionally apply globally — boosting blue/black/white + badges is a net improvement across NetBox. */ +.badge.text-bg-blue { + background-color: #1976d2 !important; + color: #ffffff !important; +} + +.badge.text-bg-black { + background-color: #1a1a1a !important; + color: #f5f5f5 !important; + border: 1px solid #666666 !important; +} + +.badge.text-bg-white { + background-color: #f5f5f5 !important; + color: #1a1a1a !important; + border: 1px solid #999999 !important; +} + /* Summary band — sits above the graph card. */ .osp-tracer-summary { display: flex; diff --git a/pyproject.toml b/pyproject.toml index b26bb6e..e4bf01a 100644 --- a/pyproject.toml +++ b/pyproject.toml @@ -4,7 +4,7 @@ build-backend = "setuptools.build_meta" [project] name = "netbox-osp" -version = "0.3.3" +version = "0.3.4" description = "Outside-plant fibre management for NetBox — cables, splice closures, fibre links with loss budgets, and an offline-capable Leaflet plant map." authors = [{ name = "John McKean", email = "33052970+iamjohnnymac@users.noreply.github.com" }] maintainers = [{ name = "John McKean", email = "33052970+iamjohnnymac@users.noreply.github.com" }]