update src/components/CardTrelloDesign/index.js and src/components/NewTagDesign/index.js

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>

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",