lms/resources/js/components/button-gradient-primary.tsx
2025-12-15 12:26:23 +01:00

37 lines
1.3 KiB
TypeScript

import { Button, ButtonProps } from '@/components/ui/button';
import { cn } from '@/lib/utils';
interface Props extends ButtonProps {
children: React.ReactNode;
containerClass?: string;
shadow?: boolean;
shadowClass?: string;
}
const ButtonGradientPrimary = ({ children, className, shadow = true, shadowClass, containerClass, ...props }: Props) => {
return (
<div className={cn('relative', containerClass)}>
{shadow && (
<div
className={cn(
"after:pointer-events-none after:absolute after:top-1/2 after:-left-7 after:h-[84px] after:w-[84px] after:-translate-y-1/2 after:rounded-full after:bg-[#E4CBA8A6] after:blur-[30px] after:content-[''] dark:after:bg-[#e4cba857]",
shadowClass,
)}
></div>
)}
<Button
className={cn(
'from-primary to-secondary-dark hover:from-secondary-dark hover:to-secondary-dark dark:from-secondary-dark dark:to-secondary-foreground dark:hover:from-secondary-dark dark:hover:to-secondary-dark relative z-10 h-auto bg-gradient-to-r px-5 py-2.5 text-white shadow-none',
className,
)}
{...props}
>
{children}
</Button>
</div>
);
};
export default ButtonGradientPrimary;