101 lines
4.1 KiB
JavaScript
101 lines
4.1 KiB
JavaScript
import React, { Fragment } from 'react';
|
|
import Navbar2 from '../../components/Navbar2/Navbar2';
|
|
import PageTitle from '../../components/pagetitle/PageTitle';
|
|
import Scrollbar from '../../components/scrollbar/scrollbar';
|
|
import { useRouter } from 'next/router';
|
|
import Campaign from '../../api/campaign';
|
|
import Footer from '../../components/footer/Footer';
|
|
import Image from 'next/image';
|
|
import Link from 'next/link';
|
|
|
|
const ServiceDetailsPage = () => {
|
|
const router = useRouter();
|
|
const { slug } = router.query;
|
|
|
|
const service = Campaign.find(item => item.slug === slug);
|
|
|
|
if (!service) {
|
|
return (
|
|
<Fragment>
|
|
<Navbar2 />
|
|
<div className="container text-center py-5">
|
|
<h2>Service not found!</h2>
|
|
<Link href="/">Back to Home</Link>
|
|
</div>
|
|
<Footer />
|
|
<Scrollbar />
|
|
</Fragment>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<Fragment>
|
|
<Navbar2 />
|
|
<PageTitle pageTitle={service.sTitle} pagesub={'Services Details'} />
|
|
|
|
<section className="wpo-blog-single-section section-padding">
|
|
<div className="container">
|
|
<div className="row">
|
|
<div className="col-12">
|
|
<div className="wpo-blog-content">
|
|
<div className="post format-standard-image">
|
|
|
|
<div className="entry-media">
|
|
<div style={{ width: "100%", height: "650px", position: "relative" }}>
|
|
<Image
|
|
src={service.sImgS}
|
|
alt={service.sTitle}
|
|
fill
|
|
style={{ objectFit: "cover" }}
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div className="entry-meta">
|
|
<ul>
|
|
<li>
|
|
{/* <i className="fi flaticon-user"></i>{' '}
|
|
<span>{service.author || 'Admin'}</span> */}
|
|
</li>
|
|
{/* <li>
|
|
<i className="fi flaticon-calendar"></i> {service.date}
|
|
</li> */}
|
|
</ul>
|
|
</div>
|
|
|
|
<h2>{service.sTitle}</h2>
|
|
|
|
<div dangerouslySetInnerHTML={{ __html: service.descriptiondetail }} />
|
|
|
|
{service.blockquotes && service.blockquotes.map((quote, idx) => (
|
|
<blockquote key={idx}>{quote}</blockquote>
|
|
))}
|
|
|
|
{service.gallery && (
|
|
<div className="gallery">
|
|
{service.gallery.map((img, i) => (
|
|
<div key={i}>
|
|
<Image src={img} alt={`Gallery ${i}`} width={400} height={300} />
|
|
</div>
|
|
))}
|
|
</div>
|
|
)}
|
|
|
|
{/* {service.extraText && <p className="mt-4">{service.extraText}</p>} */}
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<Footer />
|
|
<Scrollbar />
|
|
</Fragment>
|
|
);
|
|
};
|
|
|
|
export default ServiceDetailsPage;
|