Skip to content

Jay Mehta / zango-frontend

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

.

2 parents 097e7323 76a837b1
Inline Side-by-side
Showing 15 changed files with 275 additions and 81 deletions
components/admin/Enquiries.js
...@@ -139,8 +139,10 @@ const Enquiries = () => { ...@@ -139,8 +139,10 @@ const Enquiries = () => {
return ( return (
<div> <div>
<Table dataSource={data} columns={columns} /> <Table dataSource={data} columns={columns} />
<Modal show={detailsModal} onHide={() => setdetailsModal(false)}> <Modal show={detailsModal} onHide={() => setdetailsModal(false)} size="xl" className="vendorDetails" centered>
<Modal.Header>Enquiry details</Modal.Header> <Modal.Header style={{ border: "0" }}>
<h4>Enquiry details</h4>
</Modal.Header>
<Modal.Body> <Modal.Body>
<EnquiryDetailModal data={details} setdetailsModal={setdetailsModal} /> <EnquiryDetailModal data={details} setdetailsModal={setdetailsModal} />
</Modal.Body> </Modal.Body>
......
components/admin/EnquiryDetailModal.js
...@@ -21,10 +21,10 @@ const EnquiryDetailModal = ({ data, setdetailsModal }) => { ...@@ -21,10 +21,10 @@ const EnquiryDetailModal = ({ data, setdetailsModal }) => {
</div> </div>
</div> </div>
</div> </div>
<div className="col-8 col-lg-8 mt-4"> <div className="col-12 col-lg-12 mt-4">
{/* <h4>End user</h4> */} {/* <h4>End user</h4> */}
<div className="row"> <div className="row">
<div className="col-12 col-lg-5"> <div className="col-12 col-lg-4">
<p className="phead">User details</p> <p className="phead">User details</p>
{/* <div className="row"> {/* <div className="row">
<p className="col-12 col-lg-6">Business PAN No.</p> <p className="col-12 col-lg-6">Business PAN No.</p>
...@@ -55,7 +55,7 @@ const EnquiryDetailModal = ({ data, setdetailsModal }) => { ...@@ -55,7 +55,7 @@ const EnquiryDetailModal = ({ data, setdetailsModal }) => {
<p className="col-12 col-lg-6">{detail[0].attributes.businessName}</p> <p className="col-12 col-lg-6">{detail[0].attributes.businessName}</p>
</div> */} </div> */}
</div> </div>
<div className="col-12 col-lg-7 borderLeft"> <div className="col-12 col-lg-4 borderLeft">
<p className="phead">Activity</p> <p className="phead">Activity</p>
<div className="row"> <div className="row">
<p className="col-12 col-lg-4">Activity Name</p> <p className="col-12 col-lg-4">Activity Name</p>
...@@ -78,7 +78,7 @@ const EnquiryDetailModal = ({ data, setdetailsModal }) => { ...@@ -78,7 +78,7 @@ const EnquiryDetailModal = ({ data, setdetailsModal }) => {
<p className="col-12 col-lg-8">United States</p> <p className="col-12 col-lg-8">United States</p>
</div> </div>
</div> </div>
<div className="col-12 col-lg-7 borderLeft"> <div className="col-12 col-lg-4 borderLeft">
<p className="phead">Vendor Details</p> <p className="phead">Vendor Details</p>
<div className="row"> <div className="row">
<p className="col-12 col-lg-4">Vendor Name</p> <p className="col-12 col-lg-4">Vendor Name</p>
......
components/admin/GiftcardListing.js
...@@ -6,8 +6,8 @@ import { DownCircleOutlined, MoreOutlined } from "@ant-design/icons"; ...@@ -6,8 +6,8 @@ import { DownCircleOutlined, MoreOutlined } from "@ant-design/icons";
import { getSession } from "next-auth/react"; import { getSession } from "next-auth/react";
import { toast } from "react-toastify"; import { toast } from "react-toastify";
const GiftcardListing = () => { const GiftcardListing = () => {
const [session, setSession] = useState();
const [update, setupdate] = useState(false); const [update, setupdate] = useState(false);
const [session, setSession] = useState();
useEffect(() => { useEffect(() => {
const fetchSession = async () => { const fetchSession = async () => {
setSession(await getSession()); setSession(await getSession());
......
components/detail/DetailInfo.js
...@@ -184,17 +184,17 @@ const DetailInfo = ({ activityById }) => { ...@@ -184,17 +184,17 @@ const DetailInfo = ({ activityById }) => {
setenquiryModal; setenquiryModal;
}} }}
> >
<Modal.Header>Send Enquiry</Modal.Header> <Modal.Header><h4>Send Enquiry</h4></Modal.Header>
<Modal.Body> <Modal.Body>
<div>Experience Name:</div> <div>Experience Name:</div>
<div className="" style={{ fontSize: "22px", fontWeight: "bold" }}> <div className="" style={{ fontSize: "22px", fontWeight: "bold" }}>
{activityById.data.attributes.name} {activityById.data.attributes.name}
</div> </div>
<div className="mt-2">Full Name:</div> <div className="mt-3">Full Name:</div>
<div className="" style={{ fontWeight: "bold" }}> <div className="" style={{ fontWeight: "bold" }}>
{endUser?.attributes.name} {endUser?.attributes.name}
</div> </div>
<div className="mt-2">Email ID:</div> <div className="mt-3">Email ID:</div>
<div className="" style={{ fontSize: "22px", fontWeight: "bold" }}> <div className="" style={{ fontSize: "22px", fontWeight: "bold" }}>
{endUser?.attributes.email} {endUser?.attributes.email}
</div> </div>
...@@ -212,13 +212,18 @@ const DetailInfo = ({ activityById }) => { ...@@ -212,13 +212,18 @@ const DetailInfo = ({ activityById }) => {
<div className="col-6"> <div className="col-6">
<div className="mt-2">Date:</div> <div className="mt-2">Date:</div>
<DatePicker <div className="">
onChange={e => { <DatePicker popupStyle={{
e.preventDefault(); position: "fixed", zIndex: 9999
console.log(e);
// setenquireDate(e)
}} }}
/>
onChange={e => {
e.preventDefault();
console.log(e);
// setenquireDate(e)
}}
/>
</div>
</div> </div>
</div> </div>
<Button <Button
......
components/detail/ShareWidget.js
...@@ -52,7 +52,7 @@ const ShareWidget = () => { ...@@ -52,7 +52,7 @@ const ShareWidget = () => {
<CopyToClipboard text={shareUrl} onCopy={() => setcopy({ copied: true })}> <CopyToClipboard text={shareUrl} onCopy={() => setcopy({ copied: true })}>
<span> <span>
{!copy.copied && ( {!copy.copied && (
<div> <div style={{ cursor: "pointer" }}>
<CopyTwoTone /> Copy to clipboard <CopyTwoTone /> Copy to clipboard
</div> </div>
)} )}
......
components/gift-card/GiftCard.js
...@@ -317,7 +317,7 @@ const GiftCard = () => { ...@@ -317,7 +317,7 @@ const GiftCard = () => {
</div> </div>
<div className="col-12"> <div className="col-12">
<p> <p>
By continuing you agree to our <a href="">Terms</a> and <a href="">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>
......
components/home/BrowseExperiences.js
...@@ -116,8 +116,8 @@ const BrowseExperiences = ({ allActivitiesData }) => { ...@@ -116,8 +116,8 @@ const BrowseExperiences = ({ allActivitiesData }) => {
</div> </div>
</div> </div>
<div className="discription"> <div className="discription">
<span>{data?.attributes?.description.slice(0, 80)}...</span> <span>{data?.attributes?.description.slice(0, 52)}... <Link href={`/activities/${data.id}`} prefetch>Read More</Link></span>
{/* <a href="/detail">Read More</a> */}
</div> </div>
<div className="price"> <div className="price">
${data?.attributes?.pricePerPerson} ${data?.attributes?.pricePerPerson}
......
components/layout/Header.js
...@@ -113,7 +113,7 @@ const Header = () => { ...@@ -113,7 +113,7 @@ const Header = () => {
<div className=""> <div className="">
<div className="name">{endUser.attributes.name}</div> <div className="name">{endUser.attributes.name}</div>
<div className="view-profile"> <div className="view-profile">
<a href="">View Profile</a> <a href="/user/profile">View Profile</a>
</div> </div>
</div> </div>
</div> </div>
...@@ -309,14 +309,14 @@ const Header = () => { ...@@ -309,14 +309,14 @@ const Header = () => {
{endUser && <div className=""> {endUser && <div className="">
<div className="name">{endUser.attributes.name}</div> <div className="name">{endUser.attributes.name}</div>
<div className="view-profile"> <div className="view-profile">
<a href="">View Profile</a> <a href="/user/profile">View Profile</a>
</div> </div>
</div>} </div>}
</div> </div>
<div className="user-item"> <div className="user-item">
<ul> <ul>
<li> <li>
<a href=""> <a href="/user/my-enquires">
<span className="image-container"> <span className="image-container">
<Image layout="fill" priority alt="" className="image img-fluid" src="/images/icons/my-booking.svg" /> <Image layout="fill" priority alt="" className="image img-fluid" src="/images/icons/my-booking.svg" />
</span> </span>
......
components/listing/ListingFilter.js
...@@ -15,6 +15,7 @@ const ListingFilter = () => { ...@@ -15,6 +15,7 @@ const ListingFilter = () => {
const [showContent, setShowContent] = useState(false); const [showContent, setShowContent] = useState(false);
const [sliderLowerValue, setsliderLowerValue] = useState(0); const [sliderLowerValue, setsliderLowerValue] = useState(0);
const [sliderUpperValue, setsliderUpperValue] = useState(5000); const [sliderUpperValue, setsliderUpperValue] = useState(5000);
const [ageState, setageState] = useState("Select age, Click menu item");
const dispatch = useDispatch(); const dispatch = useDispatch();
const { activityFilters } = useSelector(sate => sate.activityFilters); const { activityFilters } = useSelector(sate => sate.activityFilters);
const { subCategories, loading } = useSelector(sate => sate.subCategories); const { subCategories, loading } = useSelector(sate => sate.subCategories);
...@@ -37,6 +38,7 @@ const ListingFilter = () => { ...@@ -37,6 +38,7 @@ const ListingFilter = () => {
// message.info(`Click on item ${key}`); // message.info(`Click on item ${key}`);
console.log("key", key, suitableAgeGroups[key - 1]); console.log("key", key, suitableAgeGroups[key - 1]);
dispatch(setActivityFilters({ filters: { ...activityFilters, minAge: suitableAgeGroups[key - 1] } })); dispatch(setActivityFilters({ filters: { ...activityFilters, minAge: suitableAgeGroups[key - 1] } }));
setageState(items[key - 1].label)
}; };
const items = [ const items = [
{ {
...@@ -399,19 +401,23 @@ const ListingFilter = () => { ...@@ -399,19 +401,23 @@ const ListingFilter = () => {
<div className="p-all"> <div className="p-all">
<div className="head">Suitable Age Group</div> <div className="head">Suitable Age Group</div>
</div> </div>
<Dropdown <div className="inner">
menu={{ <div className="suitable-age-group form-select">
items, <Dropdown
onClick menu={{
}} items,
> onClick
<a onClick={e => e.preventDefault()}> }}
<Space> >
Select age, Click menu item <a onClick={e => e.preventDefault()}>
<DownOutlined /> <Space>
</Space> {ageState}
</a> <DownOutlined />
</Dropdown> </Space>
</a>
</Dropdown>
</div>
</div>
{/* <div className="inner"> {/* <div className="inner">
<Form.Select <Form.Select
onChange={e => { onChange={e => {
......
components/listing/ListingItems.js
...@@ -169,11 +169,10 @@ const ListingItems = ({ allActivitiesData, loading, gridClass, totalCount }) => ...@@ -169,11 +169,10 @@ const ListingItems = ({ allActivitiesData, loading, gridClass, totalCount }) =>
</div> </div>
</div> </div>
<div className="discription"> <div className="discription">
{data?.attributes.description.slice(0, 70)} {data?.attributes.description.slice(0, 52)}...
<a <a className="cursor-pointer"
onClick={() => { onClick={() => {
// setreadMoreText(data); router.push(`/activities/${data.id}`);
// setshowModal(true);
}} }}
> >
Read More Read More
......
components/user/MyEnquires.js 0 → 100644
import Image from "next/image";
import React, { Fragment } from "react";
import { renderImage } from "../../services/imageHandling";
const MyEnquires = () => {
const bookingsData = [
{
id: "0",
name: "City Climb",
start_date: "Jan 8, 2021",
end_date: "Jan 9, 2021",
price: "$200",
status: "Confirmed",
image: "/images/user/image1.png"
},
{
id: "1",
name: "City Climb",
start_date: "Jan 8, 2021",
end_date: "Jan 9, 2021",
price: "$200",
status: "Confirmed",
image: "/images/user/image1.png"
},
{
id: "2",
name: "City Climb",
start_date: "Jan 8, 2021",
end_date: "Jan 9, 2021",
price: "$200",
status: "Confirmed",
image: "/images/user/image1.png"
},
{
id: "3",
name: "City Climb",
start_date: "Jan 8, 2021",
end_date: "Jan 9, 2021",
price: "$200",
status: "Confirmed",
image: "/images/user/image1.png"
}
]
return (
<Fragment>
<div className="container">
<div className="row">
<div className="col-12 col-lg-12 form-container content-wraaper">
<h2 className="px-2 px-lg-0">My Enquires</h2>
<div className="row">
{bookingsData?.length && bookingsData.map((data, index) => (
<div className="col-12 col-sm-12 col-lg-3 col-md-6 px-4 px-lg-3" key={`1${index}`}>
<div className="card-booking">
<div className="card-booking-img">
<span className="image-container">
<Image src={renderImage(data.image)} layout="fill" className="image" />
</span>
</div>
<div className="card-booking-content">
<p className="activity-name">{data.name}</p>
<p>{data.start_date} - {data.end_date}</p>
<p>{data.price}</p>
<p className="status">{data.status}</p>
</div>
<div className="hr-div" />
<div className="card-booking-footer">
<div className="d-flex align-items-center justify-content-between">
<div className="d-flex align-items-center">
<span className="image-container me-2">
<Image src={renderImage("/images/user/icon-rebook.svg")} layout="fill" className="image" />
</span>
<p className="duration mb-0">Rebook this booking</p>
</div>
<div className="image-container">
<Image src={renderImage("/images/user/arrow-right.svg")} layout="fill" className="image" />
</div>
</div>
</div>
</div>
</div>
))}
</div>
<div className="row">
{bookingsData?.length && bookingsData.map((data, index) => (
<div className="col-12 col-sm-12 col-lg-3 col-md-6 px-4 px-lg-3" key={`2${index}`}>
<div className="card-booking">
<div className="card-booking-img">
<span className="image-container">
<Image src={renderImage(data.image)} layout="fill" className="image" />
</span>
</div>
<div className="card-booking-content">
<p className="activity-name">{data.name}</p>
<p>{data.start_date} - {data.end_date}</p>
<p>{data.price}</p>
<p className="status">{data.status}</p>
</div>
<div className="hr-div" />
<div className="card-booking-footer">
<div className="d-flex align-items-center justify-content-between">
<div className="d-flex align-items-center">
<span className="image-container me-2">
<Image src={renderImage("/images/user/icon-rebook.svg")} layout="fill" className="image" />
</span>
<p className="duration mb-0">Rebook this booking</p>
</div>
<div className="image-container">
<Image src={renderImage("/images/user/arrow-right.svg")} layout="fill" className="image" />
</div>
</div>
</div>
</div>
</div>
))}
</div>
<div className="row">
{bookingsData?.length && bookingsData.map((data, index) => (
<div className="col-12 col-sm-12 col-lg-3 col-md-6 px-4 px-lg-3" key={`3${index}`}>
<div className="card-booking">
<div className="card-booking-img">
<span className="image-container">
<Image src={renderImage(data.image)} layout="fill" className="image" />
</span>
</div>
<div className="card-booking-content">
<p className="activity-name">{data.name}</p>
<p>{data.start_date} - {data.end_date}</p>
<p>{data.price}</p>
<p className="status">{data.status}</p>
</div>
<div className="hr-div" />
<div className="card-booking-footer">
<div className="d-flex align-items-center justify-content-between">
<div className="d-flex align-items-center">
<span className="image-container me-2">
<Image src={renderImage("/images/user/icon-rebook.svg")} layout="fill" className="image" />
</span>
<p className="duration mb-0">Rebook this booking</p>
</div>
<div className="image-container">
<Image src={renderImage("/images/user/arrow-right.svg")} layout="fill" className="image" />
</div>
</div>
</div>
</div>
</div>
))}
</div>
</div>
</div>
</div>
</Fragment>
)
}
export default MyEnquires;
\ No newline at end of file \ No newline at end of file
components/vendor/ActivityDetails.js
...@@ -467,8 +467,8 @@ const ActivityDetails = ({ isUpdate }) => { ...@@ -467,8 +467,8 @@ const ActivityDetails = ({ isUpdate }) => {
options={ options={
pincodeData && pincodeData.length > 0 pincodeData && pincodeData.length > 0
? pincodeData.map(item => { ? pincodeData.map(item => {
return { name: item.attributes.name, id: item.id }; return { name: item.attributes.name, id: item.id };
}) })
: [{}] : [{}]
} }
placeholder="Choose a pincode" placeholder="Choose a pincode"
...@@ -612,41 +612,41 @@ const ActivityDetails = ({ isUpdate }) => { ...@@ -612,41 +612,41 @@ const ActivityDetails = ({ isUpdate }) => {
<div className="input-group"> <div className="input-group">
<span className="col-md-12 my-1">Start date and end date of the activity:</span> <span className="col-md-12 my-1">Start date and end date of the activity:</span>
{/* <LazyLoad> */} {/* <LazyLoad> */}
{isUpdate ? ( {isUpdate ? (
<RangePicker <RangePicker
id="activityPeriod" id="activityPeriod"
name="activityPeriod" name="activityPeriod"
defaultValue={[ defaultValue={[
dayjs(activityById?.data.attributes.fromDate ? activityById?.data.attributes.fromDate : sanitizedCurrentDate, dateFormat), dayjs(activityById?.data.attributes.fromDate ? activityById?.data.attributes.fromDate : sanitizedCurrentDate, dateFormat),
dayjs(activityById?.data.attributes.toDate ? activityById?.data.attributes.toDate : sanitizedCurrentDate, dateFormat) dayjs(activityById?.data.attributes.toDate ? activityById?.data.attributes.toDate : sanitizedCurrentDate, dateFormat)
]} ]}
format={dateFormat} format={dateFormat}
onBlur={() => { onBlur={() => {
if (true) { if (true) {
} }
}} }}
onChange={e => { onChange={e => {
console.log("change", e); console.log("change", e);
setActivityPeriodState(e); setActivityPeriodState(e);
// handleChange(e); // handleChange(e);
}} }}
/> />
) : ( ) : (
<RangePicker <RangePicker
id="activityPeriod" id="activityPeriod"
name="activityPeriod" name="activityPeriod"
format={dateFormat} format={dateFormat}
onBlur={() => { onBlur={() => {
if (true) { if (true) {
} }
}} }}
onChange={e => { onChange={e => {
console.log("change", e); console.log("change", e);
setActivityPeriodState(e); setActivityPeriodState(e);
// handleChange(e); // handleChange(e);
}} }}
/> />
)} )}
{/* </LazyLoad> */} {/* </LazyLoad> */}
{touched.activityPeriod && errors.activityPeriod && ( {touched.activityPeriod && errors.activityPeriod && (
<span className="form-error" style={{ color: "red", fontSize: "10px" }}> <span className="form-error" style={{ color: "red", fontSize: "10px" }}>
...@@ -834,7 +834,7 @@ const ActivityDetails = ({ isUpdate }) => { ...@@ -834,7 +834,7 @@ const ActivityDetails = ({ isUpdate }) => {
<label>Minimum duration</label> <label>Minimum duration</label>
<input value={values.minDuration} id="minDuration" name="minDuration" onChange={handleChange} onBlur={handleBlur}></input> <input value={values.minDuration} id="minDuration" name="minDuration" onChange={handleChange} onBlur={handleBlur}></input>
{touched.minDuration && errors.minDuration && ( {touched.minDuration && errors.minDuration && (
<span className="form-error" style={{ color: "red", fontSize: "10px" }}> <span className="form-error">
{errors.minDuration} {errors.minDuration}
</span> </span>
)} )}
...@@ -857,7 +857,7 @@ const ActivityDetails = ({ isUpdate }) => { ...@@ -857,7 +857,7 @@ const ActivityDetails = ({ isUpdate }) => {
</div> </div>
<div className="col-12 col-lg-6"> <div className="col-12 col-lg-6">
<div className="input-group"> <div className="input-group">
<label>Age Group</label> <label className="mb-4">Age Group</label>
<select value={values.ageGroup} id={"ageGroup"} name={"ageGroup"} onChange={handleChange} onBlur={handleBlur}> <select value={values.ageGroup} id={"ageGroup"} name={"ageGroup"} onChange={handleChange} onBlur={handleBlur}>
<option value="">Select</option> <option value="">Select</option>
<option value="5">5+</option> <option value="5">5+</option>
......
components/vendor/ActivityListingRBAC.js
...@@ -311,7 +311,7 @@ export const ActivityListingRBAC = ({ setactivityDetailInfo, setShowActivityDeta ...@@ -311,7 +311,7 @@ export const ActivityListingRBAC = ({ setactivityDetailInfo, setShowActivityDeta
placement="bottomLeft" placement="bottomLeft"
> >
<Button style={{ border: "none" }}> <Button style={{ border: "none" }}>
<DownCircleOutlined style={{ fontSize: "20px", color: "#08c" }} onClick={() => {}} /> <DownCircleOutlined style={{ fontSize: "20px", color: "#08c" }} onClick={() => { }} />
</Button> </Button>
</Dropdown> </Dropdown>
</Space> </Space>
...@@ -485,6 +485,7 @@ export const ActivityListingRBAC = ({ setactivityDetailInfo, setShowActivityDeta ...@@ -485,6 +485,7 @@ export const ActivityListingRBAC = ({ setactivityDetailInfo, setShowActivityDeta
setrejectionId(null); setrejectionId(null);
setrejectPopUp(false); setrejectPopUp(false);
}} }}
centered
> >
<Modal.Header closeButton>Please mention reason for rejecting the activity.</Modal.Header> <Modal.Header closeButton>Please mention reason for rejecting the activity.</Modal.Header>
<Modal.Body> <Modal.Body>
......
pages/user/my-enquires/index.js 0 → 100644
import React from "react";
import Layout from "../../../components/layout/Layout";
import MyBookings from "../../../components/user/MyBookings";
import MyEnquires from "../../../components/user/MyEnquires";
export default function UserMyEnquiresPage() {
return (
<Layout>
<MyEnquires />
</Layout>
);
};
\ No newline at end of file \ No newline at end of file
styles/globals.css
...@@ -644,6 +644,7 @@ span.form-error, ...@@ -644,6 +644,7 @@ span.form-error,
color: red; color: red;
font-size: 0.8rem; font-size: 0.8rem;
font-family: "Sofia Pro Light"; font-family: "Sofia Pro Light";
display: inline-block;
} }
.login-banner-image { .login-banner-image {
...@@ -1909,6 +1910,7 @@ span.form-error, ...@@ -1909,6 +1910,7 @@ span.form-error,
line-height: 17px; line-height: 17px;
color: #000000; color: #000000;
margin-bottom: 1rem; margin-bottom: 1rem;
word-wrap: break-word;
} }
.vendorDetails p.phead { .vendorDetails p.phead {
...@@ -2120,7 +2122,7 @@ span.form-error, ...@@ -2120,7 +2122,7 @@ span.form-error,
color: #808080; color: #808080;
text-decoration: underline !important; text-decoration: underline !important;
text-align: right; text-align: right;
display: block; /* display: block; */
padding-top: 4px; padding-top: 4px;
} }
...@@ -4121,6 +4123,15 @@ footer .footer-link ul { ...@@ -4121,6 +4123,15 @@ footer .footer-link ul {
/* .image-gallery-content .image-gallery-slide .image-gallery-image { /* .image-gallery-content .image-gallery-slide .image-gallery-image {
margin-top: 2rem; margin-top: 2rem;
} */ } */
.suitable-age-group .ant-dropdown-trigger {
width: 112%;
display: block;
color: #000;
}
.suitable-age-group .anticon.anticon-down {
display: none;
}
@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;
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!