Set default theme in config toml
This commit is contained in:
parent
1974d30be0
commit
9532cb8285
3 changed files with 15 additions and 11 deletions
|
@ -7,6 +7,8 @@ paginate = 5
|
|||
|
||||
[params]
|
||||
subtitle = "A simple theme for Hugo"
|
||||
# "light" or "dark"
|
||||
defaultTheme = "dark"
|
||||
|
||||
[params.logo]
|
||||
logoText = "hello friend"
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
{{ end }}
|
||||
{{ partial "head.html" . }}
|
||||
</head>
|
||||
<body class="dark-theme">
|
||||
<body class="{{ if ne $.Site.Params.defaultTheme "light" -}} dark-theme {{- end -}}">
|
||||
<div class="container">
|
||||
{{ partial "header.html" . }}
|
||||
|
||||
|
|
|
@ -1,16 +1,18 @@
|
|||
// Toggle theme
|
||||
|
||||
const getTheme = window.localStorage && window.localStorage.getItem('theme')
|
||||
const themeToggle = document.querySelector('.theme-toggle')
|
||||
const isDark = getTheme === 'dark' || getTheme === null
|
||||
const getTheme = window.localStorage && window.localStorage.getItem("theme");
|
||||
const themeToggle = document.querySelector(".theme-toggle");
|
||||
const isDark = getTheme === "dark";
|
||||
|
||||
document.body.classList.toggle('dark-theme', isDark)
|
||||
if (getTheme !== null) {
|
||||
document.body.classList.toggle("dark-theme", isDark);
|
||||
}
|
||||
|
||||
themeToggle.addEventListener('click', () => {
|
||||
document.body.classList.toggle('dark-theme')
|
||||
themeToggle.addEventListener("click", () => {
|
||||
document.body.classList.toggle("dark-theme");
|
||||
window.localStorage &&
|
||||
window.localStorage.setItem(
|
||||
'theme',
|
||||
document.body.classList.contains('dark-theme') ? 'dark' : 'light',
|
||||
)
|
||||
})
|
||||
"theme",
|
||||
document.body.classList.contains("dark-theme") ? "dark" : "light",
|
||||
);
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue