PRIMITIVES
EXPORT
RESOURCES
PACKAGE BETA 1.0.5
Add and edit your component library
Use the Primary Link component for call to actions. Only use one primary link per page.
const commonClasses = "inline-flex items-center justify-center rounded px-3 py-1 font-bold focus:outline-none duration-500 sm:w-auto transition whitespace-nowrap";
const primaryClasses = classnames(
commonClasses,
"bg-gradient-primary hover:bg-gradient-primary-hover text-slate-1000 focus:ring-toxic-500 overflow-hidden"
);
export function PrimaryLink({ children, className, to, ...props }: LinkProps) {
return (
<Link to={to} className={classnames(primaryClasses, className)} {...props}>
{children}
</Link>
);
}