72 lines
3.0 KiB
JavaScript
72 lines
3.0 KiB
JavaScript
import Image from "next/image";
|
|
import React from "react";
|
|
import between1 from "../../../public/images/between1.png";
|
|
import between2 from "../../../public/images/between2.png";
|
|
import between from "../../../public/images/between.jpeg";
|
|
|
|
const BetweenSexualSection = () => {
|
|
return (
|
|
<section>
|
|
<div className=" xs:px-5 lg:px-20 mt-10">
|
|
<div className="grid xs:grid-cols-1 lg:grid-cols-3 rtl ">
|
|
<div className=" rounded-3xl overflow-hidden relative z-10">
|
|
<div className="w-full">
|
|
<Image src={between} className=" object-cover" />
|
|
</div>
|
|
</div>
|
|
|
|
<div className="bg-gray-100 relative xs:left-[0px] lg:left-[30px] xs:top-[-35px] lg:top-0 col-span-2 z-0 rounded-3xl xs:pr-5 lg:pr-[55px] xs:pt-[55px] lg:pt-10 pl-5">
|
|
<div className="xs:block lg:flex">
|
|
<h2 className="xs:text-2xl lg:text-3xl font-bold">
|
|
لوازم آرایشی وسمه
|
|
</h2>
|
|
|
|
<p className="mb-0 w-fit bg-sky-200 rounded-full py-1 px-3 xs:mr-0 lg:mr-2 xs:mt-2 lg:mt-0 xs:text-sm lg:text-base ">
|
|
به صرفه زیبا شـــــــــــــو
|
|
</p>
|
|
</div>
|
|
|
|
<p className="mb-0 text-gray-500 text-sm mt-3">
|
|
لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با
|
|
استفاده از طراحان گرافیک است
|
|
</p>
|
|
|
|
<div className=" xs:block lg:flex mt-10">
|
|
<div className="bg-pink-300 p-3 w-full mx-1 rounded-3xl xs:my-10 lg:my-0 ">
|
|
<div className="flex justify-end">
|
|
<div className="absolute mt-[-43px]">
|
|
<div className="xs:w-[140px] lg:w-[150px]">
|
|
<Image src={between1} className=" object-cover" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 className="xs:text-lg lg:text-xl ">لوازم بانوان وسمه</h3>
|
|
|
|
<p className="mb-0 w-fit bg-sky-200 rounded-full py-1 px-3 mt-2 text-sm">
|
|
شروع خرید{" "}
|
|
</p>
|
|
</div>
|
|
<div className="bg-sky-300 p-3 w-full mx-1 rounded-3xl xs:my-10 lg:my-0 ">
|
|
<div className="flex justify-end">
|
|
<div className="absolute mt-[-43px]">
|
|
<div className="xs:w-[140px] lg:w-[150px]">
|
|
<Image src={between2} className=" object-cover" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 className="xs:text-lg lg:text-xl ">لوازم آقایان وسمه</h3>
|
|
|
|
<p className="mb-0 w-fit bg-sky-200 rounded-full py-1 px-3 mt-2 text-sm">
|
|
شروع خرید{" "}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export default BetweenSexualSection;
|