102 lines
4.9 KiB
JavaScript
102 lines
4.9 KiB
JavaScript
import Link from "next/link"
|
||
import { Autoplay, Navigation, Pagination } from "swiper"
|
||
import { Swiper, SwiperSlide } from "swiper/react"
|
||
import "swiper/css"
|
||
import "swiper/css/navigation"
|
||
import "swiper/css/pagination"
|
||
|
||
const swiperOptions = {
|
||
modules: [Autoplay, Pagination, Navigation],
|
||
slidesPerView: 1,
|
||
spaceBetween: 30,
|
||
autoplay: {
|
||
delay: 2500,
|
||
disableOnInteraction: false,
|
||
},
|
||
loop: true,
|
||
|
||
// Navigation
|
||
navigation: {
|
||
nextEl: '.h1n',
|
||
prevEl: '.h1p',
|
||
},
|
||
|
||
// Pagination
|
||
pagination: {
|
||
el: '.swiper-pagination',
|
||
clickable: true,
|
||
},
|
||
}
|
||
|
||
export default function Offer1() {
|
||
return (
|
||
<section className="what-we-offer">
|
||
<div className="pd_top_90" />
|
||
<div className="container">
|
||
<div className="row align-items-end">
|
||
<div className="col-lg-12 col-md-12">
|
||
<div className="section_title type_four text-center">
|
||
<h4 className="sm_title">Smooth Journey</h4>
|
||
<div className="title_whole">
|
||
<h2 className="title">How It Works</h2>
|
||
<p>Booking with us is simple—just enter your pickup and drop-off details to get an instant price. We’ll handle the rest, from pickup to delivery, while you relax and track your move live.</p>
|
||
</div>
|
||
<div className="pd_bottom_40" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div className="row">
|
||
<div className="col-lg-12">
|
||
<div className="service_post style_two position-relative position_one nav_false dot_false">
|
||
<Swiper {...swiperOptions} className="theme_carousel">
|
||
<SwiperSlide className="process_box type_two hover_1_get color_two">
|
||
<div className="image_box hover_1">
|
||
<img src="/assets/images/process/step-1.webp" alt="service" className="img-fluid" />
|
||
</div>
|
||
<div className="content">
|
||
<div className="title_22">
|
||
<h4 className="text-white">Step 1: Don’t panic</h4>
|
||
</div>
|
||
<p className="trans">
|
||
Found a deal on IKEA, Facebook Marketplace, or Kijiji?
|
||
Skip the stress—we’ve got wheels.
|
||
</p>
|
||
</div>
|
||
</SwiperSlide>
|
||
<SwiperSlide className="process_box type_two hover_1_get color_two">
|
||
<div className="image_box hover_1">
|
||
<img src="/assets/images/process/step-2.webp" alt="service" className="img-fluid" />
|
||
</div>
|
||
<div className="content">
|
||
<div className="title_22">
|
||
<h4 className="text-white">Step 2: Go to zipvan.ca/book</h4>
|
||
</div>
|
||
<p className="trans">
|
||
Enter pickup & drop-off. See your instant, final price
|
||
and pick a time—no surprises.
|
||
</p>
|
||
</div>
|
||
</SwiperSlide>
|
||
<SwiperSlide className="process_box type_two hover_1_get color_two">
|
||
<div className="image_box hover_1">
|
||
<img src="/assets/images/process/step-3.webp" alt="service" className="img-fluid" />
|
||
</div>
|
||
<div className="content">
|
||
<div className="title_22">
|
||
<h4 className="text-white">Step 3: We handle it. You relax.</h4>
|
||
</div>
|
||
<p className="trans">
|
||
We coordinate pickup, load with blankets & straps,
|
||
deliver to your door. Track us live; pay on delivery.
|
||
</p>
|
||
</div>
|
||
</SwiperSlide>
|
||
</Swiper>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
)
|
||
}
|