From 29eb26b37b5fe9bb1aad721c189394b738943c64 Mon Sep 17 00:00:00 2001
From: "tangly1024.com" <tlyong1992@hotmail.com>
Date: Thu, 9 Mar 2023 14:35:40 +0800
Subject: [PATCH] theme-simple article

---
 themes/simple/components/ArticleInfo.js | 36 ++++++++++++++-----------
 1 file changed, 20 insertions(+), 16 deletions(-)

diff --git a/themes/simple/components/ArticleInfo.js b/themes/simple/components/ArticleInfo.js
index 0b34fb12..5a52750c 100644
--- a/themes/simple/components/ArticleInfo.js
+++ b/themes/simple/components/ArticleInfo.js
@@ -1,6 +1,8 @@
 import Link from 'next/link'
 import { useGlobal } from '@/lib/global'
 import formatDate from '@/lib/formatDate'
+import CONFIG_SIMPLE from '../config_simple'
+import BLOG from '@/blog.config'
 
 export const ArticleInfo = (props) => {
   const { post } = props
@@ -9,20 +11,22 @@ export const ArticleInfo = (props) => {
   const date = formatDate(post?.date?.start_date || post?.createdTime, locale.LOCALE)
 
   return (
-      <section className="flex-wrap flex mt-2 text-gray-400 dark:text-gray-400 font-light leading-8">
+        <section className="flex-wrap flex mt-2 text-gray-400 dark:text-gray-400 font-light leading-8">
             <div>
-                {post?.type !== 'Page' && <>
-                    <Link
-                        href={`/category/${post.category}`}
-                        passHref
-                        className="cursor-pointer text-md mr-2 hover:text-black dark:hover:text-white border-b dark:border-gray-500 border-dashed">
+                <h2
+                    id='blog-item-title'
+                    className="mb-5 font-bold text-black text-xl md:text-2xl no-underline">
+                    {post.title}
+                </h2>
 
-                        <i className="mr-1 fas fa-folder-open" />
-                        {post.category}
-
-                    </Link>
-                    <span className='mr-2'>|</span>
-                </>}
+                {post?.type !== 'Page' && (<>
+                    <div className="mb-4 text-sm text-gray-700 dark:text-gray-300">
+                        <span> <i className="fa-regular fa-user"></i> <a href={CONFIG_SIMPLE.AUTHOR_LINK}>{BLOG.AUTHOR}</a></span>
+                        <span> - <i className="fa-regular fa-clock"></i> {post.date?.start_date || post.createdTime}</span>
+                        {post.category && <span> - <i className="fa-regular fa-folder"></i> <a href="#" className="hover:text-red-400 transition-all duration-200">{post.category}</a></span>}
+                        {post.tags && post.tags?.length > 0 && post.tags.map(t => <span key={t}> / <Link href={`tag/${t}`}><span className=' hover:text-red-400 transition-all duration-200'>{t}</span></Link></span>)}
+                    </div>
+                </>)}
 
                 {post?.type !== 'Page' && (<>
                     <Link
@@ -39,10 +43,10 @@ export const ArticleInfo = (props) => {
                     </span>
                     <span className='mr-2'>|</span>
                     <span className="hidden busuanzi_container_page_pv font-light mr-2">
-                    <i className='mr-1 fas fa-eye' />
-                    &nbsp;
-                    <span className="mr-2 busuanzi_value_page_pv" />
-                </span>
+                        <i className='mr-1 fas fa-eye' />
+                        &nbsp;
+                        <span className="mr-2 busuanzi_value_page_pv" />
+                    </span>
                 </>)}
 
             </div>