diff --git a/src/App.vue b/src/App.vue index 544aa41..46b6c25 100644 --- a/src/App.vue +++ b/src/App.vue @@ -3,7 +3,9 @@ import { ref, onMounted, watch } from "vue"; import { RouterLink, RouterView, useRoute } from "vue-router"; const route = useRoute(); -let themeIcon = ref(""); +const currentTheme = ref(null); +const themeIcon = ref(""); + onMounted(() => { if (localStorage.getItem("theme") === "light") { setTheme("light"); @@ -11,9 +13,11 @@ onMounted(() => { setTheme("dark"); } }); + watch(() => route.name, () => { toolLink.value.style.display = ""; }); + const switchTheme = () => { if (localStorage.getItem("theme") === "dark") { setTheme("light"); @@ -26,10 +30,12 @@ const setTheme = (theme) => { if (theme == "dark") { document.documentElement.className = "dark"; localStorage.setItem("theme", "dark"); + currentTheme.value = "dark"; themeIcon.value = "🌞"; } else { document.documentElement.className = ""; localStorage.setItem("theme", "light"); + currentTheme.value = "light"; themeIcon.value = "🌙"; } }; @@ -42,6 +48,7 @@ const toggleBurger = () => { toolLink.value.style.display = ""; } }; +