From bb6a1e8c349075f40ac96be25509951ad5dce715 Mon Sep 17 00:00:00 2001 From: SlRvb <54087190+SlRvb@users.noreply.github.com> Date: Thu, 12 Aug 2021 20:46:23 -0700 Subject: [PATCH 1/2] Add SlRvb Site to Showcase --- content/moc/showcase.md | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/content/moc/showcase.md b/content/moc/showcase.md index 00fb18cc2..e1cb9a191 100644 --- a/content/moc/showcase.md +++ b/content/moc/showcase.md @@ -10,5 +10,6 @@ Want to see what Quartz can do? Here are some cool community gardens :) - [Anson Yu's Garden](http://garden.ansonyu.me/) - [Shihyu's PKM](https://shihyuho.github.io/pkm/) - [Chloe's Garden](https://garden.chloeabrasada.online/) +- [SlRvb's Site](https://slrvb.github.io/Site/) -If you want to see your own on here, submit a [Pull Request adding yourself to this file](https://github.com/jackyzha0/quartz/blob/hugo/content/moc/showcase.md)! \ No newline at end of file +If you want to see your own on here, submit a [Pull Request adding yourself to this file](https://github.com/jackyzha0/quartz/blob/hugo/content/moc/showcase.md)! From f9920f6d736754372075c8f1014ab9440e333317 Mon Sep 17 00:00:00 2001 From: Brecht Savelkoul Date: Fri, 13 Aug 2021 22:46:00 +0200 Subject: [PATCH 2/2] Execute darkmode script before first render --- assets/darkmode.js | 19 +++++++++++-------- layouts/404.html | 8 +------- layouts/_default/single.html | 9 +-------- layouts/index.html | 8 +------- layouts/partials/head.html | 8 +++++++- 5 files changed, 21 insertions(+), 31 deletions(-) diff --git a/assets/darkmode.js b/assets/darkmode.js index 93bf6dacf..d95a281ac 100644 --- a/assets/darkmode.js +++ b/assets/darkmode.js @@ -1,14 +1,8 @@ -// Darkmode toggle -const toggleSwitch = document.querySelector('#darkmode-toggle') - const userPref = window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark' const currentTheme = localStorage.getItem('theme') ?? userPref if (currentTheme) { document.documentElement.setAttribute('saved-theme', currentTheme); - if (currentTheme === 'dark') { - toggleSwitch.checked = true - } } const switchTheme = (e) => { @@ -22,5 +16,14 @@ const switchTheme = (e) => { } } -// listen for toggle -toggleSwitch.addEventListener('change', switchTheme, false) \ No newline at end of file +window.addEventListener('DOMContentLoaded', () => { + // Darkmode toggle + const toggleSwitch = document.querySelector('#darkmode-toggle') + + // listen for toggle + toggleSwitch.addEventListener('change', switchTheme, false) + + if (currentTheme === 'dark') { + toggleSwitch.checked = true + } +}) diff --git a/layouts/404.html b/layouts/404.html index 849491011..deec3eb68 100644 --- a/layouts/404.html +++ b/layouts/404.html @@ -11,12 +11,6 @@ ↳ Let's get you home. - -{{- with resources.Get "darkmode.js" | minify -}} - -{{- end -}} - \ No newline at end of file + diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 14a3b05d9..9e647ffa8 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -18,13 +18,6 @@ {{partial "footer.html" .}} - -{{- with resources.Get "darkmode.js" | minify -}} - -{{- end -}} - - \ No newline at end of file + diff --git a/layouts/index.html b/layouts/index.html index 83f6fb8ac..fdc03b1f5 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -13,10 +13,4 @@ {{partial "footer.html" .}} - -{{- with resources.Get "darkmode.js" | minify -}} - -{{- end -}} -{{end}} \ No newline at end of file +{{end}} diff --git a/layouts/partials/head.html b/layouts/partials/head.html index e53ebe1d3..3810078cc 100644 --- a/layouts/partials/head.html +++ b/layouts/partials/head.html @@ -17,5 +17,11 @@ {{end}} {{end}} + + {{- with resources.Get "darkmode.js" | minify -}} + + {{- end -}} -{{ template "_internal/google_analytics.html" . }} \ No newline at end of file +{{ template "_internal/google_analytics.html" . }}