<script setup>
import LogoWidget from "./LogoWidget.vue";
import { RouterLink } from "vue-router";
</script>

<template>
  <header
    class="sticky top-0 z-10 w-full border-b border-surface-200 bg-surface-0/95 backdrop-blur dark:border-surface-700 dark:bg-surface-900/95"
  >
    <div
      class="landing-container flex h-14 items-center justify-between sm:h-16"
    >
      <RouterLink
        to="/"
        class="flex items-center gap-3 text-surface-900 no-underline dark:text-surface-0"
        aria-label="Home"
      >
        <LogoWidget class-name="h-7 w-auto sm:h-8" />
      </RouterLink>
    </div>
  </header>
</template>
