Set default theme in config toml

This commit is contained in:
panr 2018-12-21 19:07:37 +01:00
parent 5ee3aaf6c4
commit 729f947681
3 changed files with 15 additions and 11 deletions

View File

@ -7,6 +7,8 @@ paginate = 5
[params]
subtitle = "A simple theme for Hugo"
# "light" or "dark"
defaultTheme = "dark"
[params.logo]
logoText = "hello friend"

View File

@ -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" . }}

View File

@ -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",
);
});