2022-11-27 11:35:26 +09:00
|
|
|
<script setup lang="ts">
|
|
|
|
defineProps<{
|
|
|
|
text: string
|
|
|
|
icon: string
|
|
|
|
to: string
|
|
|
|
}>()
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<template>
|
|
|
|
<NuxtLink :to="to" active-class="text-primary" group focus:outline-none>
|
2022-11-27 13:45:26 +09:00
|
|
|
<div flex w-fit px5 py2 gap2 items-center transition-100 rounded-full group-hover:bg-active group-focus-visible:ring="2 current">
|
2022-11-27 11:35:26 +09:00
|
|
|
<slot name="icon">
|
|
|
|
<div :class="icon" />
|
|
|
|
</slot>
|
|
|
|
<span>{{ text }}</span>
|
|
|
|
</div>
|
|
|
|
</NuxtLink>
|
|
|
|
</template>
|