diff options
Diffstat (limited to 'layouts/partials/footer.html')
| -rw-r--r-- | layouts/partials/footer.html | 38 |
1 files changed, 37 insertions, 1 deletions
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index 69e3e66..23ddffd 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -1,8 +1,44 @@ <div class="copyright"> {{ .Site.Params.footer.content | markdownify }} - <div class="rss-icon"> + <div class="footer-item"> <a href="/rss"> <i class="fa fa-rss">🛜</i> </a> </div> + <div class="footer-item"> + <button id="toggle-theme-btn">🌞/🌙</button> + </div> + </div> +<script> + console.log("Loaded") + const modes = { + Dark: "dark", + Light: "light", + } + + function getCurrentMode() { + let mode = localStorage.getItem("theme"); + return mode === null ? null : mode; + } + + const toggleColorSchemeBtn = document.getElementById("toggle-theme-btn"); + const body = document.body; + const currentMode = getCurrentMode() + + if (currentMode === modes.Dark) { + body.classList.toggle("dark-mode") + } + + + toggleColorSchemeBtn.addEventListener("click", () => { + body.classList.toggle("dark-mode"); + + if (body.classList.contains("dark-mode")) { + localStorage.setItem("theme", modes.Dark); + } else { + localStorage.setItem("theme", modes.Light); + } + }) + +</script> |