From 505f713241d38cbe1ef5272694ec2077b70e41f7 Mon Sep 17 00:00:00 2001
From: tangly1024 <mail@tangly1024.com>
Date: Sat, 24 Jun 2023 11:27:30 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=86=E7=BB=84-page-nav?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 themes/gitbook/components/BlogPostCard.js       |  6 +++---
 themes/gitbook/components/BlogPostListScroll.js | 13 ++++++++++---
 2 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/themes/gitbook/components/BlogPostCard.js b/themes/gitbook/components/BlogPostCard.js
index 299bc7f3..7dc9db14 100644
--- a/themes/gitbook/components/BlogPostCard.js
+++ b/themes/gitbook/components/BlogPostCard.js
@@ -3,7 +3,7 @@ import Link from 'next/link'
 import { useRouter } from 'next/router'
 import React from 'react'
 
-const BlogPostCard = ({ post }) => {
+const BlogPostCard = ({ post, className }) => {
   const router = useRouter()
   const currentSelected = router.asPath.split('?')[0] === '/' + post.slug
   return (
@@ -13,10 +13,10 @@ const BlogPostCard = ({ post }) => {
                     href={`${BLOG.SUB_PATH}/${post.slug}`}
                     passHref
                     className={
-                        `${currentSelected ? 'bg-gray-500 text-white' : 'text-gray-700 dark:text-gray-300 '} hover:font-bold py-0.5 px-1 text-sm cursor-pointer`
+                        `${className} ${currentSelected ? 'bg-gray-500 text-white' : 'text-gray-700 dark:text-gray-300 '} hover:font-bold py-0.5 cursor-pointer`
                     }>
                     <div>
-                        {post.category} -   {post.title}
+                        {post.title}
                     </div>
 
                 </Link>
diff --git a/themes/gitbook/components/BlogPostListScroll.js b/themes/gitbook/components/BlogPostListScroll.js
index ae2f0951..b8269a4d 100644
--- a/themes/gitbook/components/BlogPostListScroll.js
+++ b/themes/gitbook/components/BlogPostListScroll.js
@@ -18,9 +18,16 @@ const BlogPostListScroll = ({ posts = [], currentSearch }) => {
   } else {
     return <div id='container' ref={targetRef} className='w-full'>
             {/* 文章列表 */}
-            {filteredPosts?.map(post => (
-                <BlogPostCard key={post.id} post={post} showSummary={true} />
-            ))}
+            {filteredPosts?.map(group => {
+              if (group.category) {
+                return <>
+                        <div className='text-md font-sans ' key={group.category}>{group.category}</div>
+                        {group.items?.map(post => (<div key={post.id} className='pl-6 border-l'><BlogPostCard className='text-sm' post={post} /></div>))}
+                    </>
+              } else {
+                return <> {group.items?.map(post => (<BlogPostCard key={post.id} post={post} className='text-md' />))}</>
+              }
+            })}
         </div>
   }
 }