add type motor

Bacati · Oct 14, 2024 · 87008f8 · 87008f8
1 parent b91875e
commit 87008f8
Show file tree

Hide file tree

Showing 8 changed files with 70 additions and 15 deletions.
diff --git a/public/images/motor.svg b/public/images/motor.svg
diff --git a/src/components/global/Cards.astro b/src/components/global/Cards.astro
@@ -1,16 +1,19 @@
 ---
-const { title, description, price, imageSrc, lien, logo } = Astro.props;
+const { title, description, price, imageSrc, lien, logo, type } = Astro.props;
 import { Eye } from 'lucide-astro';
 ---
 
 <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/5">{title}</p>
+    <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">
+  <div class="w-full flex justify-between mt-2 items-center">
     <p class="text-gray-400">{description}</p>
-    <p class="px-2 border-orange-500 rounded-3xl border-2">AM6</p>
+    <div class=" flex gap-2">
+      <img src="/images/motor.svg">
+      <p class="px-3 border-orange-500 rounded-3xl border-2">{type}</p>
+    </div>
   </div>
   <div class="cards rounded-full w-60 h-60 flex items-center justify-center mt-6">
 	<img class="max-w-72 lg:max-w-80" alt="" src={imageSrc} />

diff --git a/src/components/global/TemplateConfig.astro b/src/components/global/TemplateConfig.astro
@@ -1,5 +1,5 @@
 ---
-const { title, enderTitle, description, price, images, pieces } = Astro.props;
+const { title, enderTitle, type, description, price, images, pieces } = Astro.props;
 import { ChevronDown, ChevronLeft, ChevronRight } from 'lucide-astro';
 ---
 
@@ -31,7 +31,13 @@ import { ChevronDown, ChevronLeft, ChevronRight } from 'lucide-astro';
     </div>
     <div class="p-4 lg:ml-10 lg:w-1/3">
         <p class="font-bold text-4xl">{title}</p>
-        <p class="text-gray-400">{enderTitle}</p>
+        <div class="w-full flex justify-between mt-2 items-center">
+            <p class="text-gray-400">{enderTitle}</p>
+            <div class=" flex gap-2">
+              <img src="/images/motor.svg">
+              <p class="px-3 border-orange-500 rounded-3xl border-2">{type}</p>
+            </div>
+          </div>
         <p class="mt-2">{description}</p>
         <div class="flex items-center gap-4 mt-4">
             <p class="text-gray-400">Coût total :</p>