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

Fix Logo position & Fix Nav link

Browse Source
This commit is contained in:
emengweb
2023-10-18 17:38:48 +08:00
parent b61a72abb9
commit 55e790be18
5 changed files with 112 additions and 101 deletions
Download Patch File Download Diff File Expand all files Collapse all files

202
themes/nav/index.js
View File

@@ -33,6 +33,8 @@ import Link from 'next/link'
import dynamic from 'next/dynamic'
import { MenuItem } from './components/MenuItem'
import LogoBar from './components/LogoBar'
const WWAds = dynamic(() => import('@/components/WWAds'), { ssr: false })
// 主题全局变量
@@ -75,7 +77,7 @@ const LayoutBase = (props) => {
<Style/>
{/* 主题样式根基 */}
<div id='theme-onenav' className=' dark:bg-hexo-black-gray w-full h-screen min-h-screen justify-center dark:text-gray-300'>
<div id='theme-onenav' className='dark:bg-hexo-black-gray w-full h-screen min-h-screen justify-center dark:text-gray-300'>
{/* 端顶部导航栏 */}
<TopNavBar {...props} />
@@ -85,7 +87,10 @@ const LayoutBase = (props) => {
{/* 左侧推拉抽屉 */}
<div className={'font-sans hidden md:block dark:border-transparent relative z-10 mx-4 w-52 max-h-full pb-44'}>
{/* 图标Logo */}
<div className='hidden md:block w-full top-0 left-5 md:left-4 z-40 pt-3 md:pt-4'>
<LogoBar {...props} />
</div>
<div className='main-menu z-20 pl-9 pr-7 pb-5 sticky pt-1 top-20 overflow-y-scroll h-fit max-h-full scroll-hidden bg-white dark:bg-neutral-800 rounded-xl '>
{/* 嵌入 */}
{slotLeft}
@@ -185,20 +190,21 @@ const LayoutPostListIndex = props => {
* @returns
*/
const LayoutPostList = props => {
const { posts } = props
// 顶部如果是按照分类或标签查看文章列表，列表顶部嵌入一个横幅
// 如果是搜索，则列表顶部嵌入 搜索框
return (
<LayoutBase {...props} >
<div className='w-full max-w-7xl mx-auto justify-center mt-8'>
<div id='posts-wrapper' class='card-list grid gap-4 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5'>
{posts?.map(post => (
<BlogPostCard key={post.id} post = {post} className='card' />
))}
</div>
</div>
</LayoutBase>
)
return <LayoutBase {...props}></LayoutBase>
// const { posts } = props
// // 顶部如果是按照分类或标签查看文章列表，列表顶部嵌入一个横幅
// // 如果是搜索，则列表顶部嵌入 搜索框
// return (
// <LayoutBase {...props} >
// <div className='w-full max-w-7xl mx-auto justify-center mt-8'>
// <div id='posts-wrapper' class='card-list grid gap-4 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5'>
// {posts?.map(post => (
// <BlogPostCard key={post.id} post = {post} className='card' />
// ))}
// </div>
// </div>
// </LayoutBase>
// )
}
/**
@@ -208,44 +214,45 @@ const LayoutPostList = props => {
*/
const LayoutSlug = (props) => {
const { post, lock, validPassword } = props
if(post?.slug?.startsWith('http') || post?.slug == '' || post?.slug == null){
return <LayoutBase {...props}></LayoutBase>
}else{
return <LayoutBase {...props} >
{/* 文章锁 */}
{lock && <ArticleLock validPassword={validPassword} />}
return (
<LayoutBase {...props} >
{/* 文章锁 */}
{lock && <ArticleLock validPassword={validPassword} />}
{!lock && <div id='container'>
{!lock && <div id='container'>
{/* title */}
<h1 className="text-3xl pt-4 md:pt-12 dark:text-gray-300">{post?.title}</h1>
{/* title */}
<h1 className="text-3xl pt-4 md:pt-12 dark:text-gray-300">{post?.title}</h1>
{/* Notion文章主体 */}
{post && (<section id="article-wrapper" className="px-1">
<NotionPage post={post} />
{/* Notion文章主体 */}
{post && (<section id="article-wrapper" className="px-1">
<NotionPage post={post} />
{/* 分享 */}
{/* <ShareBar post={post} /> */}
{/* 文章分类和标签信息 */}
<div className='flex justify-between'>
{CONFIG.POST_DETAIL_CATEGORY && post?.category && <CategoryItem category={post.category} />}
<div>
{CONFIG.POST_DETAIL_TAG && post?.tagItems?.map(tag => <TagItemMini key={tag.name} tag={tag} />)}
</div>
</div>
{/* 分享 */}
{/* <ShareBar post={post} /> */}
{/* 文章分类和标签信息 */}
<div className='flex justify-between'>
{CONFIG.POST_DETAIL_CATEGORY && post?.category && <CategoryItem category={post.category} />}
<div>
{CONFIG.POST_DETAIL_TAG && post?.tagItems?.map(tag => <TagItemMini key={tag.name} tag={tag} />)}
</div>
</div>
{/* 上一篇、下一篇文章 */}
{/* {post?.type === 'Post' && <ArticleAround prev={prev} next={next} />} */}
{/* 上一篇、下一篇文章 */}
{/* {post?.type === 'Post' && <ArticleAround prev={prev} next={next} />} */}
<AdSlot />
<WWAds className='w-full' orientation='horizontal'/>
<AdSlot />
<WWAds className='w-full' orientation='horizontal'/>
<Comment frontMatter={post} />
</section>)}
<Comment frontMatter={post} />
</section>)}
<TocDrawer {...props} />
</div>}
</LayoutBase>
)
<TocDrawer {...props} />
</div>}
</LayoutBase>
}
}
/**
@@ -265,13 +272,14 @@ const LayoutSearch = (props) => {
* @returns
*/
const LayoutArchive = (props) => {
const { archivePosts } = props
return <LayoutBase {...props}></LayoutBase>
// const { archivePosts } = props
return <LayoutBase {...props}>
<div className="mb-10 pb-20 md:py-12 py-3 min-h-full">
{Object.keys(archivePosts)?.map(archiveTitle => <BlogArchiveItem key={archiveTitle} archiveTitle={archiveTitle} archivePosts={archivePosts} />)}
</div>
</LayoutBase>
// return <LayoutBase {...props}>
// <div className="mb-10 pb-20 md:py-12 py-3 min-h-full">
// {Object.keys(archivePosts)?.map(archiveTitle => <BlogArchiveItem key={archiveTitle} archiveTitle={archiveTitle} archivePosts={archivePosts} />)}
// </div>
// </LayoutBase>
}
/**
@@ -287,57 +295,59 @@ const Layout404 = props => {
* 分类列表
*/
const LayoutCategoryIndex = (props) => {
const { categoryOptions } = props
const { locale } = useGlobal()
return <LayoutBase {...props}>
<div className='bg-white dark:bg-gray-700 py-10'>
<div className='dark:text-gray-200 mb-5'>
<i className='mr-4 fas fa-th' />{locale.COMMON.CATEGORY}:
</div>
<div id='category-list' className='duration-200 flex flex-wrap'>
{categoryOptions?.map(category => {
return (
<Link
key={category.name}
href={`/category/${category.name}`}
passHref
legacyBehavior>
<div
className={'hover:text-black dark:hover:text-white dark:text-gray-300 dark:hover:bg-gray-600 px-5 cursor-pointer py-2 hover:bg-gray-100'}>
<i className='mr-4 fas fa-folder' />{category.name}({category.count})
</div>
</Link>
)
})}
</div>
</div>
</LayoutBase>
return <LayoutBase {...props}></LayoutBase>
// const { categoryOptions } = props
// const { locale } = useGlobal()
// return <LayoutBase {...props}>
// <div className='bg-white dark:bg-gray-700 py-10'>
// <div className='dark:text-gray-200 mb-5'>
// <i className='mr-4 fas fa-th' />{locale.COMMON.CATEGORY}:
// </div>
// <div id='category-list' className='duration-200 flex flex-wrap'>
// {categoryOptions?.map(category => {
// return (
// <Link
// key={category.name}
// href={`/category/${category.name}`}
// passHref
// legacyBehavior>
// <div
// className={'hover:text-black dark:hover:text-white dark:text-gray-300 dark:hover:bg-gray-600 px-5 cursor-pointer py-2 hover:bg-gray-100'}>
// <i className='mr-4 fas fa-folder' />{category.name}({category.count})
// </div>
// </Link>
// )
// })}
// </div>
// </div>
// </LayoutBase>
}
/**
* 标签列表
*/
const LayoutTagIndex = (props) => {
const { tagOptions } = props
const { locale } = useGlobal()
return <LayoutBase {...props}></LayoutBase>
// const { tagOptions } = props
// const { locale } = useGlobal()
return <LayoutBase {...props}>
<div className="bg-white dark:bg-gray-700 py-10">
<div className="dark:text-gray-200 mb-5">
<i className="mr-4 fas fa-tag" />
{locale.COMMON.TAGS}:
</div>
<div id="tags-list" className="duration-200 flex flex-wrap">
{tagOptions?.map(tag => {
return (
<div key={tag.name} className="p-2">
<TagItemMini key={tag.name} tag={tag} />
</div>
)
})}
</div>
</div>
</LayoutBase>
// return <LayoutBase {...props}>
// <div className="bg-white dark:bg-gray-700 py-10">
// <div className="dark:text-gray-200 mb-5">
// <i className="mr-4 fas fa-tag" />
// {locale.COMMON.TAGS}:
// </div>
// <div id="tags-list" className="duration-200 flex flex-wrap">
// {tagOptions?.map(tag => {
// return (
// <div key={tag.name} className="p-2">
// <TagItemMini key={tag.name} tag={tag} />
// </div>
// )
// })}
// </div>
// </div>
// </LayoutBase>
}
export {