<template>
  <NuxtLink
    :to="itemData.to"
    class="flex cursor-pointer border-r h-36 border-[#ededed] items-center space-x-10 justify-center p-10 px-10"
  >
    <div>
      <div class="text-xl font-bold text-black-3">
        {{ itemData.title }}
      </div>
    </div>
    <img :src="itemData.icon" class="h-20 w-20 object-contain" alt="" />
  </NuxtLink>
</template>

<script setup>
defineProps({
  itemData: {
    type: Object,
    default: () => {
      return {};
    },
  },
});
</script>

<style lang="scss" scoped></style>
