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

点击文章日期跳转至归档

Browse Source
This commit is contained in:
tangly
2021-12-05 12:47:47 +08:00
parent a71434ddf9
commit 89af6aba78
4 changed files with 9 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
components/BlogPostArchive.js
View File

@@ -13,19 +13,17 @@ const BlogPostArchive = ({ posts = [], archiveTitle }) => {
if (!posts || posts.length === 0) {
return <></>
} else {
return <div className='py-2' ref={targetRef}>
<div className='py-2 text-3xl dark:text-white'>{archiveTitle}</div>
{/* 文章列表 */}
return <div ref={targetRef}>
<div className='pt-14 pb-4 text-3xl dark:text-white' id={archiveTitle}>{archiveTitle}</div>
<ul className='flex flex-wrap space-y-1'>
{posts.map(post => (
<Link key={post.id} href={`${BLOG.path}/article/${post.slug}`} passHref>
<li className='w-full border-l pl-2 hover:underline cursor-pointer hover:scale-105 transform duration-500'>
<span className='text-gray-400'>{post.date.start_date}</span> &nbsp; <span className='dark:text-blue-400 text-blue-600'>{post.title}</span>
<div name={post?.date?.start_date}><span className='text-gray-400'>{post.date.start_date}</span> &nbsp; <span className='dark:text-blue-400 text-blue-600'>{post.title}</span></div>
</li>
</Link>
))}
</ul>
</div>
}
}

2
components/MenuButtonGroup.js
View File

@@ -25,7 +25,7 @@ const MenuButtonGroup = ({ allowCollapse = false }) => {
<div className='leading-8 text-gray-500 dark:text-gray-400'>
{links.map(link => {
if (link.show) {
const selected = router.asPath === link.to
const selected = router.pathname === 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 ? 'font-bold bg-gray-200 dark:bg-black dark:text-white text-black ' : '')} >

2
pages/archive/index.js
View File

@@ -59,7 +59,7 @@ const Index = ({ allPosts, tags, categories }) => {
<BaseLayout meta={meta} tags={tags} categories={categories}>
<div className='flex-grow bg-gray-200 dark:bg-black shadow-inner pt-16 '>
<StickyBar>
<div className='py-4 text-lg lg:mx-14 dark:text-gray-200'><FontAwesomeIcon icon={faArchive} className='mr-4'/>{locale.NAV.ARCHIVE}</div>
<div className='py-2.5 text-lg lg:mx-14 dark:text-gray-200'><FontAwesomeIcon icon={faArchive} className='mr-4'/>{locale.NAV.ARCHIVE}</div>
</StickyBar>
<div className='mt-20 mx-2 lg:mx-20 bg-white p-12 dark:bg-gray-800'>
{Object.keys(archivePosts).map(archiveTitle => (

11
pages/article/[slug].js
View File

@@ -6,7 +6,6 @@ import Progress from '@/components/Progress'
import TagItem from '@/components/TagItem'
import formatDate from '@/lib/formatDate'
import { Code, Collection, CollectionRow, Equation, NotionRenderer } from 'react-notion-x'
import RewardButton from '@/components/RewardButton'
import ShareBar from '@/components/ShareBar'
import Comment from '@/components/Comment'
import BaseLayout from '@/layouts/BaseLayout'
@@ -47,6 +46,7 @@ const ArticleDetail = ({ post, blockMap, tags, prev, next, allPosts, categories
const drawerRight = useRef(null)
const url = BLOG.link + useRouter().asPath
const { locale } = useGlobal()
const date = formatDate(post?.date?.start_date || post.createdTime, BLOG.lang)
return <BaseLayout meta={meta} tags={tags} post={post} totalPosts={allPosts} categories={categories}>
<Progress targetRef={targetRef} />
@@ -56,7 +56,7 @@ const ArticleDetail = ({ post, blockMap, tags, prev, next, allPosts, categories
<div className='max-w-5xl mx-auto mt-16 xl:mt-32 w-screen md:w-full '>
{post.type && !post.type.includes('Page') && (<>
<header className='w-full h-60 lg:h-96 transform duration-200 md:flex-shrink-0'>
<Image src={(post.page_cover && post.page_cover.length > 1) ? post.page_cover : BLOG.defaultImgCover} loading='lazy' objectFit='cover' layout='fill' alt={post.title} />
<Image src={(post.page_cover && post.page_cover.length > 1) ? post.page_cover : BLOG.defaultImgCover} loading='eager' objectFit='cover' layout='fill' alt={post.title} />
</header>
</>)}
@@ -71,12 +71,9 @@ const ArticleDetail = ({ post, blockMap, tags, prev, next, allPosts, categories
</div>
</Link>
{post.type[0] !== 'Page' && (
<Link href='/archive' passHref>
<Link href={`/archive#${post?.date?.start_date?.substr(0, 7)}`} passHref>
<div className='pl-1 cursor-pointer hover:text-gray-700 dark:hover:text-gray-200 text-gray-400 dark:text-gray-400 leading-10'>
{formatDate(
post?.date?.start_date || post.createdTime,
BLOG.lang
)}
{date}
</div>
</Link>
)}