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

feat: added props

Browse Source
This commit is contained in:
원더 2021-01-08 22:19:10 +09:00
parent 9a5b6522ed
commit 07f2ee6966
1 changed files with 55 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
components/Tag.tsx
View File

@ -1,14 +1,58 @@
import Link from 'next/link' import Link from 'next/link'
const Tag = ({ href, text, circular=false, dark=false, marginBottom=2 }:LabelProps):JSX.Element => { const Tag = ({
return href ? <Link href={href}> blurple = false,
<a className={`text-base bg-little-white dark:bg-discord-black text-black dark:text-gray-400 ${circular ? 'rounded-3xl px-2.5 py-1.5' : 'rounded px-2 py-1'} mr-1 mb-${marginBottom} hover:bg-little-white-hover dark:hover:bg-discord-dark-hover`}>{text}</a> github = false,
</Link> : <a className={`text-base ${dark ? 'bg-little-white-hover dark:bg-very-black' : 'bg-little-white dark:bg-discord-black'} text-black dark:text-gray-400 ${circular ? 'rounded-3xl px-2.5 py-1.5' : 'rounded px-2 py-1'} mr-1 mb-${marginBottom}`}>{text}</a> href,
text,
className,
circular = false,
dark = false,
marginBottom = 2,
}: LabelProps): JSX.Element => {
return href ? (
<Link href={href}>
<a
className={`${className ?? ''} text-center text-base ${
dark
? blurple
? 'bg-discord-blurple'
: 'bg-little-white-hover dark:bg-very-black'
: github
? 'bg-gray-900 text-white'
: 'bg-little-white dark:bg-discord-black'
} ${!blurple && !github ? 'text-black dark:text-gray-400' : ''} ${
circular ? 'rounded-3xl px-2.5 py-1.5' : 'rounded px-2 py-1'
} mr-1 mb-${marginBottom} hover:bg-little-white-hover dark:hover:bg-discord-dark-hover`}
>
{text}
</a>
</Link>
) : (
<a
className={`${className ?? ''} text-center text-base ${
dark
? blurple
? 'font-bg text-white bg-discord-blurple text-black'
: github
? 'bg-gray-900 text-white'
: 'bg-little-white-hover dark:bg-very-black'
: 'bg-little-white dark:bg-discord-black'
} ${!blurple && !github ? 'text-black dark:text-gray-400' : ''} ${
circular ? 'rounded-3xl px-2.5 py-1.5' : 'rounded px-2 py-1'
} mr-1 mb-${marginBottom}`}
>
{text}
</a>
)
} }
interface LabelProps { interface LabelProps {
blurple?: boolean
github?: boolean
href?: string href?: string
text: string | JSX.Element | JSX.Element[] text: string | JSX.Element | JSX.Element[]
className?: string
icon?: string icon?: string
circular?: boolean circular?: boolean
dark?: boolean dark?: boolean