24 lines
471 B
Vue
24 lines
471 B
Vue
<script setup lang="ts">
|
|
const colorMode = useColorMode();
|
|
|
|
const isDark = computed({
|
|
get() {
|
|
return colorMode.value === "dark";
|
|
},
|
|
set() {
|
|
colorMode.preference = colorMode.value === "dark" ? "light" : "dark";
|
|
},
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<UButton
|
|
:icon="isDark ? 'i-heroicons-moon-20-solid' : 'i-heroicons-sun-20-solid'"
|
|
color="gray"
|
|
variant="ghost"
|
|
aria-label="Theme"
|
|
class="w-8 h-8"
|
|
@click="isDark = !isDark"
|
|
/>
|
|
</template>
|