added

package-lock.json

@@ -30,6 +30,7 @@
         "sass": "^1.45.0",
         "sweetalert2": "^11.3.4",
         "tw-elements": "^1.0.0-alpha8",
+        "use-draggable-scroll": "^0.1.0",
         "web-vitals": "^2.1.2"
       },
       "devDependencies": {
@@ -15678,9 +15679,9 @@
       "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
     },
     "node_modules/tw-elements": {
-      "version": "1.0.0-alpha8",
-      "resolved": "https://registry.npmjs.org/tw-elements/-/tw-elements-1.0.0-alpha8.tgz",
-      "integrity": "sha512-feqb4XmHWH8KUOT7KEC3lc258VmypcI6ettdR9adN/dEfk9wXcp/G+XPOhnAAQiXeyTDOCuDF/GNo6kMN++YXw==",
+      "version": "1.0.0-alpha9",
+      "resolved": "https://registry.npmjs.org/tw-elements/-/tw-elements-1.0.0-alpha9.tgz",
+      "integrity": "sha512-Qw88PhQQQzQ6Ohsaze8FBy3ijMJnvMe0BeD5f31tfi5KAi39y6QvmgRBxnSnLNmpvq5ItxNOxlVKMPfUCgDwfw==",
       "dependencies": {
         "@popperjs/core": "^2.6.0",
         "bootstrap": "^5.1.3",
@@ -15869,6 +15870,17 @@
       "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
       "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
     },
+    "node_modules/use-draggable-scroll": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/use-draggable-scroll/-/use-draggable-scroll-0.1.0.tgz",
+      "integrity": "sha512-mX6nT3cUqOTtA+8QUH9HfdKtzI6Oquj9QIB0wALWZYmWogNQ746MaUcmqKOKCIlt2UH6egxhSKNPiSlfEqmKhA==",
+      "engines": {
+        "node": ">=10"
+      },
+      "peerDependencies": {
+        "react": ">=16"
+      }
+    },
     "node_modules/util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
@@ -28136,9 +28148,9 @@
       }
     },
     "tw-elements": {
-      "version": "1.0.0-alpha8",
-      "resolved": "https://registry.npmjs.org/tw-elements/-/tw-elements-1.0.0-alpha8.tgz",
-      "integrity": "sha512-feqb4XmHWH8KUOT7KEC3lc258VmypcI6ettdR9adN/dEfk9wXcp/G+XPOhnAAQiXeyTDOCuDF/GNo6kMN++YXw==",
+      "version": "1.0.0-alpha9",
+      "resolved": "https://registry.npmjs.org/tw-elements/-/tw-elements-1.0.0-alpha9.tgz",
+      "integrity": "sha512-Qw88PhQQQzQ6Ohsaze8FBy3ijMJnvMe0BeD5f31tfi5KAi39y6QvmgRBxnSnLNmpvq5ItxNOxlVKMPfUCgDwfw==",
       "requires": {
         "@popperjs/core": "^2.6.0",
         "bootstrap": "^5.1.3",
@@ -28279,6 +28291,12 @@
         }
       }
     },
+    "use-draggable-scroll": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/use-draggable-scroll/-/use-draggable-scroll-0.1.0.tgz",
+      "integrity": "sha512-mX6nT3cUqOTtA+8QUH9HfdKtzI6Oquj9QIB0wALWZYmWogNQ746MaUcmqKOKCIlt2UH6egxhSKNPiSlfEqmKhA==",
+      "requires": {}
+    },
     "util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",

src/components/Digikala/SliderData.js

@@ -0,0 +1,21 @@
+import pic1 from "./pic1.jpg";
+import pic2 from "./pic2.jpg";
+import pic3 from "./pic3.jpg";
+import pic4 from "./pic4.jpg";
+import pic5 from "./pic5.jpg";
+import pic6 from "./pic6.jpg";
+
+export const SliderData = [
+  {
+    image: pic6,
+  },
+  {
+    image: pic5,
+  },
+  {
+    image: pic4,
+  },
+  {
+    image: pic3,
+  },
+];

src/components/Digikala/black-left-arrow.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="37.14" height="37.14" viewBox="0 0 37.14 37.14">
+  <g id="vuesax_linear_arrow-left" data-name="vuesax/linear/arrow-left" transform="translate(-364 -252)">
+    <g id="arrow-left" transform="translate(364 252)">
+      <path id="Vector" d="M10.983,24.512.894,14.423a3.073,3.073,0,0,1,0-4.333L10.983,0" transform="translate(12.229 6.314)" fill="none" stroke="#646464" stroke-linecap="round" stroke-linejoin="round" stroke-width="3"/>
+      <path id="Vector-2" data-name="Vector" d="M0,0H37.14V37.14H0Z" transform="translate(37.14 37.14) rotate(180)" fill="none" opacity="0"/>
+    </g>
+  </g>
+</svg>

src/components/Digikala/black-right-arrow.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="37.14" height="37.14" viewBox="0 0 37.14 37.14">
+  <g id="vuesax_linear_arrow-left" data-name="vuesax/linear/arrow-left" transform="translate(401.14 289.14) rotate(180)">
+    <g id="arrow-left" transform="translate(364 252)">
+      <path id="Vector" d="M10.983,24.512.894,14.423a3.073,3.073,0,0,1,0-4.333L10.983,0" transform="translate(12.229 6.314)" fill="none" stroke="#646464" stroke-linecap="round" stroke-linejoin="round" stroke-width="3"/>
+      <path id="Vector-2" data-name="Vector" d="M0,0H37.14V37.14H0Z" transform="translate(37.14 37.14) rotate(180)" fill="none" opacity="0"/>
+    </g>
+  </g>
+</svg>

src/components/Digikala/index.js

@@ -0,0 +1,9 @@
+import React from "react";
+import ImageSlider from "./ImageSlider";
+import { SliderData } from "./SliderData";
+
+const Digikala = () => {
+  return <ImageSlider slides={SliderData} />;
+};
+
+export default Digikala;

src/components/ReactTable4/index.js

@@ -49,6 +49,7 @@ const ReactTable3 = ({ breadCrumbs, subTitle, title }) => {
 };
 window.isDown = false;
 export default ReactTable3;
+
 function Tabbar({}) {
   const ref = useRef(null);
 

tailwind.config.js

@@ -2,6 +2,8 @@ module.exports = {
   content: [
     "./src/**/*.{js,jsx,ts,tsx}",
     "./node_modules/@themesberg/flowbite/**/*.js",
+    "./src/**/*.{html,js}",
+    "./node_modules/tw-elements/dist/js/**/*.js",
   ],
   theme: {
     extend: {},
@@ -78,5 +80,8 @@ module.exports = {
       darkCrimsonBorderColor: "#132F52",
     }),
   },
-  plugins: [require("@themesberg/flowbite/plugin")],
+  plugins: [
+    require("@themesberg/flowbite/plugin"),
+    require("tw-elements/dist/plugin"),
+  ],
 };