Merge pull request #31 from peterkos/peterkos/fix-theme-toggle-jumpiness

Fix navigation jumpiness on theme toggle click
not-matthias · Oct 3, 2023 · 441bb67 · 441bb67
2 parents 6ea17cf + 754cd6f
commit 441bb67
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 3 deletions.
diff --git a/sass/parts/_header.scss b/sass/parts/_header.scss
@@ -67,6 +67,13 @@ header .main {
   letter-spacing: -0.5px;
 }
 
+#dark-mode-toggle>img {
+  display: none;
+  width: 15px;
+  height: 15px;
+  border: unset;
+}
+
 h1,
 h2,
 h3,

diff --git a/templates/partials/nav.html b/templates/partials/nav.html
@@ -19,9 +19,9 @@
 
     {% if config.extra.theme == "toggle" %}
     <nav>
-        | <a id="dark-mode-toggle" onclick="toggleTheme()" href="">
-            <img src="feather/sun.svg" id="sun-icon" style="border: unset; filter: invert(1); display: none" height="15"/>
-            <img src="feather/moon.svg" id="moon-icon" style="border: unset; display: none" height="15" />
+        | <a id="dark-mode-toggle" onclick="toggleTheme()" href="#">
+            <img src="feather/sun.svg" id="sun-icon" style="filter: invert(1);" />
+            <img src="feather/moon.svg" id="moon-icon" />
         </a>
         <script src={{ get_url(path="js/themetoggle.js" ) }}></script>
     </nav>