59 lines
1.5 KiB
React
59 lines
1.5 KiB
React
import React from "react";
|
|
import Image from "next/image";
|
|
const FancyBlock = () => {
|
|
const fancyBlockCotent = [
|
|
{
|
|
id: 1,
|
|
icon: "203",
|
|
title: "Free Shipping",
|
|
text: `Simplify the process to create proposals.`,
|
|
delayAnim: "0",
|
|
},
|
|
{
|
|
id: 2,
|
|
icon: "204",
|
|
title: "Free Return",
|
|
text: `Return money within 7 days only!`,
|
|
delayAnim: "100",
|
|
},
|
|
{
|
|
id: 3,
|
|
icon: "205",
|
|
title: "Secured Payment",
|
|
text: `We ensure secure payment with PEV`,
|
|
delayAnim: "200",
|
|
},
|
|
{
|
|
id: 4,
|
|
icon: "206",
|
|
title: "100% Safe",
|
|
text: `We provide world best security system`,
|
|
delayAnim: "300",
|
|
},
|
|
];
|
|
|
|
return (
|
|
<>
|
|
{fancyBlockCotent.map((item) => (
|
|
<div
|
|
className="col-lg-3 col-sm-6"
|
|
data-aos="fade-up"
|
|
data-aos-delay={item.delayAnim}
|
|
key={item.id}
|
|
>
|
|
<div className="block-style-thirtyNine mt-40 text-center">
|
|
<div className="icon rounded-circle d-flex align-items-center justify-content-center m-auto">
|
|
<Image width={30} height={30} style={{objectFit:'contain'}} src={`/images/icon/${item.icon}.svg`} alt="icon" />
|
|
</div>
|
|
<h3>{item.title}</h3>
|
|
<p className="ps-xl-3 pe-xl-3">{item.text}</p>
|
|
</div>
|
|
{/* <!-- /.block-style-thirtyNine --> */}
|
|
</div>
|
|
))}
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default FancyBlock;
|