73 lines
2.4 KiB
JavaScript
73 lines
2.4 KiB
JavaScript
import React from "react";
|
|
import Link from "next/link";
|
|
import SectionTitle from "../SectionTitle/SectionTitle";
|
|
import Image from "next/image";
|
|
import { useTranslation } from "next-i18next";
|
|
|
|
const ClickHandler = () => {
|
|
if (typeof window !== "undefined") {
|
|
window.scrollTo(0, 0);
|
|
}
|
|
};
|
|
|
|
const ServicesSection = (props) => {
|
|
const { t } = useTranslation("services");
|
|
|
|
// Get campaigns array from translation json
|
|
const campaigns = t("campaigns", { returnObjects: true });
|
|
|
|
return (
|
|
<div className={`wpo-campaign-area section-padding ${props.cmClass || ""}`}>
|
|
<div className="container">
|
|
<SectionTitle subTitle={t("page.subtitle")} Title={t("page.title")} />
|
|
|
|
<div className="wpo-campaign-wrap">
|
|
<div className="row">
|
|
{campaigns.map((campaign, index) => (
|
|
<div className="col-lg-4 col-md-6 col-12" key={campaign.id || index}>
|
|
<div className="wpo-campaign-single">
|
|
<div className="wpo-campaign-item">
|
|
<div className="wpo-campaign-img">
|
|
<Image
|
|
src={campaign.sImgS}
|
|
alt={campaign.sTitle}
|
|
width={400}
|
|
height={250}
|
|
unoptimized
|
|
/>
|
|
</div>
|
|
<div className="wpo-campaign-content">
|
|
<div className="wpo-campaign-text-top data-theem">
|
|
<h3>
|
|
<Link
|
|
href={`/services/${campaign.slug}`}
|
|
onClick={ClickHandler}
|
|
>
|
|
{campaign.sTitle}
|
|
</Link>
|
|
</h3>
|
|
<p>{campaign.description}</p>
|
|
<div className="services-btn">
|
|
<Link
|
|
href={`/services/${campaign.slug}`}
|
|
className="theme-btn full-width-btn"
|
|
onClick={ClickHandler}
|
|
>
|
|
{t("page.viewButton")}
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default ServicesSection;
|