feat : add section fastSell and add section nowSell and add particle bg

src/pages/shop/section/fastSell/FastSell.tsx

@@ -0,0 +1,19 @@
+import { FaPowerOff } from "react-icons/fa6";
+import LoaderSpin from "../../../../components/loaderSpin";
+import Typewriter from "../../../../components/typeWriter";
+
+const FastSell = () => {
+  return (
+    <div className="relative w-full h-full md:mt-14 mb-8 flex justify-center items-center">
+      <div className="w-full h-full flex flex-col gap-5 justify-center items-center">
+        <LoaderSpin>
+          <FaPowerOff className="max-md:text-6xl text-8xl text-white" />
+        </LoaderSpin>
+        <Typewriter text="میبینی ؟ همینقدر" />
+        <Typewriter text="ساده و سریــــــــــــــع" />
+      </div>
+    </div>
+  );
+};
+
+export default FastSell;

src/pages/shop/section/intro/Intro.tsx

@@ -0,0 +1,30 @@
+import Button from "../../../../components/button";
+
+const Intro = () => {
+  return (
+    <div className="relative w-full h-full md:pt-40 mb-16 md:mb-32 gap-6 grid grid-cols-1 py-8 md:grid-cols-2">
+      <div className="w-full h-full flex flex-col gap-8 justify-center mx-auto items-center">
+        <h1 className="text-start flex flex-col gap-3 md:gap-4 text-3xl md:text-4xl lg:text-5xl">
+          <span className="inline-block">بزرگترین فروشگاه</span>
+          <span className="text-yellow-600 font-bold max-md:text-center">
+            کاهش پینگ
+          </span>{" "}
+          <span className="inline-block max-md:text-center">در ایران</span>
+        </h1>
+        <p className="text-center text-xl text-gray-600">
+          سال ها تجربه پشت یک کانفیگ شماست
+        </p>
+        <Button>همین الان میخرم</Button>
+      </div>
+      <div className="w-full h-full flex justify-center py-4 mx-auto items-center">
+        <img
+          src="https://persain-game.com/front_end/img/Iphone%2015.png"
+          alt="intro"
+          className="w-60 md:w-72 lg:w-80"
+        />
+      </div>
+    </div>
+  );
+};
+
+export default Intro;

src/pages/shop/section/nowSell/NowSell.tsx

@@ -0,0 +1,13 @@
+import Content from "./components/Content";
+
+const NowSell = () => {
+  return (
+    <div className="relative w-full h-full mt-16 p-5">
+      <div className="relative w-full max-md:h-[15rem] md:h-[20rem] lg:h-[25rem] p-2 rounded-2xl bg-white shadow-lg bg-banner bg-center bg-cover shadow-current flex justify-center items-center">
+        <Content />
+      </div>
+    </div>
+  );
+};
+
+export default NowSell;

src/pages/shop/section/nowSell/components/Content.tsx

@@ -0,0 +1,23 @@
+import Button from "../../../../../components/button";
+
+const Content = () => {
+  return (
+    <div className="w-full h-full flex flex-col text-center max-md:gap-3 gap-5 justify-center text-black items-center max-md:py-5 px-5 py-10">
+      <h1 className="text-4xl max-md:text-2xl lg:text-5xl font-bold">
+        با چندین سال
+      </h1>
+      <h1 className="text-4xl max-md:text-2xl lg:text-5xl font-bold">
+        تجربـــــــــــــــــــه
+      </h1>
+      <p className="text-2xl max-md:text-sm text-gray-500">
+        بهترین نتیجه رو بهتون تقدیم میکنیم
+      </p>
+      <Button extra="!bg-black text-white text-2xl max-md:text-lg max-md:!py-2 mt-4 !py-4 !px-10 !rounded-xl">
+        {" "}
+        همین الان میخرم
+      </Button>
+    </div>
+  );
+};
+
+export default Content;

src/pages/shop/section/productList/ProductList.tsx

@@ -0,0 +1,5 @@
+const ProductList = () => {
+  return <div className="relative w-full h-full"></div>;
+};
+
+export default ProductList;