Skip to content

Commit

Permalink
lien cards global et ajout d'un composant
Browse files Browse the repository at this point in the history
  • Loading branch information
Bacati committed Oct 15, 2024
1 parent 68e4597 commit 480c273
Show file tree
Hide file tree
Showing 4 changed files with 70 additions and 12 deletions.
Binary file added public/images/moteur.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
5 changes: 3 additions & 2 deletions src/components/global/Cards.astro
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
const { title, description, price, imageSrc, lien, logo, typeMotor, typeMotor1 } = Astro.props;
import { Eye } from 'lucide-astro';
---

<a href={lien}>
<div class="bg-white flex flex-col justify-center items-center w-80 lg:w-96 p-6 rounded-3xl shadow-lg card slide">
<div class="flex justify-between items-center w-full">
<p class="font-bold text-3xl w-3/4 lg:w-3/5">{title}</p>
Expand All @@ -25,6 +25,7 @@ import { Eye } from 'lucide-astro';
</div>
<div class="flex justify-between items-center w-full mt-4">
<p class="font-bold text-3xl">{price}€</p>
<a href={lien}><Eye class="bg-amber-600 p-2 w-10 h-10 rounded-2xl text-white" /></a>
<Eye class="bg-amber-600 p-2 w-10 h-10 rounded-2xl text-white" />
</div>
</div>
</a>
21 changes: 21 additions & 0 deletions src/components/global/CardsProduct.astro
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
---
const { title, description, imageSrc, lien, logo } = Astro.props;
import { Eye } from 'lucide-astro';
---
<a href={lien}>
<div class="bg-white flex flex-col justify-center items-center w-80 lg:w-96 p-6 rounded-3xl shadow-lg card slide">
<div class="flex justify-between items-center w-full">
<p class="font-bold text-3xl w-3/4 lg:w-3/5">{title}</p>
<img class="w-1/4" src={logo}>
</div>
<div class="w-full flex justify-between mt-2 items-center">
<p class="text-gray-400">{description}</p>
</div>
<div class="cards rounded-full w-52 h-52 flex items-center justify-center mt-6">
<img class="max-w-72 lg:max-w-60 -mt-6" alt="" src={imageSrc} />
</div>
<div class="flex justify-between items-center w-full mt-4">
<Eye class="bg-amber-600 p-2 w-10 h-10 rounded-2xl text-white" />
</div>
</div>
</a>
56 changes: 46 additions & 10 deletions src/pages/categorie/esthetique.astro
Original file line number Diff line number Diff line change
@@ -1,8 +1,7 @@
---
import Cards from 'components/global/Cards.astro';
import CardsProduct from 'components/global/CardsProduct.astro';
import MainLayout from 'layouts/MainLayout.astro';
import { MoveUp } from 'lucide-astro';
---

<MainLayout title="Trouve ta pièce ALLDAYS" class="overflow-x-hidden">
Expand All @@ -16,15 +15,52 @@ import { MoveUp } from 'lucide-astro';
</div>
<div class="gradient-config w-full h-2 rounded-b-3xl"></div>
</div>
<div class="pt-14">
<div>
<div class="flex justify-center my-8 gap-4 flex-wrap">
<CardsProduct
title="Thermolaquage"
logo="/public/images/logo.svg"
description="nom de l'entreprise"
imageSrc="/public/images/moteur.png"
lien=""
/>
<CardsProduct
title="Kit déco"
logo="/public/images/logo.svg"
description="nom de l'entreprise"
imageSrc="/public/images/moteur.png"
lien=""
/>
<CardsProduct
title="Thermolaquage"
logo="/public/images/logo.svg"
description="nom de l'entreprise"
imageSrc="/public/images/moteur.png"
lien=""
/>
</div>
<div class="flex justify-center my-8 gap-4 flex-wrap">
<Cards
title="fhdhfd"
logo=""
description="gfdgdf"
imageSrc="{`/images/${product.image}`}"
lien="{`/product/config?config=${product.configKey}#item-1`}"
/>
<CardsProduct
title="Thermolaquage"
logo="/public/images/logo.svg"
description="nom de l'entreprise"
imageSrc="/public/images/moteur.png"
lien=""
/>
<CardsProduct
title="Kit déco"
logo="/public/images/logo.svg"
description="nom de l'entreprise"
imageSrc="/public/images/moteur.png"
lien=""
/>
<CardsProduct
title="Thermolaquage"
logo="/public/images/logo.svg"
description="nom de l'entreprise"
imageSrc="/public/images/moteur.png"
lien=""
/>
</div>
</div>

Expand Down

0 comments on commit 480c273

Please sign in to comment.