d0zingcat/NotionNext
1
0
Fork 0
mirror of https://github.com/d0zingcat/NotionNext.git synced 2026-05-30 15:10:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

站点信息读取Notion数据

Browse Source
This commit is contained in:
tangly1024
2022-03-30 15:34:25 +08:00
parent 914e9a108f
commit 53c004843e
61 changed files with 322 additions and 463 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
themes/example/LayoutArchive.js
View File

@@ -1,11 +1,9 @@
import BLOG from '@/blog.config'
import { useGlobal } from '@/lib/global'
import Link from 'next/link'
import LayoutBase from './LayoutBase'
export const LayoutArchive = props => {
const { posts } = props
const { locale } = useGlobal()
const postsSortByDate = Object.create(posts)
postsSortByDate.sort((a, b) => {
@@ -14,12 +12,6 @@ export const LayoutArchive = props => {
return dateB - dateA
})
const meta = {
title: `${locale.NAV.ARCHIVE} | ${BLOG.TITLE}`,
description: BLOG.DESCRIPTION,
type: 'website'
}
const archivePosts = {}
postsSortByDate.forEach(post => {
@@ -31,7 +23,7 @@ export const LayoutArchive = props => {
}
})
return (
<LayoutBase {...props} meta={meta}>
<LayoutBase {...props}>
<div className="mb-10 pb-20 md:p-12 p-3 min-h-full">
{Object.keys(archivePosts).map(archiveTitle => (
<div key={archiveTitle}>

8
themes/example/LayoutBase.js
View File

@@ -11,7 +11,7 @@ import { useGlobal } from '@/lib/global'
* @constructor
*/
const LayoutBase = props => {
const { children, meta, customNav } = props
const { children, meta, customNav, siteInfo } = props
const { locale } = useGlobal()
const d = new Date()
const currentYear = d.getFullYear()
@@ -35,10 +35,10 @@ const LayoutBase = props => {
<div className="w-full flex justify-center my-2">
<div className=" max-w-6xl justify-between w-full flex">
<section>
<Link title={BLOG.TITLE} href={'/'}>
<Link title={siteInfo.title} href={'/'}>
<a className={'cursor-pointer flex items-center hover:underline'}>
<i className={'fas fa-home mr-1'} />
<div className="text-center">{BLOG.TITLE} </div>
<div className="text-center">{siteInfo.title} </div>
</a>
</Link>
</section>
@@ -126,7 +126,7 @@ const LayoutBase = props => {
<span className="px-1 busuanzi_value_site_uv"> </span>{' '}
</span>
<br />
<h1>{meta?.title || BLOG.TITLE}</h1>
<h1>{meta?.title || siteInfo.title}</h1>
</footer>
</div>
)

10
themes/example/LayoutSlug.js
View File

@@ -1,4 +1,3 @@
import BLOG from '@/blog.config'
import { getPageTableOfContents } from 'notion-utils'
import 'prismjs'
import 'prismjs/components/prism-bash'
@@ -24,13 +23,6 @@ const mapPageUrl = id => {
export const LayoutSlug = props => {
const { post, lock, validPassword } = props
const meta = {
title: `${post.title} | ${BLOG.TITLE}`,
description: post.summary,
type: 'article',
tags: post.tags
}
if (!lock && post?.blockMap?.block) {
post.content = Object.keys(post.blockMap.block)
post.toc = getPageTableOfContents(post, post.blockMap)
@@ -55,7 +47,7 @@ export const LayoutSlug = props => {
}
})
return (
<LayoutBase {...props} meta={meta}>
<LayoutBase {...props}>
<div>
<h2>{post?.title}</h2>

2
themes/fukasawa/Layout404.js
View File

@@ -1,5 +1,5 @@
import LayoutBase from './LayoutBase'
export const Layout404 = (props) => {
export const Layout404 = props => {
return <LayoutBase {...props}>404</LayoutBase>
}

12
themes/fukasawa/LayoutArchive.js
View File

@@ -1,11 +1,8 @@
import BLOG from '@/blog.config'
import { useGlobal } from '@/lib/global'
import { useEffect } from 'react'
import BlogArchiveItem from './components/BlogPostArchive'
import LayoutBase from './LayoutBase'
export const LayoutArchive = (props) => {
const { locale } = useGlobal()
const { posts } = props
// 深拷贝
const postsSortByDate = Object.create(posts)
@@ -16,13 +13,6 @@ export const LayoutArchive = (props) => {
const dateB = new Date(b?.date.start_date || b.createdTime)
return dateB - dateA
})
const meta = {
title: `${locale.NAV.ARCHIVE} | ${BLOG.TITLE}`,
description: BLOG.DESCRIPTION,
type: 'website'
}
const archivePosts = {}
postsSortByDate.forEach(post => {
@@ -47,7 +37,7 @@ export const LayoutArchive = (props) => {
}
}
}, [])
return <LayoutBase {...props} meta={meta}>
return <LayoutBase {...props}>
<div className="mb-10 pb-20 bg-white md:p-12 p-3 dark:bg-gray-800 shadow-md min-h-full">
{Object.keys(archivePosts).map(archiveTitle => (
<BlogArchiveItem

2
themes/fukasawa/LayoutCategory.js
View File

@@ -1,7 +1,7 @@
import BlogListPage from './components/BlogListPage'
import LayoutBase from './LayoutBase'
export const LayoutCategory = (props) => {
export const LayoutCategory = props => {
return <LayoutBase {...props}>
<BlogListPage page={props.page} posts={props.posts} postCount={props.postCount} />
</LayoutBase>

8
themes/fukasawa/LayoutCategoryIndex.js
View File

@@ -1,4 +1,3 @@
import BLOG from '@/blog.config'
import { useGlobal } from '@/lib/global'
import Link from 'next/link'
import LayoutBase from './LayoutBase'
@@ -6,12 +5,7 @@ import LayoutBase from './LayoutBase'
export const LayoutCategoryIndex = (props) => {
const { locale } = useGlobal()
const { categories } = props
const meta = {
title: `${locale.COMMON.CATEGORY} | ${BLOG.TITLE}`,
description: BLOG.DESCRIPTION,
type: 'website'
}
return <LayoutBase {...props} meta={meta}>
return <LayoutBase {...props}>
<div className='bg-white dark:bg-gray-700 px-10 py-10 shadow'>
<div className='dark:text-gray-200 mb-5'>
<i className='mr-4 fas fa-th' />{locale.COMMON.CATEGORY}:

10
themes/fukasawa/LayoutSlug.js
View File

@@ -1,4 +1,3 @@
import BLOG from '@/blog.config'
import { getPageTableOfContents } from 'notion-utils'
import 'prismjs'
import 'prismjs/components/prism-bash'
@@ -12,20 +11,13 @@ import { ArticleLock } from './components/ArticleLock'
export const LayoutSlug = (props) => {
const { post, lock, validPassword } = props
const meta = {
title: `${post.title} | ${BLOG.TITLE}`,
description: post.summary,
type: 'article',
tags: post.tags
}
if (!lock && post?.blockMap?.block) {
post.content = Object.keys(post.blockMap.block)
post.toc = getPageTableOfContents(post, post.blockMap)
}
return (
<LayoutBase meta={meta} {...props} >
<LayoutBase {...props} >
{!lock && <ArticleDetail {...props} />}
{lock && <ArticleLock password={post.password} validPassword={validPassword} />}
</LayoutBase>

9
themes/fukasawa/LayoutTagIndex.js
View File

@@ -1,4 +1,3 @@
import BLOG from '@/blog.config'
import { useGlobal } from '@/lib/global'
import TagItem from './components/TagItem'
import LayoutBase from './LayoutBase'
@@ -6,13 +5,7 @@ import LayoutBase from './LayoutBase'
export const LayoutTagIndex = (props) => {
const { locale } = useGlobal()
const { tags } = props
const meta = {
title: `${locale.COMMON.TAGS} | ${BLOG.TITLE}`,
description: BLOG.DESCRIPTION,
type: 'website'
}
return <LayoutBase {...props} meta={meta}>
return <LayoutBase {...props} >
<div className='bg-white dark:bg-gray-700 px-10 py-10 shadow'>
<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'>

7
themes/fukasawa/components/AsideLeft.js
View File

@@ -1,4 +1,3 @@
import BLOG from '@/blog.config'
import Logo from './Logo'
import GroupCategory from './GroupCategory'
import GroupMenu from './GroupMenu'
@@ -9,10 +8,10 @@ import Catalog from './Catalog'
import { useRouter } from 'next/router'
function AsideLeft (props) {
const { tags, currentTag, categories, currentCategory, post, slot } = props
const { tags, currentTag, categories, currentCategory, post, slot, siteInfo } = props
const router = useRouter()
return <div className='w-72 bg-white dark:bg-gray-800 min-h-screen px-10 py-14 hidden lg:block'>
<Logo />
<Logo {...props}/>
<section className='flex flex-col text-gray-600'>
<hr className='w-12 my-8' />
@@ -26,7 +25,7 @@ function AsideLeft (props) {
<section className='flex flex-col dark:text-gray-300'>
<hr className='w-12 my-8' />
{ BLOG.DESCRIPTION }
{ siteInfo.description }
</section>
{router.asPath !== '/tag' && <section className='flex flex-col'>

6
themes/fukasawa/components/Logo.js
View File

@@ -1,10 +1,10 @@
import BLOG from '@/blog.config'
import Link from 'next/link'
function Logo () {
const Logo = props => {
const { siteInfo } = props
return <section className='flex'>
<Link href='/'>
<a className='hover:bg-black hover:text-white border-black border-2 duration-500 px-4 py-2 cursor-pointer dark:text-gray-300 dark:border-gray-300 font-black'>{BLOG.TITLE}</a>
<a className='hover:bg-black hover:text-white border-black border-2 duration-500 px-4 py-2 cursor-pointer dark:text-gray-300 dark:border-gray-300 font-black'>{siteInfo.title}</a>
</Link>
</section>
}

4
themes/fukasawa/components/TopNav.js
View File

@@ -8,7 +8,7 @@ import Logo from './Logo'
* @param {*} param0
* @returns
*/
const TopNav = (props) => {
const TopNav = props => {
const [isOpen, changeShow] = useState(false)
const toggleMenuOpen = () => {
@@ -27,7 +27,7 @@ const TopNav = (props) => {
<div className='w-full flex justify-between items-center p-4 bg-white'>
{/* 左侧LOGO 标题 */}
<div className='flex flex-none flex-grow-0'>
<Logo/>
<Logo {...props}/>
</div>
<div className='flex'>
</div>

23
themes/hexo/Layout404.js
View File

@@ -1,34 +1,15 @@
import BLOG from '@/blog.config'
import { useRouter } from 'next/router'
import { useEffect } from 'react'
import LayoutBase from './LayoutBase'
export const Layout404 = props => {
const router = useRouter()
useEffect(() => {
// 延时3秒如果加载失败就返回首页
setTimeout(() => {
if (window) {
const article = document.getElementById('container')
if (!article) {
router.push('/').then(() => {
console.log('找不到页面', router.asPath)
})
}
}
}, 3000)
})
return (
<LayoutBase {...props} meta={{ title: `${BLOG.TITLE} | 页面找不到啦` }}>
<LayoutBase {...props}>
<div className="text-black w-full h-screen text-center justify-center content-center items-center flex flex-col">
<div className="dark:text-gray-200">
<h2 className="inline-block border-r-2 border-gray-600 mr-2 px-3 py-2 align-top">
<i className="mr-2 fas fa-spinner animate-spin" />
404
</h2>
<div className="inline-block text-left h-32 leading-10 items-center">
<h2 className="m-0 p-0">页面无法加载，即将返回首页</h2>
<h2 className="m-0 p-0">页面未找到</h2>
</div>
</div>
</div>

11
themes/hexo/LayoutArchive.js
View File

@@ -1,5 +1,3 @@
import BLOG from '@/blog.config'
import { useGlobal } from '@/lib/global'
import { useEffect } from 'react'
import BlogPostArchive from './components/BlogPostArchive'
import Card from './components/Card'
@@ -7,7 +5,6 @@ import LayoutBase from './LayoutBase'
export const LayoutArchive = (props) => {
const { posts } = props
const { locale } = useGlobal()
// 深拷贝
const postsSortByDate = Object.create(posts)
@@ -18,12 +15,6 @@ export const LayoutArchive = (props) => {
return dateB - dateA
})
const meta = {
title: `${locale.NAV.ARCHIVE} | ${BLOG.TITLE}`,
description: BLOG.DESCRIPTION,
type: 'website'
}
const archivePosts = {}
postsSortByDate.forEach(post => {
@@ -48,7 +39,7 @@ export const LayoutArchive = (props) => {
}
}
}, [])
return <LayoutBase {...props} meta={meta}>
return <LayoutBase {...props} >
<Card className='w-full'>
<div className="mb-10 pb-20 bg-white md:p-12 p-3 dark:bg-gray-800 min-h-full">
{Object.keys(archivePosts).map(archiveTitle => (

4
themes/hexo/LayoutBase.js
View File

@@ -18,7 +18,7 @@ import { useGlobal } from '@/lib/global'
* @constructor
*/
const LayoutBase = (props) => {
const { children, headerSlot, floatSlot, meta } = props
const { children, headerSlot, floatSlot, meta, siteInfo } = props
const [show, switchShow] = useState(false)
// const [percent, changePercent] = useState(0) // 页面阅读百分比
const rightAreaSlot = <Live2D/>
@@ -72,7 +72,7 @@ const LayoutBase = (props) => {
</div>
</div>
<Footer title={meta.title}/>
<Footer title={siteInfo.title}/>
</div>)
}

12
themes/hexo/LayoutCategory.js
View File

@@ -1,17 +1,9 @@
import BLOG from '@/blog.config'
import { useGlobal } from '@/lib/global'
import BlogPostListScroll from './components/BlogPostListScroll'
import LayoutBase from './LayoutBase'
export const LayoutCategory = (props) => {
export const LayoutCategory = props => {
const { tags, posts, category } = props
const { locale } = useGlobal()
const meta = {
title: `${category} | ${locale.COMMON.CATEGORY} | ${BLOG.TITLE}`,
description: BLOG.DESCRIPTION,
type: 'website'
}
return <LayoutBase {...props} meta={meta}>
return <LayoutBase {...props}>
<BlogPostListScroll posts={posts} tags={tags} currentCategory={category}/>
</LayoutBase>
}

8
themes/hexo/LayoutCategoryIndex.js
View File

@@ -1,4 +1,3 @@
import BLOG from '@/blog.config'
import { useGlobal } from '@/lib/global'
import Link from 'next/link'
import Card from './components/Card'
@@ -7,13 +6,8 @@ import LayoutBase from './LayoutBase'
export const LayoutCategoryIndex = props => {
const { categories } = props
const { locale } = useGlobal()
const meta = {
title: `${locale.COMMON.CATEGORY} | ${BLOG.TITLE}`,
description: BLOG.DESCRIPTION,
type: 'website'
}
return (
<LayoutBase {...props} meta={meta}>
<LayoutBase {...props}>
<Card className="w-full min-h-screen">
<div className="dark:text-gray-200 mb-5 mx-3">
<i className="mr-4 fas fa-th" />

2
themes/hexo/LayoutIndex.js
View File

@@ -4,7 +4,7 @@ import CONFIG_HEXO from './config_hexo'
import LayoutBase from './LayoutBase'
export const LayoutIndex = (props) => {
return <LayoutBase {...props} headerSlot={CONFIG_HEXO.HOME_BANNER_ENABLE && <Header/>}>
return <LayoutBase {...props} headerSlot={CONFIG_HEXO.HOME_BANNER_ENABLE && <Header {...props}/>}>
<BlogPostListPage {...props}/>
</LayoutBase>
}

8
themes/hexo/LayoutSlug.js
View File

@@ -1,4 +1,3 @@
import BLOG from '@/blog.config'
import { getPageTableOfContents } from 'notion-utils'
import 'prismjs'
import 'prismjs/components/prism-bash'
@@ -18,12 +17,6 @@ import LayoutBase from './LayoutBase'
export const LayoutSlug = props => {
const { post, lock, validPassword } = props
const meta = {
title: `${post.title} | ${BLOG.TITLE}`,
description: post.summary,
type: 'article',
tags: post.tags
}
if (!lock && post?.blockMap?.block) {
post.content = Object.keys(post.blockMap.block)
@@ -48,7 +41,6 @@ export const LayoutSlug = props => {
<LayoutBase
headerSlot={<HeaderArticle post={post}/>}
{...props}
meta={meta}
showCategory={false}
showTag={false}
floatSlot={floatSlot}

11
themes/hexo/LayoutTag.js
View File

@@ -1,19 +1,10 @@
import BLOG from '@/blog.config'
import { useGlobal } from '@/lib/global'
import BlogPostListScroll from './components/BlogPostListScroll'
import LayoutBase from './LayoutBase'
export const LayoutTag = (props) => {
const { tags, posts, tag } = props
const { locale } = useGlobal()
const meta = {
title: `${tag} | ${locale.COMMON.TAGS} | ${BLOG.TITLE}`,
description: BLOG.DESCRIPTION,
type: 'website'
}
return <LayoutBase {...props} meta={meta}>
return <LayoutBase {...props}>
<BlogPostListScroll posts={posts} tags={tags} currentTag={tag}/>
</LayoutBase>
}

8
themes/hexo/LayoutTagIndex.js
View File

@@ -1,4 +1,3 @@
import BLOG from '@/blog.config'
import { useGlobal } from '@/lib/global'
import Card from './components/Card'
import TagItemMini from './components/TagItemMini'
@@ -7,13 +6,8 @@ import LayoutBase from './LayoutBase'
export const LayoutTagIndex = props => {
const { tags } = props
const { locale } = useGlobal()
const meta = {
title: `${locale.COMMON.TAGS} | ${BLOG.TITLE}`,
description: BLOG.DESCRIPTION,
type: 'website'
}
return (
<LayoutBase {...props} meta={meta}>
<LayoutBase {...props}>
<Card className='w-full'>
<div className="dark:text-gray-200 mb-5 ml-4">
<i className="mr-4 fas fa-tag" />

2
themes/hexo/components/ArticleRecommend.js
View File

@@ -25,7 +25,7 @@ export default function ArticleRecommend ({ recommendPosts }) {
{recommendPosts.map(post => {
const headerImage = post?.page_cover
? `url("${post.page_cover}")`
: `url("/${CONFIG_HEXO.HOME_BANNER_IMAGE}")`
: `url("/${BLOG.HOME_BANNER_IMAGE}")`
return (
<Link key={post.id} title={post.title} href={`${BLOG.PATH}/article/${post.slug}`} passHref>

11
themes/hexo/components/Header.js
View File

@@ -1,4 +1,3 @@
import BLOG from '@/blog.config'
import { useGlobal } from '@/lib/global'
import { useEffect, useState } from 'react'
import Typed from 'typed.js'
@@ -12,10 +11,10 @@ let autoScroll = false
*
* @returns 头图
*/
export default function Header () {
const Header = props => {
const [typed, changeType] = useState()
const { isDarkMode } = useGlobal()
const { siteInfo } = props
useEffect(() => {
scrollTrigger()
updateHeaderHeight()
@@ -102,11 +101,11 @@ export default function Header () {
className="duration-500 md:bg-fixed w-full bg-cover bg-center h-screen bg-black text-white"
style={{
backgroundImage:
`linear-gradient(rgba(0, 0, 0, 0.8), rgba(0,0,0,0.2), rgba(0, 0, 0, 0.8) ),url("${CONFIG_HEXO.HOME_BANNER_IMAGE}")`
`linear-gradient(rgba(0, 0, 0, 0.8), rgba(0,0,0,0.2), rgba(0, 0, 0, 0.8) ),url("${siteInfo.pageCover}")`
}}
>
<div className="absolute flex flex-col h-full items-center justify-center w-full font-sans">
<div className='text-4xl md:text-5xl text-white shadow-text'>{BLOG.TITLE}</div>
<div className='text-4xl md:text-5xl text-white shadow-text'>{siteInfo.title}</div>
<div className='mt-2 h-12 items-center text-center shadow-text text-white text-lg'>
<span id='typed'/>
</div>
@@ -122,3 +121,5 @@ export default function Header () {
</header>
)
}
export default Header

4
themes/hexo/components/HeaderArticle.js
View File

@@ -1,11 +1,11 @@
import Link from 'next/link'
import { useGlobal } from '@/lib/global'
import formatDate from '@/lib/formatDate'
import CONFIG_HEXO from '../config_hexo'
import { useEffect } from 'react'
import BLOG from '@/blog.config'
export default function HeaderArticle ({ post }) {
const headerImage = post?.page_cover ? `url("${post.page_cover}")` : `url("/${CONFIG_HEXO.HOME_BANNER_IMAGE}")`
const headerImage = post?.page_cover ? `url("${post.page_cover}")` : `url("/${BLOG.HOME_BANNER_IMAGE}")`
const { isDarkMode } = useGlobal()
const { locale } = useGlobal()

3
themes/hexo/components/LatestPostsGroup.js
View File

@@ -2,7 +2,6 @@ import BLOG from '@/blog.config'
import { useGlobal } from '@/lib/global'
import Link from 'next/link'
import { useRouter } from 'next/router'
import CONFIG_HEXO from '../config_hexo'
/**
* 最新文章列表
@@ -30,7 +29,7 @@ const LatestPostsGroup = ({ posts }) => {
const selected = currentPath === `${BLOG.PATH}/article/${post.slug}`
const headerImage = post?.page_cover
? `url("${post.page_cover}")`
: `url("/${CONFIG_HEXO.HOME_BANNER_IMAGE}")`
: `url("/${BLOG.HOME_BANNER_IMAGE}")`
return (
<Link

6
themes/hexo/components/Logo.js
View File

@@ -1,11 +1,11 @@
import Link from 'next/link'
import BLOG from '@/blog.config'
import React from 'react'
const Logo = () => {
const Logo = props => {
const { siteInfo } = props
return <Link href='/' passHref>
<div className='flex flex-col justify-center items-center cursor-pointer space-y-3'>
<div className='font-sans text-lg p-1.5 rounded bg-black text-white dark:border-white border-black border'> {BLOG.TITLE}</div>
<div className='font-sans text-lg p-1.5 rounded bg-black text-white dark:border-white border-black border'> {siteInfo.title}</div>
</div>
</Link>
}

4
themes/hexo/components/TopNav.js
View File

@@ -18,7 +18,7 @@ let windowTop = 0
* @param {*} param0
* @returns
*/
const TopNav = (props) => {
const TopNav = props => {
const { tags, currentTag, categories, currentCategory } = props
const { locale } = useGlobal()
const searchDrawer = useRef()
@@ -94,7 +94,7 @@ const TopNav = (props) => {
<div id='sticky-nav' className={`${CONFIG_HEXO.NAV_TYPE !== 'normal' ? 'fixed bg-white' : ' bg-none -mb-10'} animate__animated animate__fadeIn dark:bg-hexo-black-gray dark:text-gray-200 text-black w-full top-0 z-20 transform duration-200 font-san `}>
<div className='w-full flex justify-between items-center px-4 py-2 border dark:border-transparent'>
<div className='flex'>
<Logo/>
<Logo {...props}/>
</div>
{/* 右侧功能 */}

1
themes/hexo/config_hexo.js
View File

@@ -1,7 +1,6 @@
const CONFIG_HEXO = {
HOME_BANNER_ENABLE: true,
HOME_BANNER_GREETINGS: ['Hi，我是一个程序员', 'Hi，我是一个打工人', 'Hi，我是一个干饭人', '欢迎来到我的博客🎉'], // 首页大图标语文字
HOME_BANNER_IMAGE: './bg_image.jpg', // see /public/bg_image.jpg
// 菜单配置
MENU_CATEGORY: true, // 显示分类

2
themes/medium/Layout404.js
View File

@@ -1,6 +1,6 @@
import LayoutBase from './LayoutBase'
export const Layout404 = (props) => {
export const Layout404 = props => {
return <LayoutBase {...props}>
<div className='w-full h-96 py-80 flex justify-center items-center'>404 Not found.</div>
</LayoutBase>

10
themes/medium/LayoutArchive.js
View File

@@ -1,11 +1,9 @@
import BLOG from '@/blog.config'
import { useGlobal } from '@/lib/global'
import Link from 'next/link'
import LayoutBase from './LayoutBase'
export const LayoutArchive = props => {
const { posts } = props
const { locale } = useGlobal()
const postsSortByDate = Object.create(posts)
postsSortByDate.sort((a, b) => {
@@ -14,12 +12,6 @@ export const LayoutArchive = props => {
return dateB - dateA
})
const meta = {
title: `${locale.NAV.ARCHIVE} | ${BLOG.TITLE}`,
description: BLOG.DESCRIPTION,
type: 'website'
}
const archivePosts = {}
postsSortByDate.forEach(post => {
@@ -31,7 +23,7 @@ export const LayoutArchive = props => {
}
})
return (
<LayoutBase {...props} meta={meta}>
<LayoutBase {...props}>
<div className="mb-10 pb-20 md:p-12 p-3 min-h-full">
{Object.keys(archivePosts).map(archiveTitle => (
<div key={archiveTitle}>

2
themes/medium/LayoutCategory.js
View File

@@ -1,7 +1,7 @@
import LayoutBase from './LayoutBase'
import BlogPostListScroll from './components/BlogPostListScroll'
export const LayoutCategory = (props) => {
export const LayoutCategory = props => {
const { category } = props
const slotTop = <div className='flex items-center font-sans p-8'><div className='text-xl'><i className='mr-2 fas fa-th'/>分类：</div>{category}</div>

8
themes/medium/LayoutSlug.js
View File

@@ -1,4 +1,3 @@
import BLOG from '@/blog.config'
import { getPageTableOfContents } from 'notion-utils'
import LayoutBase from './LayoutBase'
@@ -11,12 +10,6 @@ import { ArticleLock } from './components/ArticleLock'
export const LayoutSlug = props => {
const { post, lock, validPassword } = props
const meta = {
title: `${post.title} | ${BLOG.TITLE}`,
description: post.summary,
type: 'article',
tags: post.tags
}
if (!lock && post?.blockMap?.block) {
post.content = Object.keys(post.blockMap.block)
@@ -53,7 +46,6 @@ export const LayoutSlug = props => {
return (
<LayoutBase
{...props}
meta={meta}
showInfoCard={true}
slotRight={slotRight}
>

6
themes/medium/components/LogoBar.js
View File

@@ -1,10 +1,10 @@
import BLOG from '@/blog.config'
import Link from 'next/link'
export default function LogoBar () {
export default function LogoBar (props) {
const { siteInfo } = props
return <div id='top-wrapper' className='w-full flex items-center font-sans'>
<Link href='/'>
<a className='text-md md:text-xl dark:text-gray-200'>{BLOG.TITLE}</a>
<a className='text-md md:text-xl dark:text-gray-200'>{siteInfo.title}</a>
</Link>
</div>
}

2
themes/medium/components/TopNavBar.js
View File

@@ -13,7 +13,7 @@ export default function TopNavBar (props) {
return <div id='top-nav' className={'sticky top-0 lg:relative w-full z-40 ' + className}>
<div className='flex w-full h-12 shadow bg-white dark:bg-gray-900 px-5 items-between'>
<LogoBar />
<LogoBar {...props}/>
{/* 顶部菜单 */}
<div className='flex'>

5
themes/next/Layout404.js
View File

@@ -1,9 +1,8 @@
import { useRouter } from 'next/router'
import LayoutBase from './LayoutBase'
import BLOG from '@/blog.config'
import { useEffect } from 'react'
export const Layout404 = (props) => {
export const Layout404 = props => {
const router = useRouter()
useEffect(() => {
// 延时3秒如果加载失败就返回首页
@@ -19,7 +18,7 @@ export const Layout404 = (props) => {
}, 3000)
})
return <LayoutBase meta={{ title: `${BLOG.TITLE} | 页面找不到啦` }} {...props}>
return <LayoutBase {...props}>
<div
className='md:-mt-20 text-black w-full h-screen text-center justify-center content-center items-center flex flex-col'>
<div className='dark:text-gray-200'>

11
themes/next/LayoutArchive.js
View File

@@ -1,12 +1,9 @@
import { useGlobal } from '@/lib/global'
import BLOG from '@/blog.config'
import React, { useEffect } from 'react'
import LayoutBase from './LayoutBase'
import BlogPostArchive from './components/BlogPostArchive'
export const LayoutArchive = (props) => {
const { posts } = props
const { locale } = useGlobal()
// 深拷贝
const postsSortByDate = Object.create(posts)
@@ -17,12 +14,6 @@ export const LayoutArchive = (props) => {
return dateB - dateA
})
const meta = {
title: `${locale.NAV.ARCHIVE} | ${BLOG.TITLE}`,
description: BLOG.DESCRIPTION,
type: 'website'
}
const archivePosts = {}
postsSortByDate.forEach(post => {
@@ -49,7 +40,7 @@ export const LayoutArchive = (props) => {
}, [])
return (
<LayoutBase meta={meta} {...props}>
<LayoutBase {...props}>
<div className="mb-10 pb-20 bg-white md:p-12 p-3 dark:bg-gray-800 shadow-md min-h-full">
{Object.keys(archivePosts).map(archiveTitle => (
<BlogPostArchive

4
themes/next/LayoutBase.js
View File

@@ -20,7 +20,7 @@ import Live2D from '@/components/Live2D'
* @constructor
*/
const LayoutBase = (props) => {
const { children, headerSlot, meta, sideBarSlot, floatSlot, rightAreaSlot } = props
const { children, headerSlot, meta, sideBarSlot, floatSlot, rightAreaSlot, siteInfo } = props
const { onLoading } = useGlobal()
const targetRef = useRef(null)
const leftAreaSlot = <Live2D/>
@@ -75,7 +75,7 @@ const LayoutBase = (props) => {
</div>
</div>
<Footer title={meta.title}/>
<Footer title={siteInfo?.title}/>
</>
)
}

10
themes/next/LayoutCategory.js
View File

@@ -1,5 +1,3 @@
import { useGlobal } from '@/lib/global'
import BLOG from '@/blog.config'
import LayoutBase from './LayoutBase'
import StickyBar from './components/StickyBar'
import CategoryList from './components/CategoryList'
@@ -7,13 +5,7 @@ import BlogPostListScroll from './components/BlogPostListScroll'
export const LayoutCategory = (props) => {
const { tags, posts, category, categories } = props
const { locale } = useGlobal()
const meta = {
title: `${category} | ${locale.COMMON.CATEGORY} | ${BLOG.TITLE}`,
description: BLOG.DESCRIPTION,
type: 'website'
}
return <LayoutBase meta={meta} currentCategory={category} {...props}>
return <LayoutBase currentCategory={category} {...props}>
<StickyBar>
<CategoryList currentCategory={category} categories={categories} />
</StickyBar>

8
themes/next/LayoutCategoryIndex.js
View File

@@ -1,17 +1,11 @@
import { useGlobal } from '@/lib/global'
import BLOG from '@/blog.config'
import LayoutBase from './LayoutBase'
import Link from 'next/link'
export const LayoutCategoryIndex = (props) => {
const { allPosts, categories } = props
const { locale } = useGlobal()
const meta = {
title: `${locale.COMMON.CATEGORY} | ${BLOG.TITLE}`,
description: BLOG.DESCRIPTION,
type: 'website'
}
return <LayoutBase meta={meta} totalPosts={allPosts} {...props}>
return <LayoutBase totalPosts={allPosts} {...props}>
<div className='bg-white dark:bg-gray-700 px-10 py-10 shadow h-full'>
<div className='dark:text-gray-200 mb-5'>
<i className='mr-4 fas faTh' />{locale.COMMON.CATEGORY}:

8
themes/next/LayoutSlug.js
View File

@@ -1,4 +1,3 @@
import BLOG from '@/blog.config'
import { getPageTableOfContents } from 'notion-utils'
import TocDrawerButton from './components/TocDrawerButton'
import LayoutBase from './LayoutBase'
@@ -12,12 +11,6 @@ import { ArticleLock } from './components/ArticleLock'
export const LayoutSlug = (props) => {
const { post, latestPosts, lock, validPassword } = props
const meta = {
title: `${post.title} | ${BLOG.TITLE}`,
description: post.summary,
type: 'article',
tags: post.tags
}
if (!lock && post?.blockMap?.block) {
post.content = Object.keys(post.blockMap.block)
@@ -35,7 +28,6 @@ export const LayoutSlug = (props) => {
return (
<LayoutBase
{...props}
meta={meta}
floatSlot={floatSlot}
rightAreaSlot={
CONFIG_NEXT.RIGHT_LATEST_POSTS && <Card><LatestPostsGroup posts={latestPosts} /></Card>

11
themes/next/LayoutTag.js
View File

@@ -1,5 +1,3 @@
import { useGlobal } from '@/lib/global'
import BLOG from '@/blog.config'
import LayoutBase from './LayoutBase'
import StickyBar from './components/StickyBar'
import TagList from './components/TagList'
@@ -7,15 +5,8 @@ import BlogPostListScroll from './components/BlogPostListScroll'
export const LayoutTag = (props) => {
const { tags, posts, tag } = props
const { locale } = useGlobal()
const meta = {
title: `${tag} | ${locale.COMMON.TAGS} | ${BLOG.TITLE}`,
description: BLOG.DESCRIPTION,
type: 'website'
}
return <LayoutBase meta={meta} currentTag={tag} {...props}>
return <LayoutBase currentTag={tag} {...props}>
<StickyBar>
<TagList tags={tags} currentTag={tag}/>
</StickyBar>

8
themes/next/LayoutTagIndex.js
View File

@@ -1,17 +1,11 @@
import { useGlobal } from '@/lib/global'
import BLOG from '@/blog.config'
import LayoutBase from './LayoutBase'
import TagItem from './components/TagItem'
export const LayoutTagIndex = (props) => {
const { tags } = props
const { locale } = useGlobal()
const meta = {
title: `${locale.COMMON.TAGS} | ${BLOG.TITLE}`,
description: BLOG.DESCRIPTION,
type: 'website'
}
return <LayoutBase meta={meta} {...props}>
return <LayoutBase {...props}>
<div className='bg-white dark:bg-gray-700 px-10 py-10 shadow h-full'>
<div className='dark:text-gray-200 mb-5'><i className='fas fa-tags mr-4'/>{locale.COMMON.TAGS}:</div>
<div id='tags-list' className='duration-200 flex flex-wrap'>

8
themes/next/components/Logo.js
View File

@@ -1,12 +1,12 @@
import Link from 'next/link'
import BLOG from '@/blog.config'
import React from 'react'
const Logo = () => {
const Logo = props => {
const { siteInfo } = props
return <Link href='/' passHref>
<div className='flex flex-col justify-center items-center cursor-pointer bg-black space-y-3 h-32 font-bold'>
<div className='font-serif text-xl text-white'> {BLOG.TITLE}</div>
<div className='text-sm text-gray-300 font-light'> {BLOG.DESCRIPTION}</div>
<div className='font-serif text-xl text-white'> {siteInfo?.title}</div>
<div className='text-sm text-gray-300 font-light'> {siteInfo?.description}</div>
</div>
</Link>
}

4
themes/next/components/SideAreaLeft.js
View File

@@ -18,7 +18,7 @@ import CONFIG_NEXT from '../config_next'
* @returns {JSX.Element}
* @constructor
*/
const SideAreaLeft = (props) => {
const SideAreaLeft = props => {
const { post, slot, postCount } = props
const { locale } = useGlobal()
const showToc = post && post.toc && post.toc.length > 1
@@ -27,7 +27,7 @@ const SideAreaLeft = (props) => {
<section className='w-60'>
{/* 菜单 */}
<section className='shadow hidden lg:block mb-5 pb-4 bg-white dark:bg-gray-800 hover:shadow-xl duration-200'>
<Logo/>
<Logo {...props}/>
<div className='pt-2 px-2 font-sans'>
<MenuButtonGroup allowCollapse={true} {...props} />
</div>

2
themes/next/components/TopNav.js
View File

@@ -98,7 +98,7 @@ const TopNav = (props) => {
</div>
<div className='flex'>
<Logo/>
<Logo {...props}/>
</div>
{/* 右侧功能 */}

1
themes/next/config_next.js
View File

@@ -2,7 +2,6 @@ const CONFIG_NEXT = {
HOME_BANNER: false, // 首页是否显示大图及标语 [true,false]
HOME_BANNER_Strings: ['Hi，我是一个程序员', 'Hi，我是一个打工人', 'Hi，我是一个干饭人', '欢迎来到我的博客🎉'], // 首页大图标语文字
HOME_BANNER_IMAGE: './bg_image.jpg', // 背景图地址
NAV_TYPE: 'normal', // ['fixed','autoCollapse','normal'] 分别是固定屏幕顶部、屏幕顶部自动折叠，不固定