crbtc.org/components/Header.vue

34 lines
1.1 KiB
Vue
Raw Normal View History

2023-07-17 19:11:13 +00:00
<script setup>
const { isDesktopOrTablet } = useDevice();
2023-07-28 01:44:21 +00:00
const user = useDirectusUser();
const { logout } = useDirectusAuth()
/* <NuxtLink to="/" class="logo"><h1>Capital <br/>Region <br/>Bitcoin <br/>Network</h1></NuxtLink> */
/* <a @click="logout" ><h2>Logout</h2></a> */
2023-07-17 19:11:13 +00:00
</script>
<template>
<header>
<div class="logo">
<NuxtLink to="/">
<img src="/img/logo.png" alt="Capital Region Bitcoin Network">
</NuxtLink>
</div>
2023-07-17 19:11:13 +00:00
<div class="nav" >
<NuxtLink to="/about"><h2>About</h2></NuxtLink>
<NuxtLink to="/#guides"><h2>Guides</h2></NuxtLink>
<NuxtLink to="/#events" ><h2>Events</h2></NuxtLink>
<NuxtLink to="/" v-if="isDesktopOrTablet" ><h2>Members</h2></NuxtLink>
2023-07-17 19:11:13 +00:00
</div>
2023-07-28 01:44:21 +00:00
<div class="auth" v-if="isDesktopOrTablet">
<div class="links" v-if="!user">
<NuxtLink to="/register"><h2>Register</h2></NuxtLink>
<NuxtLink to="/login"><h2>Sign in</h2></NuxtLink>
</div>
<div class="user" v-if="user">
<NuxtLink :to="'/u/' + user.external_identifier"><h2>{{user.first_name}}</h2></NuxtLink>
2023-07-28 01:44:21 +00:00
</div>
2023-07-17 19:11:13 +00:00
</div>
</header>
</template>