diff --git a/src/components/CardTrelloDesign/index.js b/src/components/CardDesgin/CardTrelloDesign/index.js
similarity index 91%
rename from src/components/CardTrelloDesign/index.js
rename to src/components/CardDesgin/CardTrelloDesign/index.js
index 2cc4f78..4744218 100644
--- a/src/components/CardTrelloDesign/index.js
+++ b/src/components/CardDesgin/CardTrelloDesign/index.js
@@ -1,10 +1,10 @@
import React from "react";
-import Button from "../ButtonDesign/Button";
-import CircleInCircle from "../CircleInCircle";
-import TagDesign1 from "../Tag/TagDesign1";
-import AnimatedProgressBar1 from "../ProgressBar/AnimatedProgressbar1";
-import ProfilePicNextToEachOther from "../ProfilePicNextToEachOther";
-import CommentIcon from "../MiniComponents/CommentIcon";
+import Button from "../../ButtonDesign/Button";
+import CircleInCircle from "../../CircleInCircle";
+import TagDesign1 from "../../Tag/TagDesign1";
+import AnimatedProgressBar1 from "../../ProgressBar/AnimatedProgressbar1";
+import ProfilePicNextToEachOther from "../../ProfilePicNextToEachOther";
+import CommentIcon from "../../MiniComponents/CommentIcon";
const CardTrelloDesign = ({
circle,
diff --git a/src/components/CardDesgin/ProcessCard/index.js b/src/components/CardDesgin/ProcessCard/index.js
new file mode 100644
index 0000000..350b188
--- /dev/null
+++ b/src/components/CardDesgin/ProcessCard/index.js
@@ -0,0 +1,90 @@
+import React from "react";
+import Button from "../../ButtonDesign/Button";
+
+const ProcessCard = ({ processes, title, hint, items }) => {
+ return (
+
+ {/* right */}
+
+ {/* top */}
+
+ {processes.map((process, index) => (
+
+ {process.color && (
+
+ )}
+
{process.name}
+
+ {process.content}
+
+
+ ))}
+
+ {/* middle */}
+
+ {/* bottom */}
+
+ {/* right */}
+
+ {/* left */}
+ {items.map((item, i) => (
+
+ ))}
+
+
+ {/* left */}
+
+ );
+};
+
+export default ProcessCard;
+
+ProcessCard.defaultProps = {
+ title: "پروسه مختلف در این قسمت قرار می گیرد",
+ hint: "یک توضیح کوتاه در این پروسه در اینجا قرار خواهد گرفت که نشان دهنده چیز های مختلف است.",
+
+ processes: [
+ {
+ color: "bg-red-600",
+ name: "فرایند اجرایی",
+ content: 256,
+ },
+ {
+ color: false,
+ name: "وضعیت:",
+ content: "پرداخت شده",
+ },
+ {
+ color: "bg-blue-600",
+ name: "در حال انجام",
+ content: 55,
+ },
+ {
+ color: false,
+ name: "انجام شده",
+ content: 100,
+ },
+ ],
+
+ items: [
+ {
+ icon: "images/user-edit.svg",
+ name: "سوالات",
+ ans: "5",
+ },
+ ],
+};
diff --git a/src/components/CardDesgin/index.js b/src/components/CardDesgin/index.js
new file mode 100644
index 0000000..9f9bd87
--- /dev/null
+++ b/src/components/CardDesgin/index.js
@@ -0,0 +1,27 @@
+import React, { useState } from "react";
+
+import CardTrelloDesign from "./CardTrelloDesign";
+import ProcessCard from "./ProcessCard";
+
+function CardDesgin() {
+ const list = {
+ 1: ,
+ 2: ,
+ };
+ const [type, setType] = useState(1);
+ return (
+
+
+ {list[type]}
+
+ );
+}
+
+export default CardDesgin;
diff --git a/src/components/TitleSubtitle/index.js b/src/components/MiniComponents/TitleSubtitle/index.js
similarity index 100%
rename from src/components/TitleSubtitle/index.js
rename to src/components/MiniComponents/TitleSubtitle/index.js
diff --git a/src/components/MiniComponents/index.js b/src/components/MiniComponents/index.js
index b0fece3..5d6edd8 100644
--- a/src/components/MiniComponents/index.js
+++ b/src/components/MiniComponents/index.js
@@ -2,11 +2,13 @@ import React, { useState } from "react";
import CommentIcon from "./CommentIcon";
import RelativeCircle from "./RelativeCircle";
+import TitleSubtitle from "./TitleSubtitle";
function MiniComponents() {
const list = {
1: ,
2: ,
+ 3: ,
};
const [type, setType] = useState(1);
diff --git a/src/redux/data.js b/src/redux/data.js
index 1cb2ebc..c8e6295 100644
--- a/src/redux/data.js
+++ b/src/redux/data.js
@@ -6,7 +6,7 @@ import Alert from "../components/Alert";
import Toast from "../components/Toast";
import Banners from "../components/Banners";
import Blog from "../components/Blog";
-import CardTrelloDesign from "../components/CardTrelloDesign";
+import CardDesgin from "../components/CardDesgin";
import ChartDesign from "../components/ChartDesign";
import ProgressBar from "../components/ProgressBar";
import Checkbox from "../components/Checkbox";
@@ -207,7 +207,7 @@ const components = [
props: [],
content: {
name: "Card Designs",
- component: ,
+ component: ,
code: null,
},
},