<template>
  <div class="q-pa-lg bg-white col-grow">
    <div class="result-description__icon" style="margin-bottom: 34px;">
      <q-icon :name="icon" size="130px" color="blue-grey-2" />
    </div>
    <div class="text-h6 q-mb-md">{{ title }}</div>
    <div class="text-blue-grey">
      <slot></slot>
    </div>
  </div>
</template>

<script lang="ts">
import { Component, Prop, Vue } from 'vue-property-decorator'
import { QIcon } from 'quasar'

@Component({ components: { QIcon } })
export default class ResultDescription extends Vue {
  @Prop(String) icon!: string
  @Prop(String) title!: string
}
</script>
