diff options
| author | 2023-04-19 17:50:02 +0800 | |
|---|---|---|
| committer | 2023-04-19 17:50:02 +0800 | |
| commit | 56a6240bf700ac307342ed494d8bfbabe5c822dc (patch) | |
| tree | 0b1288a2ec1cbb538c11f4c122b6a97b9c55a05f /docs/components/app/ThemeSelect.vue | |
| parent | 3adc965dd09490b7efa1cce9f09b0a3b30970277 (diff) | |
| download | HydroRoll-56a6240bf700ac307342ed494d8bfbabe5c822dc.tar.gz HydroRoll-56a6240bf700ac307342ed494d8bfbabe5c822dc.zip | |
✨docs init
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> |
