50 lines
1.1 KiB
Vue
50 lines
1.1 KiB
Vue
<script setup lang="ts">
|
|
import type { ContentNavigationItem } from '@nuxt/content'
|
|
|
|
const navigation = inject<Ref<ContentNavigationItem[]>>('navigation')
|
|
const { header } = useAppConfig()
|
|
</script>
|
|
|
|
<template>
|
|
<UHeader
|
|
:ui="{ center: 'flex-1' }"
|
|
:to="header?.to || '/'"
|
|
>
|
|
<UContentSearchButton
|
|
v-if="header?.search"
|
|
:collapsed="false"
|
|
class="w-full"
|
|
/>
|
|
|
|
<template #left>
|
|
<NuxtLink :to="header?.to || '/'">
|
|
<AppLogo class="w-auto h-6 shrink-0" />
|
|
</NuxtLink>
|
|
</template>
|
|
|
|
<template #right>
|
|
<UContentSearchButton
|
|
v-if="header?.search"
|
|
class="lg:hidden"
|
|
/>
|
|
|
|
<UColorModeButton v-if="header?.colorMode" />
|
|
|
|
<template v-if="header?.links">
|
|
<UButton
|
|
v-for="(link, index) of header.links"
|
|
:key="index"
|
|
v-bind="{ color: 'neutral', variant: 'ghost', ...link }"
|
|
/>
|
|
</template>
|
|
</template>
|
|
|
|
<template #body>
|
|
<UContentNavigation
|
|
highlight
|
|
:navigation="navigation"
|
|
/>
|
|
</template>
|
|
</UHeader>
|
|
</template>
|