Fix Theme
This commit is contained in:
parent
5631c6f140
commit
90e98199fd
|
@ -42,10 +42,6 @@
|
||||||
<main>
|
<main>
|
||||||
{{- block "main" . }}{{- end }}
|
{{- block "main" . }}{{- end }}
|
||||||
</main>
|
</main>
|
||||||
<div class="utils">
|
|
||||||
<div id="copy">©morgan.kr</div>
|
|
||||||
<div id="toggleColor">Toggle Darkmode</div>
|
|
||||||
</div>
|
|
||||||
<script>
|
<script>
|
||||||
console.log("Sending statistics to server. Personal info is redacted afterwards.");
|
console.log("Sending statistics to server. Personal info is redacted afterwards.");
|
||||||
console.log(fetch(`https://log.blog.morgan.kr/?url=${encodeURIComponent(document.location)}&referer=${encodeURIComponent(document.referrer)}`));
|
console.log(fetch(`https://log.blog.morgan.kr/?url=${encodeURIComponent(document.location)}&referer=${encodeURIComponent(document.referrer)}`));
|
||||||
|
|
|
@ -21,4 +21,9 @@
|
||||||
{{- if .IsHome }}
|
{{- if .IsHome }}
|
||||||
<a href="/blogs" style="font-size:10px; color: #AAA; bottom: 12px; position: fixed;">-</a>
|
<a href="/blogs" style="font-size:10px; color: #AAA; bottom: 12px; position: fixed;">-</a>
|
||||||
{{- end }}
|
{{- end }}
|
||||||
|
|
||||||
|
<div class="utils">
|
||||||
|
<div id="copy">©morgan.kr</div>
|
||||||
|
<div id="toggleColor">Toggle Darkmode</div>
|
||||||
|
</div>
|
||||||
{{ end }}
|
{{ end }}
|
|
@ -26,7 +26,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
:root[color-mode="dark"] {
|
:root[color-mode="dark"] {
|
||||||
--primary-bg-color: #242424;
|
--primary-bg-color: #181816;
|
||||||
--primary-text-color: white;
|
--primary-text-color: white;
|
||||||
--link-color: #8cc2dd;
|
--link-color: #8cc2dd;
|
||||||
--blockquote-text-color: #ccc;
|
--blockquote-text-color: #ccc;
|
||||||
|
@ -53,6 +53,9 @@
|
||||||
color: var(--primary-text-color);
|
color: var(--primary-text-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
}
|
||||||
|
|
||||||
h1 { font-size: 26px; }
|
h1 { font-size: 26px; }
|
||||||
h2 { font-size: 24px; }
|
h2 { font-size: 24px; }
|
||||||
h3 { font-size: 22px; }
|
h3 { font-size: 22px; }
|
||||||
|
@ -188,10 +191,7 @@
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
document.addEventListener("DOMContentLoaded", function() {
|
|
||||||
const toggleButton = document.getElementById("toggleColor")
|
|
||||||
const userPref = localStorage.getItem("theme");
|
const userPref = localStorage.getItem("theme");
|
||||||
|
|
||||||
if (userPref === "dark") {
|
if (userPref === "dark") {
|
||||||
document.documentElement.setAttribute("color-mode", "dark");
|
document.documentElement.setAttribute("color-mode", "dark");
|
||||||
} else if (userPref === "light") {
|
} else if (userPref === "light") {
|
||||||
|
@ -200,6 +200,9 @@
|
||||||
document.documentElement.setAttribute("color-mode", "dark");
|
document.documentElement.setAttribute("color-mode", "dark");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
document.addEventListener("DOMContentLoaded", function() {
|
||||||
|
const toggleButton = document.getElementById("toggleColor")
|
||||||
|
|
||||||
toggleButton.addEventListener("click", function() {
|
toggleButton.addEventListener("click", function() {
|
||||||
if (document.documentElement.getAttribute("color-mode") === "dark") {
|
if (document.documentElement.getAttribute("color-mode") === "dark") {
|
||||||
document.documentElement.setAttribute("color-mode", "light");
|
document.documentElement.setAttribute("color-mode", "light");
|
||||||
|
|
Loading…
Reference in New Issue