Skip to content

Jay Mehta / zango-frontend

Go to a project
Toggle navigation
Toggle navigation pinning
Commit 5d70984e by Ravindra Kanojiya
Options

updated ui

1 parent d53a7dc4
Inline Side-by-side
Showing 14 changed files with 576 additions and 495 deletions
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/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">
<Button variant="primary">View All</Button>
<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
......@@ -11,17 +11,20 @@ import { finishVendorOtpVerification } from "../../redux/actions/vendorActions";
import { useRouter } from "next/router";
import { Button } from "react-bootstrap";
import { postGiftCard } from "../../redux/actions/giftCardAction";
import TermsAndConditionModel from "../signup/TermsAndConditionModel";
// import { getCurrentEndUser } from "../../redux/actions/userActions";
const validationSchema = Yup.object().shape({
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")
message: Yup.string().required("Message is required"),
termsConditions: Yup.bool().oneOf([true], "Please Accept Terms & Conditions"),
});
let formik1;
const GiftCard = () => {
const [isOpenEis, setIsOpenEis] = useState(false);
const router = useRouter();
const dispatch = useDispatch();
// useEffect(() => {
......@@ -57,394 +60,412 @@ const GiftCard = () => {
};
return (
<section className="gift-card-session">
<div className="container">
<div className="row justify-content-center">
<div className="col-md-10">
<div className="see-my-gift-cards-row">
<Button
onClick={() => {
if (!session) {
toast.warning("Please log in to see your gift cards.");
return;
}
router.push("/user/giftcard");
}}
>
See my gift cards
</Button>
</div>
{!isResult && (
<div className="row">
<div className="col-md-5">
<div className="gift-card-lt">
<div className="gift-box">
<img src="/images/gift-card.svg" alt="Gift Card" />
<>
<section className="gift-card-session">
<div className="container">
<div className="row justify-content-center">
<div className="col-md-10">
<div className="see-my-gift-cards-row">
<Button
onClick={() => {
if (!session) {
toast.warning("Please log in to see your gift cards.");
return;
}
router.push("/user/giftcard");
}}
>
See my gift cards
</Button>
</div>
{!isResult && (
<div className="row">
<div className="col-md-5">
<div className="gift-card-lt">
<div className="gift-box">
<img src="/images/gift-card.svg" alt="Gift Card" />
</div>
<h3>Amount: ${amount}</h3>
</div>
<h3>Amount: ${amount}</h3>
</div>
</div>
<div className="col-md-7">
{isStep1 && (
<div className="gift-card-rt">
{/* <div className="back-btn">
<div className="col-md-7">
{isStep1 && (
<div className="gift-card-rt">
{/* <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> */}
<Formik
validationSchema={validationSchema}
initialValues={{
customAmt: "",
email: "",
receiverEmail: "",
message: ""
}}
enableReinitialize={true}
// validationSchema={validationSchema}
onSubmit={(values, { setSubmitting }) => {
// Handle form submission here
}}
>
{({ 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>
<div className="gift-card-amt">
<ul>
<li>
<input
name="amt"
id="amt-20"
type="radio"
value=""
data-gtm-Form-interact-field-id="1"
onChange={e => {
setAmount(20);
setcustom(false);
}}
/>
<label for="amt-20">$20</label>
</li>
<li>
<input
name="amt"
id="amt-50"
type="radio"
value=""
data-gtm-form-interact-field-id="1"
onChange={e => {
setAmount(50);
setcustom(false);
}}
/>
<label for="amt-50">$50</label>
</li>
<li>
<input
name="amt"
id="amt-100"
type="radio"
value=""
data-gtm-form-interact-field-id="1"
onChange={e => {
setAmount(100);
setcustom(false);
}}
/>
<label for="amt-100">
<span>Most Popular</span>
<br /> $100
</label>
</li>
<li>
<input
name="amt"
id="amt-250"
type="radio"
value=""
data-gtm-form-interact-field-id="1"
onChange={e => {
setAmount(250);
setcustom(false);
}}
/>
<label for="amt-250"> $250</label>
</li>
<li>
<input
name="amt"
id="amt-500"
type="radio"
value=""
data-gtm-form-interact-field-id="1"
onChange={e => {
setAmount(500);
setcustom(false);
}}
/>
<label for="amt-500"> $500</label>
</li>
<li>
<input
name="amt"
id="amt-custom"
type="radio"
value=""
data-gtm-form-interact-field-id="1"
onChange={e => {
setcustom(true);
setAmount(null);
}}
/>
<label for="amt-custom"> $ Custom</label>
</li>
</ul>
</div>
<div className="row">
{custom && (
<Formik
validationSchema={validationSchema}
initialValues={{
customAmt: "",
email: "",
receiverEmail: "",
message: "",
termsConditions: false
}}
enableReinitialize={true}
// validationSchema={validationSchema}
onSubmit={(values, { setSubmitting }) => {
// Handle form submission here
}}
>
{({ 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>
<div className="gift-card-amt">
<ul>
<li>
<input
name="amt"
id="amt-20"
type="radio"
value=""
data-gtm-Form-interact-field-id="1"
onChange={e => {
setAmount(20);
setcustom(false);
}}
/>
<label for="amt-20">$20</label>
</li>
<li>
<input
name="amt"
id="amt-50"
type="radio"
value=""
data-gtm-form-interact-field-id="1"
onChange={e => {
setAmount(50);
setcustom(false);
}}
/>
<label for="amt-50">$50</label>
</li>
<li>
<input
name="amt"
id="amt-100"
type="radio"
value=""
data-gtm-form-interact-field-id="1"
onChange={e => {
setAmount(100);
setcustom(false);
}}
/>
<label for="amt-100">
<span>Most Popular</span>
<br /> $100
</label>
</li>
<li>
<input
name="amt"
id="amt-250"
type="radio"
value=""
data-gtm-form-interact-field-id="1"
onChange={e => {
setAmount(250);
setcustom(false);
}}
/>
<label for="amt-250"> $250</label>
</li>
<li>
<input
name="amt"
id="amt-500"
type="radio"
value=""
data-gtm-form-interact-field-id="1"
onChange={e => {
setAmount(500);
setcustom(false);
}}
/>
<label for="amt-500"> $500</label>
</li>
<li>
<input
name="amt"
id="amt-custom"
type="radio"
value=""
data-gtm-form-interact-field-id="1"
onChange={e => {
setcustom(true);
setAmount(null);
}}
/>
<label for="amt-custom"> $ Custom</label>
</li>
</ul>
</div>
<div className="row">
{custom && (
<div className="col-md-12 mb-4">
<label htmlFor="">Custom Amount</label>
<Field
className="form-control"
type="number"
name="customAmt"
placeholder="Enter your amount"
onChange={e => {
setAmount(e.target.value);
}}
onBlur={handleBlur}
value={amount}
/>
{touched.customAmt && errors.customAmt && <div className="text-danger">{errors.customAmt}</div>}
</div>
)}
<div className="col-md-12 mb-4">
<label htmlFor="">Custom Amount</label>
<label htmlFor="">Email Id</label>
<Field
className="form-control"
type="number"
name="customAmt"
placeholder="Enter your amount"
onChange={e => {
setAmount(e.target.value);
}}
type="email"
name="email"
placeholder="yourname@example.com"
onChange={handleChange}
onBlur={handleBlur}
value={amount}
value={values.email}
/>
{touched.customAmt && errors.customAmt && <div className="text-danger">{errors.customAmt}</div>}
</div>
)}
<div className="col-md-12 mb-4">
<label htmlFor="">Email Id</label>
<Field
className="form-control"
type="email"
name="email"
placeholder="yourname@example.com"
onChange={handleChange}
onBlur={handleBlur}
value={values.email}
/>
{touched.email && errors.email && <div className="text-danger">{errors.email}</div>}
<div className="tooltip-wrapper">
<a className="tooltip-btn" onMouseEnter={() => setShowTooltip1(true)} onMouseLeave={() => setShowTooltip1(false)}>
<span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/info.svg" />
</span>
</a>
{touched.email && errors.email && <div className="text-danger">{errors.email}</div>}
<div className="tooltip-wrapper">
<a className="tooltip-btn" onMouseEnter={() => setShowTooltip1(true)} onMouseLeave={() => setShowTooltip1(false)}>
<span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/info.svg" />
</span>
</a>
{/* Tooltip */}
{showTooltip1 && <div className="tooltips">{tooltipText1}</div>}
{/* Tooltip */}
{showTooltip1 && <div className="tooltips">{tooltipText1}</div>}
</div>
</div>
</div>
<div className="col-md-12 mb-4">
<label htmlFor="">Receiver’s Email Id</label>
<Field
className="form-control"
type="receiverEmail"
name="receiverEmail"
placeholder="yourname@example.com"
onChange={handleChange}
onBlur={handleBlur}
value={values.receiverEmail}
/>
{touched.receiverEmail && errors.receiverEmail && <div className="text-danger">{errors.receiverEmail}</div>}
<div className="tooltip-wrapper">
<a className="tooltip-btn" onMouseEnter={() => setShowTooltip2(true)} onMouseLeave={() => setShowTooltip2(false)}>
<span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/info.svg" />
</span>
</a>
<div className="col-md-12 mb-4">
<label htmlFor="">Receiver’s Email Id</label>
<Field
className="form-control"
type="receiverEmail"
name="receiverEmail"
placeholder="yourname@example.com"
onChange={handleChange}
onBlur={handleBlur}
value={values.receiverEmail}
/>
{touched.receiverEmail && errors.receiverEmail && <div className="text-danger">{errors.receiverEmail}</div>}
<div className="tooltip-wrapper">
<a className="tooltip-btn" onMouseEnter={() => setShowTooltip2(true)} onMouseLeave={() => setShowTooltip2(false)}>
<span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/info.svg" />
</span>
</a>
{showTooltip2 && <div className="tooltips">{tooltipText2}</div>}
{showTooltip2 && <div className="tooltips">{tooltipText2}</div>}
</div>
</div>
</div>
<div className="col-md-12 mb-4">
<Field
className="form-control"
as="textarea"
rows={7}
name="message"
placeholder="Type your message..."
onChange={handleChange}
onBlur={handleBlur}
value={values.message}
/>
{touched.message && errors.message && <div className="text-danger">{errors.message}</div>}
</div>
<div className="col-md-12 mb-3">
<button
className="btn btn-primary w-100"
onClick={async () => {
setloading(true);
if (!session) {
toast.warning("Please log in to buy a gift card.");
return;
}
const config = {
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${session.jwt}`
}
};
const data = {
data: {
userId: session.id
<div className="col-md-12 mb-4">
<Field
className="form-control"
as="textarea"
rows={7}
name="message"
placeholder="Type your message..."
onChange={handleChange}
onBlur={handleBlur}
value={values.message}
/>
{touched.message && errors.message && <div className="text-danger">{errors.message}</div>}
</div>
<div className="col-md-12 mb-3">
<button
className="btn btn-primary w-100"
onClick={async () => {
setloading(true);
if (!session) {
toast.warning("Please log in to buy a gift card.");
return;
}
};
const response = await axios.post(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/end-user/verify-gift-card-otp`, data, config);
setvalues({ ...values, amount });
console.log("response", response.data);
setloading(false);
console.log(values);
setIsStep2(true);
setIsStep1(false);
}}
disabled={!amount > 0 || !values.receiverEmail || !values.email || errors.email || errors.receiverEmail || errors.message}
>
{loading ? <Loader /> : "Continue"}
</button>
</div>
<div className="col-12">
<p>
By continuing you agree to our <a href="/terms-and-conditions">Terms</a> and <a href="/privacy-policy">Privacy Policy</a>
</p>
const config = {
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${session.jwt}`
}
};
const data = {
data: {
userId: session.id
}
};
const response = await axios.post(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/end-user/verify-gift-card-otp`, data, config);
setvalues({ ...values, amount });
console.log("response", response.data);
setloading(false);
console.log(values);
setIsStep2(true);
setIsStep1(false);
}}
disabled={!amount > 0 || !values.receiverEmail || !values.email || errors.email || errors.receiverEmail || errors.message}
>
{loading ? <Loader /> : "Continue"}
</button>
</div>
<div className="col-12">
<label className="check-container mb-0 pt-1 d-flex mb-2" htmlFor="termsConditions">
<input
type="checkbox"
id="termsConditions"
name="termsConditions"
className="check-box me-2"
checked={values.termsConditions}
onChange={handleChange}
onBlur={handleBlur}
/>
<span className="checkmark"></span>
{/* By continuing you agree to our <a className="cl-blue" onClick={() => { setIsOpenEis(true) }}>terms & conditions*</a> */}
<p>
By continuing you agree to our <a className="cl-blue" onClick={() => { setIsOpenEis(true) }}>Terms</a> and <a href="/privacy-policy">Privacy Policy</a>
</p>
</label>
{errors.termsConditions && touched.termsConditions && <span className="form-error pl-5">{errors.termsConditions}</span>}
</div>
</div>
</div>
</Form>
)}
</Formik>
</div>
)}
</Form>
)}
</Formik>
</div>
)}
{isStep2 && (
<div className="gift-card-rt">
{/* <div className="back-btn">
{isStep2 && (
<div className="gift-card-rt">
{/* <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> */}
<Formik
initialValues={{
code: ""
}}
// validationSchema={validationSchema}
onSubmit={(values, { setSubmitting }) => {
// Handle form submission here
console.log(values);
setSubmitting(false);
}}
>
{({ 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)} */}
<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"
name="code"
placeholder="Enter the code we emailed you"
onChange={handleChange}
onBlur={handleBlur}
value={values.code}
/>
{touched.code && errors.code && <div className="text-danger">{errors.code}</div>}
{/* <div className="link-a">
<Formik
initialValues={{
code: ""
}}
// validationSchema={validationSchema}
onSubmit={(values, { setSubmitting }) => {
// Handle form submission here
console.log(values);
setSubmitting(false);
}}
>
{({ 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)} */}
<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"
name="code"
placeholder="Enter the code we emailed you"
onChange={handleChange}
onBlur={handleBlur}
value={values.code}
/>
{touched.code && errors.code && <div className="text-danger">{errors.code}</div>}
{/* <div className="link-a">
<a href="">Resend Code</a>
</div> */}
</div>
</div>
</div>
<div className="row">
<div className="col-md-12 mb-3">
<button
className="btn btn-primary w-100"
onClick={async () => {
const res = await await finishVendorOtpVerification({ email: session.user.email, oneTimePassword: values.code });
console.log("res", res.data);
if (!res.data.ok) {
toast.error(res.data.message);
// console.log("here");
return;
}
<div className="row">
<div className="col-md-12 mb-3">
<button
className="btn btn-primary w-100"
onClick={async () => {
const res = await await finishVendorOtpVerification({ email: session.user.email, oneTimePassword: values.code });
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: {
senderEmail: form1Values.email,
senderName: form1Values.email,
receiverEmail: form1Values.receiverEmail,
receiverName: form1Values.receiverEmail,
amount: form1Values.amount,
note: form1Values.message,
endUser: endUser.id,
status: "new"
}
});
console.log("response", response);
setIsStep2(false);
setIsStep1(false);
setIsResult(true);
toast.success("OTP verified!");
}
}}
disabled={!values.code || String(values.code).length < 4}
>
Confirm
</button>
if (res.data.ok) {
const response = await postGiftCard({
data: {
senderEmail: form1Values.email,
senderName: form1Values.email,
receiverEmail: form1Values.receiverEmail,
receiverName: form1Values.receiverEmail,
amount: form1Values.amount,
note: form1Values.message,
endUser: endUser.id,
status: "new"
}
});
console.log("response", response);
setIsStep2(false);
setIsStep1(false);
setIsResult(true);
toast.success("OTP verified!");
}
}}
disabled={!values.code || String(values.code).length < 4}
>
Confirm
</button>
</div>
</div>
</div>
</Form>
)}
</Formik>
</div>
)}
</Form>
)}
</Formik>
</div>
)}
</div>
</div>
</div>
)}
)}
{isResult && (
<div className="row">
<div className="col-12">
<div className="result-box">
<p>
Gift card sent for approval, please wait till the vendor contacts you
<br /> Thank you.
</p>
<div>
<button
className="btn btn-primary"
type="button"
onClick={() => {
router.push("/listing");
}}
>
Browse Experiences
</button>
{isResult && (
<div className="row">
<div className="col-12">
<div className="result-box">
<p>
Gift card sent for approval, please wait till the vendor contacts you
<br /> Thank you.
</p>
<div>
<button
className="btn btn-primary"
type="button"
onClick={() => {
router.push("/listing");
}}
>
Browse Experiences
</button>
</div>
</div>
</div>
</div>
</div>
)}
)}
</div>
</div>
</div>
</div>
</section>
</section>
<TermsAndConditionModel isOpenEis={isOpenEis} setIsOpenEis={setIsOpenEis} />
</>
);
};
......
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/vendor/ActivityDetails.js
......@@ -457,7 +457,7 @@ const ActivityDetails = ({ isUpdate }) => {
<div className="col-12 col-lg-6">
<div className="input-group">
<label>Location</label>
<AsyncTypeahead
<AsyncTypeahead className="w-100"
type="number"
onSearch={handleSearch}
minLength={3}
......@@ -521,45 +521,37 @@ const ActivityDetails = ({ isUpdate }) => {
<div className="col-12 col-lg-6">
<div className="input-group mb-2">
<label>Gifting to Someone</label>
<div className="row">
<div className="col-12 col-lg-12">
<select id="giftingToSomeone" name="giftingToSomeone" value={values.giftingToSomeone} onChange={handleChange} onBlur={handleBlur}>
{" "}
Gift someone
<option value="">Select</option>
<option value={true}>Yes</option>
<option value={false}>No</option>
</select>
</div>
{touched.giftingToSomeone && errors.giftingToSomeone && (
<span className="form-error" style={{ color: "red", fontSize: "10px" }}>
{errors.giftingToSomeone}
</span>
)}
</div>
<select id="giftingToSomeone" name="giftingToSomeone" value={values.giftingToSomeone} onChange={handleChange} onBlur={handleBlur}>
{" "}
Gift someone
<option value="">Select</option>
<option value={true}>Yes</option>
<option value={false}>No</option>
</select>
{touched.giftingToSomeone && errors.giftingToSomeone && (
<span className="form-error" style={{ color: "red", fontSize: "10px" }}>
{errors.giftingToSomeone}
</span>
)}
</div>
</div>
<div className="col-12 col-lg-6">
<div className="input-group mb-2">
<label>Activity Type</label>
<div className="row">
<div className="">
<div className="col-12 col-lg-12">
<select id="activityType" name="activityType" onChange={handleChange} onBlur={handleBlur} value={values.activityType}>
{" "}
Activity Type
<option value="">Select</option>
<option value={"indoor"}>Indoor</option>
<option value={"outdoor"}>Outdoor</option>
</select>
</div>
{touched.activityType && errors.activityType && (
<span className="form-error" style={{ color: "red", fontSize: "10px" }}>
{errors.activityType}
</span>
)}
</div>
</div>
<select id="activityType" name="activityType" onChange={handleChange} onBlur={handleBlur} value={values.activityType}>
{" "}
Activity Type
<option value="">Select</option>
<option value={"indoor"}>Indoor</option>
<option value={"outdoor"}>Outdoor</option>
</select>
{touched.activityType && errors.activityType && (
<span className="form-error" style={{ color: "red", fontSize: "10px" }}>
{errors.activityType}
</span>
)}
</div>
</div>
</div>
......@@ -583,7 +575,7 @@ const ActivityDetails = ({ isUpdate }) => {
<div className="input-group">
<label>Size of the Group</label>
<div className="row">
<div className="col-6 col-lg-5">
<div className="col-6 col-lg-5 p-0 pe-3">
<input type="text" placeholder="Min." name={`minGroupSize`} onChange={handleChange} onBlur={handleBlur} value={values.minGroupSize} />
{touched.minGroupSize && errors.minGroupSize && (
<span className="form-error" style={{ color: "red", fontSize: "10px" }}>
......@@ -591,7 +583,7 @@ const ActivityDetails = ({ isUpdate }) => {
</span>
)}
</div>
<div className="col-6 col-lg-5">
<div className="col-6 col-lg-5 p-0 pe-3">
<input type="text" placeholder="Max." name={`maxGroupSize`} onChange={handleChange} onBlur={handleBlur} value={values.maxGroupSize} />
{touched.maxGroupSize && errors.maxGroupSize && (
<span className="form-error" style={{ color: "red", fontSize: "10px" }}>
......@@ -664,7 +656,7 @@ const ActivityDetails = ({ isUpdate }) => {
<span className="col-md-6">Select all:</span>
<Switch
// style={{ backgroundColor: "green" }}
className="col-md-4"
className="col-md-4 active-on-day"
value={
daysBoolean.availableOnMonday &&
daysBoolean.availableOnTuesday &&
......@@ -698,7 +690,7 @@ const ActivityDetails = ({ isUpdate }) => {
<div className="d-flex">
<span className="col-md-6">Monday:</span>
<Switch
className="col-md-4"
className="col-md-4 active-on-day"
value={daysBoolean.availableOnMonday}
id={"availableOnMonday"}
name="availableOnMonday"
......@@ -715,7 +707,7 @@ const ActivityDetails = ({ isUpdate }) => {
<div className="d-flex">
<span className="col-md-6">Tuesday:</span>
<Switch
className="col-md-4"
className="col-md-4 active-on-day"
value={daysBoolean.availableOnTuesday}
onChange={e => {
setDaysBoolean({ ...daysBoolean, availableOnTuesday: e === true ? true : false });
......@@ -732,7 +724,7 @@ const ActivityDetails = ({ isUpdate }) => {
<div className="d-flex">
<span className="col-md-6">Wednesday:</span>
<Switch
className="col-md-4"
className="col-md-4 active-on-day"
value={daysBoolean.availableOnWednesday}
id={"availableOnWednesday"}
// onChange={handleChange}
......@@ -749,7 +741,7 @@ const ActivityDetails = ({ isUpdate }) => {
<div className="d-flex">
<span className="col-md-6">Thursday:</span>
<Switch
className="col-md-4"
className="col-md-4 active-on-day"
value={daysBoolean.availableOnThursday}
id={"availableOnThursday"}
onChange={e => {
......@@ -765,7 +757,7 @@ const ActivityDetails = ({ isUpdate }) => {
<div className="d-flex">
<span className="col-md-6">Friday:</span>
<Switch
className="col-md-4"
className="col-md-4 active-on-day"
value={daysBoolean.availableOnFriday}
id={"availableOnFriday"}
onChange={e => {
......@@ -781,7 +773,7 @@ const ActivityDetails = ({ isUpdate }) => {
<div className="d-flex">
<span className="col-md-6">Saturday:</span>
<Switch
className="col-md-4"
className="col-md-4 active-on-day"
value={daysBoolean.availableOnSaturday}
id={"availableOnSaturday"}
onChange={e => {
......@@ -797,7 +789,7 @@ const ActivityDetails = ({ isUpdate }) => {
<div className="d-flex">
<span className="col-md-6">Sunday:</span>
<Switch
className="col-md-4"
className="col-md-4 active-on-day"
value={daysBoolean.availableOnSunday}
id={"availableOnSunday"}
onChange={e => {
......@@ -983,7 +975,7 @@ const ActivityDetails = ({ isUpdate }) => {
<p className="textH">Add display image</p>
{/* {console.log(displayImage)} */}
<UploadImageCustom isUpdate={isUpdate} setImage={setdisplayImage} populatedImages={activityById?.data.attributes.image} />
<hr />
<hr className="mt-4" />
</div>
<div className="row d-flex ">
<p className="textH">Add other images</p>
......@@ -1040,7 +1032,7 @@ const ActivityDetails = ({ isUpdate }) => {
<br />
<br />
<br />
<br />
<>
{/* <button
onClick={e => {
......@@ -1109,7 +1101,7 @@ const ActivityDetails = ({ isUpdate }) => {
</li>
<li>
<img src="/images/vendor/call.svg" className="img-fluid" />
<p>+1 (407) 8798 789</p>
<p className="number">+1 (407) 8798 789</p>
</li>
</ul>
</div>
......
components/vendor/BusinessDetails.js
......@@ -89,7 +89,7 @@ const BusinessDetails = () => {
useEffect(() => {
setbrandLogo(vendorDetails?.attributes.brandLogo.data?.id)
}, [])
const ApprovalStatus = () => {
if (loadedUser) {
switch (loadedUser.approved) {
......@@ -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,18 +143,18 @@ 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>
{/* <div>
<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">
<Image alt="" width="16" height="16" src="/images/vendor/icon-filter.svg" className="me-2" /> Filter
</Button>
</div>
</div> */}
<Table columns={columns} dataSource={data} onChange={onChange} />
{/* </div>
<Table columns={columns} dataSource={data} onChange={onChange} />
{/* </div>
</div>
</div> */}
<Modal
......
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
......@@ -558,7 +558,7 @@ const UpdateActivity = () => {
setMonths(e);
}}
options={monthsArray}
// value={values.months}
// value={values.months}
/>
{/* {touched.months && errors.months && (
<span className="form-error" style={{ color: "red", fontSize: "10px" }}>
......@@ -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,18 +32,19 @@ 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: {},
// Next.js will attempt to re-generate the page:
// - Any requests to the page after the initial request and before 10 seconds are also cached and instantaneous.
// - After the 10-second window, the next request will still show the cached (stale) page
// - Next.js triggers a regeneration of the page in the background.
// - Once the page generates successfully, Next.js will invalidate the cache and show the updated page. If the background regeneration fails, the old page would still be unaltered.
// In seconds
// revalidate: Number(process.env.NEXT_PUBLIC_ISR_REVALIDATE_AFTER)
};
} catch (error) {
console.log("index.js", error);
}
return {
props: {},
// Next.js will attempt to re-generate the page:
// - Any requests to the page after the initial request and before 10 seconds are also cached and instantaneous.
// - After the 10-second window, the next request will still show the cached (stale) page
// - Next.js triggers a regeneration of the page in the background.
// - Once the page generates successfully, Next.js will invalidate the cache and show the updated page. If the background regeneration fails, the old page would still be unaltered.
// In seconds
// revalidate: Number(process.env.NEXT_PUBLIC_ISR_REVALIDATE_AFTER)
};
} catch (error) {
console.log("index.js", error);
}
});
styles/globals.css
......@@ -270,12 +270,12 @@ h6 {
position: relative;
}
.image-container>span {
.image-container > span {
position: unset !important;
/* display: inline-block !important; */
}
.image-container.d-inblock>span {
.image-container.d-inblock > span {
position: unset !important;
display: inline-block !important;
}
......@@ -376,7 +376,7 @@ header {
font-size: 0.833vw;
}
.header-search>.form-control {
.header-search > .form-control {
font-size: 0.833vw;
}
......@@ -434,16 +434,16 @@ header {
border-radius: 0 0 8rem 8rem;
}
.home-banner-bg>span {
.home-banner-bg > span {
height: 100%;
display: block;
}
.home-banner-bg>span>span {
.home-banner-bg > span > span {
height: 100% !important;
}
.home-banner-bg>span>span .image {
.home-banner-bg > span > span .image {
object-fit: cover !important;
border-radius: 0 0 136px 136px;
}
......@@ -509,7 +509,7 @@ header {
position: relative;
}
.owl-custom01.owl-carousel .owl-nav button.owl-prev>span {
.owl-custom01.owl-carousel .owl-nav button.owl-prev > span {
background: url(/images/icons/arrow-left.svg) no-repeat center;
width: 14px;
height: 22px;
......@@ -517,7 +517,7 @@ header {
display: block;
}
.owl-custom01.owl-carousel .owl-nav button.owl-next>span {
.owl-custom01.owl-carousel .owl-nav button.owl-next > span {
background: url(/images/icons/arrow-right.svg) no-repeat center;
width: 14px;
height: 22px;
......@@ -749,6 +749,7 @@ span.form-error,
.form-container select {
padding: 12px 5px;
background-color: transparent;
font-family: sans-serif !important;
}
.form-container textarea {
......@@ -872,7 +873,7 @@ span.form-error,
user-select: none;
}
.check-container input:checked~.checkmark:after {
.check-container input:checked ~ .checkmark:after {
display: block;
}
......@@ -900,7 +901,7 @@ span.form-error,
width: 0;
}
.check-container input:checked~.checkmark {
.check-container input:checked ~ .checkmark {
background-color: #fff;
}
......@@ -1036,7 +1037,7 @@ span.form-error,
justify-content: center;
}
.btn-edit>span:first-child {
.btn-edit > span:first-child {
margin-top: 0.2rem;
}
......@@ -1114,7 +1115,7 @@ span.form-error,
color: #808080;
}
.card-booking-content>p:last-child {
.card-booking-content > p:last-child {
margin-bottom: 0;
}
......@@ -1157,7 +1158,7 @@ span.form-error,
color: #808080;
}
.card-booking-content .description>span {
.card-booking-content .description > span {
color: #646464;
text-decoration: underline;
}
......@@ -1167,7 +1168,7 @@ span.form-error,
font-weight: 600;
}
.card-booking-content .price>span {
.card-booking-content .price > span {
font-size: 0.8rem;
color: #808080;
}
......@@ -1203,7 +1204,7 @@ span.form-error,
margin-bottom: 1rem;
}
.card-booking-content .details-div>p:first-child {
.card-booking-content .details-div > p:first-child {
font-family: "Sofia Pro Light";
font-size: calc(14px + (14 - 14) * (100vw - 320px) / (1920 - 320));
line-height: calc(20px + (20 - 20) * (100vw - 320px) / (1920 - 320));
......@@ -1213,7 +1214,7 @@ span.form-error,
margin-bottom: 0;
}
.card-booking-content .details-div>p:last-child {
.card-booking-content .details-div > p:last-child {
font-family: "Sofia Pro Light";
font-size: 16px;
font-size: calc(16px + (16 - 16) * (100vw - 320px) / (1920 - 320));
......@@ -1291,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;
......@@ -1394,7 +1398,7 @@ span.form-error,
align-items: center;
}
.primary-sidebar ul li a>span {
.primary-sidebar ul li a > span {
flex: 0 0 auto;
}
......@@ -1447,7 +1451,7 @@ span.form-error,
align-items: center;
}
.sidebar ul li a>span {
.sidebar ul li a > span {
flex: 0 0 auto;
}
......@@ -1601,12 +1605,12 @@ span.form-error,
}
/* On mouse-over, add a grey background color */
.radioContainer:hover input~.checkmark {
.radioContainer:hover input ~ .checkmark {
background-color: #fff;
}
/* When the radio button is checked, add a blue background */
.radioContainer input:checked~.checkmark {
.radioContainer input:checked ~ .checkmark {
color: #0070bd;
}
......@@ -1618,7 +1622,7 @@ span.form-error,
}
/* Show the indicator (dot/circle) when checked */
.radioContainer input:checked~.checkmark:after {
.radioContainer input:checked ~ .checkmark:after {
display: block;
}
......@@ -2032,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;
......@@ -2045,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;
......@@ -2102,7 +2125,7 @@ span.form-error,
margin-left: 4px;
}
.product-info .wishlist-share>div {
.product-info .wishlist-share > div {
margin-bottom: 1rem;
}
......@@ -2149,7 +2172,7 @@ span.form-error,
margin-bottom: 10px;
}
.browse-experiences-item .info .detail>div {
.browse-experiences-item .info .detail > div {
margin-bottom: 0.4rem;
}
......@@ -2462,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 {
......@@ -2700,7 +2724,7 @@ footer hr {
line-height: 2.083vw;
}
.product-info .price>span {
.product-info .price > span {
color: #808080;
font-size: 14px;
}
......@@ -2711,7 +2735,7 @@ footer hr {
margin-bottom: 0.5rem;
}
.product-info .location>span {
.product-info .location > span {
color: #808080;
font-size: 16px;
}
......@@ -2769,7 +2793,7 @@ footer hr {
padding: 1rem 0;
}
.image-gallery-thumbnail+.image-gallery-thumbnail {
.image-gallery-thumbnail + .image-gallery-thumbnail {
margin-left: 1rem;
border-radius: 12px;
}
......@@ -2778,7 +2802,7 @@ footer hr {
width: 100px;
}
.breadcrumb-item+.breadcrumb-item::before {
.breadcrumb-item + .breadcrumb-item::before {
content: "";
background: url(/images/icons/arrow-right-grey.svg) no-repeat;
width: 24px;
......@@ -2794,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;
......@@ -2820,7 +2849,7 @@ button:focus:not(:focus-visible) {
color: #000;
}
.availability-wrappper li>span {
.availability-wrappper li > span {
width: 30px;
display: block;
margin-right: 10px;
......@@ -2913,7 +2942,7 @@ button:focus:not(:focus-visible) {
margin-bottom: 2rem;
}
.guest-reviews-session>.container {
.guest-reviews-session > .container {
border-top: 1px solid #c9c9c9;
padding-top: 3rem;
}
......@@ -3141,7 +3170,7 @@ header .top-btn .user-icon .image-container.arrow-d {
scrollbar-width: none;
}
.active>.page-link,
.active > .page-link,
.page-link.active {
background-color: #0070bd;
border-color: #0070bd;
......@@ -3277,7 +3306,7 @@ input[type="number"]::-webkit-outer-spin-button {
background: transparent;
}
.swiper-nav button .image-container>span {
.swiper-nav button .image-container > span {
width: 14px !important;
}
......@@ -3313,7 +3342,7 @@ input[type="number"]::-webkit-outer-spin-button {
display: block;
}
.page-title-area .banner-bg .image-container>span {
.page-title-area .banner-bg .image-container > span {
height: 100% !important;
}
......@@ -3477,7 +3506,7 @@ input[type="number"]::-webkit-outer-spin-button {
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-horizontal>.swiper-pagination-bullets,
.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal {
bottom: -5px !important;
}
......@@ -3593,11 +3622,11 @@ input[type="number"]::-webkit-outer-spin-button {
display: block;
}
.blog-item .img-wrapper .image-container>span {
.blog-item .img-wrapper .image-container > span {
height: 100% !important;
}
.blog-item .img-wrapper .image-container>span>.image {
.blog-item .img-wrapper .image-container > span > .image {
object-fit: cover;
border-radius: 25px 25px 0 0;
}
......@@ -3611,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 {
......@@ -3821,18 +3851,18 @@ input[type="number"]::-webkit-outer-spin-button {
justify-content: center;
}
.gift-card-amt>ul {
.gift-card-amt > ul {
display: grid;
grid-gap: 20px;
grid-template-columns: repeat(auto-fill, minmax(calc(33.33% - 15px), 1fr));
}
.gift-card-amt ul li a,
.gift-card-amt ul li label>span {
.gift-card-amt ul li label > span {
font-size: 14px;
}
.gift-card-amt ul li input[type="radio"]:checked+label {
.gift-card-amt ul li input[type="radio"]:checked + label {
background: #0070bd;
color: #fff;
}
......@@ -3869,7 +3899,7 @@ input[type="number"]::-webkit-outer-spin-button {
display: inline-block;
}
.tooltip-btn:hover+.tooltips {
.tooltip-btn:hover + .tooltips {
display: block;
}
......@@ -3904,7 +3934,8 @@ input[type="number"]::-webkit-outer-spin-button {
border-radius: 9px;
}
.gift-card-rt .form-01 .link-a {}
.gift-card-rt .form-01 .link-a {
}
.gift-card-session .result-box {
text-align: center;
......@@ -4065,7 +4096,8 @@ img:hover {
margin-top: 1.5rem;
}
.load-more .pagination .page-item {}
.load-more .pagination .page-item {
}
.page-item:not(:first-child) .page-link {
margin-left: 10px;
......@@ -4179,7 +4211,9 @@ footer .footer-link ul {
.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;
......@@ -4410,7 +4444,7 @@ footer .footer-link ul {
font-size: 4.667vw;
}
.gift-card-amt>ul {
.gift-card-amt > ul {
grid-gap: 10px;
}
......@@ -4486,7 +4520,7 @@ footer .footer-link ul {
}
.gift-card-amt ul li a,
.gift-card-amt ul li label>span {
.gift-card-amt ul li label > span {
font-size: 12px;
}
......@@ -4632,7 +4666,7 @@ footer .footer-link ul {
width: 3.585vw;
}
.header-search>.form-control {
.header-search > .form-control {
font-size: 3vw;
margin-bottom: 1rem;
}
......@@ -4654,7 +4688,7 @@ footer .footer-link ul {
line-height: 4vw;
}
.home-banner-bg>span>span .image {
.home-banner-bg > span > span .image {
border-radius: 0 0 20px 20px;
}
......@@ -4772,7 +4806,7 @@ footer .footer-link ul {
top: 40%;
}
.swiper-nav button .image-container>span {
.swiper-nav button .image-container > span {
width: 10px !important;
}
......@@ -4910,7 +4944,7 @@ footer .footer-link ul {
top: 0.8rem !important;
}
.rbt-menu>.dropdown-item {
.rbt-menu > .dropdown-item {
font-size: 13px;
}
......@@ -4945,4 +4979,4 @@ footer .footer-link ul {
/* min height */
.min-height-40 {
min-height: 40vh;
}
\ No newline at end of file
}
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!