You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
48 lines
1.1 KiB
48 lines
1.1 KiB
3 years ago
|
import React from "react";
|
||
|
|
||
|
import arrow from "../../assets/icons/white-left-arrow.svg";
|
||
|
|
||
|
const ButtonNewDesign = ({
|
||
|
bgColor,
|
||
|
bgHoverColor,
|
||
|
iconBgColor,
|
||
|
textColor,
|
||
|
border,
|
||
|
borderColor,
|
||
|
borderRadius,
|
||
|
fontSize,
|
||
|
padding,
|
||
|
icon,
|
||
|
buttonIcon,
|
||
|
}) => {
|
||
|
return (
|
||
|
<button
|
||
|
className={`w-fit h-fit flex items-center transiton duration-200 hover:bg-opacity-70 ${bgColor} ${bgHoverColor} ${textColor} ${border} ${borderColor} ${borderRadius} ${fontSize} ${padding}`}
|
||
|
>
|
||
|
اطلاعات بیشتر
|
||
|
{icon && (
|
||
|
<span className={`rounded-full mr-2 ${iconBgColor} `}>
|
||
|
<img src={buttonIcon} alt="" className="w-full" />
|
||
|
</span>
|
||
|
)}
|
||
|
</button>
|
||
|
);
|
||
|
};
|
||
|
|
||
|
export default ButtonNewDesign;
|
||
|
|
||
|
ButtonNewDesign.defaultProps = {
|
||
|
bgColor: "bg-darkGreenBg",
|
||
|
bgHoverColor: "hover:bg-gray-900",
|
||
|
iconBgColor: "bg-darkGreenBg",
|
||
|
textColor: "text-white",
|
||
|
border: "border-b-4",
|
||
|
borderColor: "border-lightBlueBorderColor",
|
||
|
borderRadius: "rounded",
|
||
|
fontSize: "text-sm",
|
||
|
padding: "p-4",
|
||
|
// icons
|
||
|
icon: true,
|
||
|
buttonIcon: arrow,
|
||
|
};
|