SEECBC/FrontEnd/components/learning/ChapterCard.vue

<template>
  <v-card
    width="100%"
    height="100%"
    max-width="380"
    class="text-center"
    :to="to"
    nuxt
  >
    <v-img
      :aspect-ratio="2.3"
      width="100%"
      src="https://cdn.vuetifyjs.com/images/home/feature2.png"
    />
    <v-card-text class="pb-1">
      <h3 class="title">
        {{ $t(name) }}
      </h3>
      <p class="subtitle-1">
        {{ $t(description) }}
      </p>
    </v-card-text>
  </v-card>
</template>

<script lang="ts">
import Vue from 'vue'

export default Vue.extend({
  props: {
    name: {
      type: String,
      default: ''
    },
    description: {
      type: String,
      default: ''
    },
    to: {
      type: String,
      default: ''
    }
  }
})
</script>

<style scoped></style>