tabexseriescomponents 0.0.238 → 0.0.239

package/dist/index.esm.js

@@ -36588,6 +36588,19 @@ var VideosSection = function VideosSection(props) {
       }
     }, langdetect == 'en' ? sectionproperties.descriptionContentEn : sectionproperties.descriptionContentAr);
   };
+  var ImageContent = function ImageContent(item, index) {
+    return /*#__PURE__*/React.createElement("div", {
+      "class": "row m-0 w-100"
+    }, sectionproperties.slideshowtext1_show == 'Show' && /*#__PURE__*/React.createElement("div", {
+      className: bgcssstyles.text1styles + ' col-lg-12 p-0 w-100 d-flex align-items-center '
+    }, /*#__PURE__*/React.createElement("p", {
+      className: bgcssstyles.text1styles + ' d-flex wordbreak m-0 p-0 '
+    }, langdetect == 'en' ? item.title_en : item.title_ar)), sectionproperties.slideshowtext2_show == 'Show' && /*#__PURE__*/React.createElement("div", {
+      className: bgcssstyles.text2styles + ' col-lg-12 p-0 w-100 d-flex '
+    }, /*#__PURE__*/React.createElement("p", {
+      className: bgcssstyles.text2styles + ' d-flex wordbreak m-0 p-0 '
+    }, langdetect == 'en' ? item.description_en : item.description_ar)));
+  };
   return /*#__PURE__*/React.createElement("div", {
     className: "row ml-0 mr-0 w-100 pl-md-0 pr-md-0",
     style: {
@@ -36625,21 +36638,15 @@ var VideosSection = function VideosSection(props) {
     }
   }, Description()), Object.keys(videosarrayofobjs).length != 0 && videosarrayofobjs.map(function (item, index) {
     return /*#__PURE__*/React.createElement("div", {
-      className: 'd-flex align-items-stretch col-md-6 col-sm-12 col-lg-' + videosarrayofobjs[index].numberofcols,
+      className: 'd-flex align-items-stretch col-md-6 col-sm-12 col-lg-' + item.numberofcols,
       style: {
         marginBottom: sectionproperties.image_mb + 'px'
       }
     }, /*#__PURE__*/React.createElement("div", {
       className: "row ml-0 mr-0 d-flex w-100"
-    }, sectionproperties.slideshowtext1_show == 'Show' && /*#__PURE__*/React.createElement("div", {
-      className: bgcssstyles.text1styles + ' col-lg-12 p-0 w-100 d-flex align-items-center '
-    }, /*#__PURE__*/React.createElement("p", {
-      className: bgcssstyles.text1styles + ' d-flex wordbreak m-0 p-0 '
-    }, langdetect == 'en' ? videosarrayofobjs[index].title_en : videosarrayofobjs[index].title_ar)), sectionproperties.slideshowtext2_show == 'Show' && /*#__PURE__*/React.createElement("div", {
-      className: bgcssstyles.text2styles + ' col-lg-12 p-0 w-100 d-flex '
-    }, /*#__PURE__*/React.createElement("p", {
-      className: bgcssstyles.text2styles + ' d-flex wordbreak m-0 p-0 '
-    }, langdetect == 'en' ? videosarrayofobjs[index].description_en : videosarrayofobjs[index].description_ar)), /*#__PURE__*/React.createElement("div", {
+    }, sectionproperties.sectionbgstyle == 'Text above image' && /*#__PURE__*/React.createElement("div", {
+      "class": "col-lg-12 p-0"
+    }, ImageContent(item)), /*#__PURE__*/React.createElement("div", {
       className: 'col-lg-12 p-0 d-md-flex w-100 mt-auto',
       style: {
         borderTopLeftRadius: langdetect == 'en' ? sectionproperties.image_bordertopleftradius + 'px' : sectionproperties.image_bordertoprightradius + 'px',
@@ -36648,8 +36655,8 @@ var VideosSection = function VideosSection(props) {
         borderBottomRightRadius: langdetect == 'en' ? sectionproperties.image_borderBottomRightRadius + 'px' : sectionproperties.image_borderBottomLeftRadius + 'px',
         height: sectionproperties.image_height + 'px'
       }
-    }, item.linkclicked == true && videosarrayofobjs[index].linktype != 'External Link ' && /*#__PURE__*/React.createElement(ReactPlayer, {
-      url: videosarrayofobjs[index].url,
+    }, item.linkclicked == true && item.linktype != 'External Link ' && /*#__PURE__*/React.createElement(ReactPlayer, {
+      url: item.url,
       height: sectionproperties.image_height + 'px',
       width: '100%',
       playing: true,
@@ -36657,28 +36664,33 @@ var VideosSection = function VideosSection(props) {
       loop: true,
       muted: true,
       playsinline: true
-    }), item.linkclicked == false && /*#__PURE__*/React.createElement("button", {
+    }), item.linkclicked == false && /*#__PURE__*/React.createElement("div", {
       onClick: function onClick() {
-        if (videosarrayofobjs[index].linktype == 'External Link') {
-          window.open(videosarrayofobjs[index].url, '_blank');
-        } else {
+        if (item.linktype == 'External Link') {
+          window.open(item.url, '_blank');
+        } else if (item.linktype == 'Image') ; else {
           var temparr = _toConsumableArray(videosarrayofobjs);
           temparr[index].linkclicked = true;
           setvideosarrayofobjs(_toConsumableArray(temparr));
         }
       },
-      "class": "w-100 h-100"
+      "class": "w-100 h-100",
+      style: {
+        cursor: item.linktype == 'Image' ? 'default' : 'pointer'
+      }
     }, /*#__PURE__*/React.createElement(IKImage, {
       urlEndpoint: IKurlEndpoint,
       publicKey: IKpublicKey,
-      path: videosarrayofobjs.length != 0 ? videosarrayofobjs[index].image : '',
+      path: videosarrayofobjs.length != 0 ? item.image : '',
       className: sectionproperties.bgcovercontainresponsive == 'Contain' ? 'objectFit-md-contain' : '',
       style: {
         height: '100%',
         width: '100%',
         objectFit: sectionproperties.bgcovercontain
       }
-    })))));
+    }))), sectionproperties.sectionbgstyle != 'Text above image' && /*#__PURE__*/React.createElement("div", {
+      "class": "col-lg-12 p-0 mt-3"
+    }, ImageContent(item))));
   }));
 };
 
@@ -44484,6 +44496,13 @@ var Card23 = function Card23(props) {
       transition: 'all, 0.4s',
       right: 10,
       transform: "translateX(0px)"
+    }),
+    imageContainer: css({
+      backgroundColor: sectionproperties.image_bgcolor,
+      borderBottomLeftRadius: langdetect == 'en' ? sectionproperties.image_borderBottomLeftRadius + 'px' : sectionproperties.image_borderBottomRightRadius + 'px',
+      borderBottomRightRadius: langdetect == 'en' ? sectionproperties.image_borderBottomRightRadius + 'px' : sectionproperties.image_borderBottomLeftRadius + 'px',
+      borderTopLeftRadius: langdetect == 'en' ? sectionproperties.image_bordertopleftradius + 'px' : sectionproperties.image_bordertoprightradius + 'px',
+      borderTopRightRadius: langdetect == 'en' ? sectionproperties.image_bordertoprightradius + 'px' : sectionproperties.image_bordertopleftradius + 'px'
     })
   };
   var plainString = function plainString(html) {
@@ -44491,6 +44510,65 @@ var Card23 = function Card23(props) {
     divContainer.innerHTML = html;
     return divContainer.textContent || divContainer.innerText || '';
   };
+  var Image = function Image() {
+    return /*#__PURE__*/React.createElement("div", {
+      "class": "w-100"
+    }, /*#__PURE__*/React.createElement(IKImage, {
+      urlEndpoint: IKurlEndpoint,
+      publicKey: IKpublicKey,
+      path: '/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + item.image,
+      style: {
+        width: sectionproperties.imageInnerWidth_Height + '%',
+        height: sectionproperties.imageInnerWidth_Height + '%',
+        objectFit: sectionproperties.bgcovercontain == 'Cover' ? 'cover' : 'contain',
+        borderBottomLeftRadius: sectionproperties.bgcovercontain == 'Cover' ? langdetect == 'en' ? sectionproperties.image_borderBottomLeftRadius + 'px' : sectionproperties.image_borderBottomRightRadius + 'px' : 0,
+        borderBottomRightRadius: sectionproperties.bgcovercontain == 'Cover' ? langdetect == 'en' ? sectionproperties.image_borderBottomRightRadius + 'px' : sectionproperties.image_borderBottomLeftRadius + 'px' : 0,
+        borderTopLeftRadius: sectionproperties.bgcovercontain == 'Cover' ? langdetect == 'en' ? sectionproperties.image_bordertopleftradius + 'px' : sectionproperties.image_bordertoprightradius + 'px' : 0,
+        borderTopRightRadius: sectionproperties.bgcovercontain == 'Cover' ? langdetect == 'en' ? sectionproperties.image_bordertoprightradius + 'px' : sectionproperties.image_bordertopleftradius + 'px' : 0
+      },
+      loading: "lazy",
+      onClick: function onClick() {
+        setShowProductInfoModalContext(true);
+        setProductIdProdutInfoModalContext(item.productid);
+      }
+    }), (item === null || item === void 0 ? void 0 : item.hassale) == 1 && sectionproperties.prodsalePriceshow == 'Show' && /*#__PURE__*/React.createElement("div", {
+      "class": "row m-0 align-items-center justify-content-center",
+      style: {
+        position: 'absolute',
+        top: 10,
+        left: 10,
+        height: sectionproperties.badge_height + 'px',
+        width: sectionproperties.badge_width + 'px',
+        backgroundColor: sectionproperties.badge_bgcolor,
+        borderRadius: sectionproperties.badge_borderradius + 'px',
+        paddingLeft: '10px',
+        paddingRight: '10px',
+        color: sectionproperties.badge_color
+      }
+    }, /*#__PURE__*/React.createElement("div", {
+      style: {
+        fontSize: sectionproperties.badge_fontsize + 'px'
+      }
+    }, langdetect == 'en' ? sectionproperties.badgeContentEn : sectionproperties.badgeContentAr)), sectionproperties.showpill == 'Show' && item.hassale == 1 && /*#__PURE__*/React.createElement("div", {
+      "class": "allcentered",
+      style: {
+        position: 'absolute',
+        top: sectionproperties.pillpositionfromtop + 'px',
+        left: sectionproperties.pillpositionfromright + 'px',
+        width: sectionproperties.pillwidth + 'px',
+        height: sectionproperties.pillheight + 'px',
+        background: sectionproperties.pillbgcolor,
+        borderRadius: sectionproperties.pillborderBottomLeftRadius + 'px'
+      }
+    }, /*#__PURE__*/React.createElement("p", {
+      "class": "m-0 p-0 text-uppercase",
+      style: {
+        color: sectionproperties.pillcolor,
+        fontSize: sectionproperties.pillfontSize + 'px',
+        direction: 'ltr'
+      }
+    }, '-' + Math.round(10.0 * ((parseInt(item.defaultprice) - parseInt(item.defaultsaleprice)) / parseInt(item.defaultprice)) * 100) / 10.0 + '%')));
+  };
   return /*#__PURE__*/React.createElement("div", {
     "class": "row m-0 w-100 pl-sm-2 pr-sm-2",
     style: {
@@ -44498,229 +44576,7 @@ var Card23 = function Card23(props) {
       paddingRight: langdetect == 'en' ? sectionproperties.card_marginRight + 'px' : sectionproperties.card_marginLeft + 'px'
     }
   }, /*#__PURE__*/React.createElement("div", {
-    "class": "".concat(cardsstyles2.card) + ' d-flex d-md-none '
-  }, /*#__PURE__*/React.createElement("div", {
-    "class": item.IsFavExists == true ? "".concat(cardsstyles2.iconsContainer, " ").concat(cardsstyles2.iconsContainer2) + ' iconsContainer d-flex d-md-none ' : "".concat(cardsstyles2.iconsContainer) + ' iconsContainer d-flex d-md-none ',
-    style: {
-      zIndex: 100
-    }
-  }, sectionproperties.favBtnShow == 'Show' && /*#__PURE__*/React.createElement("button", {
-    "class": "".concat(cardsstyles2.wishlist_btn) + ' mb-1 ',
-    onClick: function onClick() {
-      addtofavoritescontext(item.productid);
-    }
-  }, item.IsFavExists && /*#__PURE__*/React.createElement("i", {
-    "class": "h-100 d-flex align-items-center justify-content-center icon"
-  }, sectionproperties.faviconshape == 'Star Shape' && /*#__PURE__*/React.createElement(AiFillStar, {
-    size: sectionproperties.favBtnIconfontsize,
-    style: {
-      color: sectionproperties.activefaviconcolor
-    }
-  }), sectionproperties.faviconshape == 'Heart Shape' && /*#__PURE__*/React.createElement(FaHeart, {
-    size: sectionproperties.favBtnIconfontsize,
-    style: {
-      color: sectionproperties.activefaviconcolor
-    }
-  })), !item.IsFavExists && /*#__PURE__*/React.createElement("i", {
-    "class": "h-100 d-flex align-items-center justify-content-center"
-  }, sectionproperties.faviconshape == 'Star Shape' && /*#__PURE__*/React.createElement(AiOutlineStar, {
-    size: sectionproperties.favBtnIconfontsize
-  }), sectionproperties.faviconshape == 'Heart Shape' && /*#__PURE__*/React.createElement(FaRegHeart, {
-    size: sectionproperties.favBtnIconfontsize
-  }))), sectionproperties.generalbtn_show == 'Show' && /*#__PURE__*/React.createElement("button", {
-    "class": " ".concat(cardsstyles2.showmodal),
-    onClick: function onClick(e) {
-      e.stopPropagation();
-      cardonclickfunctionContext(sectionproperties === null || sectionproperties === void 0 ? void 0 : sectionproperties.onClickRoute, item.productid, props.fetchingtypeprops, item.collectionid);
-    }
-  }, /*#__PURE__*/React.createElement("i", {
-    "class": "h-100 d-flex align-items-center justify-content-center"
-  }, /*#__PURE__*/React.createElement(BsEye, {
-    size: sectionproperties.generalbtn_fontsize
-  })))), /*#__PURE__*/React.createElement("div", {
-    "class": "".concat(cardsstyles2.iconsContainer, " ").concat(cardsstyles2.iconsContainer2) + ' iconsContainer d-none d-md-flex ',
-    style: {
-      zIndex: 100
-    }
-  }, sectionproperties.favBtnShow == 'Show' && /*#__PURE__*/React.createElement("button", {
-    "class": " ".concat(cardsstyles2.wishlist_btn) + ' mb-1 ',
-    onClick: function onClick() {
-      addtofavoritescontext(item.productid);
-    }
-  }, item.IsFavExists && /*#__PURE__*/React.createElement("i", {
-    "class": "h-100 d-flex align-items-center justify-content-center icon"
-  }, sectionproperties.faviconshape == 'Star Shape' && /*#__PURE__*/React.createElement(AiFillStar, {
-    size: sectionproperties.favBtnIconfontsize,
-    style: {
-      color: sectionproperties.activefaviconcolor
-    }
-  }), sectionproperties.faviconshape == 'Heart Shape' && /*#__PURE__*/React.createElement(FaHeart, {
-    size: sectionproperties.favBtnIconfontsize,
-    style: {
-      color: sectionproperties.activefaviconcolor
-    }
-  })), !item.IsFavExists && /*#__PURE__*/React.createElement("i", {
-    "class": "h-100 d-flex align-items-center justify-content-center"
-  }, sectionproperties.faviconshape == 'Star Shape' && /*#__PURE__*/React.createElement(AiOutlineStar, {
-    size: sectionproperties.favBtnIconfontsize
-  }), sectionproperties.faviconshape == 'Heart Shape' && /*#__PURE__*/React.createElement(FaRegHeart, {
-    size: sectionproperties.favBtnIconfontsize
-  }))), sectionproperties.generalbtn_show == 'Show' && /*#__PURE__*/React.createElement("button", {
-    "class": " ".concat(cardsstyles2.showmodal),
-    onClick: function onClick(e) {
-      e.stopPropagation();
-      cardonclickfunctionContext(sectionproperties === null || sectionproperties === void 0 ? void 0 : sectionproperties.onClickRoute, item.productid, props.fetchingtypeprops, item.collectionid);
-    }
-  }, /*#__PURE__*/React.createElement("i", {
-    "class": "h-100 d-flex align-items-center justify-content-center"
-  }, /*#__PURE__*/React.createElement(BsEye, {
-    size: sectionproperties.generalbtn_fontsize
-  })))), sectionproperties.length != 0 && /*#__PURE__*/React.createElement("div", {
-    "class": "col-lg-12 col-md-12 col-sm-12 pl-0 pr-0 pl-sm-2 pr-sm-2",
-    style: {
-      paddingTop: sectionproperties.paddingTop + 'px',
-      paddingBottom: sectionproperties.paddingBottom + 'px'
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    "class": "cursor-pointer",
-    style: {
-      backgroundColor: sectionproperties.image_bgcolor,
-      height: sectionproperties.image_height + 'px',
-      borderBottomLeftRadius: langdetect == 'en' ? sectionproperties.image_borderBottomLeftRadius + 'px' : sectionproperties.image_borderBottomRightRadius + 'px',
-      borderBottomRightRadius: langdetect == 'en' ? sectionproperties.image_borderBottomRightRadius + 'px' : sectionproperties.image_borderBottomLeftRadius + 'px',
-      borderTopLeftRadius: langdetect == 'en' ? sectionproperties.image_bordertopleftradius + 'px' : sectionproperties.image_bordertoprightradius + 'px',
-      borderTopRightRadius: langdetect == 'en' ? sectionproperties.image_bordertoprightradius + 'px' : sectionproperties.image_bordertopleftradius + 'px'
-    }
-  }, /*#__PURE__*/React.createElement(IKImage, {
-    urlEndpoint: IKurlEndpoint,
-    publicKey: IKpublicKey,
-    path: '/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + item.image,
-    style: {
-      width: '100%',
-      height: '100%',
-      objectFit: sectionproperties.bgcovercontain == 'Cover' ? 'cover' : 'contain',
-      borderBottomLeftRadius: sectionproperties.bgcovercontain == 'Cover' ? langdetect == 'en' ? sectionproperties.image_borderBottomLeftRadius + 'px' : sectionproperties.image_borderBottomRightRadius + 'px' : 0,
-      borderBottomRightRadius: sectionproperties.bgcovercontain == 'Cover' ? langdetect == 'en' ? sectionproperties.image_borderBottomRightRadius + 'px' : sectionproperties.image_borderBottomLeftRadius + 'px' : 0,
-      borderTopLeftRadius: sectionproperties.bgcovercontain == 'Cover' ? langdetect == 'en' ? sectionproperties.image_bordertopleftradius + 'px' : sectionproperties.image_bordertoprightradius + 'px' : 0,
-      borderTopRightRadius: sectionproperties.bgcovercontain == 'Cover' ? langdetect == 'en' ? sectionproperties.image_bordertoprightradius + 'px' : sectionproperties.image_bordertopleftradius + 'px' : 0
-    },
-    loading: "lazy",
-    onClick: function onClick() {
-      setShowProductInfoModalContext(true);
-      setProductIdProdutInfoModalContext(item.productid);
-    }
-  }), (item === null || item === void 0 ? void 0 : item.hassale) == 1 && sectionproperties.prodsalePriceshow == 'Show' && /*#__PURE__*/React.createElement("div", {
-    "class": "row m-0 align-items-center justify-content-center",
-    style: {
-      position: 'absolute',
-      top: 10,
-      left: 10,
-      height: sectionproperties.badge_height + 'px',
-      width: sectionproperties.badge_width + 'px',
-      backgroundColor: sectionproperties.badge_bgcolor,
-      borderRadius: sectionproperties.badge_borderradius + 'px',
-      paddingLeft: '10px',
-      paddingRight: '10px',
-      color: sectionproperties.badge_color
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    style: {
-      fontSize: sectionproperties.badge_fontsize + 'px'
-    }
-  }, langdetect == 'en' ? sectionproperties.badgeContentEn : sectionproperties.badgeContentAr)), sectionproperties.showpill == 'Show' && item.hassale == 1 && /*#__PURE__*/React.createElement("div", {
-    "class": "allcentered",
-    style: {
-      position: 'absolute',
-      top: sectionproperties.pillpositionfromtop + 'px',
-      left: sectionproperties.pillpositionfromright + 'px',
-      width: sectionproperties.pillwidth + 'px',
-      height: sectionproperties.pillheight + 'px',
-      background: sectionproperties.pillbgcolor,
-      borderRadius: sectionproperties.pillborderBottomLeftRadius + 'px'
-    }
-  }, /*#__PURE__*/React.createElement("p", {
-    "class": "m-0 p-0 text-uppercase",
-    style: {
-      color: sectionproperties.pillcolor,
-      fontSize: sectionproperties.pillfontSize + 'px',
-      direction: 'ltr'
-    }
-  }, '-' + Math.round(10.0 * ((parseInt(item.defaultprice) - parseInt(item.defaultsaleprice)) / parseInt(item.defaultprice)) * 100) / 10.0 + '%'))), /*#__PURE__*/React.createElement("div", {
-    "class": 'row m-0 w-100 pl-sm-0 pr-sm-0',
-    style: {
-      paddingLeft: '10px',
-      paddingRight: '10px',
-      paddingTop: '10px',
-      paddingBottom: '10px'
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    "class": "col-lg-12 p-0"
-  }, sectionproperties.prodCatShow == 'Show' && /*#__PURE__*/React.createElement("p", {
-    "class": "".concat(cardsstyles2.productDescStyles) + ' col-lg-12 wordbreak wordbreak1 p-0 m-0 ',
-    style: {
-      textAlign: langdetect == 'en' ? 'left' : 'right'
-    }
-  }, plainString(langdetect == 'en' ? item.description_en : item.description_ar)), sectionproperties.prodNameShow == 'Show' && /*#__PURE__*/React.createElement("div", {
-    "class": "col-lg-12 p-0 ",
-    style: {
-      minHeight: '6vh'
-    }
-  }, /*#__PURE__*/React.createElement("p", {
-    onClick: function onClick() {
-      cardonclickfunctionContext(sectionproperties === null || sectionproperties === void 0 ? void 0 : sectionproperties.onClickRoute, item.productid, props.fetchingtypeprops, item.collectionid);
-    },
-    "class": sectionproperties.wordbreak == '1' ? "".concat(cardsstyles2.productNameStyles) + '  wordbreak wordbreak2 m-0 ' : "".concat(cardsstyles2.productNameStyles) + '  wordbreak wordbreak2 m-0 ',
-    style: {
-      textAlign: langdetect == 'en' ? 'left' : 'right'
-    }
-  }, item.name))), /*#__PURE__*/React.createElement("div", {
-    "class": "row m-0 w-100 align-items-center mt-1 mb-1"
-  }, sectionproperties.prodPriceShow == 'Show' && /*#__PURE__*/React.createElement("p", {
-    "class": langdetect == 'en' ? "".concat(cardsstyles2.productPricestyles) + ' m-0 wordbreak d-flex align-items-center text-right text-sm-left ' : "".concat(cardsstyles2.productPricestyles) + ' m-0 wordbreak d-flex align-items-center text-left text-sm-right '
-  }, langdetect == 'en' ? 'EGP' : '', " ", item.hassale == 1 ? item.defaultsaleprice : item.defaultprice, " ", langdetect == 'en' ? '' : 'ج.م'), sectionproperties.prodsalePriceshow == 'Show' && item.hassale == 1 && /*#__PURE__*/React.createElement("span", {
-    "class": "".concat(cardsstyles2.productSalePricestyles)
-  }, "/"), sectionproperties.prodsalePriceshow == 'Show' && item.hassale == 1 && /*#__PURE__*/React.createElement("p", {
-    "class": langdetect == 'en' ? "".concat(cardsstyles2.productSalePricestyles) + ' linethrough m-0 wordbreak d-flex mt-sm-auto mb-sm-auto text-right text-sm-left ' : "".concat(cardsstyles2.productSalePricestyles) + ' linethrough m-0 wordbreak d-flex mt-sm-auto mb-sm-auto text-left text-sm-right '
-  }, langdetect == 'en' ? 'EGP' : '', " ", item.defaultprice, " ", langdetect == 'en' ? '' : 'ج.م')), /*#__PURE__*/React.createElement("div", {
-    "class": "d-flex align-items-center m-0"
-  }, sectionproperties.cartBtnShow == 'Show' && /*#__PURE__*/React.createElement("button", {
-    "class": "".concat(cardsstyles2.cart_btn) + ' allcentered ',
-    onClick: function onClick() {
-      setShowProductInfoModalContext(true);
-      setProductIdProdutInfoModalContext(item.productid);
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    "class": "d-flex align-items-center justify-content-center"
-  }, sectionproperties.cartBtn_iconFontSize != 0 && /*#__PURE__*/React.createElement("i", {
-    "class": "allcentered mr-2",
-    style: {
-      color: sectionproperties.cart_iconcolor,
-      fontSize: sectionproperties.cartBtn_iconFontSize
-    }
-  }, sectionproperties.carticonstyle == 'Shopping bag 1' && /*#__PURE__*/React.createElement(FiShoppingBag, {
-    "class": "",
-    size: sectionproperties.cartBtn_iconFontSize
-  }), sectionproperties.carticonstyle == 'Shopping bag 2' && /*#__PURE__*/React.createElement(CgShoppingBag, {
-    "class": "",
-    size: sectionproperties.cartBtn_iconFontSize
-  }), sectionproperties.carticonstyle == 'Shopping bag 3' && /*#__PURE__*/React.createElement(BsBag, {
-    "class": "",
-    size: sectionproperties.cartBtn_iconFontSize
-  }), sectionproperties.carticonstyle == 'Shopping bag 4' && /*#__PURE__*/React.createElement(RiHandbagLine, {
-    size: sectionproperties.cartBtn_iconFontSize
-  }), sectionproperties.carticonstyle == 'Shopping cart 1' && /*#__PURE__*/React.createElement(FiShoppingCart, {
-    "class": "",
-    size: sectionproperties.cartBtn_iconFontSize
-  }), sectionproperties.carticonstyle == 'Shopping cart 2' && /*#__PURE__*/React.createElement(MdAddShoppingCart, {
-    size: sectionproperties.cartBtn_iconFontSize
-  })), /*#__PURE__*/React.createElement("p", {
-    "class": "m-0 p-0"
-  }, langdetect == 'en' ? sectionproperties.cartBtnContentenglish : sectionproperties.cartBtnContentarabic))))))), /*#__PURE__*/React.createElement("div", {
-    "class": props.sectiontypeprops2 == 'vertical' ? "".concat(cardsstyles2.card) + ' d-none d-md-flex w-100 ' : "".concat(cardsstyles2.card) + ' d-none d-md-flex ',
-    style: {
-      minWidth: props.sectiontypeprops2 == 'vertical' ? '100%' : sectionproperties.widthresponsive + 'px',
-      maxWidth: props.sectiontypeprops2 == 'vertical' ? '100%' : sectionproperties.widthresponsive + ' px'
-    }
+    "class": "".concat(cardsstyles2.card) + '  '
   }, /*#__PURE__*/React.createElement("div", {
     "class": item.IsFavExists == true ? "".concat(cardsstyles2.iconsContainer, " ").concat(cardsstyles2.iconsContainer2) + ' iconsContainer d-flex d-md-none ' : "".concat(cardsstyles2.iconsContainer) + ' iconsContainer d-flex d-md-none ',
     style: {
@@ -44804,66 +44660,16 @@ var Card23 = function Card23(props) {
       paddingBottom: sectionproperties.paddingBottom + 'px'
     }
   }, /*#__PURE__*/React.createElement("div", {
-    "class": "cursor-pointer",
+    "class": cardsstyles2.imageContainer + ' d-flex d-md-none ',
     style: {
-      backgroundColor: sectionproperties.image_bgcolor,
-      height: sectionproperties.image_height + 'px',
-      borderBottomLeftRadius: langdetect == 'en' ? sectionproperties.image_borderBottomLeftRadius + 'px' : sectionproperties.image_borderBottomRightRadius + 'px',
-      borderBottomRightRadius: langdetect == 'en' ? sectionproperties.image_borderBottomRightRadius + 'px' : sectionproperties.image_borderBottomLeftRadius + 'px',
-      borderTopLeftRadius: langdetect == 'en' ? sectionproperties.image_bordertopleftradius + 'px' : sectionproperties.image_bordertoprightradius + 'px',
-      borderTopRightRadius: langdetect == 'en' ? sectionproperties.image_bordertoprightradius + 'px' : sectionproperties.image_bordertopleftradius + 'px'
-    }
-  }, /*#__PURE__*/React.createElement(IKImage, {
-    urlEndpoint: IKurlEndpoint,
-    publicKey: IKpublicKey,
-    path: '/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + item.image,
-    style: {
-      width: '100%',
-      height: '100%',
-      objectFit: 'contain'
-    },
-    loading: "lazy",
-    onClick: function onClick() {
-      setShowProductInfoModalContext(true);
-      setProductIdProdutInfoModalContext(item.productid);
-    }
-  }), (item === null || item === void 0 ? void 0 : item.hassale) == 1 && sectionproperties.prodsalePriceshow == 'Show' && /*#__PURE__*/React.createElement("div", {
-    "class": "row m-0 align-items-center justify-content-center",
-    style: {
-      position: 'absolute',
-      top: 10,
-      left: 10,
-      height: sectionproperties.badge_height + 'px',
-      width: sectionproperties.badge_width + 'px',
-      backgroundColor: sectionproperties.badge_bgcolor,
-      borderRadius: sectionproperties.badge_borderradius + 'px',
-      paddingLeft: '10px',
-      paddingRight: '10px',
-      color: sectionproperties.badge_color
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    style: {
-      fontSize: sectionproperties.badge_fontsize + 'px'
-    }
-  }, langdetect == 'en' ? sectionproperties.badgeContentEn : sectionproperties.badgeContentAr)), sectionproperties.showpill == 'Show' && item.hassale == 1 && /*#__PURE__*/React.createElement("div", {
-    "class": "allcentered",
-    style: {
-      position: 'absolute',
-      top: sectionproperties.pillpositionfromtop + 'px',
-      left: sectionproperties.pillpositionfromright + 'px',
-      width: sectionproperties.pillwidth + 'px',
-      height: sectionproperties.pillheight + 'px',
-      background: sectionproperties.pillbgcolor,
-      borderRadius: sectionproperties.pillborderBottomLeftRadius + 'px'
+      height: sectionproperties.image_height + 'px'
     }
-  }, /*#__PURE__*/React.createElement("p", {
-    "class": "m-0 p-0 text-uppercase",
+  }, Image()), /*#__PURE__*/React.createElement("div", {
+    "class": cardsstyles2.imageContainer + ' d-none d-md-flex ',
     style: {
-      color: sectionproperties.pillcolor,
-      fontSize: sectionproperties.pillfontSize + 'px',
-      direction: 'ltr'
+      height: sectionproperties.height_responsive + 'px'
     }
-  }, '-' + Math.round(10.0 * ((parseInt(item.defaultprice) - parseInt(item.defaultsaleprice)) / parseInt(item.defaultprice)) * 100) / 10.0 + '%'))), /*#__PURE__*/React.createElement("div", {
+  }, Image()), /*#__PURE__*/React.createElement("div", {
     "class": 'row m-0 w-100 pl-sm-0 pr-sm-0',
     style: {
       paddingLeft: '10px',