rapharehap/components/sections/home/ServicesSection.js
2025-09-03 15:48:08 +05:30

55 lines
3.0 KiB
JavaScript

import { servicesList } from '@/utils/Services.utils';
import Link from 'next/link';
import React from 'react';
export default function ServicesSection() {
return (
<section className="service-section sec-pad bg-color-1">
<div className="auto-container">
<div className="sec-title-1 mb_50 centred">
<span className="sub-title-1">We Offer For You Medical & <br />Saving Lives</span>
<h2>Our Services</h2>
</div>
<div className="row clearfix">
{
servicesList?.slice(0, 6)?.map((service, index) => {
return (
<div className="col-lg-4 col-md-6 col-sm-12 service-block" key={index}>
<div className="service-block-one wow fadeInUp animated" data-wow-delay="00ms" data-wow-duration="1500ms">
<div className="inner-box">
<div className="image-box">
<figure className="image"><Link href={`/etobicoke-treatment-service/${service.slug}`}><img src={service?.image} alt="" /></Link></figure>
</div>
<div className="lower-content">
<div className="icon-box"><img src={service?.icon} alt="" /></div>
<h3>
<Link href={`/etobicoke-treatment-service/${service.slug}`}>
{service?.title?.length > 25
? service.title.slice(0, 25) + "..."
: service.title}
</Link>
</h3>
<p>
{service?.shortDescription?.length > 70
? service.shortDescription.slice(0, 70) + "..."
: service.shortDescription}
</p>
</div>
</div>
</div>
</div>
)
})
}
<div className='col-12 text-center'>
<div className="btn-box">
<Link href="/etobicoke-treatment-service" className="theme-btn btn-one-new"><span>View All Services</span></Link>
</div>
</div>
</div>
</div>
</section>
);
};