Skip to content

Jay Mehta / zango-frontend

Go to a project
Toggle navigation
Toggle navigation pinning
Commit b0e551bd by jaymehta
Options

Merge branch 'master' of https://git.logicloop.io/jaymehta/zango-frontend

2 parents e483780f 564e5ed2
Inline Side-by-side
Showing 5 changed files with 429 additions and 370 deletions
components/detail/DetailInfo.js
...@@ -47,6 +47,7 @@ const DetailInfo = ({ activityById }) => { ...@@ -47,6 +47,7 @@ const DetailInfo = ({ activityById }) => {
const [showshareWidget, setshowshareWidget] = useState(false); const [showshareWidget, setshowshareWidget] = useState(false);
const { loadedUser } = useSelector(state => state.loadedUser); const { loadedUser } = useSelector(state => state.loadedUser);
const { endUser } = useSelector(state => state.endUser); const { endUser } = useSelector(state => state.endUser);
console.log("endUser", endUser)
useEffect(() => { useEffect(() => {
const fetchSession = async () => { const fetchSession = async () => {
setSession(await getSession()); setSession(await getSession());
...@@ -190,21 +191,29 @@ const DetailInfo = ({ activityById }) => { ...@@ -190,21 +191,29 @@ const DetailInfo = ({ activityById }) => {
<h2>Send Enquiry</h2> <h2>Send Enquiry</h2>
</Modal.Header> </Modal.Header>
<Modal.Body> <Modal.Body>
<div>Experience Name:</div>
<div className="text01">
{activityById.data.attributes.name}
</div>
<div className="mt-3">Full Name:</div> <div className="mt-3">Full Name:</div>
<div className="text01"> <div className="text01">
{endUser?.attributes.name} {endUser?.attributes.name}
</div> </div>
<div className="mt-3">Mobile:</div>
<div className="text01">
{endUser?.attributes.phone}
</div>
<div className="mt-3">Email ID:</div> <div className="mt-3">Email ID:</div>
<div className="text01"> <div className="text01">
{endUser?.attributes.email} {endUser?.attributes.email}
</div> </div>
<div className="row d-flex justify-content-center">
<div className="mt-3">Experience Name:</div>
<div className="text01">
{activityById.data.attributes.name}
</div>
<div className="row d-flex justify-content-center mt-2">
<div className="col-6"> <div className="col-6">
<div className="mt-2">Quantity:</div> <div className="my-2">Quantity:</div>
<Input <Input
type="number" type="number"
onChange={e => { onChange={e => {
...@@ -214,7 +223,7 @@ const DetailInfo = ({ activityById }) => { ...@@ -214,7 +223,7 @@ const DetailInfo = ({ activityById }) => {
></Input> ></Input>
</div> </div>
<div className="col-6"> <div className="col-6">
<div className="mt-2">Date:</div> <div className="my-2">Date:</div>
<div className=""> <div className="">
<DatePicker <DatePicker
...@@ -234,7 +243,7 @@ const DetailInfo = ({ activityById }) => { ...@@ -234,7 +243,7 @@ const DetailInfo = ({ activityById }) => {
</div> </div>
<Button <Button
disabled={loading || !quantity} disabled={loading || !quantity}
className="mt-2 col-12" className="mt-4 col-12"
onClick={async () => { onClick={async () => {
setloading(true); setloading(true);
console.log("hello"); console.log("hello");
......
components/gift-card/GiftCard.js
...@@ -11,14 +11,17 @@ import { finishVendorOtpVerification } from "../../redux/actions/vendorActions"; ...@@ -11,14 +11,17 @@ import { finishVendorOtpVerification } from "../../redux/actions/vendorActions";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import { Button } from "react-bootstrap"; import { Button } from "react-bootstrap";
import { postGiftCard } from "../../redux/actions/giftCardAction"; import { postGiftCard } from "../../redux/actions/giftCardAction";
import TermsAndConditionModel from "../signup/TermsAndConditionModel";
// import { getCurrentEndUser } from "../../redux/actions/userActions"; // import { getCurrentEndUser } from "../../redux/actions/userActions";
const validationSchema = Yup.object().shape({ const validationSchema = Yup.object().shape({
customAmt: Yup.string().required("Full name is required"), customAmt: Yup.string().required("Full name is required"),
code: Yup.string().required("Please Enter 4-Digit Code"), code: Yup.string().required("Please Enter 4-Digit Code"),
email: Yup.string().email("Invalid email").required("Email is required"), email: Yup.string().email("Invalid email").required("Email is required"),
receiverEmail: Yup.string().email("Invalid email").required("Email is required"), receiverEmail: Yup.string().email("Invalid email").required("Reciver's Email is required"),
message: Yup.string().required("Message is required") message: Yup.string().required("Message is required"),
amt: Yup.string().required("Please select an amount"),
termsConditions: Yup.bool().oneOf([true], "Please Accept Terms & Conditions"),
}); });
let formik1; let formik1;
...@@ -42,6 +45,7 @@ const GiftCard = () => { ...@@ -42,6 +45,7 @@ const GiftCard = () => {
// const {loadedUser} = useSelector(state => state.loadedUser) // const {loadedUser} = useSelector(state => state.loadedUser)
const { endUser } = useSelector(state => state.endUser); const { endUser } = useSelector(state => state.endUser);
console.log("endUser", endUser); console.log("endUser", endUser);
const [isOpenEis, setIsOpenEis] = useState(false);
const [isStep1, setIsStep1] = useState(true); const [isStep1, setIsStep1] = useState(true);
const [amount, setAmount] = useState(0); const [amount, setAmount] = useState(0);
const [custom, setcustom] = useState(); const [custom, setcustom] = useState();
...@@ -59,389 +63,418 @@ const GiftCard = () => { ...@@ -59,389 +63,418 @@ const GiftCard = () => {
}; };
return ( return (
<section className="gift-card-session"> <>
<div className="container"> <section className="gift-card-session">
<div className="row justify-content-center"> <div className="container">
<div className="col-md-10"> <div className="row justify-content-center">
<div className="see-my-gift-cards-row"> <div className="col-md-10">
<Button <div className="see-my-gift-cards-row">
onClick={() => { <Button
if (!session) { onClick={() => {
toast.warning("Please log in to see your gift cards."); if (!session) {
return; toast.warning("Please log in to see your gift cards.");
} return;
router.push("/user/giftcard"); }
}} router.push("/user/giftcard");
> }}
See my gift cards >
</Button> See my gift cards
</div> </Button>
{!isResult && ( </div>
<div className="row"> {!isResult && (
<div className="col-md-5"> <div className="row">
<div className="gift-card-lt"> <div className="col-md-5">
<div className="gift-box"> <div className="gift-card-lt">
<img src="/images/gift-card.svg" alt="Gift Card" /> <div className="gift-box">
<img src="/images/gift-card.svg" alt="Gift Card" />
</div>
<h3>Amount: ${amount}</h3>
</div> </div>
<h3>Amount: ${amount}</h3>
</div> </div>
</div> <div className="col-md-7">
<div className="col-md-7"> {isStep1 && (
{isStep1 && ( <div className="gift-card-rt">
<div className="gift-card-rt"> {/* <div className="back-btn">
{/* <div className="back-btn">
<a href=""> <a href="">
<span className="image-container"> <span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/arrow-left-02.svg" /> <Image layout="fill" alt="" className="image img-fluid" src="/images/icons/arrow-left-02.svg" />
</span> </span>
</a> </a>
</div> */} </div> */}
<Formik <Formik
initialValues={{ initialValues={{
customAmt: "", customAmt: "",
email: "", email: "",
receiverEmail: "", receiverEmail: "",
message: "" message: "",
}} amt: "",
enableReinitialize={true} termsConditions: false
// validationSchema={validationSchema} }}
onSubmit={(values, { setSubmitting }) => { enableReinitialize={true}
// Handle form submission here 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> {({ isSubmitting, values, handleChange, handleBlur, touched, errors }) => (
<div className="cl-gry">Please select an amount</div> <Form action="" className="form-01">
<div className="gift-card-amt"> <div className="title">Buy a gift card</div>
<ul> <div className="cl-gry">Please select an amount</div>
<li> <div className="gift-card-amt">
<input <ul>
name="amt" <li>
id="amt-20" <input
type="radio" name="amt"
value="" id="amt-20"
data-gtm-Form-interact-field-id="1" type="radio"
onChange={e => { value=""
setAmount(20); data-gtm-Form-interact-field-id="1"
setcustom(false); onChange={e => {
}} setAmount(20);
/> setcustom(false);
<label for="amt-20">$20</label> }}
</li> />
<li> <label for="amt-20">$20</label>
<input </li>
name="amt" <li>
id="amt-50" <input
type="radio" name="amt"
value="" id="amt-50"
data-gtm-form-interact-field-id="1" type="radio"
onChange={e => { value=""
setAmount(50); data-gtm-form-interact-field-id="1"
setcustom(false); onChange={e => {
}} setAmount(50);
/> setcustom(false);
<label for="amt-50">$50</label> }}
</li> />
<li> <label for="amt-50">$50</label>
<input </li>
name="amt" <li>
id="amt-100" <input
type="radio" name="amt"
value="" id="amt-100"
data-gtm-form-interact-field-id="1" type="radio"
onChange={e => { value=""
setAmount(100); data-gtm-form-interact-field-id="1"
setcustom(false); onChange={e => {
}} setAmount(100);
/> setcustom(false);
<label for="amt-100"> }}
<span>Most Popular</span> />
<br /> $100 <label for="amt-100">
</label> <span>Most Popular</span>
</li> <br /> $100
<li> </label>
<input </li>
name="amt" <li>
id="amt-250" <input
type="radio" name="amt"
value="" id="amt-250"
data-gtm-form-interact-field-id="1" type="radio"
onChange={e => { value=""
setAmount(250); data-gtm-form-interact-field-id="1"
setcustom(false); onChange={e => {
}} setAmount(250);
/> setcustom(false);
<label for="amt-250"> $250</label> }}
</li> />
<li> <label for="amt-250"> $250</label>
<input </li>
name="amt" <li>
id="amt-500" <input
type="radio" name="amt"
value="" id="amt-500"
data-gtm-form-interact-field-id="1" type="radio"
onChange={e => { value=""
setAmount(500); data-gtm-form-interact-field-id="1"
setcustom(false); onChange={e => {
}} setAmount(500);
/> setcustom(false);
<label for="amt-500"> $500</label> }}
</li> />
<li> <label for="amt-500"> $500</label>
<input </li>
name="amt" <li>
id="amt-custom" <input
type="radio" name="amt"
value="" id="amt-custom"
data-gtm-form-interact-field-id="1" type="radio"
onChange={e => { value=""
setcustom(true); data-gtm-form-interact-field-id="1"
setAmount(null); onChange={e => {
}} setcustom(true);
/> setAmount(null);
<label for="amt-custom"> $ Custom</label> }}
</li> />
</ul> <label for="amt-custom"> $ Custom</label>
</div> </li>
<div className="row"> </ul>
{custom && ( </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"> <div className="col-md-12 mb-4">
<label htmlFor="">Custom Amount</label> <label htmlFor="">Email Id</label>
<Field <Field
className="form-control" className="form-control"
type="number" type="email"
name="customAmt" name="email"
placeholder="Enter your amount" placeholder="yourname@example.com"
onChange={e => { onChange={handleChange}
setAmount(e.target.value);
}}
onBlur={handleBlur} onBlur={handleBlur}
value={amount} value={values.email}
/> />
{touched.customAmt && errors.customAmt && <div className="text-danger">{errors.customAmt}</div>} {touched.email && errors.email && <div className="text-danger">{errors.email}</div>}
</div> <div className="tooltip-wrapper">
)} <a className="tooltip-btn" onMouseEnter={() => setShowTooltip1(true)} onMouseLeave={() => setShowTooltip1(false)}>
<div className="col-md-12 mb-4"> <span className="image-container">
<label htmlFor="">Email Id</label> <Image layout="fill" alt="" className="image img-fluid" src="/images/icons/info.svg" />
<Field </span>
className="form-control" </a>
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>
{/* Tooltip */} {/* Tooltip */}
{showTooltip1 && <div className="tooltips">{tooltipText1}</div>} {showTooltip1 && <div className="tooltips">{tooltipText1}</div>}
</div>
</div> </div>
</div>
<div className="col-md-12 mb-4"> <div className="col-md-12 mb-4">
<label htmlFor="">Receiver’s Email Id</label> <label htmlFor="">Receiver’s Email Id</label>
<Field <Field
className="form-control" className="form-control"
type="receiverEmail" type="receiverEmail"
name="receiverEmail" name="receiverEmail"
placeholder="yourname@example.com" placeholder="yourname@example.com"
onChange={handleChange} onChange={handleChange}
onBlur={handleBlur} onBlur={handleBlur}
value={values.receiverEmail} value={values.receiverEmail}
/> />
{touched.receiverEmail && errors.receiverEmail && <div className="text-danger">{errors.receiverEmail}</div>} {touched.receiverEmail && errors.receiverEmail && <div className="text-danger">{errors.receiverEmail}</div>}
<div className="tooltip-wrapper"> <div className="tooltip-wrapper">
<a className="tooltip-btn" onMouseEnter={() => setShowTooltip2(true)} onMouseLeave={() => setShowTooltip2(false)}> <a className="tooltip-btn" onMouseEnter={() => setShowTooltip2(true)} onMouseLeave={() => setShowTooltip2(false)}>
<span className="image-container"> <span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/info.svg" /> <Image layout="fill" alt="" className="image img-fluid" src="/images/icons/info.svg" />
</span> </span>
</a> </a>
{showTooltip2 && <div className="tooltips">{tooltipText2}</div>} {showTooltip2 && <div className="tooltips">{tooltipText2}</div>}
</div>
</div> </div>
</div>
<div className="col-md-12 mb-4"> <div className="col-md-12 mb-4">
<Field <Field
className="form-control" className="form-control"
as="textarea" as="textarea"
rows={7} rows={7}
name="message" name="message"
placeholder="Type your message..." placeholder="Type your message..."
onChange={handleChange} onChange={handleChange}
onBlur={handleBlur} onBlur={handleBlur}
value={values.message} value={values.message}
/> />
{touched.message && errors.message && <div className="text-danger">{errors.message}</div>} {touched.message && errors.message && <div className="text-danger">{errors.message}</div>}
</div> </div>
<div className="col-md-12 mb-3"> <div>
<button {/* {touched.amt && errors.amt && <div className="text-danger">{errors.amt}</div>} */}
className="btn btn-primary w-100" <div className="cl-gry">Please select an amount before continuing.</div>
onClick={async () => { </div>
setloading(true); <div className="col-md-12 mb-3">
if (!session) { <button
toast.warning("Please log in to buy a gift card."); className="btn btn-primary w-100"
return; onClick={async () => {
} setloading(true);
const config = { if (!session) {
headers: { toast.warning("Please log in to buy a gift card.");
"Content-Type": "application/json", return;
Authorization: `Bearer ${session.jwt}`
}
};
const data = {
data: {
userId: session.id
} }
}; const config = {
const response = await axios.post(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/end-user/verify-gift-card-otp`, data, config); headers: {
setvalues({ ...values, amount }); "Content-Type": "application/json",
console.log("response", response.data); Authorization: `Bearer ${session.jwt}`
setloading(false); }
console.log(values); };
setIsStep2(true); const data = {
setIsStep1(false); data: {
}} userId: session.id
disabled={!amount > 0 || !values.receiverEmail || !values.email} }
> };
{loading ? <Loader /> : "Continue"} const response = await axios.post(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/end-user/verify-gift-card-otp`, data, config);
</button> setvalues({ ...values, amount });
</div> console.log("response", response.data);
<div className="col-12"> setloading(false);
<p> console.log(values);
setIsStep2(true);
setIsStep1(false);
}}
disabled={!amount > 0 || !values.receiverEmail || !values.email || !values.termsConditions}
>
{loading ? <Loader /> : "Continue"}
</button>
</div>
<div className="col-12">
<label className="check-container mb-0 pt-0" 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</a> and <a href="/privacy-policy">Privacy Policy</a>
</label>
<div className="mt-3">
{touched.termsConditions && errors.termsConditions && <div className="text-danger">{errors.termsConditions}</div>}
</div>
{/* <p>
By continuing you agree to our <a href="/terms-and-conditions">Terms</a> and <a href="/privacy-policy">Privacy Policy</a> By continuing you agree to our <a href="/terms-and-conditions">Terms</a> and <a href="/privacy-policy">Privacy Policy</a>
</p> </p> */}
</div>
</div> </div>
</div> </Form>
</Form> )}
)} </Formik>
</Formik>
</div>
)}
{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> </div>
<Formik )}
initialValues={{
code: "" {isStep2 && (
}} <div className="gift-card-rt">
// validationSchema={validationSchema} <div className="back-btn">
onSubmit={(values, { setSubmitting }) => { <a href="">
// Handle form submission here <span className="image-container">
console.log(values); <Image layout="fill" alt="" className="image img-fluid" src="/images/icons/arrow-left-02.svg" />
setSubmitting(false); </span>
setIsStep2(false); </a>
setIsStep1(false); </div>
setIsResult(true); <Formik
}} initialValues={{
> code: ""
{({ isSubmitting, values, handleChange, handleBlur, touched, errors }) => ( }}
<Form action="" className="form-01"> // validationSchema={validationSchema}
<div className="title">We emailed you a 4-digit code</div> onSubmit={(values, { setSubmitting }) => {
{/* <div className="cl-gry">Please enter it below to create or login into your account:</div> */} // Handle form submission here
{console.log("values", form1Values)} console.log(values);
<div className="row mt-4"> setSubmitting(false);
<div className="col-md-12 mb-4"> setIsStep2(false);
<label htmlFor="">Enter 4-Digit Code</label> setIsStep1(false);
<Field setIsResult(true);
className="form-control" }}
type="text" >
name="code" {({ isSubmitting, values, handleChange, handleBlur, touched, errors }) => (
placeholder="Enter the code we emailed you" <Form action="" className="form-01">
onChange={handleChange} <div className="title">We emailed you a 4-digit code</div>
onBlur={handleBlur} {/* <div className="cl-gry">Please enter it below to create or login into your account:</div> */}
value={values.code} {console.log("values", form1Values)}
/> <div className="row mt-4">
{touched.code && errors.code && <div className="text-danger">{errors.code}</div>} <div className="col-md-12 mb-4">
{/* <div className="link-a"> <label htmlFor="">Enter 4-Digit Code</label>
<Field
className="form-control"
type="text"
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> <a href="">Resend Code</a>
</div> */} </div> */}
</div>
</div> </div>
</div> <div className="row">
<div className="row"> <div className="col-md-12 mb-3">
<div className="col-md-12 mb-3"> <button
<button className="btn btn-primary w-100"
className="btn btn-primary w-100" onClick={async () => {
onClick={async () => { const res = await await finishVendorOtpVerification({ email: session.user.email, oneTimePassword: values.code });
const res = await await finishVendorOtpVerification({ email: session.user.email, oneTimePassword: values.code }); console.log("res", res.data);
console.log("res", res.data); if (!res.data.ok) {
if (!res.data.ok) { toast.error(res.data.message);
toast.error(res.data.message); }
} if (res.data.ok) {
if (res.data.ok) { const response = await postGiftCard({
const response = await postGiftCard({ data: {
data: { senderEmail: form1Values.email,
senderEmail: form1Values.email, senderName: form1Values.email,
senderName: form1Values.email, receiverEmail: form1Values.receiverEmail,
receiverEmail: form1Values.receiverEmail, receiverName: form1Values.receiverEmail,
receiverName: form1Values.receiverEmail, amount: form1Values.amount,
amount: form1Values.amount, note: form1Values.message,
note: form1Values.message, endUser: endUser.id,
endUser: endUser.id, status: "new"
status: "new" }
} });
}); console.log("response", response);
console.log("response", response); toast.success("OTP verified!");
toast.success("OTP verified!"); }
} }}
}} disabled={isSubmitting}
disabled={isSubmitting} >
> Confirm
Confirm </button>
</button> </div>
</div> </div>
</div> </Form>
</Form> )}
)} </Formik>
</Formik> </div>
</div> )}
)} </div>
</div> </div>
</div> )}
)}
{isResult && ( {isResult && (
<div className="row"> <div className="row">
<div className="col-12"> <div className="col-12">
<div className="result-box"> <div className="result-box">
<p> <p>
Gift card sent for approval, please wait till the vendor contacts you “Sorry, unable to process the Gift Card now.
<br /> Thank you. This feature will be available shortly.”
</p> {/* Gift card sent for approval, please wait till the vendor contacts you
<div> <br /> Thank you. */}
<button </p>
className="btn btn-primary" <div>
type="button" <button
onClick={() => { className="btn btn-primary"
router.push("/listing"); type="button"
}} onClick={() => {
> router.push("/listing");
Browse Experiences }}
</button> >
Browse Experiences
</button>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> )}
)} </div>
</div> </div>
</div> </div>
</div> </section>
</section> <TermsAndConditionModel isOpenEis={isOpenEis} setIsOpenEis={setIsOpenEis} />
</>
); );
}; };
......
components/layout/Header.js
...@@ -90,7 +90,7 @@ const Header = () => { ...@@ -90,7 +90,7 @@ const Header = () => {
</Navbar.Brand> </Navbar.Brand>
{loadedUser && loadedUser.id ? ( {loadedUser && loadedUser.id ? (
<div className="top-btn hide-on-desktop"> <div className="top-btn hide-on-desktop">
<div className="logout-bk"> <div className="logout-bk" ref={logoutBkRef}>
<a onClick={toggleGridViewDropdown} className="user-icon"> <a onClick={toggleGridViewDropdown} className="user-icon">
<span className="image-container user-pic"> <span className="image-container user-pic">
<Image layout="fill" priority alt="" className="image img-fluid" src="/images/icons/user.svg" /> <Image layout="fill" priority alt="" className="image img-fluid" src="/images/icons/user.svg" />
...@@ -100,7 +100,7 @@ const Header = () => { ...@@ -100,7 +100,7 @@ const Header = () => {
</span> </span>
</a> </a>
{/* <p>{loadedUser.phone}</p> */} {/* <p>{loadedUser.phone}</p> */}
<div ref={logoutBkRef} className={`inner-box ${isGridViewOpen ? "open" : ""}`}> <div ref={innerBoxRef} className={`inner-box ${isGridViewOpen ? "open" : ""}`}>
{endUser && ( {endUser && (
<div className="user-info"> <div className="user-info">
<div className="pic"> <div className="pic">
...@@ -288,7 +288,7 @@ const Header = () => { ...@@ -288,7 +288,7 @@ const Header = () => {
<> <>
{endUser && endUser.id ? ( {endUser && endUser.id ? (
<div className="top-btn hide-on-mobile"> <div className="top-btn hide-on-mobile">
<div className="logout-bk"> <div className="logout-bk" ref={logoutBkRef}>
<a onClick={toggleGridViewDropdown} className="user-icon"> <a onClick={toggleGridViewDropdown} className="user-icon">
<span className="image-container user-pic"> <span className="image-container user-pic">
<Image layout="fill" priority alt="" className="image img-fluid" src="/images/icons/user.svg" /> <Image layout="fill" priority alt="" className="image img-fluid" src="/images/icons/user.svg" />
......
components/vendor/UpdateActivity.js
...@@ -1053,7 +1053,7 @@ const UpdateActivity = () => { ...@@ -1053,7 +1053,7 @@ const UpdateActivity = () => {
</li> </li>
<li> <li>
<img src="/images/vendor/call.svg" className="img-fluid" /> <img src="/images/vendor/call.svg" className="img-fluid" />
<p className="number">+1 (407) 8798 789 asdasd</p> <p className="number">+1 (407) 8798 789</p>
</li> </li>
</ul> </ul>
</div> </div>
......
styles/globals.css
...@@ -374,6 +374,7 @@ header { ...@@ -374,6 +374,7 @@ header {
.header-search .rbt .rbt-input-main { .header-search .rbt .rbt-input-main {
padding-right: 2.5rem; padding-right: 2.5rem;
font-size: 0.833vw; font-size: 0.833vw;
width: 18vw;
} }
.header-search > .form-control { .header-search > .form-control {
...@@ -2051,14 +2052,18 @@ span.form-error, ...@@ -2051,14 +2052,18 @@ span.form-error,
height: calc(25px + (25 - 25) * (100vw - 320px) / (1920 - 320)) !important; height: calc(25px + (25 - 25) * (100vw - 320px) / (1920 - 320)) !important;
padding-top: 7px; padding-top: 7px;
} }
.modal-01-session h2 { .modal-01-session h2 {
font-size: calc(32px + (32 - 32) * (100vw - 320px) / (1920 - 320)); font-size: calc(28px + (28 - 28) * (100vw - 320px) / (1920 - 320));
line-height: calc(44px + (44 - 44) * (100vw - 320px) / (1920 - 320)); line-height: calc(40px + (40 - 40) * (100vw - 320px) / (1920 - 320));
} }
.modal-01-session .text01 { .modal-01-session .text01 {
font-size: calc(20px + (20 - 20) * (100vw - 320px) / (1920 - 320)); font-size: calc(20px + (20 - 20) * (100vw - 320px) / (1920 - 320));
padding-top: 0.2rem; padding-top: 0.2rem;
padding-bottom: 1rem; padding-bottom: 0.5rem;
}
.modal-header {
padding-bottom: 0;
} }
.info .top-name .title { .info .top-name .title {
font-size: 0.885vw; font-size: 0.885vw;
...@@ -2074,6 +2079,9 @@ span.form-error, ...@@ -2074,6 +2079,9 @@ span.form-error,
.cl-blue { .cl-blue {
color: #0a58ca !important; color: #0a58ca !important;
} }
.text-danger {
font-size: 0.8rem;
}
.info .rating-wishlist .rating { .info .rating-wishlist .rating {
background: #002c5f; background: #002c5f;
border-radius: 4px; border-radius: 4px;
...@@ -4214,6 +4222,12 @@ footer .footer-link ul { ...@@ -4214,6 +4222,12 @@ footer .footer-link ul {
.vendor-signup .btn-light { .vendor-signup .btn-light {
background: #fff; background: #fff;
} }
.modal-01-session .modal-header {
border: 0 !important;
}
.modal-01-session .modal-content {
padding: 1rem;
}
@media (min-width: 992px) { @media (min-width: 992px) {
.navbar-expand-lg .navbar-nav .nav-link { .navbar-expand-lg .navbar-nav .nav-link {
margin: 0 2rem; margin: 0 2rem;
...@@ -4232,7 +4246,7 @@ footer .footer-link ul { ...@@ -4232,7 +4246,7 @@ footer .footer-link ul {
position: relative; position: relative;
} }
.navbar-expand-lg .navbar-nav .nav-link.gift-card::after { /* .navbar-expand-lg .navbar-nav .nav-link.gift-card::after {
content: ""; content: "";
background: #000; background: #000;
height: 2px; height: 2px;
...@@ -4240,7 +4254,7 @@ footer .footer-link ul { ...@@ -4240,7 +4254,7 @@ footer .footer-link ul {
bottom: 0; bottom: 0;
left: 0; left: 0;
position: absolute; position: absolute;
} } */
.navbar-expand-lg .navbar-nav .nav-link.gift-card .image-container { .navbar-expand-lg .navbar-nav .nav-link.gift-card .image-container {
width: 21px; width: 21px;
...@@ -4272,7 +4286,7 @@ footer .footer-link ul { ...@@ -4272,7 +4286,7 @@ footer .footer-link ul {
position: relative; position: relative;
} }
.navbar-expand-lg .navbar-nav .nav-link.gift-card::after { /* .navbar-expand-lg .navbar-nav .nav-link.gift-card::after {
content: ""; content: "";
background: #000; background: #000;
height: 2px; height: 2px;
...@@ -4280,7 +4294,7 @@ footer .footer-link ul { ...@@ -4280,7 +4294,7 @@ footer .footer-link ul {
bottom: 0; bottom: 0;
left: 0; left: 0;
position: absolute; position: absolute;
} } */
.navbar-expand-lg .navbar-nav .nav-link.gift-card .image-container { .navbar-expand-lg .navbar-nav .nav-link.gift-card .image-container {
width: 1.094vw; width: 1.094vw;
...@@ -4394,6 +4408,9 @@ footer .footer-link ul { ...@@ -4394,6 +4408,9 @@ footer .footer-link ul {
.vendor-signup a { .vendor-signup a {
min-width: 140px; min-width: 140px;
} }
.top-btn .inner-box {
right: -15vw;
}
} }
@media (max-width: 767px) { @media (max-width: 767px) {
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!