Skip to content

Jay Mehta / zango-frontend

Go to a project
Toggle navigation
Toggle navigation pinning
Commit 2b663a1a by jaymehta
Options

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

2 parents d4682491 c44516da
Inline Side-by-side
Showing 11 changed files with 121 additions and 27 deletions
components/detail/Detail.js
...@@ -16,11 +16,13 @@ const Detail = () => { ...@@ -16,11 +16,13 @@ const Detail = () => {
const { allActivitiesData } = useSelector(state => state.allActivitiesData); const { allActivitiesData } = useSelector(state => state.allActivitiesData);
const { activityById } = useSelector(state => state.activityById); const { activityById } = useSelector(state => state.activityById);
const { loadedUser } = useSelector(state => state.loadedUser); const { loadedUser } = useSelector(state => state.loadedUser);
const { faqs } = useSelector(state => state.faqs);
useEffect(() => { useEffect(() => {
// console.log("router", activityById.data.attributes.category?.data?.attributes.name); // console.log("router", activityById.data.attributes.category?.data?.attributes.name);
dispatch(getActivitiesByFilters({ category: activityById?.data.attributes.category?.data?.id })); dispatch(getActivitiesByFilters({ category: activityById?.data.attributes.category?.data?.id }));
}, [activityById]); }, [activityById]);
console.log("faqs=>", faqs)
console.log("activityById", activityById); console.log("activityById", activityById);
console.log("loadedUser", loadedUser); console.log("loadedUser", loadedUser);
return ( return (
...@@ -52,7 +54,7 @@ const Detail = () => { ...@@ -52,7 +54,7 @@ const Detail = () => {
</section> </section>
<GuestReviews activityById={activityById} /> <GuestReviews activityById={activityById} />
<SimilarExperiences allActivitiesData={allActivitiesData} /> <SimilarExperiences allActivitiesData={allActivitiesData} />
<Faqs /> <Faqs faqs={faqs} />
<SignUpToExperienceOurPlatform /> <SignUpToExperienceOurPlatform />
</main> </main>
</Fragment> </Fragment>
......
components/detail/Faqs.js
...@@ -2,7 +2,8 @@ import React from "react"; ...@@ -2,7 +2,8 @@ import React from "react";
import { Accordion } from "react-bootstrap"; import { Accordion } from "react-bootstrap";
import { fadeIn, zoomIn, slideFromLeft, slideFromRight } from "../animationvariants.js"; import { fadeIn, zoomIn, slideFromLeft, slideFromRight } from "../animationvariants.js";
import { motion } from "framer-motion"; import { motion } from "framer-motion";
const Faqs = () => { const Faqs = ({faqs}) => {
console.log("faqs====", faqs);
return ( return (
<section className="faqs-session"> <section className="faqs-session">
<div className="container"> <div className="container">
...@@ -21,22 +22,23 @@ const Faqs = () => { ...@@ -21,22 +22,23 @@ const Faqs = () => {
<div className="row"> <div className="row">
<div className="col-12"> <div className="col-12">
<Accordion defaultActiveKey="0" className="accordion-01"> <Accordion defaultActiveKey="0" className="accordion-01">
<Accordion.Item eventKey="0"> {faqs?.data && faqs?.data.map((item, index)=>(
<Accordion.Header>Lorem ipsum dolor sit amet, consectetur adipiscing elit ?</Accordion.Header> <Accordion.Item eventKey={index}>
<Accordion.Body> <Accordion.Header>{item?.attributes?.question}</Accordion.Header>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis <Accordion.Body dangerouslySetInnerHTML={{ __html: item?.attributes?.answer }}>
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</Accordion.Body> </Accordion.Body>
</Accordion.Item> </Accordion.Item>
<Accordion.Item eventKey="1"> ))}
{/* <Accordion.Item eventKey="1">
<Accordion.Header>Lorem ipsum dolor sit amet, consectetur adipiscing elit ?</Accordion.Header> <Accordion.Header>Lorem ipsum dolor sit amet, consectetur adipiscing elit ?</Accordion.Header>
<Accordion.Body> <Accordion.Body>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</Accordion.Body> </Accordion.Body>
</Accordion.Item> </Accordion.Item> */}
</Accordion> </Accordion>
</div> </div>
</div> </div>
......
components/home/BrowseExperiences.js
...@@ -137,13 +137,13 @@ const BrowseExperiences = ({allActivitiesData}) => { ...@@ -137,13 +137,13 @@ const BrowseExperiences = ({allActivitiesData}) => {
</div> </div>
</div> </div>
</div> </div>
<div className="row"> {/* <div className="row">
<div className="col-12"> <div className="col-12">
<div className="btn-center"> <div className="btn-center">
<Button variant="outline-secondary">Sign In for Member Price</Button> <Button variant="outline-secondary">Sign In for Member Price</Button>
</div> </div>
</div> </div>
</div> </div> */}
</div> </div>
</section> </section>
</> </>
......
components/layout/Footer.js
...@@ -6,7 +6,7 @@ const Footer = () => { ...@@ -6,7 +6,7 @@ const Footer = () => {
return ( return (
<> <>
<footer> <footer>
<div className="container"> <div className="container-fluid">
<div className="row"> <div className="row">
<div className="col-md-9"> <div className="col-md-9">
<div className="footer-logo"> <div className="footer-logo">
......
components/listing/LetDiscover.js
...@@ -54,7 +54,7 @@ const LetDiscover = ({ categories }) => { ...@@ -54,7 +54,7 @@ const LetDiscover = ({ categories }) => {
return ( return (
<> <>
<section className="let-discover-session let-discover-listing-session"> <section className="let-discover-session let-discover-listing-session">
<div className="container"> <div className="container-fluid">
<div className="row"> <div className="row">
<div className="col-12"> <div className="col-12">
{/* <motion.div variants={slideFromRight(0.4)} initial={"hidden"} whileInView={"show"} viewport={{ once: false, amount: 0.2 }}> {/* <motion.div variants={slideFromRight(0.4)} initial={"hidden"} whileInView={"show"} viewport={{ once: false, amount: 0.2 }}>
......
pages/activities/[id].js
...@@ -5,6 +5,7 @@ import Layout from "../../components/layout/Layout"; ...@@ -5,6 +5,7 @@ import Layout from "../../components/layout/Layout";
import { getActivitiesByFilters, getActivityById } from "../../redux/actions/activityAction"; import { getActivitiesByFilters, getActivityById } from "../../redux/actions/activityAction";
import { loadUser } from "../../redux/actions/userActions"; import { loadUser } from "../../redux/actions/userActions";
import { wrapper } from "../../redux/store"; import { wrapper } from "../../redux/store";
import { getFaqs } from "../../redux/actions/faqsAction";
const ActivityDetailPage = () => { const ActivityDetailPage = () => {
const dispatch = useDispatch(); const dispatch = useDispatch();
...@@ -24,6 +25,7 @@ export default ActivityDetailPage; ...@@ -24,6 +25,7 @@ export default ActivityDetailPage;
/** For server side rendering */ /** For server side rendering */
export const getServerSideProps = wrapper.getServerSideProps(store => async ({ req, query }) => { export const getServerSideProps = wrapper.getServerSideProps(store => async ({ req, query }) => {
await store.dispatch(getActivityById(query.id)); await store.dispatch(getActivityById(query.id));
await store.dispatch(getFaqs());
// await store.dispatch(getActivitiesByFilters({category: query.category})) // await store.dispatch(getActivitiesByFilters({category: query.category}))
return { return {
......
redux/actions/faqsAction.js 0 → 100644
import axios from "axios";
import qs from "qs";
import { GET_FAQS_FAIL, GET_FAQS_REQUEST, GET_FAQS_SUCCESS } from "../constants/faqsConstants";
export const getFaqs = () => async dispatch => {
try {
dispatch({
type: GET_FAQS_REQUEST
});
const config = {
headers: {
"Content-Type": "application/json"
}
};
const query = {
populate: ["image"]
};
const queryString = qs.stringify(query, {
encodeValuesOnly: true
});
const response = await axios.get(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/faqs?${queryString}`, config);
console.log("response > ", response);
dispatch({
type: GET_FAQS_SUCCESS,
payload: response.data
});
return response.data;
} catch (error) {
dispatch({
type: GET_FAQS_FAIL,
payload: error.response.data
});
}
};
redux/constants/faqsConstants.js 0 → 100644
export const GET_FAQS_REQUEST = "GET_FAQS_REQUEST"
export const GET_FAQS_SUCCESS = "GET_FAQS_SUCCESS"
export const GET_FAQS_FAIL = "GET_FAQS_FAIL"
export const CLEAR_ERRORS = "CLEAR_ERRORS";
\ No newline at end of file \ No newline at end of file
redux/reducers/faqsReducer.js 0 → 100644
import { GET_FAQS_REQUEST, CLEAR_ERRORS, GET_FAQS_SUCCESS, GET_FAQS_FAIL } from "../constants/faqsConstants";
export const getAllFaqsReducer = (state = { loading: true, success: false, faqs: null }, action) => {
switch (action.type) {
case GET_FAQS_REQUEST:
return {
loading: true,
};
case GET_FAQS_SUCCESS:
return {
loading: false,
faqs: action.payload
};
case GET_FAQS_FAIL:
return {
loading: false,
error: action.payload.error.message
};
case CLEAR_ERRORS:
return {
...state,
error: null
};
default:
return state;
}
};
\ No newline at end of file \ No newline at end of file
redux/reducers/reducers.js
...@@ -10,6 +10,7 @@ import { getAllCategoriesReducer, getAllSubCategoriesReducer } from "./categoryR ...@@ -10,6 +10,7 @@ import { getAllCategoriesReducer, getAllSubCategoriesReducer } from "./categoryR
import { getAllTestimonialReducer } from "./testimonialReducer"; import { getAllTestimonialReducer } from "./testimonialReducer";
import { blogReducer, blogsReducer } from "./blogReducer"; import { blogReducer, blogsReducer } from "./blogReducer";
import { getAllHomeBannerReducer } from "./homeBannerReducer"; import { getAllHomeBannerReducer } from "./homeBannerReducer";
import { getAllFaqsReducer } from "./faqsReducer";
const reducers = combineReducers({ const reducers = combineReducers({
townships: townshipsReducer, townships: townshipsReducer,
...@@ -42,6 +43,7 @@ const reducers = combineReducers({ ...@@ -42,6 +43,7 @@ const reducers = combineReducers({
enquiriesByVendor: getEnquiriesReducer, enquiriesByVendor: getEnquiriesReducer,
activityFilters: setActivityFilterReducer, activityFilters: setActivityFilterReducer,
wishlists: getWishlistsReducer, wishlists: getWishlistsReducer,
faqs: getAllFaqsReducer,
}); });
export default reducers; export default reducers;
styles/globals.css
...@@ -433,22 +433,22 @@ header { ...@@ -433,22 +433,22 @@ header {
} }
.home-banner .banner-txt h1 { .home-banner .banner-txt h1 {
font-size: 24px; font-size: 1.25vw;
line-height: 25px; line-height: 1.25vw;
font-weight: 300; font-weight: 300;
margin-bottom: 1rem; margin-bottom: 1rem;
} }
.home-banner .banner-txt .title { .home-banner .banner-txt .title {
font-size: 55px; font-size: 2.865vw;
line-height: 56px; line-height: 2.865vw;
font-weight: 300; font-weight: 300;
margin-bottom: 1rem; margin-bottom: 1rem;
} }
.home-banner .banner-txt .disc { .home-banner .banner-txt .disc {
font-size: 16px; font-size: 0.833vw;
line-height: 17px; line-height: 0.933vw;
font-weight: 300; font-weight: 300;
margin-bottom: 1rem; margin-bottom: 1rem;
} }
...@@ -1916,7 +1916,7 @@ span.form-error, ...@@ -1916,7 +1916,7 @@ span.form-error,
} }
.info .top-name .title { .info .top-name .title {
font-size: 17px; font-size: 0.885vw;
line-height: 20px; line-height: 20px;
} }
...@@ -1927,6 +1927,7 @@ span.form-error, ...@@ -1927,6 +1927,7 @@ span.form-error,
font-size: 14px; font-size: 14px;
padding: 0.1rem 0.3rem; padding: 0.1rem 0.3rem;
margin-right: 10px; margin-right: 10px;
height: 23px;
} }
.info .rating-wishlist .wishlist .image-container { .info .rating-wishlist .wishlist .image-container {
...@@ -1952,6 +1953,7 @@ span.form-error, ...@@ -1952,6 +1953,7 @@ span.form-error,
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
height: 32px;
} }
.browse-experiences-item .info .discription a { .browse-experiences-item .info .discription a {
...@@ -2073,8 +2075,8 @@ span.form-error, ...@@ -2073,8 +2075,8 @@ span.form-error,
} }
.signUp-to-experience-our-platform .title { .signUp-to-experience-our-platform .title {
font-size: 40px; font-size: 2.083vw;
line-height: 40px; line-height: 2.083vw;
margin-bottom: 1rem; margin-bottom: 1rem;
} }
...@@ -2094,8 +2096,8 @@ footer .footer-logo { ...@@ -2094,8 +2096,8 @@ footer .footer-logo {
} }
.footer-link h3 { .footer-link h3 {
font-size: 24px; font-size: 1.25vw;
line-height: 24px; line-height: 1.25vw;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
...@@ -2877,7 +2879,7 @@ input[type="number"]::-webkit-outer-spin-button { ...@@ -2877,7 +2879,7 @@ input[type="number"]::-webkit-outer-spin-button {
} }
.swiper.mySwiper02 { .swiper.mySwiper02 {
width: 92%; /* width: 92%; */
} }
.mySwiper01 .swiper-button-prev:after, .mySwiper01 .swiper-button-prev:after,
...@@ -2889,7 +2891,8 @@ input[type="number"]::-webkit-outer-spin-button { ...@@ -2889,7 +2891,8 @@ input[type="number"]::-webkit-outer-spin-button {
.home_nav { .home_nav {
position: absolute; position: absolute;
left: 0; left: 0;
width: 100%; width: 107%;
margin-left: -45px;
} }
.swiper-nav { .swiper-nav {
...@@ -3628,6 +3631,13 @@ img:hover { ...@@ -3628,6 +3631,13 @@ img:hover {
} }
@media (max-width: 767px) { @media (max-width: 767px) {
.info .top-name .title {
font-size: 4vw;
}
.home-banner .banner-txt .disc {
font-size: 3vw;
line-height: 4vw;
}
.home-banner-bg > span > span .image { .home-banner-bg > span > span .image {
border-radius: 0 0 20px 20px; border-radius: 0 0 20px 20px;
} }
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!