微调组件,首页和博客页分离

This commit is contained in:
tangly1024
2021-10-14 09:42:00 +08:00
parent 811c2522ba
commit 408c358da7
9 changed files with 145 additions and 25 deletions

View File

@@ -8,7 +8,7 @@ const CommonHead = ({ meta }) => {
return <Head>
<title>{meta.title}</title>
<meta content={BLOG.darkBackground} name='theme-color' />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
<meta name='robots' content='follow, index' />
<meta charSet='UTF-8' />
{BLOG.seo.googleSiteVerification && (

View File

@@ -7,9 +7,9 @@ const Footer = ({ fullWidth = true }) => {
<footer
className='flex-shrink-0 justify-center text-center m-auto w-full mx-auto text-gray-500 dark:text-gray-400 text-sm text-gray-400 p-6'
>
<span className='fa fa-copyright leading-6'> {` ${y}`} <span>Made with by <a href='https://www.tangly1024.com/article/about' className='underline'>@tangly1024</a>. Powered by <a href='https://notion.so' className='underline'>Notion</a> & <a href='https://vercel.com' className='underline'>Vercel</a>.</span> </span>
<span className='fa fa-copyright leading-6'> {` ${y}`} <span> <a href='https://www.tangly1024.com/article/about' className='underline font-bold'>tangly1024.com</a>. Powered by <a href='https://notion.so' className='underline font-bold'>Notion</a> & <a href='https://vercel.com' className='underline font-bold'>Vercel</a>.</span> </span>
<br />
<span className='fa fa-shield leading-6 mr-2'> <a href='https://beian.miit.gov.cn/' className='ml-1'>闽ICP备20010331号</a></span>
<span className='fa fa-shield leading-6 mr-2'> <a href='https://beian.miit.gov.cn/' className='ml-1 font-bold'>闽ICP备20010331号</a></span>
<span id='busuanzi_container_site_pv' className='hidden'>
<a id='busuanzi_container_site_pv' target='_blank' className='fa fa-eye' rel='noreferrer'

View File

@@ -5,10 +5,12 @@ import { useLocale } from '@/lib/locale'
/**
* 跳转到网页顶部
* 当屏幕下滑500像素后会出现该控件
* @param targetRef 关联高度的目标html标签
* @param showPercent 是否显示百分比
* @returns {JSX.Element}
* @constructor
*/
const JumpToTop = ({ targetRef }) => {
const JumpToTop = ({ targetRef, showPercent = true }) => {
const locale = useLocale()
const [show, switchShow] = useState(false)
const [percent, changePercent] = useState(0)
@@ -35,9 +37,11 @@ const JumpToTop = ({ targetRef }) => {
<div
className='border dark:border-gray-500 dark:bg-gray-600 bg-white cursor-pointer hover:shadow-2xl'
onClick={() => window.scrollTo({ top: 0, behavior: 'smooth' })}>
<div className='absolute bg-white dark:text-gray-200 dark:bg-gray-600 z-20 hover:opacity-0 w-11 py-3 text-center'>
{showPercent && (
<div className='absolute bg-white dark:text-gray-200 dark:bg-gray-600 z-20 hover:opacity-0 w-11 py-3 text-center'>
{percent}%
</div>
</div>
)}
<a className='dark:text-gray-200 fa fa-arrow-up p-4 transform hover:scale-150 duration-200'
title={locale.POST.TOP} />
</div>

View File

@@ -14,7 +14,7 @@ const TopNav = ({ tags, currentTag, post }) => {
<Drawer post={post} currentTag={currentTag} cRef={drawer} />
<div id='sticky-nav'
className='transform xl:mt-0 duration-500 bg-white dark:bg-gray-800 border-b dark:border-gray-700'>
className='transform 2xl:mt-0 duration-500 bg-white dark:bg-gray-800 border-b dark:border-gray-700'>
{/* 导航栏 */}
<div
className=' text-sm m-auto w-full flex flex-row justify-between items-center px-4 py-2 shadow-md '