Switch to another icons

justchillinfren · justchillinfren · commit 55b7f47cf152 · 2023-06-05T15:18:32.000Z
diff --git a/images/moon-regular.svg b/images/moon-regular.svg
diff --git a/images/moon.svg b/images/moon.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-moon"><path d="M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z"/></svg>
diff --git a/images/sun-regular.svg b/images/sun-regular.svg
diff --git a/images/sun.svg b/images/sun.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sun"><circle cx="12" cy="12" r="4"/><path d="M12 2v2"/><path d="M12 20v2"/><path d="m4.93 4.93 1.41 1.41"/><path d="m17.66 17.66 1.41 1.41"/><path d="M2 12h2"/><path d="M20 12h2"/><path d="m6.34 17.66-1.41 1.41"/><path d="m19.07 4.93-1.41 1.41"/></svg>
diff --git a/index.html b/index.html
@@ -19,7 +19,7 @@
     <a href="https://github.com/AxolotlClient/">GitHub</a>
     <a href="https://discord.gg/9Q3brQVQZN">Discord</a>
   </div>
-  <div class="navbar-right"><img src="images/moon-regular.svg" alt="" id="switcher"></div>
+  <div class="navbar-right"><img src="images/moon.svg" alt="" id="switcher"></div>
 </div>
 
 <body>
diff --git a/script.js b/script.js
@@ -17,10 +17,10 @@ const rootElem = document.documentElement;
 const darkThemeMq = window.matchMedia("(prefers-color-scheme: dark)");
 if (darkThemeMq.matches) {
   rootElem.setAttribute("data-theme", "dark");
-  document.getElementById("switcher").src = "images/sun-regular.svg";
+  document.getElementById("switcher").src = "images/sun.svg";
 } else {
   rootElem.setAttribute("data-theme", "light");
-  document.getElementById("switcher").src = "images/moon-regular.svg";
+  document.getElementById("switcher").src = "images/moon.svg";
 }
 
 const switchTheme = () => {
@@ -30,9 +30,9 @@ const switchTheme = () => {
   switchIcon = document.getElementById("switcher");
   rootElem.setAttribute("data-theme", newTheme);
   if (dataTheme === "dark") {
-    switcher.src = "images/moon-regular.svg";
+    switcher.src = "images/moon.svg";
   } else {
-    switcher.src = "images/sun-regular.svg";
+    switcher.src = "images/sun.svg";
   }
 };
 
