From 849a9d32d1c5535c2776588a12ee591cdc5d9478 Mon Sep 17 00:00:00 2001 From: Jeremy Stretch Date: Tue, 19 Mar 2024 14:06:24 -0400 Subject: [PATCH] Fixes #15340: Fix flicker on page load with dark mode enabled (#15475) --- netbox/project-static/js/setmode.js | 5 +++-- netbox/templates/base/base.html | 25 ++++++++++++------------- 2 files changed, 15 insertions(+), 15 deletions(-) diff --git a/netbox/project-static/js/setmode.js b/netbox/project-static/js/setmode.js index 8441a542f..ff1c5366b 100644 --- a/netbox/project-static/js/setmode.js +++ b/netbox/project-static/js/setmode.js @@ -5,10 +5,11 @@ * @param inferred {boolean} Value is inferred from browser/system preference. */ function setMode(mode, inferred) { - document.documentElement.setAttribute("data-netbox-color-mode", mode); + document.documentElement.setAttribute("data-bs-theme", mode); localStorage.setItem("netbox-color-mode", mode); localStorage.setItem("netbox-color-mode-inferred", inferred); } + /** * Determine the best initial color mode to use prior to rendering. */ @@ -69,4 +70,4 @@ function initMode() { console.error(error); } return setMode("light", true); -}; +} diff --git a/netbox/templates/base/base.html b/netbox/templates/base/base.html index 1c58047ef..bb35cd3bf 100644 --- a/netbox/templates/base/base.html +++ b/netbox/templates/base/base.html @@ -9,13 +9,7 @@ data-netbox-url-name="{{ request.resolver_match.url_name }}" data-netbox-base-path="{{ settings.BASE_PATH }}" {% with preferences|get_key:'ui.colormode' as color_mode %} - {% if color_mode == 'dark'%} - data-netbox-color-mode="dark" - {% elif color_mode == 'light' %} - data-netbox-color-mode="light" - {% else %} - data-netbox-color-mode="unset" - {% endif %} + data-netbox-color-mode="{{ color_mode|default:"unset" }}" {% endwith %} > @@ -25,7 +19,16 @@ {# Page title #} {% block title %}{% trans "Home" %}{% endblock %} | NetBox + {# Initialize color mode #} + @@ -53,13 +56,9 @@ {# Additional content #} {% block head %}{% endblock %} - - + + {# Page layout #} {% block layout %}{% endblock %}