Partially defuse dark theme

Production build is broken and switching logic is bit flawed (JavaScript)
ZentriaMC · Jan 8, 2025 · 16c4262 · 16c4262
1 parent 83eaea4
commit 16c4262
Show file tree

Hide file tree

Showing 6 changed files with 5 additions and 87 deletions.
diff --git a/assets/scss/tale/_layout.scss b/assets/scss/tale/_layout.scss
@@ -1,5 +1,5 @@
 * {
-    @include transition($color-transition);
+    //@include transition($color-transition);
 }
 
 .container {
@@ -21,17 +21,6 @@ footer,
   width: 80%;
 }
 
-#darkModeToggle {
-    float: right;
-    position: sticky;
-    top: 2rem;
-    margin-right: 2rem;
-    margin-top: 2rem;
-    font-size: 2rem;
-
-    cursor: pointer;
-}
-
 .nav {
   box-shadow: 0 2px 2px -2px var(--shadow-color);
   overflow: auto;
@@ -43,7 +32,7 @@ footer,
   }
 
   &-title {
-    @include transition($color-transition, opacity .2s ease-out);
+    //@include transition($color-transition, opacity .2s ease-out);
     color: var(--default-color);
     display: inline-block;
     margin: 0;
@@ -63,7 +52,7 @@ footer,
   }
 
   li {
-    @include transition($color-transition, opacity .2s ease-out);
+    //@include transition($color-transition, opacity .2s ease-out);
     color: var(--default-color);
     display: inline-block;
     opacity: .6;

diff --git a/assets/scss/tale/_variables.scss b/assets/scss/tale/_variables.scss
@@ -11,7 +11,7 @@ $color-transition:
 
 // Make the default be dark mode. That way, the more complicated case is the
 // default and thus bugs are discovered earlier.
-:root.light {
+:root:not(.dark) {
     --default-color: #555;
     --background-color: #fff;
     --default-shade: #353535;
@@ -27,7 +27,7 @@ $color-transition:
     --code-filter: ;
 }
 
-:root:not(.light) {
+:root.dark {
     --default-color: #888;
     --background-color: #000;
     --default-shade: #989898;

diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
@@ -3,7 +3,6 @@
     {{ partial "head.html" . }}
     <body>
         {{ partial "header.html" . }}
-        {{ partial "darkmode.html" . }}
         {{ block "main" . }}{{ end }}
         {{ partial "footer.html" . }}
     </body>

diff --git a/layouts/partials/darkmode.html b/layouts/partials/darkmode.html
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
@@ -34,6 +34,4 @@
 
 		<!-- RSS -->
 		<link href="{{ with .OutputFormats.Get "RSS" }}{{ .RelPermalink }}{{ end }}" rel="alternate" type="application/rss+xml" title="{{ .Site.Title }}" />
-
-		<script src="{{ "js/darkmode.js" | relURL }}"></script>
 	</head>
diff --git a/static/js/darkmode.js b/static/js/darkmode.js