44 lines
2.6 KiB
TypeScript
44 lines
2.6 KiB
TypeScript
const BannerSection = () => {
|
|
return (
|
|
<section className="banner-section p-relative fix">
|
|
<div className="swiper banner-active">
|
|
<div className="swiper-wrapper">
|
|
{[1, 2, 1].map((num, i) => (
|
|
<div key={i} className="swiper-slide">
|
|
<div className="banner-main" style={{ backgroundImage: `url(/assets/imgs/banner/banner-${num}.jpg)` }}>
|
|
<div className="large-container">
|
|
<div className="banner-area p-relative z-3 wow img-custom-anim-left animated" data-wow-delay={`${1500 + i * 1000}ms`}>
|
|
<span className="p-relative banner-sub-title">TECHNOLOGY CONSULTANCY</span>
|
|
<h1 className="banner-title">Make The Easiest Solution For You</h1>
|
|
<p className="banner-text">We denounce with righteous indignation and dislike men who are so beguiled and demoralized by the charms of pleasure.</p>
|
|
<div className="banner-btn-area">
|
|
<a className="primary-btn-1 btn-hover" href="/services">
|
|
eXPLORE mORE | <i className="fa-solid fa-arrow-right"></i>
|
|
<span className="btn-hover-span"></span>
|
|
</a>
|
|
<a href="https://www.youtube.com/watch?v=eEzD-Y97ges" className="play-btn popup-video">
|
|
<div className="icon-1"><i className="fa-solid fa-play"></i></div>
|
|
<span>How It Works</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="banner-shape-area">
|
|
{[1, 2, 3, 4, 5].map((s) => (
|
|
<div key={s} className={`shape-${s}`} style={{ backgroundImage: `url(/assets/imgs/shapes/shape-${s}.png)` }}></div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
<div className="banner-dot-inner">
|
|
<div className="banner-dot"></div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export default BannerSection;
|