datahub/site/components/ButtonLink.tsx

27 lines
753 B
TypeScript

import Link from 'next/link';
export default function ButtonLink({
style = 'primary',
className = '',
href = '',
children,
}) {
let styleClassName = '';
if (style == 'primary') {
styleClassName = 'text-primary bg-blue-400 hover:bg-blue-300';
} else if (style == 'secondary') {
styleClassName =
'text-secondary border !border-secondary hover:text-primary hover:bg-blue-300';
}
return (
<Link
href={href}
className={`inline-block h-12 px-6 py-3 border border-transparent text-base font-medium rounded-md focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-sky-300/50 active:bg-sky-500 ${styleClassName} ${className}`}
>
{children}
</Link>
);
}