样式微调

This commit is contained in:
tangly
2021-11-25 16:44:06 +08:00
parent 22176fee79
commit 917d3f2e63
5 changed files with 11 additions and 19 deletions

View File

@@ -34,11 +34,11 @@ const RecommendPosts = ({ currentPost, totalPosts }) => {
filteredPosts = filteredPosts.slice(0, 5)
}
return <div className='dark:text-gray-300'>
<h2 className='text-3xl mb-2'>推荐文章</h2>
return <div className='dark:text-gray-300 dark:bg-gray-900 bg-gray-100 p-2 mb-2 border-l-4 border-yellow-500'>
<h2 className='ml-2 mb-2 font-bold'>相关推荐</h2>
<ul className='list-disc px-5'>
{filteredPosts.map(post => (
<li className='py-1' key={post.id} ><Link href={`/article/${post.slug}`}><a className='cursor-pointer hover:underline'>{post.title}</a></Link></li>
<li className='py-1' key={post.id} ><Link href={`/article/${post.slug}`}><a className='cursor-pointer underline'>{post.title}</a></Link></li>
))}
</ul>
</div>

View File

@@ -16,10 +16,10 @@ const RewardButton = () => {
setPopoverShow(false)
}
return (
<div onMouseEnter={openPopover} onMouseLeave={closePopover} className='py-5'>
<div className='bg-red-500 w-20 mx-auto animate__jello text-white hover:bg-green-400 duration-200 transform hover:scale-110 px-3 py-2 rounded cursor-pointer'>
<div onMouseEnter={openPopover} onMouseLeave={closePopover}>
<div className='bg-red-500 w-36 mx-auto animate__jello text-white hover:bg-green-400 duration-200 transform hover:scale-110 px-3 py-2 rounded cursor-pointer'>
<span className='fa fa-qrcode mr-2' />
<span>打赏</span>
<span>打赏一杯咖啡</span>
</div>
<div className={ `${(popoverShow ? ' block ' : ' hidden ')} transform block z-50 font-normal`}>