{"ast":null,"code":"import _slicedToArray from\"C:/Users/user/Desktop/03portreact/node_modules/@babel/runtime/helpers/esm/slicedToArray.js\";import React,{useState}from\"react\";import Modal from\"./modal\";import{FontAwesomeIcon}from\"@fortawesome/react-fontawesome\";import{faCartShopping}from\"@fortawesome/free-solid-svg-icons\";import{jsx as _jsx}from\"react/jsx-runtime\";import{jsxs as _jsxs}from\"react/jsx-runtime\";import{Fragment as _Fragment}from\"react/jsx-runtime\";var Crea2=function Crea2(){var _useState=useState(\"/images/crea2/image-product-1.jpg\"),_useState2=_slicedToArray(_useState,2),imagePrincipal=_useState2[0],setImagePrincipal=_useState2[1];var _useState3=useState(false),_useState4=_slicedToArray(_useState3,2),modalOpen=_useState4[0],setModalOpen=_useState4[1];var _useState5=useState(0),_useState6=_slicedToArray(_useState5,2),count=_useState6[0],setCount=_useState6[1];var changeImage=function changeImage(imageNew){setImagePrincipal(imageNew);};var openModal=function openModal(){setModalOpen(true);};var closeModal=function closeModal(){setModalOpen(false);};var incrementCount=function incrementCount(){setCount(count+1);};var decrementCount=function decrementCount(){if(count>0)setCount(count-1);};return/*#__PURE__*/_jsx(_Fragment,{children:/*#__PURE__*/_jsxs(\"div\",{className:\"max-sm:w-full max-md:mt-10\",children:[/*#__PURE__*/_jsxs(\"section\",{className:\"bg-stone-100 max-sm:pb-10 p-10 w-full max-sm:w-full flex items-center space-x-5 justify-center max-sm:flex-col\",children:[/*#__PURE__*/_jsx(\"div\",{className:\"left w-1/2 max-sm:w-full flex flex-col justify-center items-center\",children:/*#__PURE__*/_jsxs(\"div\",{className:\"image h-2/3 w-2/3 max-sm:w-full space-y-5 flex flex-col items-center justify-center\",children:[/*#__PURE__*/_jsx(\"div\",{className:\"w-full cursor-pointer\",children:/*#__PURE__*/_jsx(\"img\",{src:imagePrincipal,className:\" w-full rounded-xl\",alt:\"product-principal\",onClick:openModal})}),/*#__PURE__*/_jsxs(\"div\",{className:\"allSmallImage h-1/3 w-full space-x-5 flex \",children:[/*#__PURE__*/_jsx(\"div\",{className:\" Smallimage w-44 \",children:/*#__PURE__*/_jsx(\"img\",{src:\"/images/crea2/image-product-1.jpg\",className:\"w-full h-auto rounded-xl \".concat(imagePrincipal===\"/images/crea2/image-product-1.jpg\"?\"border-2 border-orange-700 opacity-50\":\"\"),alt:\"product-1\",onClick:function onClick(){return changeImage(\"/images/crea2/image-product-1.jpg\");}})}),/*#__PURE__*/_jsx(\"div\",{className:\"Smallimage w-44 \",children:/*#__PURE__*/_jsx(\"img\",{src:\"/images/crea2/image-product-2.jpg\",className:\"w-full h-auto rounded-xl \".concat(imagePrincipal===\"/images/crea2/image-product-2.jpg\"?\"border-2 border-orange-700 opacity-50\":\"\"),alt:\"product-2\",onClick:function onClick(){return changeImage(\"/images/crea2/image-product-2.jpg\");}})}),/*#__PURE__*/_jsx(\"div\",{className:\"Smallimage w-44 \",children:/*#__PURE__*/_jsx(\"img\",{src:\"/images/crea2/image-product-3.jpg\",alt:\"product-3\",onClick:function onClick(){return changeImage(\"/images/crea2/image-product-3.jpg\");},className:\"w-full h-auto rounded-xl \".concat(imagePrincipal===\"/images/crea2/image-product-3.jpg\"?\"border-2 border-orange-700 opacity-50\":\"\")})}),/*#__PURE__*/_jsx(\"div\",{className:\"Smallimage w-44 \",children:/*#__PURE__*/_jsx(\"img\",{src:\"/images/crea2/image-product-4.jpg\",className:\"w-full h-auto rounded-xl \".concat(imagePrincipal===\"/images/crea2/image-product-4.jpg\"?\"border-2 border-orange-700 opacity-50\":\"\"),alt:\"product-4\",onClick:function onClick(){return changeImage(\"/images/crea2/image-product-4.jpg\");}})})]})]})}),/*#__PURE__*/_jsx(\"div\",{className:\"right w-1/2 max-sm:w-full flex flex-col space-y-10 p-10 justify-center\",children:/*#__PURE__*/_jsxs(\"div\",{className:\"flex flex-col space-y-10 w-full\",children:[/*#__PURE__*/_jsxs(\"div\",{className:\"title w-full \",children:[/*#__PURE__*/_jsx(\"div\",{children:/*#__PURE__*/_jsx(\"h2\",{className:\"text-orange-500 lg:text-xl max-sm:text-center \",children:\"SNEAKER COMPAGNY\"})}),/*#__PURE__*/_jsxs(\"div\",{className:\"mt-2\",children:[/*#__PURE__*/_jsx(\"h1\",{className:\"2xl:text-7xl lg:text-5xl max-sm:text-4xl max-sm:text-stone-900 w-full\",children:\"100% Tailwind\"}),/*#__PURE__*/_jsx(\"h1\",{className:\"2xl:text-7xl lg:text-5xl max-sm:text-4xl max-sm:text-stone-900 \",children:\"Sneakers\"})]})]}),/*#__PURE__*/_jsxs(\"div\",{children:[/*#__PURE__*/_jsx(\"p\",{className:\"text 2xl:w-4/6 text-justify text-stone-500\",children:\"Vous trouvez ici une page produit avec selction d'iamges et un carouselle en modal en cliquant sur l'image principale. Une petit compteur pour le panier.\"}),/*#__PURE__*/_jsx(\"p\",{className:\"text 2xl:w-4/6 text-justify text-stone-500\",children:\"Cette page est cod\\xE9 100% en Tailwind, responsive tablette, smartphone et ecran.\"})]}),/*#__PURE__*/_jsxs(\"div\",{className:\"flex items-center space-x-5 max-sm: max-sm:justify-center \",children:[/*#__PURE__*/_jsx(\"div\",{className:\"price text-4xl\",children:\" 354\\xA3\"}),/*#__PURE__*/_jsx(\"div\",{className:\"bg-orange-500 text-orange-900 p-1 rounded font-bold\",children:\"-50%\"})]}),/*#__PURE__*/_jsxs(\"div\",{className:\"panier flex space-x-1 w-2/3 max-sm:w-full justify-center items-center max-sm:flex-col max-sm:space-y-3 max-sm:pt-10 \",children:[/*#__PURE__*/_jsxs(\"div\",{className:\"cursor w-1/3 flex max-sm:w-full \",children:[/*#__PURE__*/_jsx(\"div\",{className:\" w-1/3 border rounded-xl flex items-center justify-center p-4 text-3xl max-sm:p-2 text-orange-600 \",onClick:incrementCount,children:\"+\"}),/*#__PURE__*/_jsxs(\"div\",{className:\"w-1/3 border rounded-xl flex items-center justify-center p-4 text-3xl max-sm:p-2 \",children:[\" \",count,\" \"]}),/*#__PURE__*/_jsx(\"div\",{className:\"w-1/3 border rounded-xl flex items-center justify-center p-4 text-3xl max-sm:p-2 text-orange-600 \",onClick:decrementCount,children:\"-\"})]}),/*#__PURE__*/_jsxs(\"button\",{className:\"flex items-center justify-center rounded-2xl w-2/3 max-sm:w-full bg-orange-500 space-x-5 p-5 \",children:[/*#__PURE__*/_jsxs(\"div\",{children:[\" \",/*#__PURE__*/_jsx(FontAwesomeIcon,{className:\"text-xl\",icon:faCartShopping})]}),/*#__PURE__*/_jsx(\"div\",{children:\"Ajouter au panier\"})]})]})]})})]}),modalOpen&&/*#__PURE__*/_jsx(\"div\",{className:\"gg flex items-center justify-center \",children:/*#__PURE__*/_jsx(Modal,{image:imagePrincipal,closeModal:closeModal})})]})});};export default Crea2;","map":{"version":3,"names":["React","useState","Modal","FontAwesomeIcon","faCartShopping","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","Crea2","_useState","_useState2","_slicedToArray","imagePrincipal","setImagePrincipal","_useState3","_useState4","modalOpen","setModalOpen","_useState5","_useState6","count","setCount","changeImage","imageNew","openModal","closeModal","incrementCount","decrementCount","children","className","src","alt","onClick","concat","icon","image"],"sources":["C:/Users/user/Desktop/03portreact/src/components/pages/design/crea2/crea2.js"],"sourcesContent":["import React, { useState } from \"react\";\r\nimport Modal from \"./modal\";\r\n\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCartShopping } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\nconst Crea2 = () => {\r\n const [imagePrincipal, setImagePrincipal] = useState(\r\n \"/images/crea2/image-product-1.jpg\"\r\n );\r\n const [modalOpen, setModalOpen] = useState(false);\r\n const [count, setCount] = useState(0);\r\n const changeImage = (imageNew) => {\r\n setImagePrincipal(imageNew);\r\n };\r\n\r\n const openModal = () => {\r\n setModalOpen(true);\r\n };\r\n const closeModal = () => {\r\n setModalOpen(false);\r\n };\r\n\r\n const incrementCount = () => {\r\n setCount(count + 1);\r\n };\r\n const decrementCount = () => {\r\n if (count > 0) setCount(count - 1);\r\n };\r\n\r\n return (\r\n <>\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n\r\n
\r\n
\r\n \r\n changeImage(\"/images/crea2/image-product-1.jpg\")\r\n }\r\n />\r\n
\r\n
\r\n \r\n changeImage(\"/images/crea2/image-product-2.jpg\")\r\n }\r\n />\r\n
\r\n
\r\n \r\n changeImage(\"/images/crea2/image-product-3.jpg\")\r\n }\r\n className={`w-full h-auto rounded-xl ${\r\n imagePrincipal === \"/images/crea2/image-product-3.jpg\"\r\n ? \"border-2 border-orange-700 opacity-50\"\r\n : \"\"\r\n }`}\r\n />\r\n
\r\n
\r\n \r\n changeImage(\"/images/crea2/image-product-4.jpg\")\r\n }\r\n />\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n

\r\n SNEAKER COMPAGNY\r\n

\r\n
\r\n
\r\n

\r\n 100% Tailwind\r\n

\r\n

\r\n Sneakers\r\n

\r\n
\r\n
\r\n
\r\n

\r\n Vous trouvez ici une page produit avec selction d'iamges et un\r\n carouselle en modal en cliquant sur l'image principale. Une\r\n petit compteur pour le panier.\r\n

\r\n

\r\n Cette page est codé 100% en Tailwind, responsive tablette,\r\n smartphone et ecran.\r\n

\r\n
\r\n\r\n
\r\n
354£
\r\n
\r\n -50%\r\n
\r\n
\r\n\r\n
\r\n
\r\n \r\n +\r\n
\r\n
\r\n {\" \"}\r\n {count}{\" \"}\r\n
\r\n\r\n \r\n -\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n {modalOpen && (\r\n
\r\n \r\n
\r\n )}\r\n \r\n \r\n );\r\n};\r\nexport default Crea2;\r\n"],"mappings":"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"},"metadata":{},"sourceType":"module","externalDependencies":[]}