Skip to content

sujata / advithconsulting.io-frontend

Go to a project
Toggle navigation
Toggle navigation pinning
Commit 53f8c246 by sujata
Options

chnages in frontent pages

1 parent cd22005a
Inline Side-by-side
Showing 9 changed files with 116 additions and 25 deletions
components/reuseables/FunctionalAreas.js
...@@ -65,7 +65,7 @@ const FunctionalAreas = ({functionarea}) => { ...@@ -65,7 +65,7 @@ const FunctionalAreas = ({functionarea}) => {
// console.log(functionarea ,"functionarea") // console.log(functionarea ,"functionarea")
return ( return (
<> <>
<div className="functional-areas pt-100 pb-70"> <div className="functional-areas pt-100 pb-70">
<Container> <Container>
<div className="section-title"> <div className="section-title">
<span className="sub-title">SERVICES</span> <span className="sub-title">SERVICES</span>
...@@ -76,11 +76,11 @@ const FunctionalAreas = ({functionarea}) => { ...@@ -76,11 +76,11 @@ const FunctionalAreas = ({functionarea}) => {
expertise to deliver exceptional value. expertise to deliver exceptional value.
</p> </p>
<div className="row align-items-center"> <div className="row row-gap-4 h-auto">
{functionarea && {functionarea &&
functionarea?.map((service) => ( functionarea?.map((service) => (
<div className="col-lg-4 col-sm-6 col-md-6" key={service.id}> <div className="col-lg-4 col-sm-6 col-md-6" key={service.id}>
<div className="single-services-item fuctional-areas border align-items-left"> <div className="single-services-item fuctional-areas border align-items-left h-100">
<Image <Image
src={cleanImage(service?.Icon?.url)} src={cleanImage(service?.Icon?.url)}
alt={service.serviceTitle} alt={service.serviceTitle}
......
components/reuseables/PageBanner.js
...@@ -93,6 +93,7 @@ const PageBanner = ({ banners = [] }) => { ...@@ -93,6 +93,7 @@ const PageBanner = ({ banners = [] }) => {
className="page-banner-swiper" className="page-banner-swiper"
> >
{banners.map((banner, index) => ( {banners.map((banner, index) => (
<SwiperSlide key={index}> <SwiperSlide key={index}>
<div className="page-title-area"> <div className="page-title-area">
<div className="image-wrapper"> <div className="image-wrapper">
...@@ -105,7 +106,7 @@ const PageBanner = ({ banners = [] }) => { ...@@ -105,7 +106,7 @@ const PageBanner = ({ banners = [] }) => {
className="img-fluid postion-absolute" className="img-fluid postion-absolute"
/> />
</div> </div>
<Container> <Container fluid className="ps-5">
<div className="page-title-content"> <div className="page-title-content">
<h2>{banner.pageTitle}</h2> <h2>{banner.pageTitle}</h2>
<ul> <ul>
...@@ -130,6 +131,7 @@ const PageBanner = ({ banners = [] }) => { ...@@ -130,6 +131,7 @@ const PageBanner = ({ banners = [] }) => {
</> </>
)} )}
</ul> </ul>
<p className="pt-3 text-center">{banner.Description}</p>
</div> </div>
</Container> </Container>
</div> </div>
......
components/reuseables/services/Card.js
...@@ -3,13 +3,13 @@ import { Col, Container, Row } from "react-bootstrap"; ...@@ -3,13 +3,13 @@ import { Col, Container, Row } from "react-bootstrap";
import Heading from "../Heading"; import Heading from "../Heading";
const Card = ({ heading, data }) => { const Card = ({ heading, data }) => {
console.log("heading",heading)
return ( return (
<section className="ptb-50"> <section className="ptb-50">
<Container> <Container>
<Row className="justify-content-center"> <Row className="justify-content-center">
<Col md={12}> <Col md={12}>
<Heading el="h2" heading={heading?.Title} className="text-center" /> <Heading el="h2" heading={heading?.Title} className="text-center" />
<p className="text-center mb-2">{heading?.Description}</p>
</Col> </Col>
{data.map((item, index) => ( {data.map((item, index) => (
<Col <Col
......
container/ClientServicing/CFO/HowWeDoIt.js
...@@ -51,10 +51,10 @@ const HowWeDoIt = ({ data, heading }) => { ...@@ -51,10 +51,10 @@ const HowWeDoIt = ({ data, heading }) => {
<section className="HowWeDoIt-section ptb-100"> <section className="HowWeDoIt-section ptb-100">
<Container> <Container>
<div className="section-title"> <div className="section-title">
<span className="sub-title">{""}</span> <span className="sub-title">{heading?.Subtitle}</span>
<Heading el="h2" heading={heading?.Title} /> <Heading el="h2" heading={heading?.Title} />
</div> </div>
<p className=" text-center text-black mb-4 mb-lg-5">{heading?.Description}</p> <p className=" text-center text-black mb-4 mb-lg-5" dangerouslySetInnerHTML={{ __html: heading?.Description }}></p>
<Row className='row-gap-4 h-auto justify-content-center'> <Row className='row-gap-4 h-auto justify-content-center'>
{ {
data?.carddetails && data?.carddetails.map((item, index) => ( data?.carddetails && data?.carddetails.map((item, index) => (
......
pages/client-servicing/virtual-finance-office/book-closures-audit.js
...@@ -10,10 +10,12 @@ import RightSideImage from "@/container/Corpedia/RightSideImage"; ...@@ -10,10 +10,12 @@ import RightSideImage from "@/container/Corpedia/RightSideImage";
import Seo from "@/components/reuseables/Seo/Seo"; import Seo from "@/components/reuseables/Seo/Seo";
import ConversionCode from "@/components/reuseables/ConversionCode/ConversionCode"; import ConversionCode from "@/components/reuseables/ConversionCode/ConversionCode";
import CallBackRequest from "@/components/reuseables/CallBackRequest"; import CallBackRequest from "@/components/reuseables/CallBackRequest";
import Card from "@/components/reuseables/services/Card";
import HowWeDoIt from "@/container/ClientServicing/CFO/HowWeDoIt";
// method one content // method one content
const bookclosures = ({ bookclosurepage ,conversionData }) => { const bookclosures = ({ bookclosurepage ,conversionData }) => {
// console.log(bookclosurepage ,"bookclosurepage") console.log(bookclosurepage ,"bookclosurepage")
const banners = [ const banners = [
{ {
imageSrc: cleanImage(bookclosurepage?.Banner?.Image?.url), imageSrc: cleanImage(bookclosurepage?.Banner?.Image?.url),
...@@ -72,6 +74,14 @@ const bookclosures = ({ bookclosurepage ,conversionData }) => { ...@@ -72,6 +74,14 @@ const bookclosures = ({ bookclosurepage ,conversionData }) => {
data={section?.ElementList} data={section?.ElementList}
/> />
); );
case "dynamic-zone.card":
return (
<>
<HowWeDoIt heading={section?.Heading}
data={section} />
</>
);
case "dynamic-zone.element-two": case "dynamic-zone.element-two":
return ( return (
<MethodTwoSection <MethodTwoSection
...@@ -79,6 +89,8 @@ const bookclosures = ({ bookclosurepage ,conversionData }) => { ...@@ -79,6 +89,8 @@ const bookclosures = ({ bookclosurepage ,conversionData }) => {
data={section?.ElementList} data={section?.ElementList}
/> />
); );
default: default:
return null; return null;
......
pages/client-servicing/virtual-finance-office/index.js
...@@ -19,7 +19,7 @@ import HomeBlog from "@/container/Home/HomeBlog"; ...@@ -19,7 +19,7 @@ import HomeBlog from "@/container/Home/HomeBlog";
import { fetchBlogList } from "@/redux/slices/bloglistslice"; import { fetchBlogList } from "@/redux/slices/bloglistslice";
const VirtualFinanceOfficePage = ({ ClientPage, conversionData, title }) => { const VirtualFinanceOfficePage = ({ ClientPage, conversionData, title }) => {
// console.log(ClientPage, "data1"); console.log(ClientPage, "data1");
const banners = [ const banners = [
{ {
imageSrc: cleanImage(ClientPage?.Banner?.Image?.url), imageSrc: cleanImage(ClientPage?.Banner?.Image?.url),
...@@ -27,6 +27,7 @@ const VirtualFinanceOfficePage = ({ ClientPage, conversionData, title }) => { ...@@ -27,6 +27,7 @@ const VirtualFinanceOfficePage = ({ ClientPage, conversionData, title }) => {
homePageUrl: "/", homePageUrl: "/",
homePageText: "Home", homePageText: "Home",
activePageText: ClientPage?.Banner?.Heading, activePageText: ClientPage?.Banner?.Heading,
Description:ClientPage?.Banner?.Description,
}, },
]; ];
...@@ -59,7 +60,7 @@ const VirtualFinanceOfficePage = ({ ClientPage, conversionData, title }) => { ...@@ -59,7 +60,7 @@ const VirtualFinanceOfficePage = ({ ClientPage, conversionData, title }) => {
<ConversionCode code={code} /> <ConversionCode code={code} />
<Overview overview={overview} /> {/* <Overview overview={overview} /> */}
<WhatWeDo service={serviceData} serviceheading={serviceHeading} /> <WhatWeDo service={serviceData} serviceheading={serviceHeading} />
<Finance finance={PyramidofFinance} /> <Finance finance={PyramidofFinance} />
......
pages/client-servicing/virtual-finance-office/virtual-cfo.js
...@@ -15,7 +15,7 @@ import HowWeDoIt from "@/container/ClientServicing/CFO/HowWeDoIt"; ...@@ -15,7 +15,7 @@ import HowWeDoIt from "@/container/ClientServicing/CFO/HowWeDoIt";
// method one content // method one content
const clientservicecfo = ({ cfopage, conversionData }) => { const clientservicecfo = ({ cfopage, conversionData }) => {
// console.log(cfopage ,"cfopage") console.log(cfopage ,"cfopage")
const banners = [ const banners = [
{ {
imageSrc: cleanImage(cfopage?.Banner?.Image?.url), imageSrc: cleanImage(cfopage?.Banner?.Image?.url),
...@@ -23,6 +23,7 @@ const clientservicecfo = ({ cfopage, conversionData }) => { ...@@ -23,6 +23,7 @@ const clientservicecfo = ({ cfopage, conversionData }) => {
homePageUrl: "/", homePageUrl: "/",
homePageText: "Home", homePageText: "Home",
activePageText: cfopage?.Banner?.Heading, activePageText: cfopage?.Banner?.Heading,
}, },
]; ];
...@@ -83,22 +84,23 @@ const clientservicecfo = ({ cfopage, conversionData }) => { ...@@ -83,22 +84,23 @@ const clientservicecfo = ({ cfopage, conversionData }) => {
data={section} /> data={section} />
</> </>
); );
case "dynamic-zone.element-two": case "dynamic-zone.variantcard":
return ( return (
<MethodTwoSection <Card
heading={section?.Heading} heading={section?.Heading}
data={section?.ElementList} data={section?.carddetails}
image={section?.Image}
/> />
); );
case "dynamic-zone.card": case "dynamic-zone.element-two":
return ( return (
<Card <MethodTwoSection
heading={section?.Heading} heading={section?.Heading}
data={section?.carddetails} data={section?.ElementList}
image={section?.Image}
/> />
); );
case "dynamic-zone.rules-application": case "dynamic-zone.rules-application":
return ( return (
<Rules <Rules
......
pages/client-servicing/virtual-finance-office/virtual-fc.js
...@@ -11,6 +11,7 @@ import Seo from "@/components/reuseables/Seo/Seo"; ...@@ -11,6 +11,7 @@ import Seo from "@/components/reuseables/Seo/Seo";
import ConversionCode from "@/components/reuseables/ConversionCode/ConversionCode"; import ConversionCode from "@/components/reuseables/ConversionCode/ConversionCode";
import CallBackRequest from "@/components/reuseables/CallBackRequest"; import CallBackRequest from "@/components/reuseables/CallBackRequest";
import Card from "@/components/reuseables/services/Card"; import Card from "@/components/reuseables/services/Card";
import HowWeDoIt from "@/container/ClientServicing/CFO/HowWeDoIt";
...@@ -85,11 +86,19 @@ const clientservicefc = ({ fcpage ,conversionData }) => { ...@@ -85,11 +86,19 @@ const clientservicefc = ({ fcpage ,conversionData }) => {
/> />
); );
case "dynamic-zone.card": case "dynamic-zone.card":
return (
<>
<HowWeDoIt heading={section?.Heading}
data={section} />
</>
);
case "dynamic-zone.variantcard":
return ( return (
<Card <Card
heading={section?.Heading} heading={section?.Heading}
data={section?.carddetails} data={section?.carddetails}
image={section?.Image}
/> />
); );
default: default:
......
styles/styles.css
...@@ -8841,6 +8841,7 @@ ul.pagination.custom-pagination { ...@@ -8841,6 +8841,7 @@ ul.pagination.custom-pagination {
color: var(--mainColor2) color: var(--mainColor2)
} }
.variant-box { .variant-box {
border-bottom: 2px solid #f8971f; border-bottom: 2px solid #f8971f;
background-color: #feead2b8; background-color: #feead2b8;
...@@ -8936,6 +8937,65 @@ ul.pagination.custom-pagination { ...@@ -8936,6 +8937,65 @@ ul.pagination.custom-pagination {
/*============ How to do it new section END ============ */ /*============ How to do it new section END ============ */
/* -------------------Variant section----------------- */
.variant_card {
position: relative;
/* width: 300px; */
border-radius: 10px;
overflow: hidden;
transition: box-shadow 0.3s ease;
}
.variant_card:hover h2 {
opacity: 0;
transform: scale(0.7);
}
.variant_card:hover .variant_card_content {
top: 0;
height: 100%;
background-color:#0000006e;
}
.variant_card h2 {
padding: 10px;
position: absolute;
width: auto;
top: 0px;
left: 0px;
font-size: 17px;
color: #fff;
z-index: 2;
font-weight: 300;
transition: transform 0.25s ease, opacity 0.25s ease;
margin: 10px;
background-color: var(--mainColor);
}
.variant_card_content {
position: absolute;
/* bottom: -120%; */
left: 0;
width: 100%;
padding: 30px;
color: #fff;
transition: bottom 0.3s ease;
}
.variant_card_content h4 {
color: #fff;
}
.variant_card_content p {
color: #fff;
}
/* --------------------variant end---------------- */
@media (max-width: 1200px) { @media (max-width: 1200px) {
.client-servicing-grid { .client-servicing-grid {
grid-template-columns: repeat(3, 1fr); grid-template-columns: repeat(3, 1fr);
...@@ -8996,6 +9056,14 @@ ul.pagination.custom-pagination { ...@@ -8996,6 +9056,14 @@ ul.pagination.custom-pagination {
.service-header { .service-header {
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
} }
.download-content h2 {
font-size: 2.1vh;
margin-bottom: 15px;
color: var(--mainColor2)
}
.ps-5 {
padding-left: 1rem!important;
}
} }
@media (max-width: 480px) { @media (max-width: 480px) {
...@@ -9528,12 +9596,11 @@ ul.pagination.custom-pagination { ...@@ -9528,12 +9596,11 @@ ul.pagination.custom-pagination {
text-align: center; text-align: center;
color: #fff; color: #fff;
opacity: 0; opacity: 0;
/* 🙈 Hidden initially */
transition: opacity 0.4s ease, transform 0.4s ease; transition: opacity 0.4s ease, transform 0.4s ease;
padding: 0 15px; padding: 0 15px;
} }
/* 👀 Content visible on hover */
.custom-card:hover .card-content { .custom-card:hover .card-content {
opacity: 1; opacity: 1;
transform: translate(-50%, -50%) scale(1.05); transform: translate(-50%, -50%) scale(1.05);
...@@ -9560,8 +9627,6 @@ ul.pagination.custom-pagination { ...@@ -9560,8 +9627,6 @@ ul.pagination.custom-pagination {
z-index: 3; z-index: 3;
transition: opacity 0.3s ease, transform 0.3s ease; transition: opacity 0.3s ease, transform 0.3s ease;
} }
/* 🙈 Hide badge on hover */
.custom-card:hover .card-badge { .custom-card:hover .card-badge {
opacity: 0; opacity: 0;
transform: scale(0.9); transform: scale(0.9);
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!