diff options
Diffstat (limited to 'docs/components/app/ThemeSelect.vue')
| -rw-r--r-- | docs/components/app/ThemeSelect.vue | 41 |
1 files changed, 0 insertions, 41 deletions
diff --git a/docs/components/app/ThemeSelect.vue b/docs/components/app/ThemeSelect.vue deleted file mode 100644 index 158b965..0000000 --- a/docs/components/app/ThemeSelect.vue +++ /dev/null @@ -1,41 +0,0 @@ -<script setup lang="ts"> -const colorMode = useColorMode() -const onClick = () => { - const values = ['system', 'light', 'dark'] - const index = values.indexOf(colorMode.preference) - const next = (index + 1) % values.length - - colorMode.preference = values[next] -} -</script> - -<template> - <button aria-label="Color Mode" @click="onClick"> - <ColorScheme placeholder="..."> - <Icon v-if="colorMode.preference === 'dark'" name="uil:moon" /> - <Icon v-else-if="colorMode.preference === 'light'" name="uil:sun" /> - <Icon v-else name="uil:desktop" /> - </ColorScheme> - </button> -</template> - -<style lang="ts" scoped> -css({ - button: { - display: 'flex', - padding: '{space.4}', - - color: '{color.gray.500}', - '@dark': { - color: '{color.gray.400}' - }, - - '&:hover': { - color: '{color.gray.700}', - '@dark': { - color: '{color.gray.200}', - } - }, - } -}) -</style> |
