Enhance layout

This commit is contained in:
decolua 2026-01-31 12:58:04 +07:00
parent 8c37b39eed
commit 8897df5036
23 changed files with 458 additions and 326 deletions

View file

@ -3,17 +3,17 @@
import { cn } from "@/shared/utils/cn";
const variants = {
primary: "bg-primary text-white hover:bg-primary-hover shadow-warm",
secondary: "bg-surface border border-border text-text-main hover:bg-black/5 shadow-sm",
outline: "border border-border text-text-main hover:bg-black/5",
ghost: "text-text-muted hover:bg-black/5 hover:text-text-main",
primary: "bg-gradient-to-b from-primary to-primary-hover text-white shadow-sm",
secondary: "bg-white dark:bg-white/10 border border-black/10 dark:border-white/10 text-text-main hover:bg-black/5 dark:hover:bg-white/5",
outline: "border border-black/15 dark:border-white/15 text-text-main hover:bg-black/5",
ghost: "text-text-muted hover:bg-black/5 dark:hover:bg-white/5 hover:text-text-main",
danger: "bg-red-500 text-white hover:bg-red-600 shadow-sm",
};
const sizes = {
sm: "h-8 px-3 text-xs rounded-md",
md: "h-10 px-5 text-sm rounded-lg",
lg: "h-12 px-8 text-base rounded-xl",
sm: "h-7 px-3 text-xs rounded-md",
md: "h-9 px-4 text-sm rounded-lg",
lg: "h-11 px-6 text-sm rounded-lg",
};
export default function Button({
@ -32,7 +32,7 @@ export default function Button({
<button
className={cn(
"inline-flex items-center justify-center gap-2 font-medium transition-all duration-200 cursor-pointer",
"active:scale-[0.98] disabled:opacity-50 disabled:cursor-not-allowed disabled:active:scale-100",
"active:scale-[0.99] disabled:opacity-50 disabled:cursor-not-allowed disabled:active:scale-100",
variants[variant],
sizes[size],
fullWidth && "w-full",