66 lines
1.8 KiB
Vue
66 lines
1.8 KiB
Vue
<script setup lang="ts">
|
|
const { loggedIn, clear } = useUserSession();
|
|
const { t, locale } = useI18n();
|
|
const localePath = useLocalePath();
|
|
const route = useRoute();
|
|
const switchLocalePath = useSwitchLocalePath();
|
|
</script>
|
|
|
|
<template>
|
|
<VaLayout :top="{ fixed: true, order: 2 }">
|
|
<template #top>
|
|
<VaNavbar shadowed>
|
|
<template #left>
|
|
<NuxtLink :to="localePath('/')" class="flex items-center gap-2">
|
|
<VaIcon name="photo_camera" color="primary" size="28px" />
|
|
<span class="text-xl font-bold">PicHunt</span>
|
|
</NuxtLink>
|
|
</template>
|
|
<template #right>
|
|
<div class="flex items-center gap-2">
|
|
<template v-if="loggedIn">
|
|
<VaButtonGroup preset="secondary" border-color="primary" round>
|
|
<VaButton
|
|
color="info"
|
|
:to="localePath('/profile')"
|
|
icon="account_circle"
|
|
/>
|
|
<VaButton icon="logout" @click="clear" />
|
|
</VaButtonGroup>
|
|
</template>
|
|
<template v-else>
|
|
<VaButton
|
|
preset="secondary"
|
|
:to="localePath(`/login?to=${route.path}`)"
|
|
>
|
|
{{ t('auth.login') }}
|
|
</VaButton>
|
|
<VaButton :to="localePath('/register')">
|
|
{{ t('auth.register') }}
|
|
</VaButton>
|
|
</template>
|
|
<VaButton
|
|
color="primary"
|
|
:to="switchLocalePath(locale === 'en' ? 'de' : 'en')"
|
|
icon="language"
|
|
/>
|
|
</div>
|
|
</template>
|
|
</VaNavbar>
|
|
</template>
|
|
|
|
<template #content>
|
|
<main>
|
|
<Suspense>
|
|
<slot />
|
|
</Suspense>
|
|
</main>
|
|
</template>
|
|
</VaLayout>
|
|
</template>
|
|
<style>
|
|
html {
|
|
scroll-behavior: smooth;
|
|
}
|
|
</style>
|