initial design fix

2026-04-22 21:26:59 -05:00
parent 874cbfb6a8
commit 0d44d2cd90
45 changed files with 3509 additions and 84 deletions
@@ -0,0 +1,34 @@
+import { Loader2 } from 'lucide-react';
+
+interface Props extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+  variant?: 'primary' | 'secondary' | 'ghost' | 'danger';
+  size?: 'sm' | 'md';
+  loading?: boolean;
+}
+
+const base = 'inline-flex items-center gap-2 font-medium rounded-lg transition-all duration-150 disabled:opacity-50 disabled:cursor-not-allowed';
+
+const variants = {
+  primary: 'bg-[var(--accent)] hover:opacity-90 text-white',
+  secondary: 'bg-white/5 hover:bg-white/10 text-white border border-border',
+  ghost: 'hover:bg-white/5 text-muted hover:text-white',
+  danger: 'bg-red-500/10 hover:bg-red-500/20 text-red-400 border border-red-500/20',
+};
+
+const sizes = {
+  sm: 'px-3 py-1.5 text-sm',
+  md: 'px-4 py-2 text-sm',
+};
+
+export default function Button({ variant = 'primary', size = 'md', loading, children, disabled, ...props }: Props) {
+  return (
+    <button
+      {...props}
+      disabled={disabled || loading}
+      className={`${base} ${variants[variant]} ${sizes[size]} ${props.className || ''}`}
+    >
+      {loading && <Loader2 size={14} className="animate-spin" />}
+      {children}
+    </button>
+  );
+}