cs2.tinysites.com/components/main/Header.vue

37 lines
1.3 KiB
Vue

<script setup>
const route = useRoute()
const user = useDirectusUser()
const { logout } = useDirectusAuth()
const signout = () => {
logout()
setTimeout(function () {
window.location.reload()
}, 1000)
}
</script>
<template>
<header>
<div class="head">
<NuxtLink class="logo" to="/">
<span class="icon-tinysites"></span>
</NuxtLink>
<ul class="nav">
<li><NuxtLink to="/" :class="route.path === '/' ? 'highlight' : ''">Overview</NuxtLink></li>
<li><NuxtLink to="/showcase" :class="route.path === '/showcase' ? 'highlight' : ''">Showcase</NuxtLink></li>
<li><NuxtLink to="/#pricing">Pricing</NuxtLink></li>
<li><NuxtLink to="/docs/get-started" :class="route.path.substring(1).split('/')[0] === 'docs' ? 'highlight' : ''">Docs</NuxtLink></li>
</ul>
<ul class="cta" v-if="!user">
<li class="pimary"><NuxtLink to="/site/">Get started <span>- it's free</span></NuxtLink></li>
<li class="secondary"><NuxtLink to="/login">Sign in</NuxtLink></li>
</ul>
<ul class="cta" v-if="user">
<li class="pimary"><NuxtLink to="/dashboard">Open dashboard</NuxtLink></li>
<li class="secondary"><a @click="signout()">Sign out</a></li>
</ul>
</div>
</header>
</template>