From 78627b41591ebec00423f0fc4ee5de5d931971ed Mon Sep 17 00:00:00 2001
From: Junseo Park <wonderlandpark@outlook.kr>
Date: Mon, 15 Feb 2021 11:32:40 +0900
Subject: [PATCH] feat: linking Card only divider top

---
 components/BotCard.tsx | 127 +++++++++++++++++++++--------------------
 1 file changed, 65 insertions(+), 62 deletions(-)

diff --git a/components/BotCard.tsx b/components/BotCard.tsx
index c505733..8b0807d 100644
--- a/components/BotCard.tsx
+++ b/components/BotCard.tsx
@@ -10,79 +10,82 @@ import DiscordAvatar from '@components/DiscordAvatar'
 
 const BotCard = ({ manage=false, bot }: BotProps): JSX.Element => {
 	return (
-		<Link href={makeBotURL(bot)}>
-			<a className='container mb-16 transform hover:-translate-y-1 transition duration-100 ease-in cursor-pointer'>
-				<div className='relative'>
-					<div className='container mx-auto'>
-						<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' style={checkBotFlag(bot.flags, 'trusted') && bot.banner ? { background: `linear-gradient(to right, rgba(34, 36, 38, 0.68), rgba(34, 36, 38, 0.68)), url("${bot.banner}") center top / cover no-repeat`, color: 'white' } : {}}>
-								<div className='flex h-44'>
-									<div className='w-2/3'>
-										<div className='flex justify-start'>
-											<DiscordAvatar size={128} userID={bot.id} alt='Avatar' 	className='rounded-full absolute -left-2 -top-8 mx-auto w-32 h-32 bg-white'/> 
-										</div>
+		
+		<div className='container mb-16 transform hover:-translate-y-1 transition duration-100 ease-in'>
+			<div className='relative'>
+				<div className='container mx-auto'>
+					<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' style={checkBotFlag(bot.flags, 'trusted') && bot.banner ? { background: `linear-gradient(to right, rgba(34, 36, 38, 0.68), rgba(34, 36, 38, 0.68)), url("${bot.banner}") center top / cover no-repeat`, color: 'white' } : {}}>
+							<Link href={makeBotURL(bot)}>
+								<a className='cursor-pointer'>
+									<div className='flex h-44'>
+										<div className='w-2/3'>
+											<div className='flex justify-start'>
+												<DiscordAvatar size={128} userID={bot.id} alt='Avatar' 	className='rounded-full absolute -left-2 -top-8 mx-auto w-32 h-32 bg-white'/> 
+											</div>
 
-										<div className='mt-28 px-4'>
-											<h2 className='px-1 text-sm'>
-												<i className={`fas fa-circle text-${Status[bot.status]?.color}`} />
-												{Status[bot.status]?.text}
-											</h2>
-											<h1 className='mb-3 text-left text-2xl font-bold truncate'>
-												{bot.name}
-											</h1>
+											<div className='mt-28 px-4'>
+												<h2 className='px-1 text-sm'>
+													<i className={`fas fa-circle text-${Status[bot.status]?.color}`} />
+													{Status[bot.status]?.text}
+												</h2>
+												<h1 className='mb-3 text-left text-2xl font-bold truncate'>
+													{bot.name}
+												</h1>
+											</div>
+										</div>
+										<div className='grid grid-cols-1 pr-5 py-5 w-1/3 h-0'>
+											<Tag
+												text={
+													<>
+														<i className='fas fa-heart text-red-600' /> {formatNumber(bot.votes)}
+													</>
+												}
+												dark
+											/>
+											<Tag blurple text={bot.servers ? <>{formatNumber(bot.servers)} 서버</> : 'N/A'} dark />
 										</div>
 									</div>
-									<div className='grid grid-cols-1 pr-5 py-5 w-1/3 h-0'>
-										<Tag
-											text={
-												<>
-													<i className='fas fa-heart text-red-600' /> {formatNumber(bot.votes)}
-												</>
-											}
-											dark
-										/>
-										<Tag blurple text={bot.servers ? <>{formatNumber(bot.servers)} 서버</> : 'N/A'} dark />
+									<p className='px-4 text-left text-gray-400 text-sm font-medium mb-10 h-6'>{bot.intro}</p>
+									<div className='category px-2 flex flex-wrap'>
+										{bot.category.slice(0, 3).map(el => (
+											<Tag key={el} text={el} href={`/categories/${el}`} dark/>
+										))} {
+											bot.category.length > 3 && <Tag text={`+${bot.category.length - 3}`} dark />
+										}
 									</div>
-								</div>
-								<p className='px-4 text-left text-gray-400 text-sm font-medium mb-10 h-6'>{bot.intro}</p>
-								<div className='category px-2 flex flex-wrap'>
-									{bot.category.slice(0, 3).map(el => (
-										<Tag key={el} text={el} href={`/categories/${el}`} dark/>
-									))} {
-										bot.category.length > 3 && <Tag text={`+${bot.category.length - 3}`} dark />
-									}
-								</div>
-								<Divider />
-								<div className='flex justify-evenly'>
-									<Link
-										href={makeBotURL(bot)}	
-									>
-										<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 transition duration-100 ease-in'>
+								</a>
+							</Link>
+							<Divider />
+							<div className='flex justify-evenly'>
+								<Link
+									href={makeBotURL(bot)}	
+								>
+									<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 transition duration-100 ease-in'>
 										보기
+									</a>
+								</Link>
+								{
+									manage ? <Link href={`/manage/${bot.id}`}>
+										<a
+											className='rounded-br-2xl py-3 w-full text-center text-green-500 hover:text-white text-sm font-bold hover:bg-green-500 hover:shadow-lg transition duration-100 ease-in'
+										>
+									관리하기
+										</a>
+									</Link> : <Link href={bot.url || `https://discordapp.com/oauth2/authorize?client_id=${bot.id}&scope=bot&permissions=0`}>
+										<a rel='noopener noreferrer' target='_blank'
+											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 transition duration-100 ease-in'
+										>
+									초대하기
 										</a>
 									</Link>
-									{
-										manage ? <Link href={`/manage/${bot.id}`}>
-											<a
-												className='rounded-br-2xl py-3 w-full text-center text-green-500 hover:text-white text-sm font-bold hover:bg-green-500 hover:shadow-lg transition duration-100 ease-in'
-											>
-									관리하기
-											</a>
-										</Link> : <Link href={bot.url ?? `https://discordapp.com/oauth2/authorize?client_id=${bot.id}&scope=bot&permissions=0`}>
-											<a rel='noopener noreferrer' target='_blank'
-												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 transition duration-100 ease-in'
-											>
-									초대하기
-											</a>
-										</Link>
-									}
-								</div>
+								}
 							</div>
 						</div>
 					</div>
 				</div>
-			</a>
-		</Link>
+			</div>
+		</div>
 	)
 }