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.

PrimaryButton.tsx 1005B

12345678910111213141516171819202122232425262728293031323334353637383940
  1. 'use client';
  2. import React from 'react';
  3. import { Button } from 'antd';
  4. import classNames from 'classnames';
  5. type PrimaryButtonProps = {
  6. onClick?: () => void;
  7. children: React.ReactNode;
  8. customStyle?: string;
  9. outline?: boolean;
  10. };
  11. const PrimaryButton: React.FC<PrimaryButtonProps> = ({
  12. onClick = () => { },
  13. children,
  14. customStyle = '',
  15. outline = false,
  16. }: PrimaryButtonProps) => {
  17. const baseClasses = 'mt-2 !rounded-full !px-6 !py-4';
  18. const filledClasses = '!border-0 !bg-[#602FD0] !text-[#fff] hover:!bg-[#271550]';
  19. const outlineClasses = '!border !bg-[#fff] !text-[#602FD0] hover:!bg-[#602FD0] hover:!text-[#fff]';
  20. return (
  21. <Button
  22. size="small"
  23. className={classNames(
  24. baseClasses,
  25. outline ? outlineClasses : filledClasses,
  26. customStyle
  27. )}
  28. onClick={onClick}
  29. >
  30. {children}
  31. </Button>
  32. );
  33. };
  34. export default PrimaryButton;