<script setup>
  const { isDesktopOrTablet } = useDevice();
</script>

<template>
  <header>
    <NuxtLink to="/" class="logo"><h1>Capital <br/>Region <br/>Bitcoin <br/>Network</h1></NuxtLink>
    <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="/members" v-if="isDesktopOrTablet" ><h2>Members</h2></NuxtLink>
    </div>
    <div class="auth" v-if="isDesktopOrTablet" >
      <NuxtLink to="/register"><h2>Register</h2></NuxtLink>
      <NuxtLink to="/login"><h2>Sign in</h2></NuxtLink>
    </div>
  </header>
</template>