updated kitchen tables pages

components/Collection/Explore.js

@@ -25,6 +25,8 @@ const exploreData = [
 ];
 ];
 
 
 const Explore = ({productData}) => {
 const Explore = ({productData}) => {
+  if (!productData?.item?.length) return null;
+
   return (
   return (
     <section className="explore-section sec_padd collection-section">
     <section className="explore-section sec_padd collection-section">
       <Container className="custom_container">
       <Container className="custom_container">

container/Home/Catalogues.js

@@ -48,8 +48,8 @@ const Catalogues = ({cataloguesData}) => {
                   slidesPerView={4}
                   slidesPerView={4}
                   spaceBetween={60}
                   spaceBetween={60}
                   navigation={{
                   navigation={{
-                    nextEl: ".cust-swiper-button-next",
-                    prevEl: ".cust-swiper-button-prev",
+                    nextEl: ".catalogues-swiper-button-next",
+                    prevEl: ".catalogues-swiper-button-prev",
                   }}
                   }}
                   pagination={{ clickable: true }}
                   pagination={{ clickable: true }}
                   autoplay={false}
                   autoplay={false}
@@ -86,7 +86,7 @@ const Catalogues = ({cataloguesData}) => {
         </Container>
         </Container>
         <Container className="custom_container position-absolute  swiperbtn1 d-none d-md-block">
         <Container className="custom_container position-absolute  swiperbtn1 d-none d-md-block">
         <div className=" d-flex d-nones justify-content-between align-items-center w-100 ">
         <div className=" d-flex d-nones justify-content-between align-items-center w-100 ">
-          <button className="cust-swiper-button-prev">
+          <button className="catalogues-swiper-button-prev">
                 <svg
                 <svg
                   xmlns="http://www.w3.org/2000/svg"
                   xmlns="http://www.w3.org/2000/svg"
                   width="48"
                   width="48"
@@ -119,7 +119,7 @@ const Catalogues = ({cataloguesData}) => {
                   />
                   />
                 </svg>
                 </svg>
               </button>
               </button>
-              <button className="cust-swiper-button-next">
+              <button className="catalogues-swiper-button-next">
                 <svg
                 <svg
                   xmlns="http://www.w3.org/2000/svg"
                   xmlns="http://www.w3.org/2000/svg"
                   width="48"
                   width="48"

pages/collections/[category]/[subCategory]/[productSlug].js

@@ -115,9 +115,8 @@ const ProductPage = ({ productData, cataloguesData }) => {
         <Explore productData={productData.exploreProducts} />
         <Explore productData={productData.exploreProducts} />
       )}
       )}
 
 
-      {!isDoorLayout && (
       <Catalogues cataloguesData={cataloguesData} />
       <Catalogues cataloguesData={cataloguesData} />
-      )}
+
 
 
       <Contact />
       <Contact />
     </>
     </>

styles/globals.css

@@ -311,12 +311,14 @@ body {
 .collection-section .custom_container {
 .collection-section .custom_container {
   margin-right: 0 !important;
   margin-right: 0 !important;
 } */
 } */
-button.cust-swiper-button-prev {
+button.cust-swiper-button-prev,
+button.catalogues-swiper-button-prev {
   background-color: transparent;
   background-color: transparent;
   border: none;
   border: none;
 }
 }
 
 
-button.cust-swiper-button-next {
+button.cust-swiper-button-next,
+button.catalogues-swiper-button-next {
   background-color: transparent;
   background-color: transparent;
   border: none;
   border: none;
 }
 }
@@ -1604,7 +1606,9 @@ footer a:hover {
     background-size: 100% 100%;
     background-size: 100% 100%;
   }
   }
   button.cust-swiper-button-prev svg,
   button.cust-swiper-button-prev svg,
-  button.cust-swiper-button-next svg {
+  button.cust-swiper-button-next svg,
+  button.catalogues-swiper-button-prev svg,
+  button.catalogues-swiper-button-next svg {
     width: 40px;
     width: 40px;
     height: 40px;
     height: 40px;
   }
   }