49 lines
2.4 KiB
TypeScript
49 lines
2.4 KiB
TypeScript
import React, { useEffect } from "react";
|
|
import { caseStudies } from "@/utils/data";
|
|
|
|
const ProjectSlider2Section = () => {
|
|
return (
|
|
<section className="project-slider-two-section section-space-bottom p-relative fix">
|
|
<div className="bg-shape" style={{ backgroundImage: "url(/assets/imgs/shapes/shape-37.png)" }}></div>
|
|
<div className="small-container">
|
|
<div className="project-two-title-area mb-60">
|
|
<div className="title-box wow fadeInLeft" data-wow-delay=".5s">
|
|
<span className="section-sub-title">Projects</span>
|
|
<h3 className="section-title mt-10">Our Latest Projects</h3>
|
|
</div>
|
|
<a className="primary-btn-1 btn-hover" href="#">
|
|
all PROJECTS | <i className="fa-solid fa-arrow-right"></i>
|
|
<span className="btn-hover-span"></span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div className="container-fluid">
|
|
<div className="swiper project-active-1">
|
|
<div className="swiper-wrapper">
|
|
{caseStudies.slice(0, 6).map((project, index) => (
|
|
<div key={project.id} className="swiper-slide">
|
|
<div className="project-slider-two-box p-relative">
|
|
<figure className="image w-img">
|
|
<img src={project.image} alt="" />
|
|
</figure>
|
|
<div className="content">
|
|
<div className="inner-box">
|
|
<span>{project.tag}</span>
|
|
<h5><a href="#">{project.title}</a></h5>
|
|
</div>
|
|
<a className="icon-1" href="#">
|
|
<i className="fa-solid fa-arrow-right"></i>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export default ProjectSlider2Section;
|