24 lines
854 B
Vue
24 lines
854 B
Vue
<script setup>
|
|
const { cosetta } = defineProps({
|
|
cosetta: {
|
|
type: Object,
|
|
required: true
|
|
}
|
|
})
|
|
</script>
|
|
<template>
|
|
<div class="rounded overflow-hidden shadow-lg flex flex-col justify-between">
|
|
<img class="object-cover w-full h-48" :src="`/${cosetta.images[0]}`" alt="Mountain">
|
|
<div class="px-6 py-4 grow">
|
|
<nuxt-link :to="`/c/${cosetta.uuid}`">
|
|
<h2 class="text-pink-500 card-title hover:underline uppercase mb-2 line-clamp-2" v-text='cosetta.name' />
|
|
</nuxt-link>
|
|
<p class="text-gray-700 text-base line-clamp-3" v-text='cosetta.description' />
|
|
</div>
|
|
<div class="px-6 pt-4 pb-2">
|
|
<span v-for='tag in cosetta.tags' :key='tag'
|
|
class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2"
|
|
v-text='tag' />
|
|
</div>
|
|
</div>
|
|
</template>
|