49 lines
1.2 KiB
TypeScript
49 lines
1.2 KiB
TypeScript
// app/components/HeroButton.tsx
|
|
|
|
import Link from 'next/link';
|
|
import React from 'react';
|
|
|
|
interface HeroButtonProps {
|
|
href?: string;
|
|
onClick?: () => void;
|
|
children: React.ReactNode;
|
|
className?: string;
|
|
}
|
|
|
|
export default function HeroButton({ href, onClick, children, className = "" }: HeroButtonProps) {
|
|
const baseStyles = `
|
|
text-[#406185] bg-white border-none py-3.5 px-7.5
|
|
text-center font-bold uppercase w-fit text-[1.1rem]
|
|
transition-all duration-300 hover:scale-105 active:scale-95
|
|
shadow-md hover:shadow-lg cursor-pointer inline-block
|
|
${className}
|
|
`;
|
|
|
|
if (onClick) {
|
|
return (
|
|
<button onClick={onClick} className={baseStyles}>
|
|
{children}
|
|
</button>
|
|
);
|
|
}
|
|
|
|
if (href) {
|
|
const isExternal = href.startsWith('http');
|
|
|
|
if (isExternal) {
|
|
return (
|
|
<a href={href} target="_blank" rel="noreferrer" className={baseStyles}>
|
|
{children}
|
|
</a>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<Link href={href} className={baseStyles}>
|
|
{children}
|
|
</Link>
|
|
);
|
|
}
|
|
|
|
return null;
|
|
} |