feat: Added default theme

This commit is contained in:
JY Hsu 2024-08-24 10:50:23 +08:00
parent dde735d3af
commit a11a99f92a
3 changed files with 12 additions and 3 deletions

View file

@ -14,7 +14,11 @@ window.addEventListener('load', async () => {
function loadScheme() { function loadScheme() {
return localStorage.getItem(PERSISTENCE_KEY) || "system" return localStorage.getItem(PERSISTENCE_KEY) || loadDefaultScheme()
}
function loadDefaultScheme() {
return document.getElementById('defaultTheme').innerText || "system"
} }
function saveScheme(scheme) { function saveScheme(scheme) {

View file

@ -12,7 +12,7 @@
<!--================= add analytics if enabled =========================--> <!--================= add analytics if enabled =========================-->
{{- partial "analytics.html" . -}} {{- partial "analytics.html" . -}}
<script> <script>
theme = localStorage.getItem('darkmode:color-scheme') || 'system'; theme = localStorage.getItem('darkmode:color-scheme') || document.getElementById('defaultTheme').innerText || "system"
if (theme == 'system') { if (theme == 'system') {
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) { if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
theme = 'dark'; theme = 'dark';

View file

@ -3,13 +3,18 @@
<head> <head>
<title>{{- .Site.Title -}}</title> <title>{{- .Site.Title -}}</title>
{{ $siteDescription := .Site.Params.description }} {{ $siteDescription := .Site.Params.description }}
{{ $siteDefaultTheme := .Site.Params.defaultTheme }}
{{ if (index .Site.Data .Site.Language.Lang).site }} {{ if (index .Site.Data .Site.Language.Lang).site }}
{{ $siteConfig := (index .Site.Data .Site.Language.Lang).site }} {{ $siteConfig := (index .Site.Data .Site.Language.Lang).site }}
{{ if $siteConfig.description }} {{ if $siteConfig.description }}
{{ $siteDescription = $siteConfig.description }} {{ $siteDescription = $siteConfig.description }}
{{ end }} {{ end }}
{{ if $siteConfig.defaultTheme }}
{{ $siteDefaultTheme = $siteConfig.defaultTheme }}
{{ end }}
{{ end }} {{ end }}
<meta name="description" content="{{ $siteDescription }}" /> <meta name="description" content="{{ $siteDescription }}" />
<p id="defaultTheme" hidden>{{ $siteDefaultTheme }}</p>
<!-- import common headers --> <!-- import common headers -->
{{- partial "header.html" . -}} {{- partial "header.html" . -}}
@ -18,7 +23,7 @@
<!--================= add analytics if enabled =========================--> <!--================= add analytics if enabled =========================-->
{{- partial "analytics.html" . -}} {{- partial "analytics.html" . -}}
<script> <script>
theme = localStorage.getItem('darkmode:color-scheme') || 'system'; theme = localStorage.getItem('darkmode:color-scheme') || document.getElementById('defaultTheme').innerText || "system"
if (theme == 'system') { if (theme == 'system') {
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) { if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
theme = 'dark'; theme = 'dark';