加入新的打赏码；

文章详情页重新排班；
文章卡牌动画调整；

components/BlogPostCard.js

@@ -5,7 +5,7 @@ import React from 'react'
 
 const BlogPostCard = ({ post }) => {
   return (
-    <div key={post.id} className='animate__animated animate__slideInUp animate__faster shadow-card inline-block border dark:border-gray-600 my-2 w-full 2xl:max-w-2xl bg-white bg-opacity-80 dark:bg-gray-800 dark:hover:bg-gray-700 overflow-hidden'>
+    <div key={post.id} className='animate__animated animate__fadeIn animate__faster shadow-card inline-block border dark:border-gray-600 my-2 w-full 2xl:max-w-2xl bg-white bg-opacity-80 dark:bg-gray-800 dark:hover:bg-gray-700 overflow-hidden'>
         {/*  封面图 */}
         {post.page_cover && post.page_cover.length > 1 && (
           <Link href={`${BLOG.path}/article/${post.slug}`} className='md:flex-shrink-0 md:w-52 md:h-52 rounded-lg'>

components/BlogPostListScroll.js

@@ -67,7 +67,7 @@ const BlogPostListScroll = ({ posts = [], tags, currentSearch, currentCategory,
 
       {currentTag && (
         <div className='w-full p-1 bg-gray-100 dark:bg-gray-700 flex'>
-          <div className='cursor-pointer py-1.5 mr-2 hover:underline bg-gray-200 dark:bg-gray-400 px-2 rounded'># {currentTag}</div>
+          <div className='cursor-pointer py-1.5 mr-2 hover:underline bg-gray-200 dark:bg-gray-400 px-2 rounded'><i className='fa fa-tag mr-1 '/> {currentTag}</div>
         </div>
       )}
 

components/Comment.js

@@ -27,8 +27,6 @@ const Comment = ({ frontMatter }) => {
   const { theme } = useGlobal()
 
   return <div className='comment text-gray-800 dark:text-gray-300'>
-    <div className='font-bold pt-2 pb-4 '>留下评论</div>
-
     {/* 评论插件 */}
     {BLOG.comment.provider === 'gitalk' && (
       <GitalkComponent

components/JumpToTop.js

@@ -14,7 +14,7 @@ const JumpToTop = ({ targetRef, showPercent = true }) => {
   const { locale } = useGlobal()
   const [show, switchShow] = useState(false)
   const [percent, changePercent] = useState(0)
-  const scrollListener = useCallback(throttle(() => {
+  const scrollListener = () => {
     // 处理是否显示回到顶部按钮
     const clientHeight = targetRef ? (targetRef.current ? targetRef.current.clientHeight : 0) : 0
     const scrollY = window.pageYOffset
@@ -26,7 +26,7 @@ const JumpToTop = ({ targetRef, showPercent = true }) => {
     let per = parseFloat(((scrollY / fullHeight * 100)).toFixed(0))
     if (per > 100) per = 100
     changePercent(per)
-  }, 100))
+  }
   useEffect(() => {
     document.addEventListener('scroll', scrollListener)
     return () => document.removeEventListener('scroll', scrollListener)

components/Progress.js

@@ -8,7 +8,7 @@ import throttle from 'lodash.throttle'
  */
 const Progress = ({ targetRef }) => {
   const [percent, changePercent] = useState(0)
-  const scrollListener = useCallback(throttle(() => {
+  const scrollListener = () => {
     if (targetRef.current) {
       const clientHeight = targetRef ? (targetRef.current.clientHeight) : 0
       const scrollY = window.pageYOffset
@@ -17,7 +17,7 @@ const Progress = ({ targetRef }) => {
       if (per > 100) per = 100
       changePercent(per)
     }
-  }, 100))
+  }
 
   useEffect(() => {
     document.addEventListener('scroll', scrollListener)

components/RewardButton.js

@@ -39,18 +39,19 @@ const RewardButton = () => {
 
       <div
         className={
-          (popoverShow ? 'animate__animated animate__fadeIn ' : 'hidden ') +
+          (popoverShow ? 'animate__animated animate__fadeIn ' : ' hidden ') +
           ' animate__faster transform block z-50 font-normal'
         }
         ref={popoverRef}
       >
         <div
-          className='animate__animated animate__fadeIn hover:shadow-2xl duration-200 my-5 px-5 py-6 w-96 grid justify-center bg-white dark:bg-black dark:text-gray-200'>
-         <span>
-            <img className='md:w-72 m-auto' src='/reward_code.jpg' />
-          </span>
-          <br />
-          <span className='text-center text-gray-500'>微信赞赏码或支付宝tlyong@126.com赞助</span>
+          className='flex space-x-10 animate__animated animate__fadeIn hover:shadow-2xl duration-200 my-5 px-5 py-6 justify-center bg-white dark:bg-black dark:text-gray-200'>
+         <div>
+            <img className='md:w-72 m-auto' src='/reward_code_alipay.png' />
+          </div>
+          <div>
+            <img className='md:w-72 m-auto' src='/reward_code_wechat.png' />
+          </div>
         </div>
       </div>
     </div>

components/ShareBar.js

@@ -32,6 +32,7 @@ const ShareBar = ({ post }) => {
   return <>
     <div
       className='py-2 text-gray-500 text-center space-x-2 flex inline-block my-1 dark:text-gray-200 overflow-visible'>
+      <div className='hidden md:block text-gray-800 dark:text-gray-300 mr-2 my-2'>分享本文:</div>
       <div className='text-3xl cursor-pointer'>
         <a className='fa fa-facebook-square hover:text-red-600'
            href={`https://www.facebook.com/sharer.php?u=${shareUrl}`} />

components/TagItem.js

@@ -2,12 +2,10 @@ import Link from 'next/link'
 
 const TagItem = ({ tag }) => (
   <Link href={`/tag/${encodeURIComponent(tag)}`}>
-    <a>
-      <p className="hover:shadow hover:border-gray-600 rounded-md dark:border-gray-500 border hover:scale-105 hover:bg-gray-500 bg-gray-100 hover:text-white duration-200 mr-1 p-2 leading-none text-sm
+    <div className="cursor-pointer hover:shadow hover:border-gray-600 rounded-md dark:border-gray-500 border hover:scale-105 hover:bg-gray-500 bg-gray-100 hover:text-white duration-200 mr-1 p-2 leading-none text-sm
       dark:bg-gray-500 dark:text-gray-100 dark:hover:bg-black">
-        {tag}
-      </p>
-    </a>
+     <div>  <i className='fa fa-tag mr-1 '/> {tag}</div>
+    </div>
   </Link>
 )
 

components/TagItemMini.js

@@ -2,13 +2,13 @@ import Link from 'next/link'
 
 const TagItemMini = ({ tag, selected = false, count }) => (
   <Link key={tag} href={selected ? '/' : `/tag/${encodeURIComponent(tag)}`}>
-    <span
-      className={`cursor-pointer inline-block border rounded hover:bg-gray-300 duration-200 mr-1 my-1 p-1 font-medium font-light text-xs whitespace-nowrap
-                   dark:text-gray-300 dark:hover:bg-gray-500 ${selected ? 'text-white bg-black dark:hover:bg-gray-900 dark:bg-black dark:border-gray-800' : 'bg-gray-200 text-gray-600 dark:bg-gray-800 dark:border-gray-600'
-      }`}
-    >
-                  <a> {tag + (count ? `(${count})` : '')} </a>
-                </span>
+    <div className={`cursor-pointer inline-block border rounded hover:bg-gray-300 duration-200 
+      mr-1 my-1 p-1 font-medium font-light text-xs whitespace-nowrap dark:text-gray-300 dark:hover:bg-gray-500
+       ${selected
+      ? 'text-white bg-black dark:hover:bg-gray-900 dark:bg-black dark:border-gray-800'
+      : 'bg-gray-200 text-gray-600 dark:bg-gray-800 dark:border-gray-600'}` }>
+    <div> <i className='fa fa-tag mr-1 py-0.5'/>{tag + (count ? `(${count})` : '')} </div>
+    </div>
   </Link>
 )