Protection

Author: TohyNyAina

Frontend/src/components/CardProduit/CardProduit.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, {useState} from 'react';
 import { Link } from 'react-router-dom';
 import { BiCartAdd } from 'react-icons/bi';
 import { AiOutlineHeart } from 'react-icons/ai';
@@ -13,6 +13,8 @@ const CardProduit = ({ data }) => {
     Dispatch(addToPanier(item_data));
   };
 
+  const [detail, setDetail] = useState(false);
+
   return (
     <div>
       <div className="max-w-sm bg-white px-6 pt-6 pb-2 rounded-xl shadow-lg transform hover:scale-105 transition duration-500">
@@ -29,15 +31,24 @@ const CardProduit = ({ data }) => {
           <div className="flex space-x-1 items-center">
             <p>Prix: {data.prix} Ar</p>
           </div>
+          <br/>
+          { detail &&
           <div className="flex space-x-1 items-center">
-            <p>Details: {data.description} Ar</p>
+            <p>Details: <br/> {data.description}</p>
           </div>
+          }
           <button
             className="mt-4 w-full text-white bg-blue-600 hover:bg-blue-400 py-2 rounded-xl shadow-lg"
             onClick={() => handleToPanier(data)}
           >
             Ajouter au panier
           </button>
+          <button
+            className="mt-4 w-full text-white bg-gray-600 hover:bg-gray-400 py-2 rounded-xl shadow-lg"
+            onClick={() => setDetail(!detail)}
+          >
+            {detail?'Réduire':'Voir details'}
+          </button>
         </div>
       </div>
     </div>

Frontend/src/components/CardProduitAdmin/Cardcrud.js

@@ -136,7 +136,7 @@ const Cardcrud = () => {
         </label>
         <label className="flex flex-col">
           Description:
-          <input
+          <textarea
             type="text"
             name="description"
             value={formValues.description}