feature:

去掉tidio，优化性能；
卡牌图标微调；
侧边栏分类图标样式；
个人信息卡牌图片懒加载。

blog.config.js

@@ -61,7 +61,7 @@ const BLOG = {
   isProd: process.env.VERCEL_ENV === 'production', // distinguish between development and production environment (ref: https://vercel.com/docs/environment-variables#system-environment-variables)
   googleAdsenseId: 'ca-pub-2708419466378217', // 谷歌广告ID
   DaoVoiceId: '', // 在线聊天 DaoVoice http://dashboard.daovoice.io/get-started
-  TidioId: '8lgekxyr9hr9m7archbs0a4a2gu9ckbg' // 在线聊天 https://www.tidio.com/
+  TidioId: '' // 在线聊天 https://www.tidio.com/
 }
 // export default BLOG
 module.exports = BLOG

components/BlogPostCard.js

@@ -4,7 +4,7 @@ import Link from 'next/link'
 import React from 'react'
 import Image from 'next/image'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import { faFolderOpen } from '@fortawesome/free-solid-svg-icons'
+import { faFolder } from '@fortawesome/free-solid-svg-icons'
 
 const BlogPostCard = ({ post, tags }) => {
   return (
@@ -18,7 +18,7 @@ const BlogPostCard = ({ post, tags }) => {
         <div>
           <Link href={`/category/${post.category}`} passHref>
             <span className='cursor-pointer dark:text-gray-200 text-gray-400 text-sm py-1.5 mr-1 hover:underline hover:text-blue-500 transform'>
-              <FontAwesomeIcon icon={faFolderOpen} className=' mr-1' />{post.category}
+              <FontAwesomeIcon icon={faFolder} className='mr-1' />{post.category}
             </span>
           </Link>
           <span className='mx-1 dark:text-gray-400'>|</span>

components/CategoryGroup.js

@@ -10,7 +10,7 @@ const CategoryGroup = ({ currentCategory, categories }) => {
           const selected = currentCategory === category
           return <Link key={category} href={`/category/${category}`} passHref>
             <div className={(selected ? 'bg-gray-200 dark:bg-black dark:text-white text-black ' : 'dark:text-gray-400 text-gray-500 ') + ' hover:text-black dark:hover:text-white dark:hover:bg-gray-600 px-5 cursor-pointer py-2 hover:bg-gray-100'}>
-              <FontAwesomeIcon icon={selected ? faFolderOpen : faFolder} className='mr-2 text-gray-400'/>{category}({categories[category]})</div>
+              <FontAwesomeIcon icon={selected ? faFolderOpen : faFolder} className={`${selected ? 'text-black dark:text-white' : 'text-gray-400'} mr-2 `}/>{category}({categories[category]})</div>
           </Link>
         })}
       </div>

components/InfoCard.js

@@ -12,6 +12,7 @@ const InfoCard = () => {
           alt={BLOG.author}
           width={100}
           height={100}
+          loading='lazy'
           src='/avatar.svg'
           className='rounded-full border-black'
         />