card, cose, sistemazioni varie

This commit is contained in:
lesion 2022-08-15 10:35:37 +02:00
parent 5c7fdf48bb
commit c1290ce317
3 changed files with 14 additions and 9 deletions

View file

@ -2,7 +2,6 @@
<div>
<NuxtLayout>
<Header/>
<Hero v-if="$route.name === 'index'"/>
<NuxtPage/>
<Footer/>
</NuxtLayout>

View file

@ -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>

View file

@ -6,8 +6,9 @@ const cosette = await $fetch('/api/cosette')
<section class="bg-white py-8">
<Upload />
<Hero/>
<div class="container mx-auto flex items-center flex-wrap pt-4 pb-12">
<div class="container mx-auto flex items-center flex-wrap pt-4 pb-12 px-2">
<nav id="store" class="w-full z-30 top-0 px-6 py-1">
<div class="w-full container mx-auto flex flex-wrap items-center justify-between mt-0 px-2 py-3">
<a class="uppercase tracking-wide no-underline hover:no-underline font-bold text-yellow text-xl" href="https://it.hackmeeting.org">Hackmeeting 0x19</a>
@ -23,7 +24,9 @@ const cosette = await $fetch('/api/cosette')
</div>
</div>
</nav>
<Cosetta v-for='cosetta in cosette' :key='cosetta.id' :cosetta='cosetta' />
<div class="p-10 grid grid-cols-1 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-3 gap-5">
<Cosetta v-for='cosetta in cosette' :key='cosetta.id' :cosetta='cosetta' />
</div>
</div>