wonderlandpark/core
2
1
Fork 0
mirror of https://github.com/koreanbots/core.git synced 2025-12-16 14:30:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: added button disabled

Browse Source
This commit is contained in:
wonderlandpark 2021-03-28 13:00:02 +09:00
parent 8f153a0d36
commit 93c250b62f
1 changed files with 6 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
components/Button.tsx
View File

@ -6,10 +6,11 @@ const Button = ({
className, className,
children, children,
href, href,
disabled=false,
onClick, onClick,
}: ButtonProps): JSX.Element => { }: ButtonProps): JSX.Element => {
return href ? ( return href ? (
<Link href={href}> <Link href={!disabled && href}>
<a <a
className={`cursor-pointer rounded-md px-4 py-2 m-1 transition duration-300 ease select-none outline-none foucs:outline-none ${className ?? className={`cursor-pointer rounded-md px-4 py-2 m-1 transition duration-300 ease select-none outline-none foucs:outline-none ${className ??
'bg-discord-blurple hover:opacity-80 dark:bg-very-black dark:hover:bg-discord-dark-hover text-white'}`} 'bg-discord-blurple hover:opacity-80 dark:bg-very-black dark:hover:bg-discord-dark-hover text-white'}`}
@ -19,8 +20,8 @@ const Button = ({
</Link> </Link>
) : onClick ? ( ) : onClick ? (
<button <button
type={type} type={disabled ? 'button' : type}
onClick={onClick} onClick={disabled ? null : onClick}
className={`cursor-pointer rounded-md px-4 py-2 m-0.5 transition duration-300 ease select-none outline-none foucs:outline-none ${className ?? className={`cursor-pointer rounded-md px-4 py-2 m-0.5 transition duration-300 ease select-none outline-none foucs:outline-none ${className ??
'bg-discord-blurple hover:opacity-80 dark:bg-very-black dark:hover:bg-discord-dark-hover text-white'}`} 'bg-discord-blurple hover:opacity-80 dark:bg-very-black dark:hover:bg-discord-dark-hover text-white'}`}
> >
@ -28,7 +29,7 @@ const Button = ({
</button> </button>
) : ( ) : (
<button <button
type={type} type={disabled ? 'button' : type}
className={`cursor-pointer rounded-md px-4 py-2 m-0.5 transition duration-300 ease select-none outline-none foucs:outline-none ${className ?? className={`cursor-pointer rounded-md px-4 py-2 m-0.5 transition duration-300 ease select-none outline-none foucs:outline-none ${className ??
'bg-discord-blurple hover:opacity-80 dark:bg-very-black dark:hover:bg-discord-dark-hover text-white'}`} 'bg-discord-blurple hover:opacity-80 dark:bg-very-black dark:hover:bg-discord-dark-hover text-white'}`}
> >
@ -42,6 +43,7 @@ interface ButtonProps {
className?: string className?: string
children: ReactNode children: ReactNode
href?: string href?: string
disabled?: boolean
onClick?: () => void onClick?: () => void
} }