From ffa8511439d3dab582ee4241383529a53353d6f3 Mon Sep 17 00:00:00 2001
From: "tangly1024.com" <tlyong1992@hotmail.com>
Date: Fri, 30 Aug 2024 18:15:23 +0800
Subject: [PATCH] =?UTF-8?q?heo=20=E5=8A=A8=E7=94=BB=E5=BE=AE=E8=B0=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/LoadingCover.js            |  4 +--
 themes/heo/components/Announcement.js | 16 +++++----
 themes/heo/components/CategoryBar.js  |  4 +--
 themes/heo/components/InfoCard.js     |  7 ++--
 themes/heo/components/SideRight.js    | 10 +++---
 themes/heo/components/TouchMeCard.js  | 49 ++++++++++++++++-----------
 6 files changed, 51 insertions(+), 39 deletions(-)

diff --git a/components/LoadingCover.js b/components/LoadingCover.js
index ca0198f2b1a..b53fa36c58d 100644
--- a/components/LoadingCover.js
+++ b/components/LoadingCover.js
@@ -13,7 +13,7 @@ export default function LoadingCover() {
     if (onLoading) {
       setIsVisible(true)
     } else {
-      const timeout = setTimeout(() => setIsVisible(false), 1000) // 等待淡出动画结束
+      const timeout = setTimeout(() => setIsVisible(false), 1500) // 等待淡出动画结束
       return () => clearTimeout(timeout)
     }
   }, [onLoading])
@@ -30,7 +30,7 @@ export default function LoadingCover() {
     <div
       id='loading-cover'
       onClick={handleClick}
-      className={`dark:text-white text-black bg-white dark:bg-black animate__animated ${
+      className={`dark:text-white text-black bg-white dark:bg-black animate__animated animate__faster ${
         onLoading ? 'animate__fadeIn' : 'animate__fadeOut'
       } flex flex-col justify-center z-50 w-full h-screen fixed top-0 left-0`}>
       <div className='mx-auto'>
diff --git a/themes/heo/components/Announcement.js b/themes/heo/components/Announcement.js
index 6c3feb2a42b..04955554bbc 100644
--- a/themes/heo/components/Announcement.js
+++ b/themes/heo/components/Announcement.js
@@ -4,13 +4,15 @@ const NotionPage = dynamic(() => import('@/components/NotionPage'))
 
 const Announcement = ({ post, className }) => {
   if (post?.blockMap) {
-    return <div >
-            {post && (
-                <div id="announcement-content">
-                    <NotionPage post={post} />
-                </div>
-            )}
-        </div>
+    return (
+      <div>
+        {post && (
+          <div id='announcement-content'>
+            <NotionPage post={post} />
+          </div>
+        )}
+      </div>
+    )
   } else {
     return <></>
   }
diff --git a/themes/heo/components/CategoryBar.js b/themes/heo/components/CategoryBar.js
index 9879d8a78cd..d5548f9d913 100644
--- a/themes/heo/components/CategoryBar.js
+++ b/themes/heo/components/CategoryBar.js
@@ -32,8 +32,8 @@ export default function CategoryBar(props) {
   return (
     <div
       id='category-bar'
-      className={`flex flex-nowrap justify-between items-center h-12 mb-4 space-x-2 w-full lg:bg-white dark:lg:bg-[#1e1e1e]  
-  ${border ? 'lg:border lg:hover:border dark:lg:border-gray-800 hover:border-indigo-600 dark:hover:border-yellow-600 ' : ''}  py-2 lg:px-2 rounded-xl transition-colors duration-200`}>
+      className={`wow fadeInUp flex flex-nowrap justify-between items-center h-12 mb-4 space-x-2 w-full lg:bg-white dark:lg:bg-[#1e1e1e]  
+            ${border ? 'lg:border lg:hover:border dark:lg:border-gray-800 hover:border-indigo-600 dark:hover:border-yellow-600 ' : ''}  py-2 lg:px-2 rounded-xl transition-colors duration-200`}>
       <div
         id='category-bar-items'
         ref={categoryBarItemsRef}
diff --git a/themes/heo/components/InfoCard.js b/themes/heo/components/InfoCard.js
index 99d3052f340..af31d060be1 100644
--- a/themes/heo/components/InfoCard.js
+++ b/themes/heo/components/InfoCard.js
@@ -23,11 +23,12 @@ export function InfoCard(props) {
   const url2 = siteConfig('HEO_INFO_CARD_URL2', null, CONFIG)
   const icon2 = siteConfig('HEO_INFO_CARD_ICON2', null, CONFIG)
   return (
-    <Card className='bg-[#4f65f0] dark:bg-yellow-600 text-white flex flex-col w-72 overflow-hidden relative'>
+    <Card className='wow fadeInUp bg-[#4f65f0] dark:bg-yellow-600 text-white flex flex-col w-72 overflow-hidden relative'>
       {/* 信息卡牌第一行 */}
       <div className='flex justify-between'>
         {/* 问候语 */}
         <GreetingsWords />
+        {/* 头像 */}
         <div
           className={`${isSlugPage ? 'absolute right-0 -mt-8 -mr-6 hover:opacity-0 hover:scale-150 blur' : 'cursor-pointer'} justify-center items-center flex dark:text-gray-100 transform transitaion-all duration-200`}>
           <LazyImage
@@ -42,9 +43,7 @@ export function InfoCard(props) {
       <h2 className='text-3xl font-extrabold mt-3'>{siteConfig('AUTHOR')}</h2>
 
       {/* 公告栏 */}
-      <div>
-        <Announcement post={notice} style={{ color: 'white !important' }} />
-      </div>
+      <Announcement post={notice} style={{ color: 'white !important' }} />
 
       <div className='flex justify-between'>
         <div className='flex space-x-3  hover:text-black dark:hover:text-white'>
diff --git a/themes/heo/components/SideRight.js b/themes/heo/components/SideRight.js
index c4dbffd7943..464e2081068 100644
--- a/themes/heo/components/SideRight.js
+++ b/themes/heo/components/SideRight.js
@@ -34,23 +34,25 @@ export default function SideRight(props) {
 
   return (
     <div id='sideRight' className='hidden xl:block w-72 space-y-4 h-full'>
-      <InfoCard {...props} className='w-72' />
+      <InfoCard {...props} className='w-72 wow fadeInUp' />
 
       <div className='sticky top-20 space-y-4'>
         {/* 文章页显示目录 */}
         {post && post.toc && post.toc.length > 0 && (
-          <Card className='bg-white dark:bg-[#1e1e1e]'>
+          <Card className='bg-white dark:bg-[#1e1e1e] wow fadeInUp'>
             <Catalog toc={post.toc} />
           </Card>
         )}
 
         {/* 联系交流群 */}
-        <TouchMeCard />
+        <div className='wow fadeInUp'>
+          <TouchMeCard />
+        </div>
 
         {/* 最新文章列表 */}
         <div
           className={
-            'border hover:border-indigo-600  dark:hover:border-yellow-600 duration-200 dark:border-gray-700 dark:bg-[#1e1e1e] dark:text-white rounded-xl lg:p-6 p-4 hidden lg:block bg-white'
+            'border wow fadeInUp  hover:border-indigo-600  dark:hover:border-yellow-600 duration-200 dark:border-gray-700 dark:bg-[#1e1e1e] dark:text-white rounded-xl lg:p-6 p-4 hidden lg:block bg-white'
           }>
           <LatestPostsGroupMini {...props} />
         </div>
diff --git a/themes/heo/components/TouchMeCard.js b/themes/heo/components/TouchMeCard.js
index 2388a9a56f5..42129ae0fe4 100644
--- a/themes/heo/components/TouchMeCard.js
+++ b/themes/heo/components/TouchMeCard.js
@@ -1,8 +1,7 @@
-
 import FlipCard from '@/components/FlipCard'
+import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
 import CONFIG from '../config'
-import { siteConfig } from '@/lib/config'
 
 /**
  * 交流频道
@@ -13,23 +12,33 @@ export default function TouchMeCard() {
     return <></>
   }
   return (
-        <div className={'relative h-28 text-white flex flex-col'}>
-
-            <FlipCard
-                className='cursor-pointer lg:p-6 p-4 border rounded-xl bg-[#4f65f0] dark:bg-yellow-600 dark:border-gray-600'
-                frontContent={
-                    <div className='h-full'>
-                        <h2 className='font-[1000] text-3xl'>{siteConfig('HEO_SOCIAL_CARD_TITLE_1', null, CONFIG)}</h2>
-                        <h3 className='pt-2'>{siteConfig('HEO_SOCIAL_CARD_TITLE_2', null, CONFIG)}</h3>
-                        <div className='absolute left-0 top-0 w-full h-full' style={{ background: 'url(https://bu.dusays.com/2023/05/16/64633c4cd36a9.png) center center no-repeat' }}></div>
-                    </div>}
-                backContent={<Link href={siteConfig('HEO_SOCIAL_CARD_URL', null, CONFIG)}>
-                    <div className='font-[1000] text-xl h-full'>
-                        {siteConfig('HEO_SOCIAL_CARD_TITLE_3', null, CONFIG)}
-                    </div>
-                </Link>}
-            />
-
-        </div>
+    <div className={'relative h-28 text-white flex flex-col'}>
+      <FlipCard
+        className='cursor-pointer lg:p-6 p-4 border rounded-xl bg-[#4f65f0] dark:bg-yellow-600 dark:border-gray-600'
+        frontContent={
+          <div className='h-full'>
+            <h2 className='font-[1000] text-3xl'>
+              {siteConfig('HEO_SOCIAL_CARD_TITLE_1', null, CONFIG)}
+            </h2>
+            <h3 className='pt-2'>
+              {siteConfig('HEO_SOCIAL_CARD_TITLE_2', null, CONFIG)}
+            </h3>
+            <div
+              className='absolute left-0 top-0 w-full h-full'
+              style={{
+                background:
+                  'url(https://bu.dusays.com/2023/05/16/64633c4cd36a9.png) center center no-repeat'
+              }}></div>
+          </div>
+        }
+        backContent={
+          <Link href={siteConfig('HEO_SOCIAL_CARD_URL', null, CONFIG)}>
+            <div className='font-[1000] text-xl h-full'>
+              {siteConfig('HEO_SOCIAL_CARD_TITLE_3', null, CONFIG)}
+            </div>
+          </Link>
+        }
+      />
+    </div>
   )
 }