更多分类,页面颜色色阶调整
This commit is contained in:
tangly1024
2021-12-02 10:38:59 +08:00
parent 6db0b69288
commit f7dbd26b70
10 changed files with 162 additions and 53 deletions

View File

@@ -19,20 +19,22 @@ const MenuButtonGroup = ({ allowCollapse = false }) => {
// { id: 9, icon: 'fa-telegram', name: 'Telegram', to: 'https://t.me/tangly_1024', show: true }
]
return <nav id='nav'>
<div className='leading-8 text-gray-700 dark:text-gray-400'>
{links.map(
link =>
link.show && (
<Link key={link.id + link.icon} title={link.to} href={link.to} >
<a className={(router.asPath === link.to ? 'bg-gray-200 dark:bg-black' : '') + ' py-2 px-5 hover:bg-gray-100 cursor-pointer dark:hover:bg-gray-600 duration-100 flex flex-nowrap align-middle'} >
<div className='my-auto w-5 text-2xl justify-center flex'>
<i className={'fa ' + link.icon} />
</div>
<div className={'ml-4 w-32'}>{link.name}</div>
</a>
</Link>
)
)}
<div className='leading-8 text-gray-500 dark:text-gray-400'>
{links.map(link => {
if (link.show) {
const selected = router.asPath === link.to
return <Link key={link.id + link.icon} title={link.to} href={link.to} >
<a className={(selected ? 'bg-gray-200 dark:bg-black dark:text-white text-black ' : '') + ' py-2 px-5 hover:text-black hover:bg-gray-100 cursor-pointer dark:hover:bg-gray-600 duration-100 flex flex-nowrap align-middle'} >
<div className='my-auto w-5 text-2xl justify-center flex'>
<i className={'fa ' + link.icon} />
</div>
<div className={'ml-4 w-32'}>{link.name}</div>
</a>
</Link>
} else {
return <></>
}
})}
</div>
</nav>
}