zephyr-frontend/src/components/NavigationMenuListItem.vue
2025-01-08 14:13:16 +08:00

26 lines
661 B
Vue

<script setup lang="ts">
import { NavigationMenuLink } from 'radix-vue'
const props = defineProps({
title: String,
})
</script>
<template>
<li>
<NavigationMenuLink as-child>
<a
v-bind="$attrs"
class="hover:bg-mauve3 block select-none rounded-[6px] p-3 text-[15px] leading-none no-underline outline-none transition-colors focus:shadow-[0_0_0_2px] focus:shadow-green7"
>
<div class="text-green12 mb-[5px] font-medium leading-[1.2]">
{{ props.title }}
</div>
<p class="text-mauve11 my-0 leading-[1.4]">
<slot />
</p>
</a>
</NavigationMenuLink>
</li>
</template>