.

components/blog-details/MostReadBlogs.js

@@ -12,6 +12,7 @@ import "swiper/css/pagination";
 import "swiper/css/navigation";
 import { BlogData } from "../blog/BlogItem.js";
 import Image from "next/image.js";
+import ActiveLink from "../common/ActiveLink.js";
 const MostReadBlogs = () => {
   return (
     <section className="most-read-blogs-session">
@@ -26,7 +27,8 @@ const MostReadBlogs = () => {
                 </div>
               </motion.div>
               <div className="view-all-btn">
-                <Button variant="primary">View All</Button>
+                <ActiveLink prefetch href="/blog"><Button variant="primary">View All</Button></ActiveLink>
+
               </div>
             </div>
           </div>
@@ -74,7 +76,7 @@ const MostReadBlogs = () => {
                             <div className="info">
                               <div className="read-row">
                                 <span className="image-container">
-                                  <Image layout="fill" alt="" className="image img-fluid" src="/images/icons/clock.svg" />
+                                  <Image priority layout="fill" alt="" className="image img-fluid" src="/images/icons/clock.svg" />
                                 </span>
                                 <div className="">{data.read}</div>
                               </div>

components/detail/Detail.js

@@ -109,7 +109,7 @@ const Detail = () => {
           </div>
         )}
         <GuestReviews activityById={activityById} />
-        <SimilarExperiences allActivitiesData={allActivitiesData} />
+        <SimilarExperiences allActivitiesData={allActivitiesData} activityById={activityById} />
         <Faqs faqs={faqs} />
         <SignUpToExperienceOurPlatform />
       </main>

components/detail/DetailInfo.js

@@ -20,6 +20,7 @@ import { sanitizeTimeRange } from "../../services/imageHandling";
 
 const DetailInfo = ({ activityById }) => {
   const router = useRouter();
+  console.log("activityById >>>>>", activityById)
   const dispatch = useDispatch();
   useEffect(() => {
     dispatch(getCurrentEndUser());
@@ -176,7 +177,7 @@ const DetailInfo = ({ activityById }) => {
         </Modal.Body>
       </Modal>
       {activityById && (
-        <Modal
+        <Modal dialogClassName="modal-01-session"
           centered
           show={enquiryModal}
           onHide={() => {
@@ -186,19 +187,19 @@ const DetailInfo = ({ activityById }) => {
           }}
         >
           <Modal.Header>
-            <h4>Send Enquiry</h4>
+            <h2>Send Enquiry</h2>
           </Modal.Header>
           <Modal.Body>
             <div>Experience Name:</div>
-            <div className="" style={{ fontSize: "22px", fontWeight: "bold" }}>
+            <div className="text01">
               {activityById.data.attributes.name}
             </div>
             <div className="mt-3">Full Name:</div>
-            <div className="" style={{ fontWeight: "bold" }}>
+            <div className="text01">
               {endUser?.attributes.name}
             </div>
             <div className="mt-3">Email ID:</div>
-            <div className="" style={{ fontSize: "22px", fontWeight: "bold" }}>
+            <div className="text01">
               {endUser?.attributes.email}
             </div>
             <div className="row d-flex justify-content-center">

components/detail/GuestReviews.js

@@ -103,14 +103,14 @@ const GuestReviews = ({ activityById }) => {
                                   rating={data.attributes.rating}
                                   starRatedColor="#FFD600" // Set the rated color to yellow
                                   starHoverColor="#ffe20" // Set the hover color to yellow
-                                  changeRating={() => { }}
+                                  changeRating={() => {}}
                                   numberOfStars={5}
                                   name="rating"
                                   starDimension="20px" // Set star width and height
                                 />
                                 <div className="review-content">
-                                  "{data.attributes.comments.length > 180 ? `${data.attributes.comments.slice(0, 180)}...` : data.attributes.comments}
-                                  {data.attributes.comments.length > 180 && (
+                                  "{data.attributes?.comments?.length > 180 ? `${data?.attributes?.comments.slice(0, 180)}...` : data?.attributes?.comments}"
+                                  {data?.attributes?.comments?.length > 180 && (
                                     <a
                                       onClick={() => {
                                         setreadMoreText(data);
@@ -128,7 +128,9 @@ const GuestReviews = ({ activityById }) => {
                         );
                       })
                     ) : (
-                      <div className="d-flex justify-content-center"><strong>No reviews available</strong></div>
+                      <div className="d-flex justify-content-center">
+                        <strong>No reviews available</strong>
+                      </div>
                     )}
                   </Swiper>
                 </div>

components/detail/SimilarExperiences.js

@@ -15,7 +15,8 @@ import { cleanImage } from "../../services/imageHandling.js";
 import { useRouter } from "next/router.js";
 import WishlistComponent from "./WIshlistComponent.js";
 import { useSelector } from "react-redux";
-const SimilarExperiences = ({ allActivitiesData }) => {
+import ActiveLink from "../common/ActiveLink.js";
+const SimilarExperiences = ({ allActivitiesData, activityById }) => {
   const router = useRouter();
   const [listingData, setListingData] = useState([]);
   const { endUser } = useSelector(state => state.endUser);
@@ -71,7 +72,10 @@ const SimilarExperiences = ({ allActivitiesData }) => {
                   </div>
                 </motion.div>
                 <div className="view-all-btn">
+                  <ActiveLink prefetch href={`/listing?category=${activityById?.data.attributes.category?.data?.id}`}>
                     <Button variant="primary">View All</Button>
+                  </ActiveLink>
+
                 </div>
               </div>
             </div>

components/gift-card/GiftCard.js

@@ -14,6 +14,8 @@ import { postGiftCard } from "../../redux/actions/giftCardAction";
 // import { getCurrentEndUser } from "../../redux/actions/userActions";
 
 const validationSchema = Yup.object().shape({
+  customAmt: Yup.string().required("Full name is required"),
+  code: Yup.string().required("Please Enter 4-Digit Code"),
   email: Yup.string().email("Invalid email").required("Email is required"),
   receiverEmail: Yup.string().email("Invalid email").required("Email is required"),
   message: Yup.string().required("Message is required")
@@ -95,7 +97,6 @@ const GiftCard = () => {
                         </a>
                       </div> */}
                       <Formik
-                        validationSchema={validationSchema}
                         initialValues={{
                           customAmt: "",
                           email: "",
@@ -108,7 +109,7 @@ const GiftCard = () => {
                           // Handle form submission here
                         }}
                       >
-                        {({ isSubmitting, values, handleChange, handleBlur, touched, errors, setErrors }) => (
+                        {({ isSubmitting, values, handleChange, handleBlur, touched, errors }) => (
                           <Form action="" className="form-01">
                             <div className="title">Buy a gift card</div>
                             <div className="cl-gry">Please select an amount</div>
@@ -210,21 +211,12 @@ const GiftCard = () => {
                                   <Field
                                     className="form-control"
                                     type="number"
-                                    min="1"
                                     name="customAmt"
                                     placeholder="Enter your amount"
                                     onChange={e => {
                                       setAmount(e.target.value);
                                     }}
-                                    onBlur={e => {
-                                      handleBlur(e.target.value);
-                                      console.log("blur",  e);
-                                      if (e.target.value < 1) {
-                                        setErrors({customAmt: "Amount cant be 0 or less"})
-                                      } else {
-                                        setErrors({...errors, customAmt: null})
-                                      }
-                                    }}
+                                    onBlur={handleBlur}
                                     value={amount}
                                   />
                                   {touched.customAmt && errors.customAmt && <div className="text-danger">{errors.customAmt}</div>}
@@ -318,7 +310,7 @@ const GiftCard = () => {
                                     setIsStep2(true);
                                     setIsStep1(false);
                                   }}
-                                  disabled={!amount > 0 || !values.receiverEmail || !values.email || errors.email || errors.receiverEmail || errors.message}
+                                  disabled={!amount > 0 || !values.receiverEmail || !values.email}
                                 >
                                   {loading ? <Loader /> : "Continue"}
                                 </button>
@@ -337,13 +329,13 @@ const GiftCard = () => {
 
                   {isStep2 && (
                     <div className="gift-card-rt">
-                      {/* <div className="back-btn">
+                      <div className="back-btn">
                         <a href="">
                           <span className="image-container">
                             <Image layout="fill" alt="" className="image img-fluid" src="/images/icons/arrow-left-02.svg" />
                           </span>
                         </a>
-                      </div> */}
+                      </div>
                       <Formik
                         initialValues={{
                           code: ""
@@ -353,19 +345,22 @@ const GiftCard = () => {
                           // Handle form submission here
                           console.log(values);
                           setSubmitting(false);
+                          setIsStep2(false);
+                          setIsStep1(false);
+                          setIsResult(true);
                         }}
                       >
                         {({ isSubmitting, values, handleChange, handleBlur, touched, errors }) => (
                           <Form action="" className="form-01">
                             <div className="title">We emailed you a 4-digit code</div>
                             {/* <div className="cl-gry">Please enter it below to create or login into your account:</div> */}
-                            {/* {console.log("values", form1Values)} */}
+                            {console.log("values", form1Values)}
                             <div className="row mt-4">
                               <div className="col-md-12 mb-4">
                                 <label htmlFor="">Enter 4-Digit Code</label>
                                 <Field
                                   className="form-control"
-                                  type="number"
+                                  type="text"
                                   name="code"
                                   placeholder="Enter the code we emailed you"
                                   onChange={handleChange}
@@ -387,10 +382,7 @@ const GiftCard = () => {
                                     console.log("res", res.data);
                                     if (!res.data.ok) {
                                       toast.error(res.data.message);
-                                      // console.log("here");
-                                      return;
                                     }
-
                                     if (res.data.ok) {
                                       const response = await postGiftCard({
                                         data: {
@@ -405,13 +397,10 @@ const GiftCard = () => {
                                         }
                                       });
                                       console.log("response", response);
-                                      setIsStep2(false);
-                                      setIsStep1(false);
-                                      setIsResult(true);
                                       toast.success("OTP verified!");
                                     }
                                   }}
-                                  disabled={!values.code || String(values.code).length < 4}
+                                  disabled={isSubmitting}
                                 >
                                   Confirm
                                 </button>

components/home/BrowseExperiences.js

@@ -18,6 +18,8 @@ import { useSelector } from "react-redux";
 import Link from "next/link.js";
 import ActiveLink from "../common/ActiveLink.js";
 const BrowseExperiences = ({ allActivitiesData }) => {
+  console.log("allActivitiesData>>>>>>", allActivitiesData);
+
   const { endUser } = useSelector(state => state.endUser);
   const calculateRating = data => {
     let value = 0;
@@ -108,7 +110,7 @@ const BrowseExperiences = ({ allActivitiesData }) => {
                                         {/* {console.log(">>", calculateRating(data?.attributes?.reviews.data))} */}
                                         {<span className="number">{calculateRating(data?.attributes?.reviews.data)}</span>}
                                         <span className="image-container">
-                                          <Image layout="fill" alt="" className="image img-fluid" src="/images/icons/star.svg" />
+                                          <Image layout="fill" alt="" priority className="image img-fluid" src="/images/icons/star.svg" />
                                         </span>
                                       </div>
                                     )}
@@ -133,11 +135,24 @@ const BrowseExperiences = ({ allActivitiesData }) => {
                                       // onClick={() => {
                                       //   router.push(`/activities/${data.id}`);
                                       // }}
-                                      variant="primary"
+                                      variant="primary me-2"
                                     >
                                       Explore Now
                                     </Button>
                                   </ActiveLink>
+
+                                  {data?.attributes.link && (
+                                    <Button
+                                      // disabled={loading}
+                                      onClick={() => {
+                                        window.open(data?.attributes?.link, "_blank", "noopener,noreferrer");
+                                      }}
+                                      variant="primary"
+                                    >
+                                      Book Now
+                                    </Button>
+                                  )}
+
                                 </div>
                               </div>
                             </div>

components/listing/ListingItems.js

@@ -194,10 +194,21 @@ const ListingItems = ({ allActivitiesData, loading, gridClass, totalCount }) =>
                                   onClick={() => {
                                     router.push(`/activities/${data.id}`);
                                   }}
-                                  variant="primary"
+                                  variant="primary me-2"
                                 >
                                   Explore Now
                                 </Button>
+                                {data?.attributes.link && (
+                                  <Button
+                                    // disabled={loading}
+                                    onClick={() => {
+                                      window.open(data?.attributes?.link, "_blank", "noopener,noreferrer");
+                                    }}
+                                    variant="primary"
+                                  >
+                                    Book Now
+                                  </Button>
+                                )}
                               </div>
                             </div>
                           </div>

components/signup/Signup.js

@@ -270,7 +270,7 @@ const Signup = props => {
                               onChange={handleChange}
                               onBlur={handleBlur}
                             />
-                            <span className="checkmark"></span>I Agree to the <a onClick={() => { setIsOpenEis(true) }}>terms & conditions*</a>
+                            <span className="checkmark"></span>I Agree to the <a className="cl-blue" onClick={() => { setIsOpenEis(true) }}>terms & conditions*</a>
                           </label>
                           <br />
 

components/user/MyGiftCard.js

@@ -18,35 +18,35 @@ const MyGiftCard = () => {
 
   console.log("endUser", endUser);
   console.log("giftCard", giftCard);
-  const getStatus = (status) => {
+  const getStatus = status => {
     let text;
     let color;
     switch (status) {
-      case 'new':
-        text = 'PENDING';
-        color = 'warning';
+      case "new":
+        text = "PENDING";
+        color = "warning";
         break;
-      case 'fulfilled':
-        text = 'APPROVED';
-        color = 'success';
+      case "fulfilled":
+        text = "APPROVED";
+        color = "success";
         break;
-      case 'rejected':
-        text = 'REJECTED';
-        color = 'error';
+      case "rejected":
+        text = "REJECTED";
+        color = "error";
         break;
       default:
         break;
     }
     return <Tag color={color}>{text.toUpperCase()}</Tag>;
-  }
+  };
   return (
     <Fragment>
-      <div className="container">
+      <div className="container min-height-40 ">
         <div className="row">
           <div className="col-12 col-lg-12 form-container content-wraaper">
             <h2 className="px-2 px-lg-0">My Gift Card</h2>
             <div className="row">
-              {giftCard?.length > 0 ?
+              {giftCard?.length > 0 ? (
                 <>
                   {giftCard.map((data, index) => (
                     <div className="col-12 col-lg-4 col-md-6 px-4 px-lg-3" key={`1${index}`}>
@@ -74,20 +74,18 @@ const MyGiftCard = () => {
                               <p className="m-0">${data.attributes.amount}</p>
                             </div>
 
-                            {data.attributes.status !== null &&
-                              <div>
-                                {getStatus(data?.attributes?.status)}
-                              </div>
-                            }
+                            {data.attributes.status !== null && <div>{getStatus(data?.attributes?.status)}</div>}
                           </div>
                         </div>
                       </div>
                     </div>
-                  ))}</>
-                :
+                  ))}
+                </>
+              ) : (
                 <>
                   <p className="mb-5">No Item Found</p>
-                </>}
+                </>
+              )}
             </div>
           </div>
         </div>

components/vendor/ActivityDetails.js

@@ -234,7 +234,6 @@ const ActivityDetails = ({ isUpdate, loadedUser }) => {
   console.log("activityPeriodState", activityPeriodState);
   return (
     <Fragment>
-      {loadedUser && loadedUser.approved == "approved" ? (
       <div className="container p-5">
         <div className="row">
           <div className="col-12 col-lg-8">
@@ -1120,18 +1119,6 @@ const ActivityDetails = ({ isUpdate, loadedUser }) => {
           </div>
         </div>
       </div>
-      ) : (
-        <div className="container">
-          <div className="m-5 d-flex  text-center justify-content-center">
-            <div className="">
-              <span className="image-container " >
-                <Image loading="lazy" layout="fill" alt="" className="image img-fluid mb-5" src="/images/main-logo.svg"  style={{ minWidth:"31%", maxWidth: "6%" }}/>
-              </span>
-              <h1 className="mt-5">Profile is not approved yet, please wait for the admin to approve your profile</h1>
-            </div>
-          </div>
-        </div>
-      )}
     </Fragment>
   );
 };

components/vendor/BusinessDetails.js

@@ -212,7 +212,7 @@ const BusinessDetails = () => {
                                 </div>
                               </div>
                               <div className="col-12  col-lg-5">
-                                <div className="input-group">
+                                <div className="input-group align-items-center">
                                   <label>Brand Logo</label>
                                   {/* <div className="custom-file">
                                     <input
@@ -230,7 +230,7 @@ const BusinessDetails = () => {
                                     </label>
                                   </div> */}
                                   <UploadImageCustom disabled={disableFields} setImage={setbrandLogo} isPdf={false} populatedImages={vendorDetails?.attributes.brandLogo} />
-                                  <p className="textS">Upload in .PNG or .JPG/JPEG format</p>
+                                  <p className="textS pe-5 pt-2">Upload in .PNG or .JPG/JPEG format</p>
                                   {errors.brandLogoFile && touched.brandLogoFile && <span className="form-error">{errors.brandLogoFile}</span>}
                                 </div>
                               </div>
@@ -359,7 +359,7 @@ const BusinessDetails = () => {
                     </li>
                     <li>
                       <Image alt="" src="/images/vendor/call.svg" width="32" height="32" />
-                      <p>+1 (407) 8798 789</p>
+                      <p className="number">+1 (407) 8798 789</p>
                     </li>
                   </ul>
                 </div>

components/vendor/OrderListing.js

@@ -143,9 +143,9 @@ const OrderListing = () => {
         <div className="col-12 col-lg-12">
           <div className="rightContent">
             <div className="d-flex align-items-center justify-content-between px-2 mb-2"> */}
-              <div className="mb-3">
-                <h2 style={{fontSize: 28}}>Orders</h2>
-                <p>View all the orders</p>
+      <div className="mb-3 d-flex align-items-center justify-content-between">
+        <h2 style={{ fontSize: 28 }}>Orders</h2>
+        <p><a href="">View all the orders</a></p>
       </div>
       {/* <div>
                 <Button type="button" variant="" className="btnAdd m-0">

components/vendor/UpdateActivity.js

@@ -217,7 +217,7 @@ const UpdateActivity = () => {
                     }}
                     validationSchema={activityDetailsValidationSchema}
                     // enableReinitialize={true}
-                    onSubmit={values => {}}
+                    onSubmit={values => { }}
                   >
                     {({ values, errors, touched, handleChange, handleBlur, handleSubmit, setFieldValue, resetForm }) => (
                       <Form
@@ -1053,7 +1053,7 @@ const UpdateActivity = () => {
                   </li>
                   <li>
                     <img src="/images/vendor/call.svg" className="img-fluid" />
-                    <p>+1 (407) 8798 789</p>
+                    <p className="number">+1 (407) 8798 789 asdasd</p>
                   </li>
                 </ul>
               </div>

pages/index.js

 import Home from "../components/home/Home";
 import Layout from "../components/layout/Layout";
-import { getActivitiesByVendor, getActivitiesForEndUser } from "../redux/actions/activityAction";
+import { getActivitiesByVendor, getActivitiesForEndUser, getActivityById } from "../redux/actions/activityAction";
 import { getAllCategories } from "../redux/actions/categoriesAction";
 import { getHomeBanner } from "../redux/actions/homeBannerAction";
 import { getTestimonial } from "../redux/actions/testimonialAction";
@@ -32,6 +32,7 @@ export const getServerSideProps = wrapper.getServerSideProps(store => async ({ r
     await store.dispatch(getTestimonial())
     await store.dispatch(getActivitiesForEndUser())
     await store.dispatch(getHomeBanner())
+    await store.dispatch(getActivityById())
 
     return {
       props: {},
@@ -43,7 +44,7 @@ export const getServerSideProps = wrapper.getServerSideProps(store => async ({ r
       // In seconds
       // revalidate: Number(process.env.NEXT_PUBLIC_ISR_REVALIDATE_AFTER)
     };
-} catch (error) {
+  } catch (error) {
     console.log("index.js", error);
-}
+  }
 });

styles/globals.css

@@ -31,7 +31,7 @@ acronym,
 address,
 big,
 cite,
-55 code,
+code,
 del,
 dfn,
 em,
@@ -684,9 +684,11 @@ span.form-error,
 .form-container .input-group {
   margin-bottom: 28px;
 }
+
 .form-container .password-field {
   position: relative;
 }
+
 .form-container .password-field .eye {
   background: url(/images/icons/eye-icon.png) no-repeat 50%;
   display: block;
@@ -697,6 +699,7 @@ span.form-error,
   top: 35px;
   cursor: pointer;
 }
+
 .form-container .password-field .eye-slash {
   background: url(/images/icons/eye-slash-icon.png) no-repeat 50%;
   display: block;
@@ -707,6 +710,7 @@ span.form-error,
   top: 35px;
   cursor: pointer;
 }
+
 .form-container .input-group .form-error {
   margin-top: 0.4rem;
 }
@@ -745,6 +749,7 @@ span.form-error,
 .form-container select {
   padding: 12px 5px;
   background-color: transparent;
+  font-family: sans-serif !important;
 }
 
 .form-container textarea {
@@ -1287,7 +1292,10 @@ span.form-error,
   margin-bottom: 0;
   margin-left: 1rem;
 }
-
+.helplist li p.number {
+  font-size: calc(16px + (16 - 16) * (100vw - 320px) / (1920 - 320));
+  line-height: calc(16px + (20 - 16) * (100vw - 320px) / (1920 - 320));
+}
 .business-details p {
   margin-left: 0;
   margin-bottom: 1rem;
@@ -2028,10 +2036,12 @@ span.form-error,
   border-radius: 24px 24px 0 0;
   object-fit: cover !important;
 }
-
+.business-details :where(.css-dev-only-do-not-override-1kuana8).ant-upload-wrapper.ant-upload-picture-card-wrapper {
+  display: block;
+}
 .top-rated {
   position: absolute;
-  bottom: 10px;
+  bottom: 12px;
   left: 10px;
   background: #fff;
   border-radius: 6px;
@@ -2041,12 +2051,29 @@ span.form-error,
   height: calc(25px + (25 - 25) * (100vw - 320px) / (1920 - 320)) !important;
   padding-top: 7px;
 }
-
+.modal-01-session h2 {
+  font-size: calc(32px + (32 - 32) * (100vw - 320px) / (1920 - 320));
+  line-height: calc(44px + (44 - 44) * (100vw - 320px) / (1920 - 320));
+}
+.modal-01-session .text01 {
+  font-size: calc(20px + (20 - 20) * (100vw - 320px) / (1920 - 320));
+  padding-top: 0.2rem;
+  padding-bottom: 1rem;
+}
 .info .top-name .title {
   font-size: 0.885vw;
   line-height: 20px;
+  display: -webkit-box;
+  -webkit-line-clamp: 1;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  margin-right: 5px;
+  /* height: 40px; */
+}
+.cl-blue {
+  color: #0a58ca !important;
 }
-
 .info .rating-wishlist .rating {
   background: #002c5f;
   border-radius: 4px;
@@ -2458,6 +2485,7 @@ footer hr {
   border-color: #c3c3c3;
   padding: 0.575rem 2.55rem 0.575rem 0.95rem;
   margin-bottom: 1rem;
+  font-family: sans-serif !important;
 }
 
 .box-01 .show-all {
@@ -2668,14 +2696,17 @@ footer hr {
   align-items: center;
   justify-content: center;
 }
+
 .product-reviews .rating .image-container {
   width: calc(12px + (13 - 12) * (100vw - 320px) / (1920 - 320));
   /* margin-top: -4px; */
   margin-left: 4px;
 }
+
 .product-reviews .rating .number {
   padding-top: 0.2rem;
 }
+
 .product-info .product-reviews .review {
   margin-right: 10px;
   margin-left: 0;
@@ -2719,9 +2750,11 @@ footer hr {
 .btn-row {
   padding: 2rem 0;
 }
+
 .product-info .btn-row {
   padding: 1rem 0;
 }
+
 .image-container.btn-gift {
   width: 0.938vw;
   display: inline-block;
@@ -2749,18 +2782,22 @@ footer hr {
   /* max-height: 100%; */
   border-radius: 8px;
 }
+
 .image-gallery-thumbnail .image-gallery-thumbnail-image,
 .image-gallery-slide.image-gallery-center {
   border-radius: 8px;
   overflow: hidden;
 }
+
 .image-gallery-thumbnails {
   padding: 1rem 0;
 }
+
 .image-gallery-thumbnail + .image-gallery-thumbnail {
   margin-left: 1rem;
   border-radius: 12px;
 }
+
 .image-gallery-content.image-gallery-thumbnails-bottom.fullscreen .image-gallery-thumbnail {
   width: 100px;
 }
@@ -2781,13 +2818,18 @@ footer hr {
   font-size: 0.833vw;
 }
 
-.btn-check:focus + .btn,
+/* .btn-check:focus + .btn,
 .btn:focus,
 button:focus:not(:focus-visible) {
   box-shadow: none;
   background-color: transparent;
 }
-
+.active-on-day .btn-check:focus + .active-on-day .btn,
+.btn:focus,
+button:focus:not(:focus-visible).active-on-day {
+  box-shadow: inherit;
+  background-color: #00000040;
+} */
 .availability-wrappper {
   display: flex;
   align-items: center;
@@ -2802,19 +2844,23 @@ button:focus:not(:focus-visible) {
   align-items: center;
   margin: 0.5rem 1rem 0.5rem 0.5rem;
 }
+
 .availability-wrappper li a {
   color: #000;
 }
+
 .availability-wrappper li > span {
   width: 30px;
   display: block;
   margin-right: 10px;
   flex: 0 0 auto;
 }
+
 .post-a-review .star-container {
   padding-right: 0 !important;
   padding-left: 3px !important;
 }
+
 .availability-wrappper li .info {
   width: 12px;
   height: 12px;
@@ -2945,10 +2991,12 @@ button:focus:not(:focus-visible) {
   /* display: none; */
   color: #000;
 }
+
 header .top-btn {
   display: flex;
   align-items: center;
 }
+
 header .top-btn .user-icon {
   padding: 0;
   margin: 0 0.5rem;
@@ -2956,15 +3004,18 @@ header .top-btn .user-icon {
   align-items: center;
   cursor: pointer;
 }
+
 header .top-btn .user-icon .image-container.user-pic {
   width: 37px;
   display: inline-block;
   margin-right: 0.5rem;
 }
+
 header .top-btn .user-icon .image-container.arrow-d {
   width: 12px;
   display: inline-block;
 }
+
 .top-btn .inner-box {
   box-shadow: 0px 4px 15.9px 0px #00000040;
   background: #fff;
@@ -2978,12 +3029,15 @@ header .top-btn .user-icon .image-container.arrow-d {
   display: none;
   border-radius: 9px;
 }
+
 .top-btn .inner-box.open {
   display: block;
 }
+
 .logout-bk {
   position: relative;
 }
+
 .user-info {
   background: #eaf6ff;
   padding: 1rem;
@@ -2991,21 +3045,25 @@ header .top-btn .user-icon .image-container.arrow-d {
   align-items: center;
   border-radius: 9px 9px 0 0;
 }
+
 .user-info .image-container {
   width: 52px;
   display: inline-block;
   margin-right: 1rem;
 }
+
 .user-info .view-profile a {
   font-size: 11px;
   color: #808080;
   text-decoration: underline !important;
 }
+
 .user-item {
   padding: 1rem;
   background: #fff;
   border-radius: 0 0 9px 9px;
 }
+
 .user-item ul {
   margin: 0;
   padding: 0;
@@ -3019,11 +3077,13 @@ header .top-btn .user-icon .image-container.arrow-d {
   padding: 0.5rem 0;
   cursor: pointer;
 }
+
 .user-item ul li a .image-container {
   margin-right: 0.5rem;
   flex: 0 0 auto;
   width: 20px;
 }
+
 .accordion-01 .accordion-button {
   font-size: 1.042vw;
   line-height: 1.042vw;
@@ -3580,6 +3640,7 @@ input[type="number"]::-webkit-outer-spin-button {
   padding: 0.3rem 0.5rem;
   font-size: 0.677vw;
   font-weight: 700;
+  line-height: inherit !important;
 }
 
 .blog-item .info {
@@ -3862,10 +3923,12 @@ input[type="number"]::-webkit-outer-spin-button {
 .gift-card-amt {
   margin: 1rem 0;
 }
+
 .gift-card-amt ul {
   margin: 0;
   padding: 0;
 }
+
 .gift-card-rt .form-01 .form-control {
   border: 1px solid #000;
   border-radius: 9px;
@@ -4057,69 +4120,85 @@ img:hover {
 .text-trunc-2 {
   display: -webkit-box;
   max-width: 100%;
-  height: 35px; /* this height is tempary while content is getting larger than 2 lines then remove it*/
+  height: 35px;
+  /* this height is tempary while content is getting larger than 2 lines then remove it*/
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
 }
+
 .listing-wrapper .product-info {
   padding-left: 2rem;
 }
+
 .breadcrumb-wrap .ant-breadcrumb ol li.ant-breadcrumb-separator {
   margin: 0 0.8rem;
 }
+
 .breadcrumb-wrap .ant-breadcrumb ol li .ant-breadcrumb-link {
   font-size: calc(14px + (14 - 14) * (100vw - 320px) / (1920 - 320));
 }
+
 .most-read-blogs-session,
 .blogs-session {
   padding-bottom: 3rem;
 }
+
 footer .footer-link ul {
   padding-left: 0;
 }
+
 .let-discover-carousal .title {
   text-align: center;
   padding: 0.5rem 0;
   cursor: pointer;
 }
+
 .contact-numbe .special-label {
   display: none !important;
 }
+
 .modal-01-session .closeIcon {
   position: absolute;
   right: 1.5rem;
   top: 1rem;
   width: 20px;
 }
+
 .modal-01-session .closeIcon .closeIconBtn {
   border: 0;
   background: transparent;
 }
+
 .modal-01-session .closeIcon .closeIconBtn img {
   width: 20px;
 }
+
 .top-btn.hide-on-desktop {
   margin: 0;
   position: absolute;
   right: 20vw;
   top: 13px;
 }
+
 .image-gallery-thumbnail.active,
 .image-gallery-thumbnail:focus,
 .image-gallery-thumbnail:hover {
   border-radius: 12px;
 }
+
 .product-gallery-item .image-gallery-content.fullscreen {
   background: #000;
   margin: 2rem 0;
 }
+
 .product-gallery-item .image-gallery-content.image-gallery-content.image-gallery-thumbnails-bottom.fullscreen {
   position: relative;
   line-height: 0;
   top: -50px;
   /* margin-top: 2rem; */
 }
+
 /* .image-gallery-content .image-gallery-slide .image-gallery-image {
   margin-top: 2rem;
 } */
@@ -4128,10 +4207,13 @@ footer .footer-link ul {
   display: block;
   color: #000;
 }
+
 .suitable-age-group .anticon.anticon-down {
   display: none;
 }
-
+.vendor-signup .btn-light {
+  background: #fff;
+}
 @media (min-width: 992px) {
   .navbar-expand-lg .navbar-nav .nav-link {
     margin: 0 2rem;
@@ -4227,6 +4309,7 @@ footer .footer-link ul {
   .listing-wrapper .product-info {
     padding-left: 0;
   }
+
   .browse-experiences-item .img-wrapper .image-container .image {
     height: 120px !important;
   }
@@ -4318,14 +4401,17 @@ footer .footer-link ul {
     padding-left: 5vw;
     padding-right: 5vw;
   }
+
   .load-more {
     justify-content: center;
   }
+
   .btn-primary,
   .btn-secondary,
   .vendor-signup a {
     padding: 0.6rem 2rem;
   }
+
   .browse-experiences-item .img-wrapper .image-container .image {
     height: 220px !important;
   }
@@ -4889,3 +4975,8 @@ footer .footer-link ul {
     padding: 0 1rem;
   }
 }
+
+/* min height */
+.min-height-40 {
+  min-height: 40vh;
+}

yarn.lock

@@ -352,11 +352,6 @@
   resolved "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-12.2.5.tgz"
   integrity sha512-0szyAo8jMCClkjNK0hknjhmAngUppoRekW6OAezbEYwHXN/VNtsXbfzgYOqjKWxEx3OoAzrT3jLwAF0HdX2MEw==
 
-"@next/swc-linux-x64-musl@12.2.5":
-  version "12.2.5"
-  resolved "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-12.2.5.tgz"
-  integrity sha512-zg/Y6oBar1yVnW6Il1I/08/2ukWtOG6s3acdJdEyIdsCzyQi4RLxbbhkD/EGQyhqBvd3QrC6ZXQEXighQUAZ0g==
-
 "@nodelib/fs.scandir@2.1.5":
   version "2.1.5"
   resolved "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz"
@@ -2622,27 +2617,27 @@ glob-parent@~5.1.2:
   dependencies:
     is-glob "^4.0.1"
 
-glob@^7.1.3, glob@^7.1.4, glob@^7.2.0:
-  version "7.2.3"
-  resolved "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz"
-  integrity sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==
+glob@^7.1.3, glob@^7.1.4, glob@7.1.7:
+  version "7.1.7"
+  resolved "https://registry.npmjs.org/glob/-/glob-7.1.7.tgz"
+  integrity sha512-OvD9ENzPLbegENnYP5UUfJIirTg4+XwMWGaQfQTY0JenxNvvIKP3U3/tAQSPIu/lHxXYSZmpXlUHeqAIdKzBLQ==
   dependencies:
     fs.realpath "^1.0.0"
     inflight "^1.0.4"
     inherits "2"
-    minimatch "^3.1.1"
+    minimatch "^3.0.4"
     once "^1.3.0"
     path-is-absolute "^1.0.0"
 
-glob@7.1.7:
-  version "7.1.7"
-  resolved "https://registry.npmjs.org/glob/-/glob-7.1.7.tgz"
-  integrity sha512-OvD9ENzPLbegENnYP5UUfJIirTg4+XwMWGaQfQTY0JenxNvvIKP3U3/tAQSPIu/lHxXYSZmpXlUHeqAIdKzBLQ==
+glob@^7.2.0:
+  version "7.2.3"
+  resolved "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz"
+  integrity sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==
   dependencies:
     fs.realpath "^1.0.0"
     inflight "^1.0.4"
     inherits "2"
-    minimatch "^3.0.4"
+    minimatch "^3.1.1"
     once "^1.3.0"
     path-is-absolute "^1.0.0"
 
@@ -3696,21 +3691,16 @@ move-concurrently@^1.0.1:
     rimraf "^2.5.4"
     run-queue "^1.0.3"
 
-ms@^2.1.1:
-  version "2.1.3"
-  resolved "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz"
-  integrity sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==
+ms@^2.1.1, ms@2.1.2:
+  version "2.1.2"
+  resolved "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz"
+  integrity sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==
 
 ms@2.0.0:
   version "2.0.0"
   resolved "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz"
   integrity sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==
 
-ms@2.1.2:
-  version "2.1.2"
-  resolved "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz"
-  integrity sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==
-
 nanoclone@^0.2.1:
   version "0.2.1"
   resolved "https://registry.npmjs.org/nanoclone/-/nanoclone-0.2.1.tgz"
@@ -4838,16 +4828,7 @@ react-easy-crop@^5.0.7:
     normalize-wheel "^1.0.1"
     tslib "^2.0.1"
 
-react-event-listener@^0.6.2:
-  version "0.6.6"
-  resolved "https://registry.npmjs.org/react-event-listener/-/react-event-listener-0.6.6.tgz"
-  integrity sha512-+hCNqfy7o9wvO6UgjqFmBzARJS7qrNoda0VqzvOuioEpoEXKutiKuv92dSz6kP7rYLmyHPyYNLesi5t/aH1gfw==
-  dependencies:
-    "@babel/runtime" "^7.2.0"
-    prop-types "^15.6.0"
-    warning "^4.0.1"
-
-react-event-listener@^0.6.6:
+react-event-listener@^0.6.2, react-event-listener@^0.6.6:
   version "0.6.6"
   resolved "https://registry.npmjs.org/react-event-listener/-/react-event-listener-0.6.6.tgz"
   integrity sha512-+hCNqfy7o9wvO6UgjqFmBzARJS7qrNoda0VqzvOuioEpoEXKutiKuv92dSz6kP7rYLmyHPyYNLesi5t/aH1gfw==
@@ -5157,7 +5138,7 @@ react-transition-group@^2.5.3:
     prop-types "^15.6.2"
     react-lifecycles-compat "^3.0.4"
 
-react-transition-group@^4, react-transition-group@4.3.0:
+react-transition-group@^4, react-transition-group@^4.3.0, react-transition-group@4.3.0:
   version "4.3.0"
   resolved "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.3.0.tgz"
   integrity sha512-1qRV1ZuVSdxPlPf4O8t7inxUGpdyO5zG9IoNfJxSO0ImU2A1YWkEQvFPuIPZmMLkg5hYs7vv5mMOyfgSkvAwvw==
@@ -5167,7 +5148,7 @@ react-transition-group@^4, react-transition-group@4.3.0:
     loose-envify "^1.4.0"
     prop-types "^15.6.2"
 
-react-transition-group@^4.3.0, react-transition-group@^4.4.2:
+react-transition-group@^4.4.2:
   version "4.4.5"
   resolved "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz"
   integrity sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==
@@ -5669,17 +5650,22 @@ source-map-url@^0.4.0:
   resolved "https://registry.npmjs.org/source-map-url/-/source-map-url-0.4.1.tgz"
   integrity sha512-cPiFOTLUKvJFIg4SKVScy4ilPPW6rFgMgfuZJPNoDuMs3nC1HbMUycBoJw77xFIp6z1UJQJOfx6C9GMH80DiTw==
 
-source-map@^0.5.6:
+source-map@^0.5.6, source-map@^0.5.7:
   version "0.5.7"
   resolved "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz"
   integrity sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==
 
-source-map@^0.5.7:
-  version "0.5.7"
-  resolved "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz"
-  integrity sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==
+source-map@^0.6.0:
+  version "0.6.1"
+  resolved "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz"
+  integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
+
+source-map@^0.6.1:
+  version "0.6.1"
+  resolved "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz"
+  integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
 
-source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.1:
+source-map@~0.6.1:
   version "0.6.1"
   resolved "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz"
   integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==