feat: gap only for x

This commit is contained in:
원더 2021-02-10 13:21:51 +09:00
parent 891a2412cf
commit 1e3eebb8ff
5 changed files with 7 additions and 7 deletions

View File

@ -22,7 +22,7 @@ const Category: NextPage<CategoryProps> = ({ data, query }) => {
<Container> <Container>
<Advertisement /> <Advertisement />
<div className='grid gap-4 2xl:grid-cols-4 md:grid-cols-2 mt-20'> <div className='grid gap-x-4 2xl:grid-cols-4 md:grid-cols-2 mt-20'>
{ {
data.data.map(bot => <BotCard key={bot.id} bot={bot} /> ) data.data.map(bot => <BotCard key={bot.id} bot={bot} /> )
} }

View File

@ -21,7 +21,7 @@ const Index: NextPage<IndexProps> = ({ votes, newBots, trusted }) => {
<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-x-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} />)
} }
@ -31,7 +31,7 @@ const Index: NextPage<IndexProps> = ({ votes, newBots, trusted }) => {
<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-x-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} />)
} }
@ -41,7 +41,7 @@ const Index: NextPage<IndexProps> = ({ votes, newBots, trusted }) => {
<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-x-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} />)
} }

View File

@ -16,7 +16,7 @@ const New:NextPage<NewProps> = ({ data }) => {
<SEO title='새로운 봇' description='최근에 추가된 봇들입니다!' /> <SEO title='새로운 봇' description='최근에 추가된 봇들입니다!' />
<Container> <Container>
<Advertisement /> <Advertisement />
<div className='grid gap-4 2xl:grid-cols-4 md:grid-cols-2 mt-20'> <div className='grid gap-x-4 2xl:grid-cols-4 md:grid-cols-2 mt-20'>
{ {
data.data.map(bot => <BotCard key={bot.id} bot={bot} /> ) data.data.map(bot => <BotCard key={bot.id} bot={bot} /> )
} }

View File

@ -24,7 +24,7 @@ const Votes:NextPage<VotesProps> = ({ data }) => {
<SEO title='하트 랭킹' description='하트를 많이 받은 봇들의 순위입니다!'/> <SEO title='하트 랭킹' description='하트를 많이 받은 봇들의 순위입니다!'/>
<Container> <Container>
<Advertisement /> <Advertisement />
<div className='grid gap-4 2xl:grid-cols-4 md:grid-cols-2 mt-20'> <div className='grid gap-x-4 2xl:grid-cols-4 md:grid-cols-2 mt-20'>
{ {
data.data.map(bot => <BotCard key={bot.id} bot={bot} /> ) data.data.map(bot => <BotCard key={bot.id} bot={bot} /> )
} }

View File

@ -83,7 +83,7 @@ const Users: NextPage<UserProps> = ({ data }) => {
</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-x-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} />
))} ))}