Implementing theme switcher.
h3rald h3rald@h3rald.com
Sat, 10 Feb 2024 15:19:43 +0100
2 files changed,
2 insertions(+),
15 deletions(-)
M
assets/styles/style.css
→
assets/styles/style.css
@@ -3,8 +3,7 @@ /* Credits: https://endtimes.dev/no-javascript-dark-mode-toggle/ */
/* Tutorial CSS starts here */ :root { - --bg: white; - --text: black; + --html-font-size: 18px; --base-font-size: 1rem; --line-height: 1.5;@@ -29,9 +28,6 @@ }
@media (prefers-color-scheme: dark) { :root { - --bg: black; - --text: white; - --link-color: #e96363; --link-hover-color: #ff6e6e;@@ -49,9 +45,6 @@ }
} #color-mode:checked~* { - --bg: black; - --text: white; - --link-color: #e96363; --link-hover-color: #ff6e6e;@@ -69,9 +62,6 @@ }
@media (prefers-color-scheme: dark) { #color-mode:checked~* { - --bg: white; - --text: black; - --link-color: #b73333; --link-hover-color: #653131;@@ -90,8 +80,6 @@ }
.color-scheme-wrapper { min-height: 100vh; - background: var(--bg); - color: var(--text); } .light-mode-hide {@@ -109,7 +97,6 @@ .light-mode-hide {
display: initial; } } - html {