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

style: lint

Browse Source
This commit is contained in:
원더 2021-01-10 13:19:06 +09:00
parent ddf7f09df6
commit 4156ae6149
20 changed files with 259 additions and 258 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.eslintrc.js
View File

@ -27,6 +27,7 @@ module.exports = {
'@typescript-eslint' '@typescript-eslint'
], ],
rules: { rules: {
'jsx-quotes': ['error', 'prefer-single'],
'react/no-unescaped-entities': 'off', 'react/no-unescaped-entities': 'off',
'react/prop-types': 'off', 'react/prop-types': 'off',
'react/react-in-jsx-scope': 'off', 'react/react-in-jsx-scope': 'off',

14
components/Advertisement.tsx
View File

@ -2,17 +2,17 @@ const Advertisement = (): JSX.Element => {
if (process.env.NODE_ENV === 'production') if (process.env.NODE_ENV === 'production')
return ( return (
<ins <ins
className="adsbygoogle mb-5 w-full" className='adsbygoogle mb-5 w-full'
style={{ display: 'block' }} style={{ display: 'block' }}
data-ad-client="ca-pub-4856582423981759" data-ad-client='ca-pub-4856582423981759'
data-ad-slot="3250141451" data-ad-slot='3250141451'
data-ad-format="auto" data-ad-format='auto'
data-adtest="on" data-adtest='on'
data-full-width-responsive="true" data-full-width-responsive='true'
></ins> ></ins>
) )
else else
return <div className="my-5 py-12 w-full text-center text-white bg-gray-700">Advertisement</div> return <div className='my-5 py-12 w-full text-center text-white bg-gray-700'>Advertisement</div>
} }
export default Advertisement export default Advertisement

48
components/BotCard.tsx
View File

@ -7,47 +7,47 @@ import Link from 'next/link'
const BotCard = ({ bot }: BotProps): JSX.Element => { const BotCard = ({ bot }: BotProps): JSX.Element => {
return ( return (
<div className="container mb-20"> <div className='container mb-20'>
<div className="relative"> <div className='relative'>
<div className="container mx-auto"> <div className='container mx-auto'>
<div className="h-full"> <div className='h-full'>
<div className="relative mx-auto h-full text-black dark:text-white dark:bg-discord-black bg-little-white rounded-2xl shadow-xl"> <div className='relative mx-auto h-full text-black dark:text-white dark:bg-discord-black bg-little-white rounded-2xl shadow-xl'>
<div className="flex mb-16 h-48"> <div className='flex mb-16 h-48'>
<div className="w-2/3"> <div className='w-2/3'>
<div className="flex justify-start"> <div className='flex justify-start'>
<img <img
alt="Avatar" alt='Avatar'
src={ src={
bot.avatar bot.avatar
? `https://cdn.discordapp.com/avatars/${bot.id}/${bot.avatar}.png?size=1024` ? `https://cdn.discordapp.com/avatars/${bot.id}/${bot.avatar}.png?size=1024`
: `https://cdn.discordapp.com/embed/avatars/${Number(bot.tag) % : `https://cdn.discordapp.com/embed/avatars/${Number(bot.tag) %
5}.png?size=1024` 5}.png?size=1024`
} }
className="rounded-full absolute -left-2 -top-8 mx-auto w-32 h-32 bg-white" className='rounded-full absolute -left-2 -top-8 mx-auto w-32 h-32 bg-white'
/> />
</div> </div>
<div className="mt-28 px-4"> <div className='mt-28 px-4'>
<h2 className="px-1 text-sm"> <h2 className='px-1 text-sm'>
<i className={`fas fa-circle text-${Status[bot.status]?.color}`} /> <i className={`fas fa-circle text-${Status[bot.status]?.color}`} />
{Status[bot.status]?.text} {Status[bot.status]?.text}
</h2> </h2>
<h1 className="mb-3 text-left text-2xl font-bold truncate"> <h1 className='mb-3 text-left text-2xl font-bold truncate'>
{bot.name}{' '} {bot.name}{' '}
{bot.trusted ? ( {bot.trusted ? (
<span className="text-koreanbots-blue text-3xl"> <span className='text-koreanbots-blue text-3xl'>
<i className="fas fa-award" /> <i className='fas fa-award' />
</span> </span>
) : ''} ) : ''}
</h1> </h1>
<p className="text-left text-gray-400 text-sm font-medium">{bot.intro}</p> <p className='text-left text-gray-400 text-sm font-medium'>{bot.intro}</p>
</div> </div>
</div> </div>
<div className="grid grid-cols-1 pr-5 py-5 w-1/3 h-0"> <div className='grid grid-cols-1 pr-5 py-5 w-1/3 h-0'>
<Tag <Tag
text={ text={
<> <>
<i className="fas fa-heart text-red-600" /> {formatNumber(bot.votes)} <i className='fas fa-heart text-red-600' /> {formatNumber(bot.votes)}
</> </>
} }
dark dark
@ -55,30 +55,30 @@ const BotCard = ({ bot }: BotProps): JSX.Element => {
<Tag blurple text={<>{formatNumber(bot.servers)} 서버</>} dark /> <Tag blurple text={<>{formatNumber(bot.servers)} 서버</>} dark />
</div> </div>
</div> </div>
<div className="category px-2 flex flex-wrap"> <div className='category px-2 flex flex-wrap'>
{bot.category.slice(0, 5).map(el => ( {bot.category.slice(0, 5).map(el => (
<Tag key={el} text={el} href={`/categories/${el}`} dark/> <Tag key={el} text={el} href={`/categories/${el}`} dark/>
))} ))}
</div> </div>
<Divider /> <Divider />
<div className="flex justify-evenly"> <div className='flex justify-evenly'>
<Link <Link
href={`/bots/${ href={`/bots/${
(bot.partnered || bot.trusted) && bot.vanity ? bot.vanity : bot.id (bot.partnered || bot.trusted) && bot.vanity ? bot.vanity : bot.id
}`} }`}
> >
<a className="rounded-bl-2xl py-3 w-full text-center text-koreanbots-blue hover:text-white text-sm font-bold hover:bg-koreanbots-blue hover:shadow-lg"> <a className='rounded-bl-2xl py-3 w-full text-center text-koreanbots-blue hover:text-white text-sm font-bold hover:bg-koreanbots-blue hover:shadow-lg'>
보기 보기
</a> </a>
</Link> </Link>
<a <a
rel="noopener noreferrer" rel='noopener noreferrer'
target="_blank" target='_blank'
href={ href={
bot.url ?? bot.url ??
`https://discordapp.com/oauth2/authorize?client_id=${bot.id}&scope=bot&permissions=0` `https://discordapp.com/oauth2/authorize?client_id=${bot.id}&scope=bot&permissions=0`
} }
className="rounded-br-2xl py-3 w-full text-center text-discord-blurple hover:text-white text-sm font-bold hover:bg-discord-blurple hover:shadow-lg" className='rounded-br-2xl py-3 w-full text-center text-discord-blurple hover:text-white text-sm font-bold hover:bg-discord-blurple hover:shadow-lg'
> >
초대하기 초대하기
</a> </a>

2
components/DiscordImage.tsx
View File

@ -17,7 +17,7 @@ const DiscordImage = (props: {
} }
width={props.size || 256} width={props.size || 256}
height={props.size || 256} height={props.size || 256}
data-fallback-image="/img/default.png" data-fallback-image='/img/default.png'
/> />
) )
} }

14
components/Docs.tsx
View File

@ -4,22 +4,22 @@ import Wave from './Wave'
const Docs = ({ header, description, subheader, children }: DocsProps): JSX.Element => { const Docs = ({ header, description, subheader, children }: DocsProps): JSX.Element => {
return ( return (
<> <>
<div className="dark:bg-discord-black bg-discord-blurple"> <div className='dark:bg-discord-black bg-discord-blurple'>
<Container className="pb-28 pt-20" ignoreColor> <Container className='pb-28 pt-20' ignoreColor>
<h1 className="mt-10 text-center text-gray-100 text-4xl font-bold sm:text-left"> <h1 className='mt-10 text-center text-gray-100 text-4xl font-bold sm:text-left'>
{header} {header}
</h1> </h1>
<h2 className="mt-5 text-center text-gray-200 text-2xl font-medium sm:text-left"> <h2 className='mt-5 text-center text-gray-200 text-2xl font-medium sm:text-left'>
{description} {description}
</h2> </h2>
<h2 className="mt-5 text-center text-gray-200 text-2xl font-medium sm:text-left"> <h2 className='mt-5 text-center text-gray-200 text-2xl font-medium sm:text-left'>
{subheader} {subheader}
</h2> </h2>
</Container> </Container>
</div> </div>
<Wave <Wave
color="currentColor" color='currentColor'
className="dark:text-discord-black text-discord-blurple dark:bg-discord-dark bg-white" className='dark:text-discord-black text-discord-blurple dark:bg-discord-dark bg-white'
/> />
<Container> <Container>
<div>{children}</div> <div>{children}</div>

68
components/Footer.tsx
View File

@ -4,65 +4,65 @@ import Wave from './Wave'
const Footer = (): JSX.Element => { const Footer = (): JSX.Element => {
return ( return (
<div className="releative"> <div className='releative'>
<Wave color="currentColor" className="dark:text-discord-dark text-white bg-discord-black" /> <Wave color='currentColor' className='dark:text-discord-dark text-white bg-discord-black' />
<div className="bottom-0 text-white bg-discord-black"> <div className='bottom-0 text-white bg-discord-black'>
<Container className="pb-20 pt-10 w-11/12 lg:flex lg:pt-0 lg:w-3/5" ignoreColor> <Container className='pb-20 pt-10 w-11/12 lg:flex lg:pt-0 lg:w-3/5' ignoreColor>
<div className="w-full lg:flex-grow"> <div className='w-full lg:flex-grow'>
<h1 className="text-koreanbots-blue text-3xl font-extrabold">국내봇을 한 곳에서.</h1> <h1 className='text-koreanbots-blue text-3xl font-extrabold'>국내봇을 한 곳에서.</h1>
<span className="text-base">2020 Koreanbots, All rights reserved.</span> <span className='text-base'>2020 Koreanbots, All rights reserved.</span>
<div className="text-2xl"> <div className='text-2xl'>
<Link href="/discord"> <Link href='/discord'>
<a className="mr-2"> <a className='mr-2'>
<i className="fab fa-discord" /> <i className='fab fa-discord' />
</a> </a>
</Link> </Link>
<a href="https://github.com/koreanbots" className="mr-2"> <a href='https://github.com/koreanbots' className='mr-2'>
<i className="fab fa-github" /> <i className='fab fa-github' />
</a> </a>
</div> </div>
</div> </div>
<div className="flex-col mb-2 w-full lg:w-1/3"> <div className='flex-col mb-2 w-full lg:w-1/3'>
<h2 className="text-koreanbots-blue text-base font-bold">한국 디스코드봇 리스트</h2> <h2 className='text-koreanbots-blue text-base font-bold'>한국 디스코드봇 리스트</h2>
<ul className="text-sm"> <ul className='text-sm'>
<li> <li>
<Link href="/about"> <Link href='/about'>
<a className="hover:text-gray-300">소개</a> <a className='hover:text-gray-300'>소개</a>
</Link> </Link>
</li> </li>
<li> <li>
<Link href="/api"> <Link href='/api'>
<a className="hover:text-gray-300">API</a> <a className='hover:text-gray-300'>API</a>
</Link> </Link>
</li> </li>
</ul> </ul>
</div> </div>
<div className="flex-col mb-2 w-full lg:w-1/5"> <div className='flex-col mb-2 w-full lg:w-1/5'>
<h2 className="text-koreanbots-blue text-base font-bold">커뮤니티</h2> <h2 className='text-koreanbots-blue text-base font-bold'>커뮤니티</h2>
<ul className="text-sm"> <ul className='text-sm'>
<li> <li>
<Link href="/partners"> <Link href='/partners'>
<a className="hover:text-gray-300">파트너</a> <a className='hover:text-gray-300'>파트너</a>
</Link> </Link>
</li> </li>
<li> <li>
<Link href="/verification"> <Link href='/verification'>
<a className="hover:text-gray-300">인증</a> <a className='hover:text-gray-300'>인증</a>
</Link> </Link>
</li> </li>
</ul> </ul>
</div> </div>
<div className="flex-col mb-2 w-full lg:w-1/5"> <div className='flex-col mb-2 w-full lg:w-1/5'>
<h2 className="text-koreanbots-blue text-base font-bold">약관</h2> <h2 className='text-koreanbots-blue text-base font-bold'>약관</h2>
<ul className="text-sm"> <ul className='text-sm'>
<li> <li>
<Link href="/privacy"> <Link href='/privacy'>
<a className="hover:text-gray-300">개인정보취급방침</a> <a className='hover:text-gray-300'>개인정보취급방침</a>
</Link> </Link>
</li> </li>
<li> <li>
<Link href="/guidelines"> <Link href='/guidelines'>
<a className="hover:text-gray-300">가이드라인</a> <a className='hover:text-gray-300'>가이드라인</a>
</Link> </Link>
</li> </li>
</ul> </ul>

4
components/LongButton.tsx
View File

@ -3,8 +3,8 @@ import Link from 'next/link'
const LongButton = ({ children, newTab=false, href, onClick, center=false }:LongButtonProps):JSX.Element => { const LongButton = ({ children, newTab=false, href, onClick, center=false }:LongButtonProps):JSX.Element => {
if(href) { if(href) {
if(newTab) return <a href={href} rel="noopener noreferrer" if(newTab) return <a href={href} rel='noopener noreferrer'
target="_blank"> target='_blank'>
<div className={`${center ? 'justify-center ': '' }text-base bg-little-white dark:bg-discord-black text-black dark:text-gray-400 rounded flex hover:bg-little-white-hover dark:hover:bg-discord-dark-hover cursor-pointer px-4 py-4 mb-1`}> <div className={`${center ? 'justify-center ': '' }text-base bg-little-white dark:bg-discord-black text-black dark:text-gray-400 rounded flex hover:bg-little-white-hover dark:hover:bg-discord-dark-hover cursor-pointer px-4 py-4 mb-1`}>
{children} {children}
</div> </div>

108
components/Navbar.tsx
View File

@ -5,57 +5,57 @@ const Navbar = (): JSX.Element => {
const [navbarOpen, setNavbarOpen] = useState<boolean>(false) const [navbarOpen, setNavbarOpen] = useState<boolean>(false)
return ( return (
<> <>
<nav className="fixed z-40 top-0 flex flex-wrap items-center justify-between px-2 py-3 w-full text-gray-100 dark:bg-discord-black bg-discord-blurple bg-transparent lg:absolute"> <nav className='fixed z-40 top-0 flex flex-wrap items-center justify-between px-2 py-3 w-full text-gray-100 dark:bg-discord-black bg-discord-blurple bg-transparent lg:absolute'>
<div className="container flex flex-wrap items-center justify-between mx-auto px-4"> <div className='container flex flex-wrap items-center justify-between mx-auto px-4'>
<div className="relative static block flex justify-between w-full lg:justify-start lg:w-auto"> <div className='relative static block flex justify-between w-full lg:justify-start lg:w-auto'>
<a <a
className="logofont text-large whitespace-no-wrap inline-block mr-4 py-2 hover:text-gray-300 font-semibold leading-relaxed uppercase sm:text-2xl" className='logofont text-large whitespace-no-wrap inline-block mr-4 py-2 hover:text-gray-300 font-semibold leading-relaxed uppercase sm:text-2xl'
href="/" href='/'
> >
KOREANBOTS KOREANBOTS
</a> </a>
<button <button
className="block px-3 py-1 dark:text-gray-200 text-xl leading-none bg-transparent border border-solid border-transparent rounded outline-none focus:outline-none cursor-pointer lg:hidden" className='block px-3 py-1 dark:text-gray-200 text-xl leading-none bg-transparent border border-solid border-transparent rounded outline-none focus:outline-none cursor-pointer lg:hidden'
type="button" type='button'
onClick={() => setNavbarOpen(!navbarOpen)} onClick={() => setNavbarOpen(!navbarOpen)}
> >
<i className={`fas ${!navbarOpen ? 'fa-bars' : 'fa-times'}`}></i> <i className={`fas ${!navbarOpen ? 'fa-bars' : 'fa-times'}`}></i>
</button> </button>
</div> </div>
<div className="hidden flex-grow items-center bg-white lg:flex lg:bg-transparent lg:shadow-none"> <div className='hidden flex-grow items-center bg-white lg:flex lg:bg-transparent lg:shadow-none'>
<ul className="flex flex-col list-none lg:flex-row lg:ml-auto"> <ul className='flex flex-col list-none lg:flex-row lg:ml-auto'>
<li className="flex items-center"> <li className='flex items-center'>
<a <a
href="/discord" href='/discord'
className="lg:hover:text-gray-300 flex items-center px-3 py-4 w-full hover:text-gray-500 text-gray-700 text-sm font-semibold sm:w-auto lg:py-2 lg:text-gray-100" className='lg:hover:text-gray-300 flex items-center px-3 py-4 w-full hover:text-gray-500 text-gray-700 text-sm font-semibold sm:w-auto lg:py-2 lg:text-gray-100'
> >
디스코드 디스코드
</a> </a>
</li> </li>
<li className="flex items-center"> <li className='flex items-center'>
<Link href="/about"> <Link href='/about'>
<a className="lg:hover:text-gray-300 flex items-center px-3 py-4 w-full hover:text-gray-500 text-gray-700 text-sm font-semibold sm:w-auto lg:py-2 lg:text-gray-100"> <a className='lg:hover:text-gray-300 flex items-center px-3 py-4 w-full hover:text-gray-500 text-gray-700 text-sm font-semibold sm:w-auto lg:py-2 lg:text-gray-100'>
소개 소개
</a> </a>
</Link> </Link>
</li> </li>
<li className="flex items-center"> <li className='flex items-center'>
<Link href="/api"> <Link href='/api'>
<a className="lg:hover:text-gray-300 flex items-center px-3 py-4 w-full hover:text-gray-500 text-gray-700 text-sm font-semibold sm:w-auto lg:py-2 lg:text-gray-100"> <a className='lg:hover:text-gray-300 flex items-center px-3 py-4 w-full hover:text-gray-500 text-gray-700 text-sm font-semibold sm:w-auto lg:py-2 lg:text-gray-100'>
API API
</a> </a>
</Link> </Link>
</li> </li>
<li className="flex items-center"> <li className='flex items-center'>
<Link href="/addbot"> <Link href='/addbot'>
<a className="lg:hover:text-gray-300 flex items-center px-3 py-4 w-full hover:text-gray-500 text-gray-700 text-sm font-semibold sm:w-auto lg:py-2 lg:text-gray-100"> <a className='lg:hover:text-gray-300 flex items-center px-3 py-4 w-full hover:text-gray-500 text-gray-700 text-sm font-semibold sm:w-auto lg:py-2 lg:text-gray-100'>
봇 추가하기 봇 추가하기
</a> </a>
</Link> </Link>
</li> </li>
<li className="flex items-center"> <li className='flex items-center'>
<Link href="/api/auth/discord"> <Link href='/api/auth/discord'>
<a className="lg:hover:text-gray-300 flex items-center px-3 py-4 w-full hover:text-gray-500 text-gray-700 text-sm font-semibold sm:w-auto lg:py-2 lg:text-gray-100"> <a className='lg:hover:text-gray-300 flex items-center px-3 py-4 w-full hover:text-gray-500 text-gray-700 text-sm font-semibold sm:w-auto lg:py-2 lg:text-gray-100'>
로그인 로그인
</a> </a>
</Link> </Link>
@ -69,55 +69,55 @@ const Navbar = (): JSX.Element => {
navbarOpen ? 'block' : 'hidden' navbarOpen ? 'block' : 'hidden'
}`} }`}
> >
<nav className="mt-20"> <nav className='mt-20'>
<Link href="/about"> <Link href='/about'>
<a className="flex items-center px-8 py-2 text-gray-100 hover:text-gray-300"> <a className='flex items-center px-8 py-2 text-gray-100 hover:text-gray-300'>
<svg <svg
className="w-5 h-5" className='w-5 h-5'
viewBox="0 0 24 24" viewBox='0 0 24 24'
fill="none" fill='none'
xmlns="http://www.w3.org/2000/svg" xmlns='http://www.w3.org/2000/svg'
> >
<path <path
d="M19 11H5M19 11C20.1046 11 21 11.8954 21 13V19C21 20.1046 20.1046 21 19 21H5C3.89543 21 3 20.1046 3 19V13C3 11.8954 3.89543 11 5 11M19 11V9C19 7.89543 18.1046 7 17 7M5 11V9C5 7.89543 5.89543 7 7 7M7 7V5C7 3.89543 7.89543 3 9 3H15C16.1046 3 17 3.89543 17 5V7M7 7H17" d='M19 11H5M19 11C20.1046 11 21 11.8954 21 13V19C21 20.1046 20.1046 21 19 21H5C3.89543 21 3 20.1046 3 19V13C3 11.8954 3.89543 11 5 11M19 11V9C19 7.89543 18.1046 7 17 7M5 11V9C5 7.89543 5.89543 7 7 7M7 7V5C7 3.89543 7.89543 3 9 3H15C16.1046 3 17 3.89543 17 5V7M7 7H17'
stroke="currentColor" stroke='currentColor'
strokeWidth="2" strokeWidth='2'
strokeLinecap="round" strokeLinecap='round'
strokeLinejoin="round" strokeLinejoin='round'
/> />
</svg> </svg>
<span className="px-2 font-medium">소개</span> <span className='px-2 font-medium'>소개</span>
</a> </a>
</Link> </Link>
<Link href="/about"> <Link href='/about'>
<a className="flex items-center px-8 py-2 text-gray-100 hover:text-gray-300"> <a className='flex items-center px-8 py-2 text-gray-100 hover:text-gray-300'>
<i className="fas fa-tools" /> <i className='fas fa-tools' />
<span className="px-2 font-medium">API</span> <span className='px-2 font-medium'>API</span>
</a> </a>
</Link> </Link>
<Link href="/addbot"> <Link href='/addbot'>
<a className="flex items-center px-8 py-2 text-gray-100 hover:text-gray-300"> <a className='flex items-center px-8 py-2 text-gray-100 hover:text-gray-300'>
<i className="fas fa-plus"></i> <i className='fas fa-plus'></i>
<span className="px-2 font-medium">봇 추가하기</span> <span className='px-2 font-medium'>봇 추가하기</span>
</a> </a>
</Link> </Link>
<Link href="/api/auth/login"> <Link href='/api/auth/login'>
<a className="flex items-center px-8 py-2 text-gray-100 hover:text-gray-300"> <a className='flex items-center px-8 py-2 text-gray-100 hover:text-gray-300'>
<i className="far fa-user" /> <i className='far fa-user' />
<span className="px-2 font-medium">로그인</span> <span className='px-2 font-medium'>로그인</span>
</a> </a>
</Link> </Link>
</nav> </nav>
<div className="absolute bottom-0 my-10"> <div className='absolute bottom-0 my-10'>
<a className="flex items-center px-8 py-2 text-gray-100 hover:text-gray-300"> <a className='flex items-center px-8 py-2 text-gray-100 hover:text-gray-300'>
<i className="fab fa-discord" /> <i className='fab fa-discord' />
<Link href="/discord"> <Link href='/discord'>
<a className="px-2 font-medium">디스코드 서버</a> <a className='px-2 font-medium'>디스코드 서버</a>
</Link> </Link>
</a> </a>
</div> </div>

12
components/Owner.tsx
View File

@ -3,13 +3,13 @@ import DiscordImage from './DiscordImage'
const Owner = ({ id, username, tag, avatarHash }:OwnerProps):JSX.Element => { const Owner = ({ id, username, tag, avatarHash }:OwnerProps):JSX.Element => {
return <Link href={`/users/${id}`}> return <Link href={`/users/${id}`}>
<div className="text-base bg-little-white dark:bg-discord-black text-black dark:text-gray-400 rounded flex hover:bg-little-white-hover dark:hover:bg-discord-dark-hover cursor-pointer px-4 py-4 mb-1"> <div className='text-base bg-little-white dark:bg-discord-black text-black dark:text-gray-400 rounded flex hover:bg-little-white-hover dark:hover:bg-discord-dark-hover cursor-pointer px-4 py-4 mb-1'>
<div className="rounded-full h-8 w-8 flex-shrink-0 mr-3 mt-1 overflow-hidden shadow-inner relative"> <div className='rounded-full h-8 w-8 flex-shrink-0 mr-3 mt-1 overflow-hidden shadow-inner relative'>
<DiscordImage userID={id} tag={tag} avatarHash={avatarHash} className="absolute inset-0 z-negative w-full h-full" size={50} /> <DiscordImage userID={id} tag={tag} avatarHash={avatarHash} className='absolute inset-0 z-negative w-full h-full' size={50} />
</div> </div>
<div className="flex-1 leading-snug w-0"> <div className='flex-1 leading-snug w-0'>
<h4 className="whitespace-nowrap">{username} <h4 className='whitespace-nowrap'>{username}
</h4><span className="text-sm text-gray-600">#{tag}</span> </h4><span className='text-sm text-gray-600'>#{tag}</span>
</div> </div>
</div> </div>
{/* <div className='text-base bg-little-white dark:bg-discord-black text-black dark:text-gray-400 px-2 rounded mr-1 mb-3 hover:bg-little-white-hover dark:hover:bg-discord-dark-hover w-full py-5'> {/* <div className='text-base bg-little-white dark:bg-discord-black text-black dark:text-gray-400 px-2 rounded mr-1 mb-3 hover:bg-little-white-hover dark:hover:bg-discord-dark-hover w-full py-5'>

10
components/SEO.tsx
View File

@ -4,11 +4,11 @@ const SEO = ({ title, description, image }: SEOProps): JSX.Element => {
return ( return (
<Head> <Head>
<title>{title} - 한국 디스코드봇 리스트</title> <title>{title} - 한국 디스코드봇 리스트</title>
{description && <meta name="description" content={description} />} {description && <meta name='description' content={description} />}
<meta name="og:site_name" content="한국 디스코드봇 리스트" /> <meta name='og:site_name' content='한국 디스코드봇 리스트' />
<meta name="og:title" content={title} /> <meta name='og:title' content={title} />
{description && <meta name="og:description" content={description} />} {description && <meta name='og:description' content={description} />}
{image && <meta name="og:image" content={image} />} {image && <meta name='og:image' content={image} />}
</Head> </Head>
) )
} }

2
components/Segment.tsx
View File

@ -1,6 +1,6 @@
const Segment = ({ children }): JSX.Element => { const Segment = ({ children }): JSX.Element => {
return ( return (
<div className="p-5 text-black dark:text-white dark:bg-discord-black bg-little-white rounded-sm"> <div className='p-5 text-black dark:text-white dark:bg-discord-black bg-little-white rounded-sm'>
{children} {children}
</div> </div>
) )

4
components/Tag.tsx
View File

@ -14,8 +14,8 @@ const Tag = ({
return href ? newTab ? ( return href ? newTab ? (
<a <a
href={href} href={href}
rel="noopener noreferrer" rel='noopener noreferrer'
target="_blank" target='_blank'
className={`${className ?? ''} text-center text-base ${ className={`${className ?? ''} text-center text-base ${
dark dark
? blurple ? blurple

4
components/Wave.tsx
View File

@ -1,9 +1,9 @@
const Wave = ({ color, className }: WaveProps): JSX.Element => { const Wave = ({ color, className }: WaveProps): JSX.Element => {
return ( return (
<svg viewBox="0 0 1440 320" className={className}> <svg viewBox='0 0 1440 320' className={className}>
<path <path
fill={color} fill={color}
d="M0 192l34.3 5.3C68.6 203 137 213 206 186.7c68.3-26.7 137-90.7 205-96 69-5.7 138 48.3 206 90.6C685.7 224 754 256 823 272c68.4 16 137 16 206 0 68.1-16 137-48 205-69.3 68.9-21.7 137-31.7 172-37.4l34-5.3V0H0z" d='M0 192l34.3 5.3C68.6 203 137 213 206 186.7c68.3-26.7 137-90.7 205-96 69-5.7 138 48.3 206 90.6C685.7 224 754 256 823 272c68.4 16 137 16 206 0 68.1-16 137-48 205-69.3 68.9-21.7 137-31.7 172-37.4l34-5.3V0H0z'
/> />
</svg> </svg>
) )

22
pages/_app.tsx
View File

@ -34,21 +34,21 @@ export default function App({ Component, pageProps }: AppProps): JSX.Element {
localStorage.setItem('theme', systemColor) localStorage.setItem('theme', systemColor)
}, []) }, [])
return ( return (
<ThemeProvider defaultTheme={systemColor} attribute="class" storageKey="theme"> <ThemeProvider defaultTheme={systemColor} attribute='class' storageKey='theme'>
<Head> <Head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name='viewport' content='width=device-width, initial-scale=1.0' />
<title>한국 디스코드봇 리스트</title> <title>한국 디스코드봇 리스트</title>
<meta name="description" content="국내 디스코드봇들을 확인하고, 초대해보세요!" /> <meta name='description' content='국내 디스코드봇들을 확인하고, 초대해보세요!' />
<meta name="og:title" content="한국 디스코드봇 리스트" /> <meta name='og:title' content='한국 디스코드봇 리스트' />
<meta name="og:url" content="https://koreanbots.dev" /> <meta name='og:url' content='https://koreanbots.dev' />
<meta name="og:description" content="국내 디스코드봇들을 확인하고, 초대해보세요!" /> <meta name='og:description' content='국내 디스코드봇들을 확인하고, 초대해보세요!' />
<meta name="og:image" content="/logo.png" /> <meta name='og:image' content='/logo.png' />
<meta charSet="utf-8" /> <meta charSet='utf-8' />
<link rel="shortcut icon" href="/logo.png" /> <link rel='shortcut icon' href='/logo.png' />
<meta name="theme-color" content="#3366FF" /> <meta name='theme-color' content='#3366FF' />
</Head> </Head>
<Navbar /> <Navbar />
<div className="iu-is-the-best h-full text-black dark:text-gray-100 dark:bg-discord-dark bg-white"> <div className='iu-is-the-best h-full text-black dark:text-gray-100 dark:bg-discord-dark bg-white'>
<Component {...pageProps} /> <Component {...pageProps} />
</div> </div>
<Footer /> <Footer />

8
pages/_document.tsx
View File

@ -11,11 +11,11 @@ class MyDocument extends Document {
<Html> <Html>
<Head> <Head>
<script <script
data-ad-client="ca-pub-4856582423981759" data-ad-client='ca-pub-4856582423981759'
async async
src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js" src='https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'
></script> ></script>
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-165454387-1"></script> <script async src='https://www.googletagmanager.com/gtag/js?id=UA-165454387-1'></script>
<script <script
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{
__html: ` __html: `
@ -28,7 +28,7 @@ class MyDocument extends Document {
}} }}
/> />
</Head> </Head>
<body className="h-full text-black dark:text-gray-100 dark:bg-discord-dark bg-white"> <body className='h-full text-black dark:text-gray-100 dark:bg-discord-dark bg-white'>
<Main /> <Main />
<NextScript /> <NextScript />
</body> </body>

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

@ -22,7 +22,7 @@ import Link from 'next/link'
const Bots: NextPage<BotsProps> = ({ data, date }) => { const Bots: NextPage<BotsProps> = ({ data, date }) => {
if (!data.id) return <NotFound /> if (!data.id) return <NotFound />
return ( return (
<Container paddingTop className="py-10"> <Container paddingTop className='py-10'>
<SEO <SEO
title={data.name} title={data.name}
description={data.intro} description={data.intro}
@ -32,16 +32,16 @@ const Bots: NextPage<BotsProps> = ({ data, date }) => {
: `https://cdn.discordapp.com/embed/avatars/${Number(data.tag) % 5}.png?size=1024` : `https://cdn.discordapp.com/embed/avatars/${Number(data.tag) % 5}.png?size=1024`
} }
/> />
<div className="lg:flex"> <div className='lg:flex'>
<div className="w-full text-center lg:w-1/4"> <div className='w-full text-center lg:w-1/4'>
<DiscordImage <DiscordImage
userID={data.id} userID={data.id}
avatarHash={data.avatar} avatarHash={data.avatar}
tag={data.tag} tag={data.tag}
className="w-full" className='w-full'
/> />
</div> </div>
<div className="flex-grow px-5 py-12 w-full text-center lg:w-5/12 lg:text-left"> <div className='flex-grow px-5 py-12 w-full text-center lg:w-5/12 lg:text-left'>
<div> <div>
<Tag <Tag
circular circular
@ -52,18 +52,18 @@ const Bots: NextPage<BotsProps> = ({ data, date }) => {
</> </>
} }
/> />
<h1 className="mb-2 mt-3 text-4xl font-bold"> <h1 className='mb-2 mt-3 text-4xl font-bold'>
{data.name}{' '} {data.name}{' '}
{data.trusted ? ( {data.trusted ? (
<span className="text-koreanbots-blue text-3xl"> <span className='text-koreanbots-blue text-3xl'>
<i className="fas fa-award" /> <i className='fas fa-award' />
</span> </span>
) : ''} ) : ''}
</h1> </h1>
</div> </div>
<p className="dark:text-gray-300 text-gray-800 text-base">{data.intro}</p> <p className='dark:text-gray-300 text-gray-800 text-base'>{data.intro}</p>
</div> </div>
<div className="w-full lg:w-1/4"> <div className='w-full lg:w-1/4'>
<LongButton <LongButton
newTab newTab
href={ href={
@ -71,50 +71,50 @@ const Bots: NextPage<BotsProps> = ({ data, date }) => {
`https://discordapp.com/oauth2/authorize?client_id=${data.id}&scope=bot&permissions=0` `https://discordapp.com/oauth2/authorize?client_id=${data.id}&scope=bot&permissions=0`
} }
> >
<h4 className="whitespace-nowrap"> <h4 className='whitespace-nowrap'>
<i className="fas fa-user-plus text-discord-blurple" /> 초대하기 <i className='fas fa-user-plus text-discord-blurple' /> 초대하기
</h4> </h4>
</LongButton> </LongButton>
<LongButton> <LongButton>
<h4> <h4>
<i className="fas fa-heart text-red-600" /> 하트 추가 <i className='fas fa-heart text-red-600' /> 하트 추가
</h4> </h4>
<span className="ml-1 px-2 py-1 text-center text-black dark:text-gray-400 text-sm bg-little-white-hover dark:bg-very-black rounded-lg"> <span className='ml-1 px-2 py-1 text-center text-black dark:text-gray-400 text-sm bg-little-white-hover dark:bg-very-black rounded-lg'>
{formatNumber(data.votes)} {formatNumber(data.votes)}
</span> </span>
</LongButton> </LongButton>
</div> </div>
</div> </div>
<Divider className="px-5" /> <Divider className='px-5' />
<div className="lg:flex lg:flex-row-reverse"> <div className='lg:flex lg:flex-row-reverse'>
<div className="mb-1 w-full lg:w-1/4"> <div className='mb-1 w-full lg:w-1/4'>
<h2 className="3xl mb-2 font-bold">정보</h2> <h2 className='3xl mb-2 font-bold'>정보</h2>
<div className="grid gap-4 grid-cols-2 px-4 py-4 text-black dark:text-gray-400 dark:bg-discord-black bg-little-white"> <div className='grid gap-4 grid-cols-2 px-4 py-4 text-black dark:text-gray-400 dark:bg-discord-black bg-little-white'>
<div> <div>
<i className="far fa-flag" /> 접두사 <i className='far fa-flag' /> 접두사
</div> </div>
<div className="markdown-body text-black dark:text-gray-400"> <div className='markdown-body text-black dark:text-gray-400'>
<code>{data.prefix}</code> <code>{data.prefix}</code>
</div> </div>
<div> <div>
<i className="fas fa-users" /> 서버수 <i className='fas fa-users' /> 서버수
</div> </div>
<div>{data.servers}</div> <div>{data.servers}</div>
<div> <div>
<i className="fas fa-calendar-day" /> 봇 생성일 <i className='fas fa-calendar-day' /> 봇 생성일
</div> </div>
<div>{Day(date).fromNow(false)}</div> <div>{Day(date).fromNow(false)}</div>
<div> <div>
<i className="fas fa-check text-discord-blurple" /> 디스코드 인증됨 <i className='fas fa-check text-discord-blurple' /> 디스코드 인증됨
</div> </div>
</div> </div>
<h2 className="3xl mb-2 mt-2 font-bold">카테고리</h2> <h2 className='3xl mb-2 mt-2 font-bold'>카테고리</h2>
<div className="flex flex-wrap"> <div className='flex flex-wrap'>
{data.category.map(el => ( {data.category.map(el => (
<Tag key={el} text={el} href={`/categories/${el}`} /> <Tag key={el} text={el} href={`/categories/${el}`} />
))} ))}
</div> </div>
<h2 className="3xl mb-2 mt-2 font-bold">제작자</h2> <h2 className='3xl mb-2 mt-2 font-bold'>제작자</h2>
{(data.owners as User[]).map(el => ( {(data.owners as User[]).map(el => (
<Owner <Owner
key={el.id} key={el.id}
@ -124,40 +124,40 @@ const Bots: NextPage<BotsProps> = ({ data, date }) => {
username={el.username} username={el.username}
/> />
))} ))}
<div className="list grid"> <div className='list grid'>
<Link href={`/bots/${data.id}/report`}> <Link href={`/bots/${data.id}/report`}>
<a className="text-red-600 hover:underline"> <a className='text-red-600 hover:underline'>
<i className="far fa-flag" /> <i className='far fa-flag' />
신고하기 신고하기
</a> </a>
</Link> </Link>
{data.discord && ( {data.discord && (
<a <a
rel="noopener noreferrer" rel='noopener noreferrer'
target="_blank" target='_blank'
className="text-discord-blurple hover:underline" className='text-discord-blurple hover:underline'
href={`https://discord.gg/${data.discord}`} href={`https://discord.gg/${data.discord}`}
> >
<i className="fab fa-discord" /> <i className='fab fa-discord' />
디스코드 서버 디스코드 서버
</a> </a>
)} )}
{data.web && ( {data.web && (
<a <a
rel="noopener noreferrer" rel='noopener noreferrer'
target="_blank" target='_blank'
className="text-blue-500 hover:underline" className='text-blue-500 hover:underline'
href={data.web} href={data.web}
> >
<i className="fas fa-globe" /> <i className='fas fa-globe' />
웹사이트 웹사이트
</a> </a>
)} )}
{data.git && ( {data.git && (
<a <a
rel="noopener noreferrer" rel='noopener noreferrer'
target="_blank" target='_blank'
className="hover:underline" className='hover:underline'
href={data.git} href={data.git}
> >
<i className={`fab fa-${git?.[new URL(data.git).hostname].icon ?? 'git-alt'}`} /> <i className={`fab fa-${git?.[new URL(data.git).hostname].icon ?? 'git-alt'}`} />
@ -167,7 +167,7 @@ const Bots: NextPage<BotsProps> = ({ data, date }) => {
</div> </div>
<Advertisement /> <Advertisement />
</div> </div>
<div className="markdown-body pt-10 w-full lg:pr-5 lg:w-3/4"> <div className='markdown-body pt-10 w-full lg:pr-5 lg:w-3/4'>
<Advertisement /> <Advertisement />
<Segment> <Segment>
<h1>이 메세지는 테스트 메세지입니다.</h1> <h1>이 메세지는 테스트 메세지입니다.</h1>
@ -186,12 +186,12 @@ const Bots: NextPage<BotsProps> = ({ data, date }) => {
<td>apple</td> <td>apple</td>
</tbody> </tbody>
</table> </table>
<ul className="list-disc"> <ul className='list-disc'>
<li>first</li> <li>first</li>
<li>second</li> <li>second</li>
</ul> </ul>
<ul className="list-decimal"> <ul className='list-decimal'>
<li>first</li> <li>first</li>
<li>second</li> <li>second</li>
</ul> </ul>

24
pages/guidelines.tsx
View File

@ -4,18 +4,18 @@ import Docs from '../components/Docs'
const Privacy: NextPage = () => { const Privacy: NextPage = () => {
return ( return (
<Docs <Docs
header="가이드라인" header='가이드라인'
description="리스트에 등재되는 모든 봇들이 지켜야하는 가이드라인입니다!" description='리스트에 등재되는 모든 봇들이 지켜야하는 가이드라인입니다!'
subheader="최초 작성: 2020-04-30 수정: 2020-05-15" subheader='최초 작성: 2020-04-30 수정: 2020-05-15'
> >
<h1 className="mb-3 text-4xl font-bold">KOREANBOTS에 오신 것을 환영합니다.</h1> <h1 className='mb-3 text-4xl font-bold'>KOREANBOTS에 오신 것을 환영합니다.</h1>
<p>봇 추가 또는 등재 유지를 위해서 반드시 지켜야할 가이드라인들입니다.</p> <p>봇 추가 또는 등재 유지를 위해서 반드시 지켜야할 가이드라인들입니다.</p>
<p>가이드라인 위반이 확인될 경우, 거부 또는 삭제 처리될 수 있음을 알려드립니다.</p> <p>가이드라인 위반이 확인될 경우, 거부 또는 삭제 처리될 수 있음을 알려드립니다.</p>
<h2 className="mt-10 text-3xl font-semibold" id="봇"> <h2 className='mt-10 text-3xl font-semibold' id='봇'>
봇 봇
</h2> </h2>
<p>아래는 봇 추가를 위해 반드시 지켜야할 규칙입니다.</p> <p>아래는 봇 추가를 위해 반드시 지켜야할 규칙입니다.</p>
<ul className="list-inside list-disc"> <ul className='list-inside list-disc'>
<li>반드시 디스코드 서버에 참가해주세요.</li> <li>반드시 디스코드 서버에 참가해주세요.</li>
<li>카테고리는 정확하게 지정해주세요 (NSFW의 경우 반드시 NSFW를 지정해주셔야합니다.)</li> <li>카테고리는 정확하게 지정해주세요 (NSFW의 경우 반드시 NSFW를 지정해주셔야합니다.)</li>
<li> <li>
@ -31,7 +31,7 @@ const Privacy: NextPage = () => {
<li> <li>
오픈소스봇을 따로 거부하지는 않지만, 반드시 <strong>라이선스</strong>를 지켜주세요. 오픈소스봇을 따로 거부하지는 않지만, 반드시 <strong>라이선스</strong>를 지켜주세요.
원작자가 문제 제기할 경우, 통보없이 봇이 삭제되거나 거부될 수 있습니다. 원작자가 문제 제기할 경우, 통보없이 봇이 삭제되거나 거부될 수 있습니다.
<ul className="pl-3 list-inside list-disc"> <ul className='pl-3 list-inside list-disc'>
<li> <li>
오픈소스 라이선스에 <strong>원소스를 표시해야 한다는 조항</strong>(MIT 등 해당)이 오픈소스 라이선스에 <strong>원소스를 표시해야 한다는 조항</strong>(MIT 등 해당)이
있다면, 소스같은 곳뿐만 아니라 반드시 봇 설명에 기재해주세요. 있다면, 소스같은 곳뿐만 아니라 반드시 봇 설명에 기재해주세요.
@ -45,11 +45,11 @@ const Privacy: NextPage = () => {
</ul> </ul>
</li> </li>
</ul> </ul>
<h3 className="mt-x text-lg font-semibold" id="금지사항"> <h3 className='mt-x text-lg font-semibold' id='금지사항'>
금지사항 금지사항
</h3> </h3>
<p>다음 항목에 해당하는 봇의 등록을 거부할 수 있습니다.</p> <p>다음 항목에 해당하는 봇의 등록을 거부할 수 있습니다.</p>
<ul className="list-inside list-disc"> <ul className='list-inside list-disc'>
<li>불법 프로그램 홍보 또는 판매 기타 행위를 조장하는 봇.</li> <li>불법 프로그램 홍보 또는 판매 기타 행위를 조장하는 봇.</li>
<li> <li>
디스코드 <strong>TOS</strong>나 <strong>가이드라인</strong>, <strong>개발자 약관</strong> 디스코드 <strong>TOS</strong>나 <strong>가이드라인</strong>, <strong>개발자 약관</strong>
@ -61,21 +61,21 @@ const Privacy: NextPage = () => {
</li> </li>
<li>대한민국 법을 위반하거나 오픈소스 라이선스, API 라이선스등을 위반한 봇</li> <li>대한민국 법을 위반하거나 오픈소스 라이선스, API 라이선스등을 위반한 봇</li>
</ul> </ul>
<h2 className="mt-10 text-3xl font-semibold" id="유저"> <h2 className='mt-10 text-3xl font-semibold' id='유저'>
유저 유저
</h2> </h2>
<p> <p>
다음 항목에 해당하는 유저가 제작에 참여하고 있는(과거에 제작 참여 이력과는 관련 없음) 봇의 다음 항목에 해당하는 유저가 제작에 참여하고 있는(과거에 제작 참여 이력과는 관련 없음) 봇의
등록을 거부할 수 있습니다. 등록을 거부할 수 있습니다.
</p> </p>
<ul className="list-inside list-disc"> <ul className='list-inside list-disc'>
<li> <li>
디스코드 <strong>TOS</strong>나 <strong>가이드라인</strong>, <strong>개발자 약관</strong>{' '} 디스코드 <strong>TOS</strong>나 <strong>가이드라인</strong>, <strong>개발자 약관</strong>{' '}
또는 <strong>대한민국 법</strong>, <strong>오픈소스 라이선스</strong>,{' '} 또는 <strong>대한민국 법</strong>, <strong>오픈소스 라이선스</strong>,{' '}
<strong>기타 라이선스</strong> 중 하나 이상을 위반 하고 있는 경우 <strong>기타 라이선스</strong> 중 하나 이상을 위반 하고 있는 경우
</li> </li>
</ul> </ul>
<p className="mt-10"> <p className='mt-10'>
위 항목들은 정확하게 인정되기 전까지는 처리할 수 없습니다. 또한, 처리하기 전에는 반드시 위 항목들은 정확하게 인정되기 전까지는 처리할 수 없습니다. 또한, 처리하기 전에는 반드시
유저에게 통보를 시도해야합니다. 유저에게 통보를 시도해야합니다.
</p> </p>

28
pages/index.tsx
View File

@ -10,24 +10,24 @@ import { Fetch } from '../utils'
const Index: NextPage<IndexProps> = ({ votes, newBots, trusted }) => { const Index: NextPage<IndexProps> = ({ votes, newBots, trusted }) => {
return ( return (
<> <>
<div className="dark:bg-discord-black bg-discord-blurple"> <div className='dark:bg-discord-black bg-discord-blurple'>
<Container className="pb-28 pt-20" ignoreColor> <Container className='pb-28 pt-20' ignoreColor>
<h1 className="text-center text-gray-100 text-3xl font-bold sm:text-left"> <h1 className='text-center text-gray-100 text-3xl font-bold sm:text-left'>
한국 디스코드봇 리스트 한국 디스코드봇 리스트
</h1> </h1>
</Container> </Container>
</div> </div>
<Wave <Wave
color="currentColor" color='currentColor'
className="dark:text-discord-black text-discord-blurple dark:bg-discord-dark bg-white" className='dark:text-discord-black text-discord-blurple dark:bg-discord-dark bg-white'
/> />
<Container> <Container>
<Advertisement /> <Advertisement />
<h1 className="text-3xl font-bold"> <h1 className='text-3xl font-bold'>
<i className="far fa-heart mr-3 text-pink-600" /> 하트 랭킹 <i className='far fa-heart mr-3 text-pink-600' /> 하트 랭킹
</h1> </h1>
<p className="text-base">하트를 많이 받은 봇들의 순위입니다!</p> <p className='text-base'>하트를 많이 받은 봇들의 순위입니다!</p>
<div className='grid gap-4 2xl:grid-cols-4 md:grid-cols-2 mt-10'> <div className='grid gap-4 2xl:grid-cols-4 md:grid-cols-2 mt-10'>
{ {
votes.data.slice(0, 8).map(bot=> <BotCard key={bot.id} bot={bot} />) votes.data.slice(0, 8).map(bot=> <BotCard key={bot.id} bot={bot} />)
@ -36,19 +36,19 @@ const Index: NextPage<IndexProps> = ({ votes, newBots, trusted }) => {
<LongButton href='/list/votes' center> <LongButton href='/list/votes' center>
<h1 className='text-2xl'>더보기</h1> <h1 className='text-2xl'>더보기</h1>
</LongButton> </LongButton>
<h1 className="text-3xl font-bold mt-5"> <h1 className='text-3xl font-bold mt-5'>
<i className="far fa-star mr-3 text-yellow-500" /> 새로운 봇 <i className='far fa-star mr-3 text-yellow-500' /> 새로운 봇
</h1> </h1>
<p className="text-base">최근에 한국 디스코드봇 리스트에 추가된 따끈따끈한 봇입니다.</p> <p className='text-base'>최근에 한국 디스코드봇 리스트에 추가된 따끈따끈한 봇입니다.</p>
<div className='grid gap-4 2xl:grid-cols-4 md:grid-cols-2 mt-10'> <div className='grid gap-4 2xl:grid-cols-4 md:grid-cols-2 mt-10'>
{ {
newBots.data.slice(0, 4).map(bot=> <BotCard key={bot.id} bot={bot} />) newBots.data.slice(0, 4).map(bot=> <BotCard key={bot.id} bot={bot} />)
} }
</div> </div>
<h1 className="text-3xl font-bold"> <h1 className='text-3xl font-bold'>
<i className="fa fa-check mr-3 mt-10 text-green-500" /> 신뢰된 봇 <i className='fa fa-check mr-3 mt-10 text-green-500' /> 신뢰된 봇
</h1> </h1>
<p className="text-base">KOREANBOTS에서 인증받은 신뢰할 수 있는 봇들입니다!!</p> <p className='text-base'>KOREANBOTS에서 인증받은 신뢰할 수 있는 봇들입니다!!</p>
<div className='grid gap-4 2xl:grid-cols-4 md:grid-cols-2 mt-10'> <div className='grid gap-4 2xl:grid-cols-4 md:grid-cols-2 mt-10'>
{ {
trusted.data.slice(0, 4).map(bot=> <BotCard key={bot.id} bot={bot} />) trusted.data.slice(0, 4).map(bot=> <BotCard key={bot.id} bot={bot} />)

26
pages/privacy.tsx
View File

@ -3,19 +3,19 @@ import Docs from '../components/Docs'
const Privacy: NextPage = () => { const Privacy: NextPage = () => {
return ( return (
<Docs header="개인정보취급방침" description="저희가 개인정보를 취급하는 방침입니다."> <Docs header='개인정보취급방침' description='저희가 개인정보를 취급하는 방침입니다.'>
<h2 className="mt-10 text-3xl font-medium">개인정보 처리의 목적</h2> <h2 className='mt-10 text-3xl font-medium'>개인정보 처리의 목적</h2>
<p> <p>
"한국 디스코드봇 리스트"('https://koreanbots.dev')는 다음 목적을 위하여 개인정보를 처리하고 "한국 디스코드봇 리스트"('https://koreanbots.dev')는 다음 목적을 위하여 개인정보를 처리하고
있으며, 다음 목적 이외의 용도로는 사용하지 않습니다. 있으며, 다음 목적 이외의 용도로는 사용하지 않습니다.
</p> </p>
<ul className="list-inside list-disc"> <ul className='list-inside list-disc'>
<li>웹사이트에 표시 및 서비스 제공</li> <li>웹사이트에 표시 및 서비스 제공</li>
<li>빠른 웹사이트 문제 수정</li> <li>빠른 웹사이트 문제 수정</li>
<li>사이트와 유저의 보안 유지</li> <li>사이트와 유저의 보안 유지</li>
</ul> </ul>
<h2 className="mt-10 text-3xl font-medium">수집하는 개인정보 항목</h2> <h2 className='mt-10 text-3xl font-medium'>수집하는 개인정보 항목</h2>
<ul className="list-inside list-disc"> <ul className='list-inside list-disc'>
<li> <li>
유저: 디스코드 Oauth를 통한 정보(이메일, 디스코드 유저의 ID, 아바타, 유저네임과 태그, 유저: 디스코드 Oauth를 통한 정보(이메일, 디스코드 유저의 ID, 아바타, 유저네임과 태그,
접속해있는 길드), 접속로그(IP주소, 접속 기기정보), 유저의 봇 투표 정보 | 선택항목: Github 접속해있는 길드), 접속로그(IP주소, 접속 기기정보), 유저의 봇 투표 정보 | 선택항목: Github
@ -27,12 +27,12 @@ const Privacy: NextPage = () => {
링크 링크
</li> </li>
</ul> </ul>
<h2 className="mt-10 text-3xl font-medium">개인정보 보유 및 이용기간</h2> <h2 className='mt-10 text-3xl font-medium'>개인정보 보유 및 이용기간</h2>
<p> <p>
개인정보는 <strong>서비스 종료시까지 보관을 원칙</strong>으로 하며, 유저의 요청시 언제든지 개인정보는 <strong>서비스 종료시까지 보관을 원칙</strong>으로 하며, 유저의 요청시 언제든지
파기할 수 있습니다. 파기할 수 있습니다.
</p> </p>
<h2 className="mt-10 text-3xl font-medium">이용자 및 법정 대리인의 권리와 행사 방법</h2> <h2 className='mt-10 text-3xl font-medium'>이용자 및 법정 대리인의 권리와 행사 방법</h2>
<p> <p>
회사는 정보통신망법 및 개인정보 보호법 등 관계 법령에서 규정하고 있는 이용자의 권리를 충실히 회사는 정보통신망법 및 개인정보 보호법 등 관계 법령에서 규정하고 있는 이용자의 권리를 충실히
보장합니다. 보장합니다.
@ -41,28 +41,28 @@ const Privacy: NextPage = () => {
이용자는 언제든지 자신의 개인정보 및 이용 현황을 상시 확인할 수 있으며, 동의 철회 및 정정을 이용자는 언제든지 자신의 개인정보 및 이용 현황을 상시 확인할 수 있으며, 동의 철회 및 정정을
요청할 수 있습니다. 요청할 수 있습니다.
</p> </p>
<h2 className="mt-10 text-3xl font-medium">개인정보의 파기</h2> <h2 className='mt-10 text-3xl font-medium'>개인정보의 파기</h2>
<p> <p>
개인정보의 수집 및 이용 목적이 달성 되면, 수집한 개인정보를 신속하고 안전한 방법으로 개인정보의 수집 및 이용 목적이 달성 되면, 수집한 개인정보를 신속하고 안전한 방법으로
파기합니다. 파기합니다.
</p> </p>
<h2 className="mt-10 text-3xl font-medium">개인정보 보호책임자</h2> <h2 className='mt-10 text-3xl font-medium'>개인정보 보호책임자</h2>
<p> <p>
권리 침해와 개인정보 처리와 관한 불만처리 및 피해구제를 위하여 아래와 같이 개인정보보호 권리 침해와 개인정보 처리와 관한 불만처리 및 피해구제를 위하여 아래와 같이 개인정보보호
담당자를 지정하고 있습니다. 담당자를 지정하고 있습니다.
</p> </p>
<h3>개인정보 보호 책임자</h3> <h3>개인정보 보호 책임자</h3>
<ul className="list-inside list-disc"> <ul className='list-inside list-disc'>
<li>성명: 박준서</li> <li>성명: 박준서</li>
<li>직책: 대표</li> <li>직책: 대표</li>
<li> <li>
연락처: <a href="mailto:wonderlandpark@callisto.team">메일</a> 혹은 디스코드 연락처: <a href='mailto:wonderlandpark@callisto.team'>메일</a> 혹은 디스코드
@wonderlandpark#9999 @wonderlandpark#9999
</li> </li>
</ul> </ul>
<h2 className="mt-10 text-3xl font-medium">개인정보 처리방침 변경 시 고지 의무</h2> <h2 className='mt-10 text-3xl font-medium'>개인정보 처리방침 변경 시 고지 의무</h2>
<p>개인정보 처리방침의 변경이 있는 경우 시행 7일전 사전에 이용자에게 고지합니다.</p> <p>개인정보 처리방침의 변경이 있는 경우 시행 7일전 사전에 이용자에게 고지합니다.</p>
<h2 className="mt-10 text-3xl font-medium">정보주체의 권익침해에 대한 구제방법</h2> <h2 className='mt-10 text-3xl font-medium'>정보주체의 권익침해에 대한 구제방법</h2>
<p>정보주체는 아래의 기관에 개인정보 침해에 대한 피해구제, 상담 등을 문의할 수 있습니다.</p> <p>정보주체는 아래의 기관에 개인정보 침해에 대한 피해구제, 상담 등을 문의할 수 있습니다.</p>
<p> <p>
아래의 기관은 당사와는 별개의 기관으로서, 당사의 자체적인 개인정보 불만처리, 피해 구제 아래의 기관은 당사와는 별개의 기관으로서, 당사의 자체적인 개인정보 불만처리, 피해 구제

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

@ -18,7 +18,7 @@ const Users: NextPage<UserProps> = ({ data }) => {
if (!data.id) return <NotFound /> if (!data.id) return <NotFound />
console.log(data.bots[0]) console.log(data.bots[0])
return ( return (
<Container paddingTop className="py-10"> <Container paddingTop className='py-10'>
<SEO <SEO
title={data.username} title={data.username}
description={josa( description={josa(
@ -33,29 +33,29 @@ const Users: NextPage<UserProps> = ({ data }) => {
: `https://cdn.discordapp.com/embed/avatars/${Number(data.tag) % 5}.png?size=1024` : `https://cdn.discordapp.com/embed/avatars/${Number(data.tag) % 5}.png?size=1024`
} }
/> />
<div className="lg:flex"> <div className='lg:flex'>
<div className="w-full text-center lg:w-1/4"> <div className='w-full text-center lg:w-1/4'>
<DiscordImage <DiscordImage
userID={data.id} userID={data.id}
avatarHash={data.avatar} avatarHash={data.avatar}
tag={data.tag} tag={data.tag}
className="w-full" className='w-full'
/> />
</div> </div>
<div className="flex-grow px-5 py-12 w-full text-center lg:w-5/12 lg:text-left"> <div className='flex-grow px-5 py-12 w-full text-center lg:w-5/12 lg:text-left'>
<div> <div>
<h1 className="mb-2 mt-3 text-4xl font-bold">{data.username}</h1> <h1 className='mb-2 mt-3 text-4xl font-bold'>{data.username}</h1>
<span className="ml-0.5 text-gray-400 text-4xl font-semibold">#{data.tag}</span> <span className='ml-0.5 text-gray-400 text-4xl font-semibold'>#{data.tag}</span>
<br /> <br />
<div className="badges flex"> <div className='badges flex'>
{checkPerm(data.perm, 'staff') && ( {checkPerm(data.perm, 'staff') && (
<div className="pr-5 text-koreanbots-blue text-2xl"> <div className='pr-5 text-koreanbots-blue text-2xl'>
<i className="fas fa-hammer" /> <i className='fas fa-hammer' />
</div> </div>
)} )}
{checkPerm(data.perm, 'bughunter') && ( {checkPerm(data.perm, 'bughunter') && (
<div className="pr-5 text-green-500 text-2xl"> <div className='pr-5 text-green-500 text-2xl'>
<i className="fas fa-bug" /> <i className='fas fa-bug' />
</div> </div>
)} )}
</div> </div>
@ -65,7 +65,7 @@ const Users: NextPage<UserProps> = ({ data }) => {
newTab newTab
text={ text={
<> <>
<i className="fab fa-github" /> {data.github} <i className='fab fa-github' /> {data.github}
</> </>
} }
github github
@ -76,8 +76,8 @@ const Users: NextPage<UserProps> = ({ data }) => {
</div> </div>
</div> </div>
<Divider /> <Divider />
<h2 className="mt-8 text-3xl font-bold">제작한 봇</h2> <h2 className='mt-8 text-3xl font-bold'>제작한 봇</h2>
<div className="grid gap-4 mt-20 2xl:grid-cols-4 md:grid-cols-2"> <div className='grid gap-4 mt-20 2xl:grid-cols-4 md:grid-cols-2'>
{(data.bots as Bot[]).map((bot: Bot) => ( {(data.bots as Bot[]).map((bot: Bot) => (
<BotCard key={bot.id} bot={bot} /> <BotCard key={bot.id} bot={bot} />
))} ))}