<template>
  <div class="column items-center bg-white fit q-pa-lg rounded-card fit">
    <q-icon
      :name="icon"
      size="xl"
      color="primary"
    />
    <div class="text-bold text-h5 text-center q-pt-md">
      {{ $t(title) }}
    </div>
    <div class="text-grey text-body1 text-center q-pt-sm text-wrap">
      {{ $t(description) }}
    </div>
  </div>
</template>

<script setup lang="ts">
defineProps({
  icon: String,
  title: String,
  description: String
})
</script>

<style scoped>
</style>
