d0zingcat/NotionNext
1
0
Fork 0
mirror of https://github.com/d0zingcat/NotionNext.git synced 2026-05-17 07:26:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

feature:

Browse Source 
引入react-fontawesome，升级至v5.15;
next/link补齐passHref;
替换img为next/Image,优化图片
This commit is contained in:
tangly1024
2021-12-03 15:01:11 +08:00
parent 88d1e0742a
commit 49ab1eb124
32 changed files with 243 additions and 202 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
components/MenuButtonGroup.js
View File

@@ -2,21 +2,23 @@ import React from 'react'
import Link from 'next/link'
import { useRouter } from 'next/router'
import { useGlobal } from '@/lib/global'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faHome, faInfoCircle } from '@fortawesome/free-solid-svg-icons'
const MenuButtonGroup = ({ allowCollapse = false }) => {
const { locale } = useGlobal()
const router = useRouter()
const links = [
{ id: 0, icon: 'fa-home', name: locale.NAV.INDEX, to: '/' || '/', show: true },
{ id: 1, icon: 'fa-info-circle', name: locale.NAV.ABOUT, to: '/article/about', show: true }
// { id: 7, icon: 'fa-github', name: 'Github', to: 'https://github.com/tangly1024', show: true },
// { id: 5, icon: 'fa-weibo', name: '微博', to: 'https://weibo.com/tangly1024', show: true },
// { id: 4, icon: 'fa-envelope', name: locale.NAV.MAIL, to: 'mailto:tlyong1992@hotmail.com', show: true }
// { id: 2, icon: 'fa-rss-square', name: locale.NAV.RSS, to: '/feed', show: true },
// { id: 3, icon: 'fa-compass', name: '发现', to: 'https://search.tangly1024.com/', show: true }
// { id: 6, icon: 'fa-map-marker', name: 'Fuzhou', to: '#', show: true },
// { id: 8, icon: 'fa-twitter', name: 'Twitter', to: 'https://twitter.com/troy1024_1', show: true },
// { id: 9, icon: 'fa-telegram', name: 'Telegram', to: 'https://t.me/tangly_1024', show: true }
{ id: 0, icon: faHome, name: locale.NAV.INDEX, to: '/' || '/', show: true },
{ id: 1, icon: faInfoCircle, name: locale.NAV.ABOUT, to: '/article/about', show: true }
// { id: 7, icon: 'faGithub', name: 'Github', to: 'https://github.com/tangly1024', show: true },
// { id: 5, icon: 'faWeibo', name: '微博', to: 'https://weibo.com/tangly1024', show: true },
// { id: 4, icon: 'faEnvelope', name: locale.NAV.MAIL, to: 'mailto:tlyong1992@hotmail.com', show: true }
// { id: 2, icon: 'faRssSquare', name: locale.NAV.RSS, to: '/feed', show: true },
// { id: 3, icon: 'faCompass', name: '发现', to: 'https://search.tangly1024.com/', show: true }
// { id: 6, icon: 'faMapMarker', name: 'Fuzhou', to: '#', show: true },
// { id: 8, icon: 'faTwitter', name: 'Twitter', to: 'https://twitter.com/troy1024_1', show: true },
// { id: 9, icon: 'faTelegram', name: 'Telegram', to: 'https://t.me/tangly_1024', show: true }
]
return <nav id='nav'>
<div className='leading-8 text-gray-500 dark:text-gray-400'>
@@ -25,9 +27,9 @@ const MenuButtonGroup = ({ allowCollapse = false }) => {
const selected = router.asPath === link.to
return <Link key={link.id + link.icon} title={link.to} href={link.to} >
<a className={'py-2 px-5 hover:text-black dark:hover:text-white hover:bg-gray-100 cursor-pointer dark:hover:bg-gray-600 duration-100 flex flex-nowrap align-middle' +
(selected ? 'bg-gray-200 dark:bg-black dark:text-white text-black ' : '') } >
<div className='my-auto w-5 text-2xl justify-center flex'>
<i className={'fa ' + link.icon} />
(selected ? 'bg-gray-200 dark:bg-black dark:text-white text-black ' : '')} >
<div className='my-auto w-5 justify-center flex'>
<FontAwesomeIcon icon={link.icon} />
</div>
<div className={'ml-4 w-32'}>{link.name}</div>
</a>