style(ui): add icon-only button sizing and fix action column alignment

2026-04-22 19:38:02 -04:00
parent 602b4f13cf
commit e2dd60843f
2 changed files with 10 additions and 3 deletions
@@ -31,6 +31,14 @@ const Button = ({
        md: 'px-[14px] py-[7px] text-[13px] gap-2',
        lg: 'px-6 py-3 text-base gap-2.5'
    };
+
+    const iconOnlySizes = {
+        sm: 'p-[6px] text-[12px]',
+        md: 'p-[7px] text-[13px]',
+        lg: 'p-3 text-base'
+    };
+
+    const isIconOnly = icon && !children;
    
    const iconSizes = {
        sm: 'w-3.5 h-3.5',
@@ -53,7 +61,7 @@ const Button = ({
            type={type}
            onClick={handleClick}
            disabled={disabled || loading}
-            className={`${baseClassName} ${variants[variant]} ${sizes[size]} ${className}`}
+            className={`${baseClassName} ${variants[variant]} ${isIconOnly ? iconOnlySizes[size] : sizes[size]} ${className}`}
            {...props}
        >
            {loading ? (