From 8da03b02ea4f7a8acfbb3b2a425bacac73515127 Mon Sep 17 00:00:00 2001 From: mahdi andalib Date: Wed, 6 Jul 2022 17:39:02 +0430 Subject: [PATCH] =?UTF-8?q?=D8=A7=D8=AF=D8=A7=D9=85=D9=87=20=DA=A9=D8=A7?= =?UTF-8?q?=D8=B1=20|=20=D8=B3=D8=A7=D8=B9=D8=AA=20=DA=A9=D8=A7=D8=B1?= =?UTF-8?q?=DB=8C=20=D8=B1=D8=A7=20=D8=AF=D8=B1=20=D8=A7=DB=8C=D8=B4=D9=88?= =?UTF-8?q?=20=D9=87=D8=A7=DB=8C=DB=8C=20=DA=A9=D9=87=20=D8=AF=D8=B1=D8=B3?= =?UTF-8?q?=D8=AA=20=DA=A9=D8=B1=D8=AF=D9=85=20=D9=85=DB=8C=D8=B2=D8=A7?= =?UTF-8?q?=D8=B1=D9=85=20=D8=A7=D8=B2=20=D8=A7=DB=8C=D9=86=20=D8=A8=D9=87?= =?UTF-8?q?=20=D8=A8=D8=B9=D8=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/images/blue-correct-thick-icon.svg | 3 + src/components/Modal/index.js | 10 ++- src/components/Tabbar/index.js | 74 +++++++++++++++++++++++ 3 files changed, 84 insertions(+), 3 deletions(-) create mode 100644 public/images/blue-correct-thick-icon.svg create mode 100644 src/components/Tabbar/index.js diff --git a/public/images/blue-correct-thick-icon.svg b/public/images/blue-correct-thick-icon.svg new file mode 100644 index 0000000..3cc8973 --- /dev/null +++ b/public/images/blue-correct-thick-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/components/Modal/index.js b/src/components/Modal/index.js index ef25ff9..e7c90bb 100644 --- a/src/components/Modal/index.js +++ b/src/components/Modal/index.js @@ -1,6 +1,7 @@ import React, { useState } from "react"; import Button from "../Button"; +import Tabbar from "../Tabbar"; import FormInput from "../FormInput"; const Modal = () => { @@ -24,16 +25,19 @@ const Modal = () => { `} >
e.stopPropagation()} >
diff --git a/src/components/Tabbar/index.js b/src/components/Tabbar/index.js new file mode 100644 index 0000000..67384a3 --- /dev/null +++ b/src/components/Tabbar/index.js @@ -0,0 +1,74 @@ +import React, { useState } from "react"; +import Button from "../Button"; + +const Tabbar = ({ tabs }) => { + const [activeTab, setActiveTab] = useState(); + + return ( +
+
+ {tabs.map((tab, index) => ( +
+
+ {activeTab?.components} +
+
+ ); +}; + +export default Tabbar; + +Tabbar.defaultProps = { + tabs: [ + { + title: "تنظیمات", + className: "rounded-tr-md rounded-br-md border-r-2", + components: "mahdi", + bg: "bg-blue-500", + }, + { + title: "سوالات", + className: "", + components: "iran", + bg: "bg-blue-500", + }, + { + title: "چک لیست", + className: "", + components: "zlatan", + bg: "bg-blue-500", + }, + { + title: "مکاتبات", + className: "", + components: "mahdii", + bg: "bg-blue-500", + }, + { + title: "توابع", + className: "", + components: "mahdiii", + bg: "bg-blue-500", + }, + { + title: "شرایط و اجرا", + className: "rounded-tl-md rounded-bl-md border-l-2", + components: "mahdiii", + bg: "bg-blue-500", + }, + ], +};