diff --git a/exampleSite/content/en/usage/configuration.md b/exampleSite/content/en/usage/configuration.md
index 3b16af7..094c4b7 100644
--- a/exampleSite/content/en/usage/configuration.md
+++ b/exampleSite/content/en/usage/configuration.md
@@ -102,6 +102,10 @@ enableRobotsTXT = true
# See https://developer.mozilla.org/de/docs/Web/HTML/Element/base.
geekdocOverwriteHTMLBase = false
+ # (Optional, default true) Enable or disable the JavaScript based color theme toggle switch. The CSS based
+ # user preference mode still works.
+ geekdocDarkModeToggle = false
+
# (Optional, default false) Auto-decrease brightness of images and add a slightly grayscale to avoid
# bright spots while using the dark mode.
geekdocDarkModeDim = false
@@ -224,6 +228,10 @@ params:
# See https://developer.mozilla.org/de/docs/Web/HTML/Element/base.
geekdocOverwriteHTMLBase: false
+ # (Optional, default true) Enable or disable the JavaScript based color theme toggle switch. The CSS based
+ # user preference mode still works.
+ geekdocDarkModeToggle: false
+
# (Optional, default false) Auto-decrease brightness of images and add a slightly grayscale to avoid
# bright spots while using the dark mode.
geekdocDarkModeDim: false
diff --git a/layouts/partials/head/others.html b/layouts/partials/head/others.html
index a9c9f34..8d0a6d4 100644
--- a/layouts/partials/head/others.html
+++ b/layouts/partials/head/others.html
@@ -1,3 +1,6 @@
+{{- if default true .Site.Params.GeekdocDarkModeToggle }}
+
+{{- end }}
{
- applyTheme()
-})()
-
document.addEventListener("DOMContentLoaded", function (event) {
let clipboard = new Clipboard(".clip")
diff --git a/src/js/colorTheme.js b/src/js/colorTheme.js
index e874299..e0c9077 100644
--- a/src/js/colorTheme.js
+++ b/src/js/colorTheme.js
@@ -1,7 +1,10 @@
const Storage = require("store2")
-
const { TOGGLE_COLOR_THEMES, THEME, COLOR_THEME_AUTO } = require("./config.js")
+;(() => {
+ applyTheme()
+})()
+
document.addEventListener("DOMContentLoaded", (event) => {
const colorThemeToggle = document.getElementById("gdoc-color-theme")
@@ -15,7 +18,7 @@ document.addEventListener("DOMContentLoaded", (event) => {
}
})
-export function applyTheme(init = true) {
+function applyTheme(init = true) {
if (Storage.isFake()) return
let lstore = Storage.namespace(THEME)
diff --git a/src/sass/_base.scss b/src/sass/_base.scss
index 23c93e4..9dec059 100644
--- a/src/sass/_base.scss
+++ b/src/sass/_base.scss
@@ -36,11 +36,7 @@ html {
&.color-toggle-hidden {
#gdoc-color-theme {
- .gdoc_brightness_auto,
- .gdoc_brightness_dark,
- .gdoc_brightness_light {
- display: none;
- }
+ display: none;
}
}
diff --git a/webpack.config.js b/webpack.config.js
index 09d8085..392f47c 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -18,6 +18,7 @@ var config = {
path.resolve("src", "sass", "print.scss")
],
main: path.resolve("src", "js", "app.js"),
+ colortheme: path.resolve("src", "js", "colorTheme.js"),
mermaid: path.resolve("src", "js", "mermaid.js"),
katex: [path.resolve("src", "js", "katex.js")].concat(
glob.sync(path.join(nodeModulesPath, "katex", "dist", "fonts", "*.{woff,woff2}"))