hugo-bear-blog : support 'lastmod' and add darkmode toggle

This commit is contained in:
minoplhy 2024-03-09 13:27:57 +07:00
parent cbfa056a96
commit e437c66e80
Signed by: minoplhy
GPG Key ID: 41D406044E2434BF
7 changed files with 72 additions and 32 deletions

View File

@ -1,6 +1,7 @@
+++ +++
title = "{{ replace .Name "-" " " | title }}" title = "{{ replace .Name "-" " " | title }}"
date = "{{ .Date }}" date = "{{ .Date }}"
lastmod = "{{ .Lastmod }}
# #
# description is optional # description is optional

View File

@ -16,6 +16,7 @@
{{ end -}} {{ end -}}
{{- partial "style.html" . -}} {{- partial "style.html" . -}}
{{- partial "script.html" . -}}
<!-- A partial to be overwritten by the user. <!-- A partial to be overwritten by the user.
Simply place a custom_head.html into Simply place a custom_head.html into
@ -37,6 +38,7 @@
<!-- A partial to be overwritten by the user. <!-- A partial to be overwritten by the user.
Simply place a custom_body.html into Simply place a custom_body.html into
your local /layouts/partials-directory --> your local /layouts/partials-directory -->
{{- partial "script_bottom.html" -}}
{{- partial "custom_body.html" . -}} {{- partial "custom_body.html" . -}}
</body> </body>

View File

@ -6,6 +6,12 @@
<time datetime='{{ .Date.Format "2006-01-02" }}' pubdate> <time datetime='{{ .Date.Format "2006-01-02" }}' pubdate>
{{ .Date.Format (default "02 Jan, 2006" .Site.Params.dateFormat) }} {{ .Date.Format (default "02 Jan, 2006" .Site.Params.dateFormat) }}
</time> </time>
{{ if ne .Lastmod .Date }}
/ <b>EDIT :
<time datetime='{{ .Lastmod.Format "2006-01-02" }}'>
{{ .Lastmod.Format (default "02 Jan, 2006" .Site.Params.dateFormat) }}
</time></b>
{{ end }}
</i> </i>
</p> </p>
{{ end }}{{ end }} {{ end }}{{ end }}

View File

@ -5,3 +5,6 @@
{{ with .Site.GetPage "/blog" }} {{ with .Site.GetPage "/blog" }}
<a href="{{ "blog" | relURL }}">Blog</a> <a href="{{ "blog" | relURL }}">Blog</a>
{{ end }} {{ end }}
<a id="dark-mode-button" onclick="darkmode()" >
<span>Toggle-Dark-Mode</span>
</a>

View File

@ -0,0 +1,25 @@
<script>
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches && localStorage.getItem('dark-mode') === null) {
localStorage.setItem('dark-mode', 'true');
}
function darkmode() {
if (localStorage.getItem('dark-mode') === 'false') {
darkmode_enable();
} else if (localStorage.getItem('dark-mode') === null) {
darkmode_enable();
} else {
darkmode_disable();
}
}
function darkmode_enable() {
document.body.classList.add("dark-mode");
localStorage.setItem('dark-mode', 'true');
}
function darkmode_disable() {
document.body.classList.remove("dark-mode");
localStorage.setItem('dark-mode', 'false');
}
</script>

View File

@ -0,0 +1,5 @@
<script>
if (localStorage.getItem('dark-mode') === 'true') {
darkmode_enable()
}
</script>

View File

@ -126,48 +126,46 @@
color: #8b6fcb; color: #8b6fcb;
} }
@media (prefers-color-scheme: dark) { .dark-mode {
body {
background-color: #333; background-color: #333;
color: #ddd; color: #ddd;
} }
h1, .dark-mode h1,
h2, .dark-mode h2,
h3, .dark-mode h3,
h4, .dark-mode h4,
h5, .dark-mode h5,
h6, .dark-mode h6,
strong, .dark-mode strong,
b { .dark-mode b {
color: #eee; color: #eee;
} }
a { .dark-mode a {
color: #8cc2dd; color: #8cc2dd;
} }
code { .dark-mode code {
background-color: #777; background-color: #777;
} }
pre code { .dark-mode pre code {
color: #ddd; color: #ddd;
} }
blockquote { .dark-mode blockquote {
color: #ccc; color: #ccc;
} }
textarea, .dark-mode textarea,
input { .dark-mode input {
background-color: #252525; background-color: #252525;
color: #ddd; color: #ddd;
} }
.helptext { .dark-mode .helptext {
color: #aaa; color: #aaa;
} }
}
</style> </style>