diff --git a/site/content/docs/5.2/customize/color-modes.md b/site/content/docs/5.2/customize/color-modes.md
index 929075cbb4..bf1692ae16 100644
--- a/site/content/docs/5.2/customize/color-modes.md
+++ b/site/content/docs/5.2/customize/color-modes.md
@@ -248,7 +248,7 @@ Here's a look at the JavaScript that powers it. Feel free to inspect our own doc
{{< example lang="js" show_preview="false" >}}
{{< js.inline >}}
-{{- readFile (path.Join "site/assets/js/color-modes/index.js") -}}
+{{- readFile (path.Join "site/static/docs" .Site.Params.docs_version "assets/js/color-modes.js") -}}
{{< /js.inline >}}
{{< /example >}}
diff --git a/site/layouts/partials/header.html b/site/layouts/partials/header.html
index 327ed14888..22528ae47b 100644
--- a/site/layouts/partials/header.html
+++ b/site/layouts/partials/header.html
@@ -1,6 +1,3 @@
-{{- $colorModeJS := resources.Get "js/color-modes/index.js" }}
-
-
@@ -22,6 +19,9 @@
{{- end }}
+{{- $colorModeJS := printf "/docs/%s/assets/js/color-modes.js" $.Site.Params.docs_version -}}
+
+
{{ partial "stylesheet" . }}
{{ partial "favicons" . }}
{{ partial "social" . }}
diff --git a/site/assets/js/color-modes/index.js b/site/static/docs/5.2/assets/js/color-modes.js
similarity index 97%
rename from site/assets/js/color-modes/index.js
rename to site/static/docs/5.2/assets/js/color-modes.js
index 51bfd40a71..41b6b893e2 100644
--- a/site/assets/js/color-modes/index.js
+++ b/site/static/docs/5.2/assets/js/color-modes.js
@@ -46,7 +46,7 @@
}
})
- window.addEventListener('load', () => {
+ window.addEventListener('DOMContentLoaded', () => {
showActiveTheme(getPreferredTheme())
document.querySelectorAll('[data-bs-theme-value]')