51 lines
1.1 KiB
Vue
51 lines
1.1 KiB
Vue
<script setup>
|
|
const runtimeConfig = useRuntimeConfig()
|
|
const theme = ref('light')
|
|
const toggleTheme = () => {
|
|
theme.value = theme.value === 'light' ? 'dark' : 'light'
|
|
}
|
|
const drawer = ref(false)
|
|
const showAppBar = computed(() => {
|
|
return !drawer.value
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<v-app
|
|
:theme="theme"
|
|
>
|
|
<v-navigation-drawer
|
|
v-model="drawer"
|
|
>
|
|
<v-list>
|
|
<ModelDialog/>
|
|
</v-list>
|
|
|
|
<template v-slot:append>
|
|
<v-divider></v-divider>
|
|
<v-list>
|
|
<ApiKeyDialog/>
|
|
|
|
<v-list-item
|
|
rounded="xl"
|
|
:prepend-icon="theme === 'light' ? 'dark_mode' : 'light_mode'"
|
|
:title="(theme === 'light' ? 'Dark' : 'Light') + ' mode'"
|
|
@click="toggleTheme"
|
|
></v-list-item>
|
|
</v-list>
|
|
</template>
|
|
</v-navigation-drawer>
|
|
|
|
<v-app-bar
|
|
class="d-lg-none"
|
|
>
|
|
<v-app-bar-nav-icon @click="drawer = !drawer"></v-app-bar-nav-icon>
|
|
|
|
<v-toolbar-title>{{ runtimeConfig.public.appName }}</v-toolbar-title>
|
|
</v-app-bar>
|
|
|
|
<v-main>
|
|
<NuxtPage/>
|
|
</v-main>
|
|
</v-app>
|
|
</template> |