-
Notifications
You must be signed in to change notification settings - Fork 10.1k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
add theme nav & add pageIcon support of @lib/getNotionData
- Loading branch information
Showing
48 changed files
with
2,483 additions
and
1 deletion.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -29,6 +29,7 @@ yarn-error.log* | |
.env.development.local | ||
.env.test.local | ||
.env.production.local | ||
.env | ||
|
||
# vercel | ||
.vercel | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
// import { useGlobal } from '@/lib/global' | ||
import dynamic from 'next/dynamic' | ||
|
||
const NotionPage = dynamic(() => import('@/components/NotionPage')) | ||
|
||
const Announcement = ({ notice, className }) => { | ||
// const { locale } = useGlobal() | ||
if (notice?.blockMap) { | ||
return <div className={className}> | ||
<section id='announcement-wrapper' className="dark:text-gray-300"> | ||
{/* <div><i className='mr-2 fas fa-bullhorn' />{locale.COMMON.ANNOUNCEMENT}</div> */} | ||
{notice && (<div id="announcement-content"> | ||
<NotionPage post={notice} /> | ||
</div>)} | ||
</section> | ||
</div> | ||
} else { | ||
return <></> | ||
} | ||
} | ||
export default Announcement |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,32 @@ | ||
import Link from 'next/link' | ||
|
||
/** | ||
* 上一篇,下一篇文章 | ||
* @param {prev,next} param0 | ||
* @returns | ||
*/ | ||
export default function ArticleAround ({ prev, next }) { | ||
if (!prev || !next) { | ||
return <></> | ||
} | ||
return ( | ||
<section className='text-gray-800 dark:text-gray-400 h-12 flex items-center justify-between space-x-5 my-4'> | ||
<Link | ||
href={`/${prev.slug}`} | ||
passHref | ||
className='text-sm cursor-pointer justify-start items-center flex hover:underline duration-300'> | ||
|
||
<i className='mr-1 fas fa-angle-double-left' />{prev.title} | ||
|
||
</Link> | ||
<Link | ||
href={`/${next.slug}`} | ||
passHref | ||
className='text-sm cursor-pointer justify-end items-center flex hover:underline duration-300'> | ||
{next.title} | ||
<i className='ml-1 my-1 fas fa-angle-double-right' /> | ||
|
||
</Link> | ||
</section> | ||
) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
export default function ArticleInfo({ post }) { | ||
if (!post) { | ||
return null | ||
} | ||
return <div className="pt-10 pb-6 text-gray-400 text-sm border-b"> | ||
<i className="fa-regular fa-clock mr-1" /> | ||
Last update: { post.date?.start_date} | ||
</div> | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,53 @@ | ||
import { useGlobal } from '@/lib/global' | ||
import { useEffect, useRef } from 'react' | ||
|
||
/** | ||
* 加密文章校验组件 | ||
* @param {password, validPassword} props | ||
* @param password 正确的密码 | ||
* @param validPassword(bool) 回调函数,校验正确回调入参为true | ||
* @returns | ||
*/ | ||
export const ArticleLock = props => { | ||
const { validPassword } = props | ||
const { locale } = useGlobal() | ||
|
||
const submitPassword = () => { | ||
const p = document.getElementById('password') | ||
if (!validPassword(p?.value)) { | ||
const tips = document.getElementById('tips') | ||
if (tips) { | ||
tips.innerHTML = '' | ||
tips.innerHTML = `<div class='text-red-500 animate__shakeX animate__animated'>${locale.COMMON.PASSWORD_ERROR}</div>` | ||
} | ||
} | ||
} | ||
|
||
const passwordInputRef = useRef(null) | ||
useEffect(() => { | ||
// 选中密码输入框并将其聚焦 | ||
passwordInputRef.current.focus() | ||
}, []) | ||
|
||
return <div id='container' className='w-full flex justify-center items-center h-96 '> | ||
<div className='text-center space-y-3'> | ||
<div className='font-bold'>{locale.COMMON.ARTICLE_LOCK_TIPS}</div> | ||
<div className='flex mx-4'> | ||
<input id="password" type='password' | ||
onKeyDown={(e) => { | ||
if (e.key === 'Enter') { | ||
submitPassword() | ||
} | ||
}} | ||
ref={passwordInputRef} // 绑定ref到passwordInputRef变量 | ||
className='outline-none w-full text-sm pl-5 rounded-l transition focus:shadow-lg dark:text-gray-300 font-light leading-10 text-black bg-gray-100 dark:bg-gray-500'> | ||
</input> | ||
<div onClick={submitPassword} className="px-3 whitespace-nowrap cursor-pointer items-center justify-center py-2 bg-green-500 hover:bg-green-400 text-white rounded-r duration-300" > | ||
<i className={'duration-200 cursor-pointer fas fa-key'} > {locale.COMMON.SUBMIT}</i> | ||
</div> | ||
</div> | ||
<div id='tips'> | ||
</div> | ||
</div> | ||
</div> | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,36 @@ | ||
import BLOG from '@/blog.config' | ||
import Link from 'next/link' | ||
|
||
/** | ||
* 归档分组 | ||
* @param {*} param0 | ||
* @returns | ||
*/ | ||
export default function BlogArchiveItem({ archiveTitle, archivePosts }) { | ||
return ( | ||
<div key={archiveTitle}> | ||
<div id={archiveTitle} className="pt-16 pb-4 text-3xl dark:text-gray-300" > | ||
{archiveTitle} | ||
</div> | ||
<ul> | ||
{archivePosts[archiveTitle]?.map(post => ( | ||
<li key={post.id} | ||
className="border-l-2 p-1 text-xs md:text-base items-center hover:scale-x-105 hover:border-gray-500 dark:hover:border-gray-300 dark:border-gray-400 transform duration-500" | ||
> | ||
<div id={post?.publishDay}> | ||
<span className="text-gray-400"> | ||
{post.date?.start_date} | ||
</span>{' '} | ||
| ||
|
||
<Link passHref href={`${BLOG.SUB_PATH}/${post.slug}`} | ||
className="dark:text-gray-400 dark:hover:text-gray-300 overflow-x-hidden hover:underline cursor-pointer text-gray-600"> | ||
{post.title} | ||
</Link> | ||
</div> | ||
</li> | ||
))} | ||
</ul> | ||
</div> | ||
) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,49 @@ | ||
import BLOG from '@/blog.config' | ||
import Link from 'next/link' | ||
import NotionIcon from './NotionIcon' | ||
import { useRouter } from 'next/router' | ||
import React from 'react' | ||
|
||
const BlogPostCard = ({ post, className }) => { | ||
const router = useRouter() | ||
const currentSelected = router.asPath.split('?')[0] === '/' + post.slug | ||
return ( | ||
<Link href={`${removeHttp(post.slug)}`} target={(checkRemoveHttp(post.slug) ? '_blank' : '_self')} passHref> | ||
<div key={post.id} className={`${className} h-full rounded-lg p-4 dark:bg-neutral-800 cursor-pointer bg-white hover:bg-white rounded-2xl dark:hover:bg-gray-800 ${currentSelected ? 'bg-green-50 text-green-500' : ''}`}> | ||
<div className="stack-entry w-full flex space-x-3 select-none dark:text-neutral-200"> | ||
<NotionIcon icon={post.pageIcon} size='10' className='text-6xl w-11 h-11 mx-1 my-0 flex-none' /> | ||
<div className="stack-comment flex-auto"> | ||
<p className="title font-bold">{post.title}</p> | ||
<p className="description font-normal">{post.summary ? post.summary : '暂无简介'}</p> | ||
</div> | ||
</div> | ||
</div> | ||
</Link> | ||
) | ||
function removeHttp(str) { | ||
// 检查字符串是否包含http | ||
if (str.includes("http")) { | ||
// 如果包含,找到http的位置 | ||
let index = str.indexOf("http"); | ||
// 返回http之后的部分 | ||
return str.slice(index, str.length); | ||
} else { | ||
// 如果不包含,返回原字符串 | ||
return str; | ||
} | ||
} | ||
function checkRemoveHttp(str) { | ||
// 检查字符串是否包含http | ||
if (str.includes("http")) { | ||
// 如果包含,找到http的位置 | ||
let index = str.indexOf("http"); | ||
// 包含 | ||
return true; | ||
} else { | ||
// 不包含 | ||
return false; | ||
} | ||
} | ||
} | ||
|
||
export default BlogPostCard |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,49 @@ | ||
import BlogPostCard from './BlogPostCard' | ||
import React, { useState } from 'react' | ||
import NotionIcon from './NotionIcon' | ||
// import Collapse from '@/components/Collapse' | ||
|
||
/** | ||
* 导航列表 | ||
* @param posts 所有文章 | ||
* @param tags 所有标签 | ||
* @returns {JSX.Element} | ||
* @constructor | ||
*/ | ||
const BlogPostItem = (props) => { | ||
const { group, filterLinks } = props | ||
// const [isOpen, changeIsOpen] = useState(group?.selected) | ||
|
||
// const toggleOpenSubMenu = () => { | ||
// changeIsOpen(!isOpen) | ||
// } | ||
|
||
console.log('####### group') | ||
console.log(group) | ||
|
||
if (group?.category) { | ||
return <> | ||
<div id={group?.category} className='category text-lg font-normal pt-9 pb-4 first:pt-4 select-none flex justify-between font-sans text-neutral-800 dark:text-neutral-400 p-2' key={group?.category}> | ||
<h3><i className={`text-base mr-2 ${group?.icon ? group?.icon : 'fas fa-hashtag'}`} />{group?.category}</h3> | ||
</div> | ||
<div id='posts-wrapper' className='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' > | ||
{group?.items?.map(post => ( | ||
<BlogPostCard key={post.id} className='card' post={post} /> | ||
))} | ||
</div> | ||
</> | ||
} else { | ||
return <> | ||
<div id='uncategory' className='category text-lg font-normal pt-9 pb-4 first:pt-4 font-bold select-none flex justify-between font-sans text-neutral-800 dark:text-neutral-400 p-2' key='uncategory'> | ||
<span><i className={`text-base mr-2 ${group?.icon ? group?.icon : 'fas fa-hashtag'}`} />未分类</span> | ||
</div> | ||
<div 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'> | ||
{group?.items?.map(post => ( | ||
<BlogPostCard key={post.id} className='card' post={post} /> | ||
))} | ||
</div> | ||
</> | ||
} | ||
} | ||
|
||
export default BlogPostItem |
Oops, something went wrong.