Some checks failed
🚀 Deploy - Demo / deployment (push) Has been cancelled
- 웹훅 URL을 https://admin.youtooplay.com/webhook로 변경 - Nginx 리버스 프록시 설정 파일 추가 - 배포 가이드 업데이트
34 lines
933 B
Vue
34 lines
933 B
Vue
<script setup lang="ts">
|
|
import { useTheme } from 'vuetify'
|
|
import type { ThemeSwitcherTheme } from '@layouts/types'
|
|
|
|
const props = defineProps<{
|
|
themes: ThemeSwitcherTheme[]
|
|
}>()
|
|
|
|
const { name: themeName, global: globalTheme } = useTheme()
|
|
const { state: currentThemeName, next: getNextThemeName, index: currentThemeIndex } = useCycleList(props.themes.map(t => t.name), { initialValue: themeName })
|
|
|
|
const changeTheme = () => {
|
|
globalTheme.name.value = getNextThemeName()
|
|
}
|
|
|
|
// Update icon if theme is changed from other sources
|
|
watch(() => globalTheme.name.value, val => {
|
|
currentThemeName.value = val
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<IconBtn @click="changeTheme">
|
|
<VIcon :icon="props.themes[currentThemeIndex].icon" />
|
|
<VTooltip
|
|
activator="parent"
|
|
open-delay="1000"
|
|
scroll-strategy="close"
|
|
>
|
|
<span class="text-capitalize">{{ currentThemeName }}</span>
|
|
</VTooltip>
|
|
</IconBtn>
|
|
</template>
|