|
@@ -7,13 +7,16 @@ const { cosetta } = defineProps({
|
|
|
})
|
|
|
</script>
|
|
|
<template>
|
|
|
- <div class="w-full md:w-1/3 xl:w-1/4 p-6 flex flex-col">
|
|
|
+ <div class="rounded overflow-hidden shadow-lg">
|
|
|
+ <img class="object-cover w-full max-h-48" :src="`src/public/${cosetta.images[0]}`" alt="Mountain">
|
|
|
+ <div class="px-6 py-4">
|
|
|
<nuxt-link :to="`/c/${cosetta.uuid}`">
|
|
|
- <img class="hover:grow hover:shadow-lg" :src="`src/public/${cosetta.images[0]}`">
|
|
|
- <div class="pt-3 flex items-center justify-between">
|
|
|
- <p class=" text-black font-bold uppercase" v-text='cosetta.name'></p>
|
|
|
- </div>
|
|
|
- <p class="pt-1 text-gray-700 text-sm" v-text='cosetta.description'></p>
|
|
|
+ <h2 class="text-indigo-500 card-title hover:underline uppercase mb-2" v-text='cosetta.name' />
|
|
|
</nuxt-link>
|
|
|
+ <p class="text-gray-700 text-base" 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>
|