41 lines
989 B
Vue
41 lines
989 B
Vue
<template>
|
|
<div
|
|
class="flex flex-col rounded-3xl border-4 border-white min-h-64 w-full"
|
|
:class="{
|
|
'bg-consumo-extra-light': color === 'consumo',
|
|
'bg-iguales-extra-light': color === 'iguales',
|
|
'bg-aula-extra-light': color === 'aula',
|
|
'bg-certifica-extra-light': color === 'certifica',
|
|
'bg-foro-extra-light': color === 'foro',
|
|
'bg-ods-extra-light': color === 'ods',
|
|
}">
|
|
<div class="flex flex-col gap-2 bg-white px-6 py-8 rounded-b-2xl mt-auto min-h-44">
|
|
<h4 class="text-5.5 font-semibold uppercase">{{ title }}</h4>
|
|
<p class="text-base" v-html="description"></p>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: {
|
|
color: {
|
|
type: String,
|
|
default: "consumo",
|
|
},
|
|
title: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
description: {
|
|
type: String,
|
|
default: ''
|
|
}
|
|
},
|
|
computed: {
|
|
langcode() {
|
|
return this.$store.getters.langcode;
|
|
},
|
|
},
|
|
}
|
|
</script> |