add temp theme selector

This commit is contained in:
axolotle 2023-07-26 04:30:24 +02:00
parent b24bd4d5ff
commit 50e3d29c65

View file

@ -7,6 +7,40 @@ const { t } = useI18n()
const isLoggedIn = useIsLoggedIn() const isLoggedIn = useIsLoggedIn()
const me = await useUserInfo() const me = await useUserInfo()
const colorMode = useColorMode()
const themes = [
'system',
'light',
'dark',
'cupcake',
'bumblebee',
'emerald',
'corporate',
'synthwave',
'retro',
'cyberpunk',
'valentine',
'halloween',
'garden',
'forest',
'aqua',
'lofi',
'pastel',
'fantasy',
'wireframe',
'black',
'luxury',
'dracula',
'cmyk',
'autumn',
'business',
'acid',
'lemonade',
'night',
'coffee',
'winter',
]
const footerLinks = [ const footerLinks = [
{ text: t('footerlink_edit'), to: '/edit' }, { text: t('footerlink_edit'), to: '/edit' },
{ {
@ -55,11 +89,21 @@ async function logout() {
<h4 class="opacity-50">{{ me.mail }}</h4> <h4 class="opacity-50">{{ me.mail }}</h4>
</div> </div>
<!-- FIXME temp -->
<div class="ml-auto mr-4">
<label class="mr-4">theme:</label>
<select
v-model="colorMode.preference"
class="select select-bordered"
>
<option disabled selected>Theme</option>
<option v-for="theme of themes" :key="theme">{{ theme }}</option>
</select>
</div>
<YButton <YButton
variant="neutral"
icon="mdi:logout" icon="mdi:logout"
:text="t('logout')" :text="t('logout')"
class="ml-auto"
@click.prevent="logout" @click.prevent="logout"
/> />
</div> </div>