NeoAnd/netbox
1
0
Fork 0
mirror of https://github.com/netbox-community/netbox.git synced 2025-07-22 20:12:00 -06:00
Code Issues Actions 8 Packages Projects Releases Wiki Activity

Fixes #15617: Fix rack elevation styling under dark mode

Browse Source
This commit is contained in:
Jeremy Stretch 2024-04-05 13:52:53 -04:00
parent 25c39ce480
commit 99fe63569d
5 changed files with 7 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
netbox/project-static/dist/netbox.js vendored
View File

Binary file not shown.

BIN
netbox/project-static/dist/netbox.js.map vendored
View File

Binary file not shown.

BIN
netbox/project-static/dist/rack_elevation.css vendored
View File

Binary file not shown.

2
netbox/project-static/src/colorMode.ts
View File

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

11
netbox/project-static/styles/svg/rack_elevation.scss
View File

@ -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.