From 78f4f3f41c504007159ba0c6047d53de2faddc5c Mon Sep 17 00:00:00 2001
From: Your Name <you@example.com>
Date: Tue, 12 Apr 2022 09:28:22 +0430
Subject: [PATCH] update src/components/CardTrelloDesign/index.js and
 src/components/NewTagDesign/index.js

---
 src/components/CardTrelloDesign/index.js | 28 +++++++++++++-----------
 src/components/NewTagDesign/index.js     |  4 +++-
 2 files changed, 18 insertions(+), 14 deletions(-)

diff --git a/src/components/CardTrelloDesign/index.js b/src/components/CardTrelloDesign/index.js
index 0a4aba2..4fbecf2 100644
--- a/src/components/CardTrelloDesign/index.js
+++ b/src/components/CardTrelloDesign/index.js
@@ -29,13 +29,13 @@ const CardTrelloDesign = ({ circle, pictures }) => {
         {/* left */}
         <div className="flex flex-row gap-x-1 items-center place-content-end">
           <ButtonNewDesign
-            bgColor={"bg-[#ff0a3c]"}
+            bgColor={"bg-[#FF0A3C]"}
             bgHoverColor={"bg-transparent"}
             border={"border-none"}
-            paddingX={"p-3"}
-            paddingY={"p-3"}
+            paddingX={"p-1"}
+            paddingY={"p-0.5"}
             fontSize={"text-xs"}
-            borderRadius={"rounded-md"}
+            borderRadius={"rounded-sm"}
             icon={false}
             text={"رابط کاربری"}
           />
@@ -43,8 +43,8 @@ const CardTrelloDesign = ({ circle, pictures }) => {
             bgColor={"bg-[#0AABFF]"}
             bgHoverColor={"bg-transparent"}
             border={"border-none"}
-            paddingX={"p-3"}
-            paddingY={"p-3"}
+            paddingX={"p-1"}
+            paddingY={"p-0.5"}
             fontSize={"text-xs"}
             borderRadius={"rounded-sm"}
             icon={false}
@@ -54,10 +54,10 @@ const CardTrelloDesign = ({ circle, pictures }) => {
             bgColor={"bg-[#C7FF0A]"}
             bgHoverColor={"bg-transparent"}
             border={"border-none"}
-            paddingX={"p-3"}
-            paddingY={"p-3"}
+            paddingX={"p-1"}
+            paddingY={"p-0.5"}
             fontSize={"text-xs"}
-            borderRadius={"rounded-md"}
+            borderRadius={"rounded-sm"}
             icon={false}
             text={"بک اند"}
           />
@@ -91,12 +91,13 @@ const CardTrelloDesign = ({ circle, pictures }) => {
             titleColor="text-[#007987]"
             tagBgColor={"bg-[#06BACE33]"}
             border={"border-none"}
+            borderRadius={"rounded-sm"}
             iconWidth={"w-4"}
             marginRight="mr-0"
             marginLeft="ml-1"
             icon={clock}
-            paddingY={"p-2"}
-            paddingX={"p-2"}
+            paddingY={"p-1"}
+            paddingX={"p-1"}
           />
           <NewTagDesign
             title="12 از 13"
@@ -104,12 +105,13 @@ const CardTrelloDesign = ({ circle, pictures }) => {
             titleColor="text-[#FFB300]"
             tagBgColor={"bg-[#FFAA0033]"}
             border={"border-none"}
+            borderRadius={"rounded-sm"}
             iconWidth={"w-4"}
             marginRight="mr-0"
             marginLeft="ml-1"
             icon={nike}
-            paddingY={"p-2"}
-            paddingX={"p-2"}
+            paddingY={"p-1"}
+            paddingX={"p-1"}
           />
         </div>
       </div>
diff --git a/src/components/NewTagDesign/index.js b/src/components/NewTagDesign/index.js
index 527881a..5eaf895 100644
--- a/src/components/NewTagDesign/index.js
+++ b/src/components/NewTagDesign/index.js
@@ -10,6 +10,7 @@ const NewTagDesign = ({
   icon,
   fontSize,
   border,
+  borderRadius,
   iconWidth,
   marginRight,
   marginLeft,
@@ -19,7 +20,7 @@ const NewTagDesign = ({
 }) => {
   return (
     <button
-      className={`flex ${align} items-center rounded ${paddingY} ${paddingX} ${border} ${fontSize} ${titleColor} ${tagBorderColor} ${tagBgColor} `}
+      className={`flex ${align} items-center ${borderRadius} ${paddingY} ${paddingX} ${border} ${fontSize} ${titleColor} ${tagBorderColor} ${tagBgColor} `}
     >
       {title}
       {icon && (
@@ -41,6 +42,7 @@ NewTagDesign.defaultProps = {
   titleColor: "text-blue-600",
   tagBgColor: "bg-blue-300 bg-opacity-10",
   border: "border-2",
+  borderRadius: "rounded-full",
   tagBorderColor: "border-blue-600",
   fontSize: "text-xs",
   iconWidth: "w-2.5",