mirror of
https://github.com/thegeeklab/hugo-geekblog.git
synced 2024-06-09 03:40:59 +02:00
Robert Kaussow
d5f6cfb13e
BREAKING CHANGE: We have replaced `gulp` with `webpack` and `npm scripts` to build this theme. If you build it on your own or use build commands during the deployment, you may have to adjust your setup. BREAKING CHANGE: The `GeekblogIcons` font is using the icon name as Unicode now. As a consequence, you have to replace all references to Icons from this font if you have customized the theme.
54 lines
1.3 KiB
JavaScript
54 lines
1.3 KiB
JavaScript
import Storage from "store2"
|
|
|
|
import { TOGGLE_MODES, THEME, AUTO_MODE } from "./config.js"
|
|
|
|
document.addEventListener("DOMContentLoaded", (event) => {
|
|
const darkModeToggle = document.getElementById("gblog-dark-mode")
|
|
|
|
darkModeToggle.onclick = function () {
|
|
let lstore = Storage.namespace(THEME)
|
|
let currentMode = lstore.get("color-mode")
|
|
let nextMode = toggle(TOGGLE_MODES, currentMode)
|
|
|
|
lstore.set("color-mode", TOGGLE_MODES[nextMode])
|
|
applyTheme(false)
|
|
}
|
|
})
|
|
|
|
export function applyTheme(init = true) {
|
|
if (Storage.isFake()) return
|
|
|
|
let lstore = Storage.namespace(THEME)
|
|
let html = document.documentElement
|
|
let currentMode = TOGGLE_MODES.includes(lstore.get("color-mode"))
|
|
? lstore.get("color-mode")
|
|
: AUTO_MODE
|
|
|
|
html.setAttribute("class", "color-toggle-" + currentMode)
|
|
lstore.set("color-mode", currentMode)
|
|
|
|
if (currentMode === AUTO_MODE) {
|
|
html.removeAttribute("color-mode")
|
|
} else {
|
|
html.setAttribute("color-mode", currentMode)
|
|
}
|
|
|
|
if (!init) {
|
|
// Reload required to re-initialise e.g. Mermaid with the new theme
|
|
// and re-parse the Mermaid code blocks.
|
|
location.reload()
|
|
}
|
|
}
|
|
|
|
function toggle(list = [], value) {
|
|
let current = list.indexOf(value)
|
|
let max = list.length - 1
|
|
let next = 0
|
|
|
|
if (current < max) {
|
|
next = current + 1
|
|
}
|
|
|
|
return next
|
|
}
|