moon
/
soapbox
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Change className "icon-button" to use only Tailwind

This commit is contained in:
danidfra 2024-11-04 12:19:26 -03:00
parent 8e3d89ea75
commit 19160af7df
1 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/icon-button.tsx
View File

@ -66,9 +66,9 @@ const IconButton: React.FC<IIconButton> = ({
} }
}; };
const classes = clsx(className, 'icon-button', { const classes = clsx(className, 'inline-flex cursor-pointer items-center border-0 bg-transparent p-0 text-black opacity-40 transition-opacity duration-100 ease-in hover:opacity-60 hover:transition-colors hover:duration-200 focus:opacity-60 focus:outline-none focus:transition-colors focus:duration-200 dark:text-white', {
active, 'opacity-60 outline-none transition-colors duration-200': active,
disabled, 'opacity-20 cursor-default': disabled,
}); });
return ( return (
@ -89,10 +89,10 @@ const IconButton: React.FC<IIconButton> = ({
disabled={disabled} disabled={disabled}
type='button' type='button'
> >
<div> <div className='flex items-center justify-center'>
<Icon className={iconClassName} src={src} aria-hidden='true' /> <Icon className={iconClassName} src={src} aria-hidden='true' />
</div> </div>
{text && <span className='icon-button__text'>{text}</span>} {text && <span className='pl-0.5'>{text}</span>}
</button> </button>
); );
}; };