Skip to content

Jay Mehta / zango-frontend

Go to a project
Toggle navigation
Toggle navigation pinning
Commit 27c80214 by Ravindra Kanojiya
Options

updated

1 parent 4f8a782f
Inline Side-by-side
Showing 7 changed files with 53 additions and 28 deletions
components/blog/BlogItem.js
...@@ -10,47 +10,47 @@ export const BlogData = [ ...@@ -10,47 +10,47 @@ export const BlogData = [
title: "13 MOST Unique Places to Stay in Washington State", title: "13 MOST Unique Places to Stay in Washington State",
discription: "Undoubtedly, the most unique places to stay........", discription: "Undoubtedly, the most unique places to stay........",
read: "10-15 Read", read: "10-15 Read",
flag:"Adventure" flag: "Adventure"
}, },
{ {
image: "/images/blogs/02.png", image: "/images/blogs/02.png",
title: "13 MOST Unique Places to Stay in Washington State", title: "13 MOST Unique Places to Stay in Washington State",
discription: "Undoubtedly, the most unique places to stay........", discription: "Undoubtedly, the most unique places to stay........",
read: "10-15 Read", read: "10-15 Read",
flag:"Adventure" flag: "Adventure"
}, },
{ {
image: "/images/blogs/03.png", image: "/images/blogs/03.png",
title: "13 MOST Unique Places to Stay in Washington State", title: "13 MOST Unique Places to Stay in Washington State",
discription: "Undoubtedly, the most unique places to stay........", discription: "Undoubtedly, the most unique places to stay........",
read: "10-15 Read", read: "10-15 Read",
flag:"Art & History" flag: "Art & History"
}, },
{ {
image: "/images/blogs/01.png", image: "/images/blogs/01.png",
title: "13 MOST Unique Places to Stay in Washington State", title: "13 MOST Unique Places to Stay in Washington State",
discription: "Undoubtedly, the most unique places to stay........", discription: "Undoubtedly, the most unique places to stay........",
read: "10-15 Read", read: "10-15 Read",
flag:"Adventure" flag: "Adventure"
}, },
{ {
image: "/images/blogs/02.png", image: "/images/blogs/02.png",
title: "13 MOST Unique Places to Stay in Washington State", title: "13 MOST Unique Places to Stay in Washington State",
discription: "Undoubtedly, the most unique places to stay........", discription: "Undoubtedly, the most unique places to stay........",
read: "10-15 Read", read: "10-15 Read",
flag:"Adventure" flag: "Adventure"
}, },
{ {
image: "/images/blogs/03.png", image: "/images/blogs/03.png",
title: "13 MOST Unique Places to Stay in Washington State", title: "13 MOST Unique Places to Stay in Washington State",
discription: "Undoubtedly, the most unique places to stay........", discription: "Undoubtedly, the most unique places to stay........",
read: "10-15 Read", read: "10-15 Read",
flag:"Art & History" flag: "Art & History"
} }
]; ];
const BlogsItem = ({blogs}) => { const BlogsItem = ({ blogs }) => {
const [showContent, setShowContent] = useState(false); const [showContent, setShowContent] = useState(false);
const [isGridViewOpen, setIsGridViewOpen] = useState(false); const [isGridViewOpen, setIsGridViewOpen] = useState(false);
const [isOpen, setIsOpen] = useState(false); const [isOpen, setIsOpen] = useState(false);
const toggleContent = () => { const toggleContent = () => {
...@@ -99,9 +99,9 @@ const BlogsItem = ({blogs}) => { ...@@ -99,9 +99,9 @@ const BlogsItem = ({blogs}) => {
</div> </div>
</div> </div>
<div className="listing-filter"> <div className="listing-filter">
<div className="box-01"> <div className="box-01">
<div className="inner"> <div className="inner">
<Accordion className="accordion-filter" defaultActiveKey="0" flush> <Accordion className="accordion-filter" defaultActiveKey="0" flush>
<Accordion.Item eventKey="0"> <Accordion.Item eventKey="0">
...@@ -290,7 +290,7 @@ const BlogsItem = ({blogs}) => { ...@@ -290,7 +290,7 @@ const BlogsItem = ({blogs}) => {
<div></div> <div></div>
</div> </div>
<div className="text-center"> <div className="text-center">
<Button variant="primary">Submit</Button> <Button variant="primary">Submit</Button>
</div> </div>
</div> </div>
</div> </div>
......
components/detail/Detail.js
...@@ -33,7 +33,7 @@ const Detail = () => { ...@@ -33,7 +33,7 @@ const Detail = () => {
<main> <main>
<section className="main-mt"> <section className="main-mt">
<div className="container mt-3"> <div className="container mt-3">
<div className="py-5"> <div className="py-4 py-lg-5 breadcrumb-wrap">
<ConfigProvider <ConfigProvider
theme={{ theme={{
components: { components: {
......
components/detail/DetailInfo.js
...@@ -143,15 +143,13 @@ const DetailInfo = ({ activityById }) => { ...@@ -143,15 +143,13 @@ const DetailInfo = ({ activityById }) => {
router.push("/gift-card"); router.push("/gift-card");
} }
}} }}
variant="secondary" variant="secondary me-3"
> >
Gift Now Gift Now
<span className="image-container btn-gift"> <span className="image-container btn-gift">
<Image layout="fill" className="image img-fluid" src="/images/icons/gift-card-icon.svg" /> <Image layout="fill" className="image img-fluid" src="/images/icons/gift-card-icon.svg" />
</span> </span>
</Button> </Button>
</div>
<div>
<Button <Button
disabled={loading} disabled={loading}
// onClick={() => { // onClick={() => {
...@@ -161,11 +159,12 @@ const DetailInfo = ({ activityById }) => { ...@@ -161,11 +159,12 @@ const DetailInfo = ({ activityById }) => {
// setenquiryModal(true); // setenquiryModal(true);
// } // }
// }} // }}
variant="primary me-3" variant="primary"
> >
Book Now Book Now
</Button> </Button>
</div> </div>
</div> </div>
</div> </div>
)} )}
......
components/detail/DetailSchedule.js
...@@ -36,7 +36,7 @@ const DetailSchedule = ({ activityById }) => { ...@@ -36,7 +36,7 @@ const DetailSchedule = ({ activityById }) => {
return array; return array;
}; };
return ( return (
<div className="row mb-5"> <div className="row mb-3 mb-lg-4">
{activityById && ( {activityById && (
<div className="col-12"> <div className="col-12">
<ul className="availability-wrappper"> <ul className="availability-wrappper">
......
components/detail/SimilarExperiences.js
...@@ -108,7 +108,7 @@ const SimilarExperiences = ({ allActivitiesData }) => { ...@@ -108,7 +108,7 @@ const SimilarExperiences = ({ allActivitiesData }) => {
<div className="browse-experiences-item"> <div className="browse-experiences-item">
<div className="img-wrapper"> <div className="img-wrapper">
<span className="image-container"> <span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src={data.image} /> <Image layout="fill" alt="" className="image img-fluid" src={data.image} priority />
</span> </span>
{/* <div className="top-rated">{data.topRated}</div> */} {/* <div className="top-rated">{data.topRated}</div> */}
</div> </div>
...@@ -142,7 +142,7 @@ const SimilarExperiences = ({ allActivitiesData }) => { ...@@ -142,7 +142,7 @@ const SimilarExperiences = ({ allActivitiesData }) => {
</div> </div>
<div className="price"> <div className="price">
${data.price} ${data.price}
{/* <span className="off">{data.offPrice} OFF</span> */} {/* <span className="off">{data.offPrice} OFF</span> */}
</div> </div>
<div className="detail"> <div className="detail">
<div className="">{data.days}</div> <div className="">{data.days}</div>
......
components/layout/Header.js
...@@ -56,7 +56,7 @@ const Header = () => { ...@@ -56,7 +56,7 @@ const Header = () => {
</Navbar.Brand> </Navbar.Brand>
<Navbar.Toggle aria-controls="navbarScroll" /> <Navbar.Toggle aria-controls="navbarScroll" />
<Navbar.Collapse id="navbarScroll"> <Navbar.Collapse id="navbarScroll">
<Nav className=" my-2 my-lg-0" style={{ maxHeight: "100px" }} navbarScroll> <Nav className=" my-2 my-lg-0" navbarScroll>
<ActiveLink href="/user/wishlist" activeClassName="active"> <ActiveLink href="/user/wishlist" activeClassName="active">
<a className="nav-link ">Wishlist</a> <a className="nav-link ">Wishlist</a>
</ActiveLink> </ActiveLink>
......
styles/globals.css
...@@ -31,7 +31,7 @@ acronym, ...@@ -31,7 +31,7 @@ acronym,
address, address,
big, big,
cite, cite,
code, 55 code,
del, del,
dfn, dfn,
em, em,
...@@ -1959,7 +1959,7 @@ span.form-error, ...@@ -1959,7 +1959,7 @@ span.form-error,
} }
.similar-experiences-session { .similar-experiences-session {
padding: 2rem 0; padding: 1rem 0;
} }
.browse-experiences-item { .browse-experiences-item {
...@@ -2082,7 +2082,7 @@ span.form-error, ...@@ -2082,7 +2082,7 @@ span.form-error,
margin-bottom: 10px; margin-bottom: 10px;
} }
.browse-experiences-item .info .discription > span { .browse-experiences-item .info .discription {
display: -webkit-box; display: -webkit-box;
-webkit-line-clamp: 2; -webkit-line-clamp: 2;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
...@@ -2750,13 +2750,14 @@ button:focus:not(:focus-visible) { ...@@ -2750,13 +2750,14 @@ button:focus:not(:focus-visible) {
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
margin-top: 2rem; margin-top: 2rem;
padding-left: 0;
} }
.availability-wrappper li { .availability-wrappper li {
width: 32%; width: 31%;
display: flex; display: flex;
align-items: center; align-items: center;
margin: 0.5rem; margin: 0.5rem 1rem 0.5rem 0.5rem;
} }
.availability-wrappper li > span { .availability-wrappper li > span {
...@@ -2805,7 +2806,7 @@ button:focus:not(:focus-visible) { ...@@ -2805,7 +2806,7 @@ button:focus:not(:focus-visible) {
} }
.guest-reviews-detail .head .name { .guest-reviews-detail .head .name {
font-size: 24px; font-size: calc(20px + (24 - 20) * (100vw - 320px) / (1920 - 320));
line-height: 24px; line-height: 24px;
} }
...@@ -2941,7 +2942,7 @@ button:focus:not(:focus-visible) { ...@@ -2941,7 +2942,7 @@ button:focus:not(:focus-visible) {
} }
.faqs-session { .faqs-session {
padding: 5rem 0; padding: 4rem 0;
} }
.subscribe label .btn { .subscribe label .btn {
...@@ -3899,6 +3900,7 @@ img:hover { ...@@ -3899,6 +3900,7 @@ img:hover {
align-items: center; align-items: center;
justify-content: flex-end; justify-content: flex-end;
margin-bottom: 4rem; margin-bottom: 4rem;
margin-top: 1.5rem;
} }
.load-more .pagination .page-item { .load-more .pagination .page-item {
...@@ -3933,6 +3935,19 @@ img:hover { ...@@ -3933,6 +3935,19 @@ img:hover {
.listing-wrapper .product-info { .listing-wrapper .product-info {
padding-left: 2rem; padding-left: 2rem;
} }
.breadcrumb-wrap .ant-breadcrumb ol li.ant-breadcrumb-separator {
margin: 0 0.8rem;
}
.breadcrumb-wrap .ant-breadcrumb ol li .ant-breadcrumb-link {
font-size: calc(14px + (14 - 14) * (100vw - 320px) / (1920 - 320));
}
.most-read-blogs-session,
.blogs-session {
padding-bottom: 3rem;
}
footer .footer-link ul {
padding-left: 0;
}
@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;
...@@ -4115,6 +4130,17 @@ img:hover { ...@@ -4115,6 +4130,17 @@ img:hover {
} }
@media (max-width: 767px) { @media (max-width: 767px) {
.product-info .btn-row .btn {
padding-left: 5vw;
padding-right: 5vw;
}
.load-more {
justify-content: center;
}
.btn-primary,
.vendor-signup a {
padding: 0.6rem 2rem;
}
.browse-experiences-item .img-wrapper .image-container .image { .browse-experiences-item .img-wrapper .image-container .image {
height: 220px !important; height: 220px !important;
} }
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!