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

gitbook 增加新文章红点机制

Browse Source
This commit is contained in:
tangly1024.com
2024-03-06 14:57:54 +08:00
parent 9494daee36
commit 0d1004a7b1
12 changed files with 86 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
themes/gitbook/components/BlogPostCard.js
View File

@@ -3,17 +3,22 @@ import Link from 'next/link'
import { useRouter } from 'next/router'
import { checkContainHttp, sliceUrlFromHttp } from '@/lib/utils'
import NotionIcon from '@/components/NotionIcon'
import Badge from '@/components/Badge'
import CONFIG from '../config'
const BlogPostCard = ({ post, className }) => {
const router = useRouter()
const currentSelected = router.asPath.split('?')[0] === '/' + post.slug
const url = checkContainHttp(post.slug) ? sliceUrlFromHttp(post.slug) : `${siteConfig('SUB_PATH', '')}/${post.slug}`
return (
<Link href={url} passHref> <div key={post.id} className={`${className} py-1.5 cursor-pointer px-1.5 hover:bg-gray-50 rounded-md dark:hover:bg-gray-600 ${currentSelected ? 'bg-green-50 text-green-500' : ''}`}>
<div className="w-full select-none">
<NotionIcon icon={post?.pageIcon}/> {post.title}
<Link href={url} passHref>
<div key={post.id} className={`${className} relative py-1.5 cursor-pointer px-1.5 hover:bg-gray-50 rounded-md dark:hover:bg-gray-600 ${currentSelected ? 'bg-green-50 text-green-500 dark:bg-yellow-100 dark:text-yellow-600' : ''}`}>
<div className="w-full select-none">
<NotionIcon icon={post?.pageIcon}/> {post.title}
</div>
{/* 最新文章加个红点 */}
{post?.isLatest && siteConfig('GITBOOK_LATEST_POST_RED_BADGE', false, CONFIG) && <Badge/>}
</div>
</div>
</Link>
)
}

10
themes/gitbook/components/NavPostItem.js
View File

@@ -1,6 +1,9 @@
import BlogPostCard from './BlogPostCard'
import { useState } from 'react'
import Collapse from '@/components/Collapse'
import Badge from '@/components/Badge'
import { siteConfig } from '@/lib/config'
import CONFIG from '../config'
/**
* 导航列表
@@ -17,12 +20,15 @@ const NavPostItem = (props) => {
changeIsOpen(!isOpen)
}
const groupHasLatest = group?.items?.some(post => post.isLatest)
if (group?.category) {
return <>
<div onClick={toggleOpenSubMenu}
className='select-none flex justify-between text-sm cursor-pointer p-2 hover:bg-gray-50 rounded-md dark:hover:bg-gray-600' key={group?.category}>
className='select-none relative flex justify-between text-sm cursor-pointer p-2 hover:bg-gray-50 rounded-md dark:hover:bg-gray-600' key={group?.category}>
<span>{group?.category}</span>
<div className='inline-flex items-center select-none pointer-events-none '><i className={`px-2 fas fa-chevron-left transition-all duration-200 ${isOpen ? '-rotate-90' : ''}`}></i></div>
<div className='inline-flex items-center select-none pointer-events-none '><i className={`px-2 fas fa-chevron-left transition-all opacity-50 duration-200 ${isOpen ? '-rotate-90' : ''}`}></i></div>
{groupHasLatest && siteConfig('GITBOOK_LATEST_POST_RED_BADGE', false, CONFIG) && !isOpen && <Badge/>}
</div>
<Collapse isOpen={isOpen} onHeightChange={props.onHeightChange}>
{group?.items?.map(post => (<div key={post.id} className='ml-3 border-l'>

2
themes/gitbook/components/SearchInput.js
View File

@@ -103,7 +103,7 @@ const SearchInput = ({ currentSearch, cRef, className }) => {
<input
ref={searchInputRef}
type='text'
className={`${className} outline-none w-full text-sm pl-2 transition focus:shadow-lg font-light leading-10 text-black bg-gray-100 dark:bg-gray-900 dark:text-white`}
className={`${className} outline-none w-full text-sm pl-2 transition focus:shadow-lg font-light leading-10 text-black bg-gray-100 dark:bg-gray-800 dark:text-white`}
onFocus={handleFocus}
onKeyUp={handleKeyUp}
onCompositionStart={lockSearchInput}