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

feat: https://github.com/koreanbots/v2-testing/issues/12

Browse Source
This commit is contained in:
원더 2021-01-14 13:27:08 +09:00
parent 33ebfde010
commit 35854d2f79
3 changed files with 66 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
components/Tooltip.tsx Normal file
View File

@ -0,0 +1,43 @@
import Link from 'next/link'
const Tooltip = ({ href, size='small', children, direction='center', text }:TooltipProps):JSX.Element => {
return href ? <Link href={href}>
<a className='inline'>
<div className='relative py-3 inline'>
<div className='group cursor-pointer relative inline-block text-center'>{children}
<div className={`opacity-0 ${size==='small' ? 'w-44' : 'w-60'} bg-black text-white text-center text-xs rounded-lg py-2 px-3 absolute z-10 group-hover:opacity-100 bottom-full -left-4 pointer-events-none`}>
{text}
{
direction === 'left' ? <svg className='absolute text-black h-2 left-5 mr-3 top-full' x='0px' y='0px' viewBox='0 0 255 255' xmlSpace='preserve'><polygon className='fill-current' points='0,0 127.5,127.5 255,0'/></svg>
: direction === 'center' ? <svg className='absolute text-black h-2 w-full left-0 top-full' x='0px' y='0px' viewBox='0 0 255 255' xmlSpace='preserve'><polygon className='fill-current' points='0,0 127.5,127.5 255,0'/></svg>
: <svg className='absolute text-black h-2 right-5 mr-3 top-full' x='0px' y='0px' viewBox='0 0 255 255' xmlSpace='preserve'><polygon className='fill-current' points='0,0 127.5,127.5 255,0'/></svg>
}
</div>
</div>
</div>
</a>
</Link> : <a className='inline'>
<div className='relative py-3 inline'>
<div className='group cursor-pointer relative inline-block text-center'>{children}
<div className={`opacity-0 ${size==='small' ? 'w-44' : 'w-60'} bg-black text-white text-center text-xs rounded-lg py-2 px-3 absolute z-10 group-hover:opacity-100 bottom-full -left-4 pointer-events-none`}>
{text}
{
direction === 'left' ? <svg className='absolute text-black h-2 left-5 mr-3 top-full' x='0px' y='0px' viewBox='0 0 255 255' xmlSpace='preserve'><polygon className='fill-current' points='0,0 127.5,127.5 255,0'/></svg>
: direction === 'center' ? <svg className='absolute text-black h-2 w-full left-0 top-full' x='0px' y='0px' viewBox='0 0 255 255' xmlSpace='preserve'><polygon className='fill-current' points='0,0 127.5,127.5 255,0'/></svg>
: <svg className='absolute text-black h-2 right-5 mr-3 top-full' x='0px' y='0px' viewBox='0 0 255 255' xmlSpace='preserve'><polygon className='fill-current' points='0,0 127.5,127.5 255,0'/></svg>
}
</div>
</div>
</div>
</a>
}
interface TooltipProps {
href?: string
size?: 'small' | 'large'
direction?: 'left' | 'center' | 'right'
text: string
children: JSX.Element | JSX.Element[]
}
export default Tooltip

19
pages/bots/[id].tsx
View File

@ -18,6 +18,7 @@ import { Query } from '../../utils'
import { formatNumber } from '../../utils/Tools'
import Advertisement from '../../components/Advertisement'
import Link from 'next/link'
import Tooltip from '../../components/Tooltip'
const Bots: NextPage<BotsProps> = ({ data, date }) => {
if (!data || !data.id) return <NotFound />
@ -55,9 +56,11 @@ const Bots: NextPage<BotsProps> = ({ data, date }) => {
<h1 className='mb-2 mt-3 text-4xl font-bold'>
{data.name}{' '}
{data.trusted ? (
<span className='text-koreanbots-blue text-3xl'>
<i className='fas fa-award' />
</span>
<Tooltip text='해당봇은 한국 디스코드봇 리스트에서 엄격한 기준을 통과한 봇입니다!' direction='left' size='large' href='/verification'>
<span className='text-koreanbots-blue text-3xl'>
<i className='fas fa-award' />
</span>
</Tooltip>
) : ''}
</h1>
</div>
@ -105,10 +108,12 @@ const Bots: NextPage<BotsProps> = ({ data, date }) => {
</div>
<div>{Day(date).fromNow(false)}</div>
{
data.verified ?
<div>
<i className='fas fa-check text-discord-blurple' /> 디스코드 인증됨
</div>
data.verified ?
<Tooltip direction='left' text='해당 봇은 디스코드측에서 인증된 봇입니다.'>
<div>
<i className='fas fa-check text-discord-blurple' /> 디스코드 인증됨
</div>
</Tooltip>
: ''
}
</div>

17
pages/users/[id].tsx
View File

@ -14,6 +14,7 @@ import BotCard from '../../components/BotCard'
import Tag from '../../components/Tag'
import { checkPerm } from '../../utils/Tools'
import Advertisement from '../../components/Advertisement'
import Tooltip from '../../components/Tooltip'
const Users: NextPage<UserProps> = ({ data }) => {
if (!data.id) return <NotFound />
return (
@ -48,14 +49,18 @@ const Users: NextPage<UserProps> = ({ data }) => {
<br />
<div className='badges flex'>
{checkPerm(data.perm, 'staff') && (
<div className='pr-5 text-koreanbots-blue text-2xl'>
<i className='fas fa-hammer' />
</div>
<Tooltip text='한국 디스코드봇 리스트 스탭입니다.' direction='left'>
<div className='pr-5 text-koreanbots-blue text-2xl'>
<i className='fas fa-hammer' />
</div>
</Tooltip>
)}
{checkPerm(data.perm, 'bughunter') && (
<div className='pr-5 text-green-500 text-2xl'>
<i className='fas fa-bug' />
</div>
<Tooltip text='버그를 많이 제보해주신 분입니다.' direction='left'>
<div className='pr-5 text-green-500 text-2xl'>
<i className='fas fa-bug' />
</div>
</Tooltip>
)}
</div>
<br />