diff --git a/src/assets/js/main.js b/src/assets/js/main.js index 03eaaf2..7b0b75c 100644 --- a/src/assets/js/main.js +++ b/src/assets/js/main.js @@ -1,7 +1,3 @@ -// Add your javascript here - -window.darkMode = false; - const stickyClasses = ["fixed", "h-14"]; const unstickyClasses = ["absolute", "h-20"]; const stickyClassesContainer = [ @@ -17,32 +13,12 @@ let headerElement = null; document.addEventListener("DOMContentLoaded", () => { headerElement = document.getElementById("header"); - if ( - localStorage.getItem("dark_mode") && - localStorage.getItem("dark_mode") === "true" - ) { - window.darkMode = true; - showNight(); - } else { - showDay(); - } stickyHeaderFuncionality(); applyMenuItemClasses(); evaluateHeaderPosition(); mobileMenuFunctionality(); }); -// window.toggleDarkMode = function(){ -// document.documentElement.classList.toggle('dark'); -// if(document.documentElement.classList.contains('dark')){ -// localStorage.setItem('dark_mode', true); -// window.darkMode = true; -// } else { -// window.darkMode = false; -// localStorage.setItem('dark_mode', false); -// } -// } - window.stickyHeaderFuncionality = () => { window.addEventListener("scroll", () => { evaluateHeaderPosition(); @@ -69,70 +45,6 @@ window.evaluateHeaderPosition = () => { } }; -document.getElementById("darkToggle").addEventListener("click", () => { - document.documentElement.classList.add("duration-300"); - - if (document.documentElement.classList.contains("dark")) { - localStorage.removeItem("dark_mode"); - showDay(true); - } else { - localStorage.setItem("dark_mode", true); - showNight(true); - } -}); - -function showDay(animate) { - document.getElementById("sun").classList.remove("setting"); - document.getElementById("moon").classList.remove("rising"); - - let timeout = 0; - - if (animate) { - timeout = 500; - - document.getElementById("moon").classList.add("setting"); - } - - setTimeout(() => { - document.getElementById("dayText").classList.remove("hidden"); - document.getElementById("nightText").classList.add("hidden"); - - document.getElementById("moon").classList.add("hidden"); - document.getElementById("sun").classList.remove("hidden"); - - if (animate) { - document.documentElement.classList.remove("dark"); - document.getElementById("sun").classList.add("rising"); - } - }, timeout); -} - -function showNight(animate) { - document.getElementById("moon").classList.remove("setting"); - document.getElementById("sun").classList.remove("rising"); - - let timeout = 0; - - if (animate) { - timeout = 500; - - document.getElementById("sun").classList.add("setting"); - } - - setTimeout(() => { - document.getElementById("nightText").classList.remove("hidden"); - document.getElementById("dayText").classList.add("hidden"); - - document.getElementById("sun").classList.add("hidden"); - document.getElementById("moon").classList.remove("hidden"); - - if (animate) { - document.documentElement.classList.add("dark"); - document.getElementById("moon").classList.add("rising"); - } - }, timeout); -} - window.applyMenuItemClasses = () => { const menuItems = document.querySelectorAll("#menu a"); for (let i = 0; i < menuItems.length; i++) { @@ -140,7 +52,6 @@ window.applyMenuItemClasses = () => { menuItems[i].classList.add("text-neutral-900", "dark:text-white"); } } - //:class="{ 'text-neutral-900 dark:text-white': window.location.pathname == '{menu.url}', 'text-neutral-700 dark:text-neutral-400': window.location.pathname != '{menu.url}' }" }; function mobileMenuFunctionality() { diff --git a/src/layouts/main.astro b/src/layouts/main.astro index 7c9ee3b..e61bef1 100644 --- a/src/layouts/main.astro +++ b/src/layouts/main.astro @@ -15,10 +15,7 @@ const { title } = Astro.props;