From 0e538a6fdae10f13f3c5f998ede0477e7dd738f5 Mon Sep 17 00:00:00 2001
From: Jeremy Stretch <jstretch@netboxlabs.com>
Date: Fri, 5 Apr 2024 13:52:53 -0400
Subject: [PATCH] Fixes #15617: Fix rack elevation styling under dark mode

---
 netbox/project-static/dist/netbox.js          | Bin 375669 -> 375672 bytes
 netbox/project-static/dist/netbox.js.map      | Bin 340501 -> 340497 bytes
 netbox/project-static/dist/rack_elevation.css | Bin 1513 -> 1514 bytes
 netbox/project-static/src/colorMode.ts        |   2 +-
 .../styles/svg/rack_elevation.scss            |  11 ++++++-----
 5 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/netbox/project-static/dist/netbox.js b/netbox/project-static/dist/netbox.js
index 97796e4fb1e44abb1ed4da75a89d4e52a2cb6b97..af0d70c075826315e16a57eacbce6530176e45c9 100644
GIT binary patch
delta 1827
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
D?8#&t

delta 1825
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
BWh(#x

diff --git a/netbox/project-static/dist/netbox.js.map b/netbox/project-static/dist/netbox.js.map
index c6443c7dfd67b8151448275982c0283abddf4d39..9d18c575e8e6b63a73cf8d695aae851fc0589a2a 100644
GIT binary patch
delta 35
rcmbRGL}cO<k%kt=7N!>FEiB1V-04n^j+st6-j1PJ+l!)D7GDPd?Kcef

delta 39
tcmbREL}cm{k%kt=7N!>FEiB1V{DF>+fjZufj@eE?GSqN;UKGpX>i`*$4YB|L

diff --git a/netbox/project-static/dist/rack_elevation.css b/netbox/project-static/dist/rack_elevation.css
index 40fa2908a0420f425610e88039cf361434290562..185163389fba2c7e71bcc7156f6377ebfa6eb32c 100644
GIT binary patch
delta 122
zcmaFK{fgVTxGcR|S2r)ILboU}Ia@a=-AbV>u}DK#w<Ia22*}kfE-gw+OitA;PEF3w
zOGzxM)SS%EC^}Jp2D`FZvbm{w%ESj6{6*<W8b;<i3MPg+3Z@ny6&u)<6H}5*lTtR{
YV3cBHte$*}S#$Cirl*_#GQVL20QsjWn*aa+

delta 121
zcmaFG{gPX%xGcR|S2r)ILboU}Ia@a=-AX|@)iO0XHEp8tTFJ7+A`M;Lq+;FT)a3lU
zl*FP+-Q@h7{36YX&o$VUjZKUbO$;W>F>b)EaPw70DaOg-%+DFECx2kl+|0uAj1d4G
C3MuIT

diff --git a/netbox/project-static/src/colorMode.ts b/netbox/project-static/src/colorMode.ts
index 7883a9630..894a1e8a5 100644
--- a/netbox/project-static/src/colorMode.ts
+++ b/netbox/project-static/src/colorMode.ts
@@ -30,7 +30,7 @@ function updateElements(targetMode: ColorMode): void {
   for (const elevation of getElements<HTMLObjectElement>('.rack_elevation')) {
     const svg = elevation.contentDocument?.querySelector('svg') ?? null;
     if (svg !== null) {
-      svg.setAttribute(`data-${COLOR_MODE_KEY}`, targetMode);
+      svg.setAttribute(`data-bs-theme`, targetMode);
     }
   }
 }
diff --git a/netbox/project-static/styles/svg/rack_elevation.scss b/netbox/project-static/styles/svg/rack_elevation.scss
index f61081983..603ad0a6c 100644
--- a/netbox/project-static/styles/svg/rack_elevation.scss
+++ b/netbox/project-static/styles/svg/rack_elevation.scss
@@ -8,23 +8,23 @@
 
 svg {
   // Light mode values
-  --nbx-rack-bg: #{$gray-200};
+  --nbx-rack-bg: var(--tblr-bg-surface-secondary);
   --nbx-rack-border: #{$black};
   --nbx-rack-slot-bg: #{$gray-200};
   --nbx-rack-slot-border: #{$gray-500};
   --nbx-rack-slot-hover-bg: #{$gray-400};
   --nbx-rack-link-color: #{$blue};
-  --nbx-rack-unit-color: #{$text-muted};
+  --nbx-rack-unit-color: #{$gray-600};
 
   &[data-bs-theme='dark'] {
     // Dark mode values
-    --nbx-rack-bg: #{$gray-800};
+    --nbx-rack-bg: rgb(27, 41, 58);
     --nbx-rack-border: #{$gray-600};
     --nbx-rack-slot-bg: #{$gray-800};
     --nbx-rack-slot-border: #{$gray-700};
     --nbx-rack-slot-hover-bg: #{$gray-900};
     --nbx-rack-link-color: #{$blue-200};
-    --nbx-rack-unit-color: #{$text-muted};
+    --nbx-rack-unit-color: #{$gray-500};
   }
 }
 
@@ -41,6 +41,8 @@ text {
 }
 
 svg {
+  background-color: var(--nbx-rack-bg);
+
   // Rack unit numbers along left side of rack elevation.
   .unit {
     margin: 0;
@@ -65,7 +67,6 @@ svg {
     fill: none;
     stroke-width: 2px;
     stroke: var(--nbx-rack-border);
-    background-color: var(--nbx-rack-bg);
   }
 
   // Rack unit slot.