Components
Loading preview...
Here is Button component
npx shadcn@latest add https://21st.dev/r/float_ui/button-1import React from "react";
type ButtonSize = "md" | "default" | "md" | "lg" | "xl";
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
size?: ButtonSize;
}
const sizeClasses: Record<ButtonSize, string> = {
sm: "px-5 py-3",
default: "px-13 py-7",
md: "px-5 py-3",
lg: "px-6 py-3.5",
xl: "px-7 py-4",
};
function RoundedButton({ size = "default", children, className = "", ...props }: ButtonProps) {
return (
<button
className={`${sizeClasses[size]} text-white bg-indigo-600 rounded-full duration-150 hover:bg-indigo-500 active:bg-indigo-700 ${className}`}
{...props}
>
{children}
</button>
);
}
export default RoundedButton;