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

Merge branch 'preview' into main

Browse Source
This commit is contained in:
tangly1024
2022-03-17 22:16:04 +08:00
parent 5be9eec9f5 b1764d343a
commit 973784b2cd
32 changed files with 137 additions and 113 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
blog.config.js
View File

@@ -5,6 +5,7 @@ const BLOG = {
AUTHOR: 'tangly1024', // 作者
BIO: '一个普通的干饭人🍚', // 作者简介
LINK: 'https://tangly1024.com', // 网站地址
AVATAR: '/avatar.png', // 个人头像 默认取public目录下的avatar.png
KEYWORDS: 'Notion, 博客', // 网站关键词 英文逗号隔开
NOTION_PAGE_ID: process.env.NOTION_PAGE_ID || '02ab3b8678004aa69e9e415905ef32a5', // Important page_id！！！Duplicate Template from https://www.notion.so/tanghh/02ab3b8678004aa69e9e415905ef32a5
NOTION_ACCESS_TOKEN: process.env.NOTION_ACCESS_TOKEN || '', // Useful if you prefer not to make your database public
@@ -51,7 +52,7 @@ const BLOG = {
COMMENT_GITALK_ADMIN: process.env.NEXT_PUBLIC_COMMENT_GITALK_ADMIN || '', // 管理员用户名、一般是自己 e.g 'tangly1024'
COMMENT_GITALK_CLIENT_ID: process.env.NEXT_PUBLIC_COMMENT_GITALK_CLIENT_ID || '', // e.g 20位ID ， 在gitalk后台获取
COMMENT_GITALK_CLIENT_SECRET: process.env.NEXT_PUBLIC_COMMENT_GITALK_CLIENT_SECRET || '', // e.g 40位ID， 在gitalk后台获取
COMMENT_GITALK_DISTRACTION_FREE_MODE: false,
COMMENT_GITALK_DISTRACTION_FREE_MODE: false, // 类似facebook的无干扰模式
COMMENT_GITTER_ROOM: process.env.NEXT_PUBLIC_COMMENT_GITTER_ROOM || '', // gitter聊天室 see https://gitter.im/ 不需要则留空
COMMENT_DAO_VOICE_ID: process.env.NEXT_PUBLIC_COMMENT_DAO_VOICE_ID || '', // DaoVoice http://dashboard.daovoice.io/get-started
@@ -71,7 +72,8 @@ const BLOG = {
ADSENSE_GOOGLE_ID: process.env.NEXT_PUBLIC_ADSENSE_GOOGLE_ID || '', // 谷歌广告ID e.g ca-pub-xxxxxxxxxxxxxxxx
isProd: process.env.VERCEL_ENV === 'production' // distinguish between development and production environment (ref: https://vercel.com/docs/environment-variables#system-environment-variables) isProd: process.env.VERCEL_ENV === 'production' // distinguish between development and production environment (ref: https://vercel.com/docs/environment-variables#system-environment-variables)
isProd: process.env.VERCEL_ENV === 'production', // distinguish between development and production environment (ref: https://vercel.com/docs/environment-variables#system-environment-variables) isProd: process.env.VERCEL_ENV === 'production' // distinguish between development and production environment (ref: https://vercel.com/docs/environment-variables#system-environment-variables)
VERSION: '2.7.1' // 版本号
}
module.exports = BLOG

31
components/Comment.js
View File

@@ -25,6 +25,22 @@ const Comment = ({ frontMatter }) => {
return (
<div id='comment' className='comment mt-5 text-gray-800 dark:text-gray-300'>
<Tabs>
{BLOG.COMMENT_GITALK_CLIENT_ID && (<div key='GitTalk'>
<GitalkComponent
options={{
id: frontMatter.id,
title: frontMatter.title,
clientID: BLOG.COMMENT_GITALK_CLIENT_ID,
clientSecret: BLOG.COMMENT_GITALK_CLIENT_SECRET,
repo: BLOG.COMMENT_GITALK_REPO,
owner: BLOG.COMMENT_GITALK_OWNER,
admin: BLOG.COMMENT_GITALK_ADMIN.split(','),
distractionFreeMode: JSON.parse(BLOG.COMMENT_GITALK_DISTRACTION_FREE_MODE)
}}
/>
</div>)}
{BLOG.COMMENT_UTTERRANCES_REPO && (<div key='Utterance'>
<UtterancesComponent issueTerm={frontMatter.id} className='px-2' />
</div>)}
@@ -41,21 +57,6 @@ const Comment = ({ frontMatter }) => {
}}
/>
</div>)}
{BLOG.COMMENT_GITALK_CLIENT_ID && (<div key='GitTalk'>
<GitalkComponent
options={{
id: frontMatter.id,
title: frontMatter.title,
clientID: BLOG.COMMENT_GITALK_CLIENT_ID,
clientSecret: BLOG.COMMENT_GITALK_CLIENT_SECRET,
repo: BLOG.COMMENT_GITALK_REPO,
owner: BLOG.COMMENT_GITALK_OWNER,
admin: BLOG.COMMENT_GITALK_ADMIN.split(','),
distractionFreeMode: JSON.parse(BLOG.COMMENT_GITALK_DISTRACTION_FREE_MODE)
}}
/>
</div>)}
</Tabs>
</div>
)

12
components/Tabs.js
View File

@@ -10,13 +10,19 @@ const Tabs = ({ className, children }) => {
return <></>
}
let count = children.length
children = children.filter(c => c !== '')
let count = 0
children.forEach(e => {
if (!e) {
count--
if (e) {
count++
}
})
if (count === 0) {
return <></>
}
if (count === 1) {
return <section className={'duration-200 ' + className}>
{children}

1
lib/global.js
View File

@@ -29,7 +29,6 @@ export function GlobalContextProvider ({ children }) {
useEffect(() => {
if (!hasInit) {
const userTheme = getQueryVariable('theme')
console.log('用户主题', userTheme)
if (userTheme && ALL_THEME.indexOf(userTheme) > -1) {
setTheme(userTheme)
}

2
package.json
View File

@@ -1,6 +1,6 @@
{
"name": "notion-next",
"version": "1.0.0",
"version": "2.7.1",
"homepage": "https://github.com/tangly1024/NotionNext.git",
"license": "MIT",
"repository": {

BIN
public/avatar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 51 KiB

2
themes/fukasawa/components/BlogCard.js
View File

@@ -13,7 +13,7 @@ const BlogCard = ({ post, showSummary }) => {
<div className='p-2 flex flex-col w-full'>
<Link href={`${BLOG.PATH}/article/${post.slug}`} passHref>
<a className={`cursor-pointer font-bold hover:underline text-xl flex ${showPreview ? 'justify-center' : 'justify-start'} leading-tight text-gray-700 dark:text-gray-100 hover:text-blue-500 dark:hover:text-blue-400`}>
<a className={`cursor-pointer font-bold hover:underline text-xl ${showPreview ? 'justify-center' : 'justify-start'} leading-tight text-gray-700 dark:text-gray-100 hover:text-blue-500 dark:hover:text-blue-400`}>
{post.title}
</a>
</Link>

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

@@ -14,8 +14,8 @@ import PaginationSimple from './PaginationSimple'
*/
const BlogListPage = ({ page = 1, posts = [], postCount }) => {
const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
const showNext = page < totalPage && posts.length <= BLOG.POSTS_PER_PAGE && posts.length < postCount
const [colCount, changeCol] = useState(3)
const showNext = page < totalPage && posts.length === BLOG.POSTS_PER_PAGE && posts.length < postCount
const [colCount, changeCol] = useState(1)
function updateCol () {
if (window.outerWidth > 1200) {

2
themes/fukasawa/components/Catalog.js
View File

@@ -51,7 +51,7 @@ const Catalog = ({ toc }) => {
}, throttleMs))
return <div>
<div className='w-full dark:text-gray-300'><i className='mr-1 fas fa-stream' /> 目录</div>
<div className='w-full dark:text-gray-300 mb-2'><i className='mr-1 fas fa-stream' /> 目录</div>
<nav className='font-sans overflow-y-auto scroll-hidden text-black'>
{toc.map((tocItem) => {
const id = uuidToId(tocItem.id)

3
themes/fukasawa/components/GroupMenu.js
View File

@@ -12,7 +12,8 @@ function GroupMenu ({ customNav }) {
{ name: locale.NAV.INDEX, to: '/' || '/', show: true },
{ name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG_FUKA.MENU_CATEGORY },
{ name: locale.COMMON.TAGS, to: '/tag', show: CONFIG_FUKA.MENU_TAG },
{ name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG_FUKA.MENU_ARCHIVE }
{ name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG_FUKA.MENU_ARCHIVE },
{ name: locale.NAV.SEARCH, to: '/search', show: CONFIG_FUKA.MENU_SEARCH }
]
if (customNav) {

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

@@ -22,7 +22,7 @@ const PaginationSimple = ({ page, showNext }) => {
} } passHref >
<a
rel='prev'
className={`${currentPage === 1 ? 'invisible' : 'block'} text-center w-full duration-200 px-4 py-2 hover:border-black border-b-2 hover:font-bold`}
className={`${currentPage === 1 ? 'invisible' : 'visible'} text-center w-full duration-200 px-4 py-2 hover:border-black border-b-2 hover:font-bold`}
>
← {locale.PAGINATION.PREV}
</a>
@@ -30,7 +30,7 @@ const PaginationSimple = ({ page, showNext }) => {
<Link href={ { pathname: `/page/${currentPage + 1}`, query: router.query.s ? { s: router.query.s } : {} } } passHref>
<a
rel='next'
className={`${+showNext ? 'block' : 'invisible'} text-center w-full duration-200 px-4 py-2 hover:border-black border-b-2 hover:font-bold`}
className={`${showNext ? 'visible' : 'invisible'} text-center w-full duration-200 px-4 py-2 hover:border-black border-b-2 hover:font-bold`}
>
{locale.PAGINATION.NEXT} →
</a>

3
themes/fukasawa/components/SiteInfo.js
View File

@@ -10,13 +10,12 @@ function SiteInfo ({ title }) {
>
<span> © {`${startYear}${currentYear}`} <span> <a href={BLOG.LINK} className='text-gray-500 dark:text-gray-300 '>{BLOG.AUTHOR}</a>. <br /></span>
<span>Powered by <a href='https://github.com/tangly1024/NotionNext' className='underline font-bold text-gray-500 dark:text-gray-300'>NotionNext</a>.</span><br /></span>
{BLOG.BEI_AN && <><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{BLOG.BEI_AN}</a><br/></>}
<span className='hidden busuanzi_container_site_pv'> <i className='fas fa-eye' /><span className='px-1 busuanzi_value_site_pv'> </span> </span>
<span className='pl-2 hidden busuanzi_container_site_uv'> <i className='fas fa-users' /> <span className='px-1 busuanzi_value_site_uv'> </span> </span>
<br />
<span><i className='mx-1 animate-pulse fas fa-heart'/> <a href='https://github.com/tangly1024/NotionNext' className='underline font-bold text-gray-500 dark:text-gray-300'>NotionNext {BLOG.VERSION}</a></span><br /></span>
<h1>{title}</h1>
</footer>
)

6
themes/hexo/LayoutBase.js
View File

@@ -45,9 +45,9 @@ const LayoutBase = (props) => {
{headerSlot}
<main id='wrapper' className='flex w-full justify-center py-8 min-h-screen'>
<main id='wrapper' className='w-full justify-center py-8 min-h-screen'>
<div id='container-inner' className='pt-14 w-full mx-auto flex justify-between space-x-4 max-w-7xl'>
<div id='container-inner' className='pt-14 w-full mx-auto lg:flex justify-between md:space-x-4 max-w-7xl'>
<div className='flex-grow w-full'>{children}</div>
<SideRight {...props}/>
</div>
@@ -56,7 +56,7 @@ const LayoutBase = (props) => {
{/* 右下角悬浮 */}
<div className='bottom-12 right-1 fixed justify-end z-20 font-sans text-white bg-blue-400 rounded'>
<div className={(show ? 'animate__animated ' : 'hidden') + ' animate__fadeInUp justify-center duration-500 animate__faster flex flex-col items-center cursor-pointer '}>
<div className={(show ? 'animate__animated ' : 'hidden') + ' animate__fadeInUp justify-center duration-300 animate__faster flex flex-col items-center cursor-pointer '}>
<FloatDarkModeButton/>
{floatSlot}
<JumpToTopButton/>

16
themes/hexo/LayoutSearch.js
View File

@@ -21,14 +21,16 @@ export const LayoutSearch = props => {
// 自动聚焦到搜索框
cRef.current.focus()
if (currentSearch && !handleTextColor) {
const container = document.getElementById('container')
if (container && container.innerHTML) {
const re = new RegExp(`${currentSearch}`, 'gim')
container.innerHTML = container.innerHTML.replace(
re,
const targets = document.getElementsByClassName('replace')
for (const container of targets) {
if (container && container.innerHTML) {
const re = new RegExp(`${currentSearch}`, 'gim')
container.innerHTML = container.innerHTML.replace(
re,
`<span class='text-red-500 border-b border-dashed'>${currentSearch}</span>`
)
handleTextColor = true
)
handleTextColor = true
}
}
}
}, 100)

30
themes/hexo/components/AnalyticsCard.js Normal file
View File

@@ -0,0 +1,30 @@
import Card from './Card'
export function AnalyticsCard (props) {
const { postCount } = props
return <Card>
<div className='ml-2 mb-3 font-sans'>
<i className='fas fa-chart-area' /> 统计
</div>
<div className='text-xs font-sans font-light justify-center mx-7'>
<div className='inline'>
<div className='flex justify-between'>
<div>文章数:</div>
<div>{postCount}</div>
</div>
</div>
<div className='hidden busuanzi_container_page_pv ml-2'>
<div className='flex justify-between'>
<div>访问量:</div>
<div className='busuanzi_value_page_pv' />
</div>
</div>
<div className='hidden busuanzi_container_site_uv ml-2'>
<div className='flex justify-between'>
<div>访客数:</div>
<div className='busuanzi_value_site_uv' />
</div>
</div>
</div>
</Card>
}

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

@@ -68,7 +68,7 @@ export default function ArticleDetail ({ post, recommendPosts, prev, next }) {
<hr className='border-dashed'/>
{/* 评论互动 */}
<div className="duration-200 overflow-x-auto bg-white dark:bg-gray-800">
<div className="duration-200 overflow-x-auto bg-white dark:bg-gray-800 px-3">
<Comment frontMatter={post} />
</div>
</div>)

12
themes/hexo/components/BlogPostCard.js
View File

@@ -10,24 +10,22 @@ const BlogPostCard = ({ post, showSummary }) => {
const showPreview = CONFIG_HEXO.POST_LIST_PREVIEW && post.blockMap
return (
<div className='w-full shadow hover:shadow-2xl border border-gray-100 dark:border-gray-600 rounded-xl bg-white dark:bg-gray-800 duration-300'>
<div key={post.id} className='animate__animated animate__fadeIn flex flex-col-reverse lg:flex-row justify-between duration-300'>
<div key={post.id} className='animate__animated animate__fadeIn flex flex-col-reverse lg:flex-row justify-between duration-300'>
<div className='lg:p-8 p-4 flex flex-col w-full'>
<Link href={`${BLOG.PATH}/article/${post.slug}`} passHref>
<a className={`cursor-pointer hover:underline text-2xl font-sans ${showPreview ? 'justify-center' : 'justify-start'} leading-tight text-gray-700 dark:text-gray-100 hover:text-blue-500 dark:hover:text-blue-400`}>
<a className={`replace cursor-pointer hover:underline text-2xl font-sans ${showPreview ? 'text-center' : ''} leading-tight text-gray-700 dark:text-gray-100 hover:text-blue-500 dark:hover:text-blue-400`}>
{post.title}
</a>
</Link>
<div className={`flex mt-2 items-center ${showPreview ? 'justify-center' : 'justify-start'} flex-wrap dark:text-gray-500 text-gray-400 hover:text-blue-500 dark:hover:text-blue-400 `}>
<div>
<Link href={`/archive#${post?.date?.start_date?.substr(0, 7)}`} passHref>
<a className='font-light hover:underline cursor-pointer text-sm leading-4 mr-3'><i className="far fa-calendar-alt mr-1"/>{post.date.start_date}</a>
</Link>
</div>
</div>
{(!showPreview || showSummary) && <p className='my-4 text-gray-700 dark:text-gray-300 text-sm font-light leading-7'>
{(!showPreview || showSummary) && <p className='replace my-4 text-gray-700 dark:text-gray-300 text-sm font-light leading-7'>
{post.summary}
</p>}
@@ -46,7 +44,6 @@ const BlogPostCard = ({ post, showSummary }) => {
</div> }
<div className='text-gray-400 justify-between flex'>
<Link href={`/category/${post.category}`} passHref>
<a className='cursor-pointer font-light text-sm hover:underline transform'>
<i className='mr-1 far fa-folder' />{post.category}
@@ -68,7 +65,8 @@ const BlogPostCard = ({ post, showSummary }) => {
</a>
</Link>
)}
</div >
</div>
</div>
)

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

@@ -13,6 +13,7 @@ import BlogPostListEmpty from './BlogPostListEmpty'
*/
const BlogPostListPage = ({ page = 1, posts = [], postCount }) => {
const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
const showPagination = posts.length === BLOG.POSTS_PER_PAGE
if (!posts || posts.length === 0) {
return <BlogPostListEmpty />
@@ -25,7 +26,7 @@ const BlogPostListPage = ({ page = 1, posts = [], postCount }) => {
<BlogPostCard key={post.id} post={post} />
))}
</div>
<PaginationNumber page={page} totalPage={totalPage} />
{showPagination && <PaginationNumber page={page} totalPage={totalPage} /> }
</div>
)
}

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

@@ -12,7 +12,7 @@ const Footer = ({ title }) => {
<i className='fas fa-copyright' /> {`${startYear}${currentYear}`} <span><i className='mx-1 animate-pulse fas fa-heart'/> <a href={BLOG.LINK} className='underline font-bold text-gray-50 dark:text-gray-300 '>{BLOG.AUTHOR}</a>.
<br/>
<span>Powered by <a href='https://notion.so' className='underline font-bold text-gray-50 dark:text-gray-300'>Notion</a> & <a href='https://github.com/tangly1024/NotionNext' className='underline font-bold text-gray-50 dark:text-gray-300'>NotionNext</a>.</span></span>
<span>Powered by <a href='https://notion.so' className='underline font-bold text-gray-50 dark:text-gray-300'>Notion</a> & <a href='https://github.com/tangly1024/NotionNext' className='underline font-bold text-gray-50 dark:text-gray-300'>NotionNext {BLOG.VERSION}</a>.</span></span>
{BLOG.BEI_AN && <><br /><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{BLOG.BEI_AN}</a><br/></>}
<br/>

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

@@ -107,7 +107,9 @@ export default function Header () {
>
<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 id='typed' className='flex h-10 items-center text-center text-lg shadow-text text-white'/>
<div className='mt-2 h-12 items-center text-center shadow-text text-white text-lg'>
<span id='typed'/>
</div>
</div>
<div
onClick={() => {

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

@@ -19,7 +19,7 @@ export function InfoCard (props) {
width={120}
height={120}
loading='lazy'
src='/avatar.jpg'
src={BLOG.AVATAR}
className='rounded-full'
/>
</div>

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

@@ -25,10 +25,9 @@ const LatestPostsGroup = ({ posts }) => {
const selected = currentPath === `${BLOG.PATH}/article/${post.slug}`
return (
<Link key={post.id} title={post.title} href={`${BLOG.PATH}/article/${post.slug}`} passHref>
<a className={ 'my-1 mx-5 flex font-light'}>
<a className={ 'my-1 flex '}>
<div className={ (selected ? 'text-white bg-blue-400 ' : 'text-gray-500 dark:text-gray-400 ') + ' text-xs py-1.5 flex overflow-x-hidden whitespace-nowrap hover:bg-blue-400 px-2 duration-200 w-full rounded ' +
'hover:text-white dark:hover:text-white cursor-pointer items-center'}>
<i className='mr-2 fas fa-file-alt'/>
<div className='truncate'>{post.title}</div>
</div>
</a>

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

@@ -26,7 +26,7 @@ const MenuList = (props) => {
if (link && link.show) {
const selected = (router.pathname === link.to) || (router.asPath === link.to)
return <Link key={`${link.to}`} title={link.to} href={link.to} >
<a className={'py-1.5 px-5 duration-300 text-base justify-between hover:bg-blue-400 hover:text-white hover:shadow-lg cursor-pointer font-light flex flex-nowrap items-center ' +
<a className={'py-1.5 px-5 text-base justify-between hover:bg-blue-400 hover:text-white hover:shadow-lg cursor-pointer font-light flex flex-nowrap items-center ' +
(selected ? 'bg-gray-200 text-black' : ' ')} >
<div className='my-auto items-center justify-center flex '>
<i className={`${link.icon} w-4 text-center`} />

5
themes/hexo/components/SearchInput.js
View File

@@ -21,7 +21,10 @@ const SearchInput = props => {
const key = searchInputRef.current.value
if (key && key !== '') {
setLoadingState(true)
location.href = '/search/' + key
router.push({ pathname: '/search/' + key }).then(r => {
setLoadingState(false)
})
// location.href = '/search/' + key
} else {
router.push({ pathname: '/' }).then(r => {})
}

32
themes/hexo/components/SideRight.js
View File

@@ -4,11 +4,11 @@ import LatestPostsGroup from './LatestPostsGroup'
import TagGroups from './TagGroups'
import Catalog from './Catalog'
import { InfoCard } from './InfoCard'
import { AnalyticsCard } from './AnalyticsCard'
export default function SideRight (props) {
const {
post,
postCount,
currentCategory,
categories,
latestPosts,
@@ -19,33 +19,9 @@ export default function SideRight (props) {
} = props
return (
<div className={'w-80 space-y-4 hidden lg:block'}>
<div className={'md:w-80 p-2 space-y-4'}>
<InfoCard {...props}/>
<Card>
<div className='ml-2 mb-3 font-sans'>
<i className='fas fa-chart-area' /> 统计
</div>
<div className='text-xs font-sans font-light justify-center mx-7'>
<div className='inline'>
<div className='flex justify-between'>
<div>文章数:</div>
<div>{postCount}</div>
</div>
</div>
<div className='hidden busuanzi_container_page_pv ml-2'>
<div className='flex justify-between'>
<div>访问量:</div>
<div className='busuanzi_value_page_pv' />
</div>
</div>
<div className='hidden busuanzi_container_site_uv ml-2'>
<div className='flex justify-between'>
<div>访客数:</div>
<div className='busuanzi_value_site_uv' />
</div>
</div>
</div>
</Card>
<AnalyticsCard {...props}/>
{showCategory && (
<Card>
@@ -68,7 +44,7 @@ export default function SideRight (props) {
</Card>}
{post && post.toc && (
<Card className='sticky top-12'>
<Card className='sticky top-20'>
<Catalog toc={post.toc} />
</Card>
)}

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

@@ -91,7 +91,7 @@ const TopNav = (props) => {
<SearchDrawer cRef={searchDrawer} slot={searchDrawerSlot}/>
{/* 导航栏 */}
<div id='sticky-nav' className={`${CONFIG_HEXO.NAV_TYPE !== 'normal' ? 'fixed bg-white' : ' bg-none -mb-10'} animate__animated animate__fadeIn dark:bg-black dark:bg-opacity-50 dark:text-gray-200 bg-opacity-80 text-black w-full top-0 z-20 transform duration-500 font-sans`}>
<div id='sticky-nav' className={`${CONFIG_HEXO.NAV_TYPE !== 'normal' ? 'fixed bg-white' : ' bg-none -mb-10'} animate__animated animate__fadeIn dark:bg-black dark:bg-opacity-50 dark:text-gray-200 bg-opacity-80 text-black w-full top-0 z-20 transform duration-200 font-sans`}>
<div className='w-full flex justify-between items-center px-4 py-4 shadow'>
<div className='flex'>
<Logo/>

2
themes/hexo/config_hexo.js
View File

@@ -11,7 +11,7 @@ const CONFIG_HEXO = {
POST_LIST_COVER: true, // 文章封面
POST_LIST_SUMMARY: true, // 文章摘要
POST_LIST_PREVIEW: false, // 读取文章预览
POST_LIST_PREVIEW: true, // 读取文章预览
NAV_TYPE: 'autoCollapse', // ['fixed','autoCollapse','normal'] 分别是固定屏幕顶部、屏幕顶部自动折叠，不固定
WIDGET_TO_TOP: true,

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

@@ -12,7 +12,7 @@ const Footer = ({ title }) => {
<i className='fas fa-copyright' /> {`${startYear}${currentYear}`} <span><i className='mx-1 animate-pulse fas fa-heart'/> <a href={BLOG.LINK} className='underline font-bold text-gray-500 dark:text-gray-300 '>{BLOG.AUTHOR}</a>.
<br/>
<span>Powered by <a href='https://notion.so' className='underline font-bold text-gray-500 dark:text-gray-300'>Notion</a> & <a href='https://github.com/tangly1024/NotionNext' className='underline font-bold text-gray-500 dark:text-gray-300'>NotionNext</a>.</span></span>
<span>Powered by <a href='https://notion.so' className='underline font-bold text-gray-500 dark:text-gray-300'>Notion</a> & <a href='https://github.com/tangly1024/NotionNext' className='underline font-bold text-gray-500 dark:text-gray-300'>NotionNext {BLOG.VERSION}</a>.</span></span>
{BLOG.BEI_AN && <><br /><i className='fas fa-shield-alt'/> <a href='https://beian.miit.gov.cn/' className='mr-2'>{BLOG.BEI_AN}</a><br/></>}
<span className='hidden busuanzi_container_site_pv'>

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

@@ -13,7 +13,7 @@ const InfoCard = () => {
width={120}
height={120}
loading='lazy'
src='/avatar.jpg'
src={BLOG.AVATAR}
className='rounded-full'
/>
</div>

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

@@ -12,7 +12,7 @@ const Footer = ({ title }) => {
<i className='fas fa-copyright' /> {`${startYear}${currentYear}`} <span><i className='mx-1 animate-pulse fas fas-heart'/> <a href={BLOG.LINK} className='underline font-bold text-gray-500 dark:text-gray-300 '>{BLOG.AUTHOR}</a>.
<br/>
<span>Powered by <a href='https://notion.so' className='underline font-bold text-gray-500 dark:text-gray-300'>Notion</a> & <a href='https://github.com/tangly1024/NotionNext' className='underline font-bold text-gray-500 dark:text-gray-300'>NotionNext</a>.</span></span>
<span>Powered by <a href='https://notion.so' className='underline font-bold text-gray-500 dark:text-gray-300'>Notion</a> & <a href='https://github.com/tangly1024/NotionNext' className='underline font-bold text-gray-500 dark:text-gray-300'>NotionNext {BLOG.VERSION}</a>.</span></span>
{BLOG.BEI_AN && <><br /><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{BLOG.BEI_AN}</a><br/></>}
<span className='hidden busuanzi_container_site_pv'>

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

@@ -13,7 +13,7 @@ const InfoCard = () => {
width={120}
height={120}
loading='lazy'
src='/avatar.jpg'
src={BLOG.AVATAR}
className='rounded-full'
/>
</div>

49
themes/next/components/SearchInput.js
View File

@@ -21,10 +21,10 @@ const SearchInput = ({ currentTag, currentSearch, cRef }) => {
const key = searchInputRef.current.value
if (key && key !== '') {
setLoadingState(true)
// router.push({ pathname: '/search/' + key }).then(r => {
// setLoadingState(false)
// })
location.href = '/search/' + key
router.push({ pathname: '/search/' + key }).then(r => {
setLoadingState(false)
})
// location.href = '/search/' + key
} else {
router.push({ pathname: '/' }).then(r => {
})
@@ -61,26 +61,31 @@ const SearchInput = ({ currentTag, currentSearch, cRef }) => {
}
}
return <div className='flex border dark:border-gray-600 w-full bg-gray-100 dark:bg-gray-900'>
<input
ref={searchInputRef}
type='text'
placeholder={currentTag ? `${locale.SEARCH.TAGS} #${currentTag}` : `${locale.SEARCH.ARTICLES}`}
className={'w-full text-sm pl-4 transition focus:shadow-lg font-light leading-10 border-gray-300 text-black bg-gray-100 dark:bg-gray-900 dark:text-white'}
onKeyUp={handleKeyUp}
onCompositionStart={lockSearchInput}
onCompositionUpdate={lockSearchInput}
onCompositionEnd={unLockSearchInput}
onChange={e => updateSearchKey(e.target.value)}
defaultValue={currentSearch}
/>
{(showClean && <i className='fas fa-times text-gray-300 float-right m-3 cursor-pointer' onClick={cleanSearch} />)}
return <div className='flex w-full bg-gray-100'>
<input
ref={searchInputRef}
type='text'
placeholder={currentTag ? `${locale.SEARCH.TAGS} #${currentTag}` : `${locale.SEARCH.ARTICLES}`}
className={'w-full text-sm pl-4 transition focus:shadow-lg font-light leading-10 text-black bg-gray-100 dark:bg-gray-900 dark:text-white'}
onKeyUp={handleKeyUp}
onCompositionStart={lockSearchInput}
onCompositionUpdate={lockSearchInput}
onCompositionEnd={unLockSearchInput}
onChange={e => updateSearchKey(e.target.value)}
defaultValue={currentSearch || ''}
/>
<div className='p-3 bg-gray-50 flex border-l dark:border-gray-700 dark:hover:bg-gray-800 dark:bg-gray-600 justify-center items-center cursor-pointer'
onClick={handleSearch}>
<i className={`${onLoading ? 'fa-spinner animate-spin ' : 'fa-search'} fas hover:scale-125 hover:text-black transform duration-200 dark:text-gray-300 dark:hover:text-white text-gray-600 cursor-pointer`} />
</div>
<div className='-ml-8 cursor-pointer float-right items-center justify-center py-2'
onClick={handleSearch}>
<i className={`hover:text-black transform duration-200 text-gray-500 cursor-pointer fas ${onLoading ? 'fa-spinner animate-spin' : 'fa-search'}`} />
</div>
{(showClean &&
<div className='-ml-12 cursor-pointer dark:bg-gray-600 dark:hover:bg-gray-800 float-right items-center justify-center py-2'>
<i className='hover:text-black transform duration-200 text-gray-400 cursor-pointer fas fa-times' onClick={cleanSearch} />
</div>
)}
</div>
}
export default SearchInput