42 lines
1.0 KiB
Vue
42 lines
1.0 KiB
Vue
<script>
|
|
import { RouterLink } from 'vue-router';
|
|
import { Icon } from '@iconify/vue'
|
|
export default {
|
|
props: {
|
|
title: String,
|
|
description: String,
|
|
icon: String,
|
|
link: String,
|
|
},
|
|
components: {
|
|
Icon,
|
|
}
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
<div class="flex flex-col flex-nowrap justify-end bg-gray-dark w-64 h-64
|
|
rounded-2xl hover:ring-2 ring-blue p-6 cursor-pointer" v-on:click="$router.push(link)">
|
|
<div class="flex flex-row justify-center items-center h-full">
|
|
<icon :icon="icon" class="h-20 w-20 text-white" />
|
|
</div>
|
|
<div>
|
|
<h1 class="text-4xl m-0">{{ title }}</h1>
|
|
<p class="text-white h-12">{{ description }}</p>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
|
|
<style>
|
|
/* .card {
|
|
color: var(--white);
|
|
padding: 0 10px;
|
|
margin: 10px;
|
|
border-radius: 10px;
|
|
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
|
height: fit-content;
|
|
} */
|
|
</style> |