33 lines
648 B
TypeScript
33 lines
648 B
TypeScript
import { ref, onMounted } from "vue";
|
|
|
|
export function useTheme() {
|
|
const isDarkMode = ref(false);
|
|
|
|
function setTheme(dark: boolean) {
|
|
isDarkMode.value = dark;
|
|
document.documentElement.setAttribute(
|
|
"data-theme",
|
|
dark ? "dark" : "light",
|
|
);
|
|
localStorage.setItem("theme", dark ? "dark" : "light");
|
|
}
|
|
|
|
function toggleTheme() {
|
|
setTheme(!isDarkMode.value);
|
|
}
|
|
|
|
onMounted(() => {
|
|
const savedTheme = localStorage.getItem("theme");
|
|
if (savedTheme) {
|
|
setTheme(savedTheme === "dark");
|
|
} else {
|
|
setTheme(false);
|
|
}
|
|
});
|
|
|
|
return {
|
|
isDarkMode,
|
|
setTheme,
|
|
toggleTheme,
|
|
};
|
|
}
|