<script setup lang="ts">
const { menuItems } = await useMenuItems("MAIN");
</script>

<template>
  <UHeader title="CCAT" mode="slideover">
    <template #left>
      <NuxtLink to="/">
        <SvgLogoCcat class="h-12 w-auto shrink-0" />
      </NuxtLink>
    </template>
    <template #right>
      <UNavigationMenu :items="menuItems" variant="link" content-orientation="vertical" class="hidden lg:block" :ui="{ list: '-mx-2.5', link: 'text-base', childLink: 'text-base' }" />
    </template>
    <template #body>
      <UNavigationMenu :items="menuItems" orientation="vertical" />
    </template>
  </UHeader>
</template>
