mirror of
https://github.com/Monadical-SAS/reflector.git
synced 2026-04-13 00:36:54 +00:00
adding app v2 (#943)
This commit is contained in:
29
www/appv2/src/components/ui/Button.tsx
Normal file
29
www/appv2/src/components/ui/Button.tsx
Normal file
@@ -0,0 +1,29 @@
|
||||
import React from 'react';
|
||||
|
||||
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
||||
variant?: 'primary' | 'secondary' | 'tertiary';
|
||||
}
|
||||
|
||||
export const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
|
||||
({ variant = 'primary', className = '', children, ...props }, ref) => {
|
||||
const baseStyles = 'rounded-sm px-5 py-2.5 font-sans font-semibold text-sm transition-all duration-200';
|
||||
|
||||
const variants = {
|
||||
primary: 'bg-gradient-primary text-on-primary border-none hover:brightness-110 active:brightness-95',
|
||||
secondary: 'bg-transparent border-[1.5px] border-primary text-primary hover:bg-primary/5',
|
||||
tertiary: 'bg-transparent border-none text-primary hover:bg-surface-mid',
|
||||
};
|
||||
|
||||
return (
|
||||
<button
|
||||
ref={ref}
|
||||
className={`${baseStyles} ${variants[variant]} ${className}`}
|
||||
{...props}
|
||||
>
|
||||
{children}
|
||||
</button>
|
||||
);
|
||||
}
|
||||
);
|
||||
|
||||
Button.displayName = 'Button';
|
||||
Reference in New Issue
Block a user