Thream/website
Archived
2
2
Fork 0
Code Issues Pull Requests Releases Activity

feat: add guilds and channels CRUD (#14)

Browse Source
This commit is contained in:
Divlo
2022-03-05 18:22:30 +01:00
committed by GitHub
parent 9f56a10305
commit 780788d682
50 changed files with 6459 additions and 9039 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
components/design/Button/Button.tsx
View File

@ -2,18 +2,40 @@ import { forwardRef } from 'react'
import classNames from 'classnames'
const className =
'py-2 px-6 font-paragraph rounded-lg bg-transparent border border-green-800 dark:border-green-400 text-green-800 dark:text-green-400 hover:bg-green-800 hover:text-white dark:hover:bg-green-400 dark:hover:text-black fill-current stroke-current transform transition-colors duration-300 ease-in-out focus:outline-none focus:bg-green-800 focus:text-white dark:focus:bg-green-400 dark:focus:text-black'
'py-2 px-6 font-paragraph rounded-lg bg-transparent border hover:text-white dark:hover:text-black fill-current stroke-current transform transition-colors duration-300 ease-in-out focus:outline-none focus:text-white dark:focus:text-black'
export interface ButtonLinkProps extends React.ComponentPropsWithRef<'a'> {}
const classNameGreen =
'border-green-800 dark:border-green-400 text-green-800 dark:text-green-400 hover:bg-green-800 focus:bg-green-800 dark:focus:bg-green-400 dark:hover:bg-green-400'
const classNameRed =
'border-red-800 dark:border-red-400 text-red-800 dark:text-red-400 hover:bg-red-800 focus:bg-red-800 dark:focus:bg-red-400 dark:hover:bg-red-400'
export type ButtonColor = 'green' | 'red'
export interface ButtonLinkProps extends React.ComponentPropsWithRef<'a'> {
color?: ButtonColor
}
export const ButtonLink = forwardRef<HTMLAnchorElement, ButtonLinkProps>(
(props, reference) => {
const { children, className: givenClassName, ...rest } = props
const {
children,
className: givenClassName,
color = 'green',
...rest
} = props
return (
<a
ref={reference}
className={classNames(className, givenClassName)}
className={classNames(
className,
{
[classNameGreen]: color === 'green',
[classNameRed]: color === 'red'
},
givenClassName
)}
{...rest}
>
{children}
@ -24,13 +46,30 @@ export const ButtonLink = forwardRef<HTMLAnchorElement, ButtonLinkProps>(
ButtonLink.displayName = 'ButtonLink'
export interface ButtonProps extends React.ComponentPropsWithoutRef<'button'> {}
export interface ButtonProps extends React.ComponentPropsWithoutRef<'button'> {
color?: ButtonColor
}
export const Button: React.FC<ButtonProps> = (props) => {
const { children, className: givenClassName, ...rest } = props
const {
children,
className: givenClassName,
color = 'green',
...rest
} = props
return (
<button className={classNames(className, givenClassName)} {...rest}>
<button
className={classNames(
className,
{
[classNameGreen]: color === 'green',
[classNameRed]: color === 'red'
},
givenClassName
)}
{...rest}
>
{children}
</button>
)