From d445ac85490041428c03364c4bbf35f8d07a2930 Mon Sep 17 00:00:00 2001
From: tangly1024 <mail@tangly1024.com>
Date: Sun, 13 Apr 2025 13:13:09 +0800
Subject: [PATCH] =?UTF-8?q?proxio=E7=BB=86=E8=8A=82=E5=9B=BE=E7=89=87?=
 =?UTF-8?q?=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 themes/proxio/components/Blog.js         | 28 ++++++++++++++++++++++--
 themes/proxio/components/Features.js     | 12 ++++++----
 themes/proxio/components/LoadingCover.js |  4 ++--
 themes/proxio/components/Team.js         | 16 ++++++++++++--
 themes/proxio/config.js                  | 14 +++++++++++-
 5 files changed, 63 insertions(+), 11 deletions(-)

diff --git a/themes/proxio/components/Blog.js b/themes/proxio/components/Blog.js
index 9773413b..a4d71972 100644
--- a/themes/proxio/components/Blog.js
+++ b/themes/proxio/components/Blog.js
@@ -9,6 +9,17 @@ import Link from 'next/link'
  * @returns
  */
 export const Blog = ({ posts }) => {
+  const enable = siteConfig('PROXIO_BLOG_ENABLE')
+  if (!enable) {
+    return null
+  }
+
+  // 博客列表默认显示summary文字，当鼠标指向时显示文章封面。这里可选把summary文字替换成图片占位符。
+  const PROXIO_BLOG_PLACEHOLDER_IMG_URL_1 = siteConfig('PROXIO_BLOG_PLACEHOLDER_IMG_URL_1')
+  const PROXIO_BLOG_PLACEHOLDER_IMG_URL_2 = siteConfig('PROXIO_BLOG_PLACEHOLDER_IMG_URL_2')
+  const PROXIO_BLOG_PLACEHOLDER_IMG_URL_3 = siteConfig('PROXIO_BLOG_PLACEHOLDER_IMG_URL_3')
+  const PROXIO_BLOG_PLACEHOLDER_IMG_URL_4 = siteConfig('PROXIO_BLOG_PLACEHOLDER_IMG_URL_4')
+
   return (
     <>
       {/* <!-- ====== Blog Section Start --> */}
@@ -31,6 +42,17 @@ export const Blog = ({ posts }) => {
           {/* 博客列表 此处优先展示3片文章 */}
           <div className='-mx-4 grid md:grid-cols-2 grid-cols-1'>
             {posts?.map((item, index) => {
+              // 文章封面图片，默认使用占位符 根据index 判断获取的时哪一张图片
+              let coverImg = PROXIO_BLOG_PLACEHOLDER_IMG_URL_1
+              if (index === 0) {
+                coverImg = PROXIO_BLOG_PLACEHOLDER_IMG_URL_1
+              } else if (index === 1) {
+                coverImg = PROXIO_BLOG_PLACEHOLDER_IMG_URL_2
+              } else if (index === 2) {
+                coverImg = PROXIO_BLOG_PLACEHOLDER_IMG_URL_3
+              } else if (index === 3) {
+                coverImg = PROXIO_BLOG_PLACEHOLDER_IMG_URL_4
+              }
               return (
                 <div key={index} className='w-full px-4'>
                   <div
@@ -51,9 +73,11 @@ export const Blog = ({ posts }) => {
                       <div className='absolute inset-0 bg-gray-100 dark:bg-hexo-black-gray transition-all duration-500 group-hover:opacity-50 group-hover:bg-black' />
                       {/* 鼠标悬停时显示的文字内容 */}
                       <div className='absolute inset-0 flex items-center justify-center group-hover:scale-110 duration-200 group-hover:text-white'>
-                        <p className='max-w-[370px] text-base text-body-color dark:text-dark-6 flex items-center justify-center duration-200 group-hover:text-white '>
+                        {!coverImg && <p className='max-w-[370px] text-base text-body-color dark:text-dark-6 flex items-center justify-center duration-200 group-hover:text-white '>
                           {item.summary}
-                        </p></div>
+                        </p>}
+                        <LazyImage src={coverImg} className='absolute' />
+                      </div>
                     </div>
                     {/* 内容部分 */}
                     <div className='relative z-10 p-4'>
diff --git a/themes/proxio/components/Features.js b/themes/proxio/components/Features.js
index 72985adb..6f932fd6 100644
--- a/themes/proxio/components/Features.js
+++ b/themes/proxio/components/Features.js
@@ -4,6 +4,7 @@ import { SVGEssential } from './svg/SVGEssential'
 import { SVGGifts } from './svg/SVGGifts'
 import { SVGTemplate } from './svg/SVGTemplate'
 import Link from 'next/link'
+import LazyImage from '@/components/LazyImage'
 /**
  * 产品特性相关，将显示在首页中
  * @returns
@@ -36,8 +37,9 @@ export const Features = () => {
             <div className='w-full p-6 rounded-xl border border-gray-200 dark:border-[#333333]'>
               <div className='wow fadeInUp group flex-col space-y-2 flex' data-wow-delay='.1s'>
                 <div className='flex w-12 h-12'>
-                  <div className='w-full flex justify-center items-center rounded-xl border border-gray-200 dark:border-[#333333] dark:text-white'>
-                    <i class={siteConfig('PROXIO_FEATURE_1_ICON_CLASS')}></i>
+                  <div className='overflow-hidden w-full flex justify-center items-center rounded-xl border border-gray-200 dark:border-[#333333] dark:text-white'>
+                    <i className={siteConfig('PROXIO_FEATURE_1_ICON_CLASS') + ' absolute'}></i>
+                    <LazyImage src={siteConfig('PROXIO_FEATURE_1_ICON_IMG_URL')} className='z-10' />
                   </div>
                 </div>
                 <h4 className='mb-3 text-xl font-bold text-dark dark:text-white'>
@@ -52,8 +54,9 @@ export const Features = () => {
             <div className='w-full p-6 rounded-xl border border-gray-200 dark:border-[#333333]'>
               <div className='wow fadeInUp group flex-col space-y-2 flex' data-wow-delay='.1s'>
                 <div className='flex w-12 h-12'>
-                  <div className='w-full flex justify-center items-center rounded-xl border border-gray-200 dark:border-[#333333] dark:text-white'>
+                  <div className='overflow-hidden w-full flex justify-center items-center rounded-xl border border-gray-200 dark:border-[#333333] dark:text-white'>
                     <i class={siteConfig('PROXIO_FEATURE_2_ICON_CLASS')}></i>
+                    <LazyImage src={siteConfig('PROXIO_FEATURE_2_ICON_IMG_URL')} className='z-10' />
                   </div>
                 </div>
                 <h4 className='mb-3 text-xl font-bold text-dark dark:text-white'>
@@ -68,8 +71,9 @@ export const Features = () => {
             <div className='w-full p-6 rounded-xl border border-gray-200 dark:border-[#333333]'>
               <div className='wow fadeInUp group flex-col space-y-2 flex' data-wow-delay='.1s'>
                 <div className='flex w-12 h-12'>
-                  <div className='w-full flex justify-center items-center rounded-xl border border-gray-200 dark:border-[#333333] dark:text-white'>
+                  <div className='overflow-hidden w-full flex justify-center items-center rounded-xl border border-gray-200 dark:border-[#333333] dark:text-white'>
                     <i class={siteConfig('PROXIO_FEATURE_3_ICON_CLASS')}></i>
+                    <LazyImage src={siteConfig('PROXIO_FEATURE_3_ICON_IMG_URL')} className='z-10' />
                   </div>
                 </div>
                 <h4 className='mb-3 text-xl font-bold text-dark dark:text-white'>
diff --git a/themes/proxio/components/LoadingCover.js b/themes/proxio/components/LoadingCover.js
index a8d134e8..11e49035 100644
--- a/themes/proxio/components/LoadingCover.js
+++ b/themes/proxio/components/LoadingCover.js
@@ -26,7 +26,7 @@ const LoadingCover = ({ onFinishLoading }) => {
             document.body.appendChild(ripple);
 
             // 添加页面缩放 + 模糊动画
-            pageContainer.classList.add('page-clicked');
+            pageContainer?.classList?.add('page-clicked');
 
             // 模拟加载完成，调用回调函数
             setTimeout(() => {
@@ -55,7 +55,7 @@ const LoadingCover = ({ onFinishLoading }) => {
 
     return (
         <div className="welcome" id="pageContainer">
-            <div className="welcome-text" id="welcomeText">
+            <div className="welcome-text px-2" id="welcomeText">
                 {welcomeText}
             </div>
             <style jsx>
diff --git a/themes/proxio/components/Team.js b/themes/proxio/components/Team.js
index d48d519e..0f013b7a 100644
--- a/themes/proxio/components/Team.js
+++ b/themes/proxio/components/Team.js
@@ -1,12 +1,15 @@
 /* eslint-disable @next/next/no-img-element */
 import { siteConfig } from '@/lib/config'
 import LazyImage from '@/components/LazyImage'
+import Link from 'next/link'
 /**
  * 作者团队
  * @returns 
  */
 export const Team = () => {
     const PROXIO_ABOUT_PHOTO_URL = siteConfig('PROXIO_ABOUT_PHOTO_URL')
+    const AUTHOR = siteConfig('AUTHOR')
+
     return (
         <>
             {/* <!-- ====== Team Section Start --> */}
@@ -17,7 +20,7 @@ export const Team = () => {
                     <div className='flex flex-col md:flex-row -mx-4 justify-between'>
                         {/* 左边肖像图 */}
                         <div className='mx-6 mb-6 max-w-96 border-gray-200 dark:border-[#333333] dark:bg-dark-1 border rounded-2xl overflow-hidden'>
-                            <LazyImage src={PROXIO_ABOUT_PHOTO_URL} className='object-cover h-full' />
+                            <LazyImage alt={AUTHOR} src={PROXIO_ABOUT_PHOTO_URL} className='object-cover h-full' />
                         </div>
                         {/* 右侧文字说明 */}
                         <div className='flex flex-col px-4 space-y-4 mx-auto justify-between max-w-[485px]'>
@@ -26,7 +29,7 @@ export const Team = () => {
                                     {siteConfig('PROXIO_ABOUT_TITLE')}
                                 </span>
                             </div>
-                            <h2 className='mb-3 text-2xl leading-[1.2] dark:text-white md:text-[40px]'>
+                            <h2 className='mb-3 text-xl md:text-3xl leading-[1.2] dark:text-white '>
                                 {siteConfig('PROXIO_ABOUT_TEXT_1')}
                             </h2>
                             <p
@@ -41,6 +44,15 @@ export const Team = () => {
                                 <KeyVal k={siteConfig('PROXIO_ABOUT_KEY_3')} v={siteConfig('PROXIO_ABOUT_VAL_3')} />
                                 <KeyVal k={siteConfig('PROXIO_ABOUT_KEY_4')} v={siteConfig('PROXIO_ABOUT_VAL_4')} />
                             </div>
+
+                            <div className='mt-8 w-full flex justify-end py-2'>
+                                <Link
+                                    href={siteConfig('PROXIO_ABOUT_BUTTON_URL', '')}
+                                    className='px-4 py-2 rounded-3xl border dark:border-gray-200 border-[#333333] text-base font-medium text-dark hover:bg-gray-100 dark:text-white dark:hover:bg-white dark:hover:text-black duration-200'>
+                                    {siteConfig('PROXIO_ABOUT_BUTTON_TEXT')}
+                                    <i className="pl-4 fa-solid fa-arrow-right"></i>
+                                </Link>
+                            </div>
                         </div>
                     </div>
                 </div>
diff --git a/themes/proxio/config.js b/themes/proxio/config.js
index 72d691ac..aa0d0812 100644
--- a/themes/proxio/config.js
+++ b/themes/proxio/config.js
@@ -28,6 +28,13 @@ const CONFIG = {
     PROXIO_BLOG_COUNT: 4, // 首页博文区块展示前4篇文章
     PROXIO_BLOG_TEXT_1: '我的最新动态',
 
+    // 区块默认内容显示文章的summary文本，但也支持用自定义图片或logo德国替换掉占位显示内容
+    PROXIO_BLOG_PLACEHOLDER_IMG_URL_1: '', // 填写要替换成的图片，支持图床或直接上传到项目中，示例  /images/feature-1.webp
+    PROXIO_BLOG_PLACEHOLDER_IMG_URL_2: '',
+    PROXIO_BLOG_PLACEHOLDER_IMG_URL_3: '',
+    PROXIO_BLOG_PLACEHOLDER_IMG_URL_4: '',
+
+
     PROXIO_ANNOUNCEMENT_ENABLE: true, //公告文字区块
 
     // 特性区块
@@ -39,14 +46,17 @@ const CONFIG = {
 
     // 特性1
     PROXIO_FEATURE_1_ICON_CLASS: 'fa-solid fa-stopwatch', // fas图标
+    PROXIO_FEATURE_1_ICON_IMG_URL: '', // 图片图标选填，默认是fas图标，如果需要图片图标可以填写图片地址，示例/avatar.png
     PROXIO_FEATURE_1_TITLE_1: '高效工作流程',
     PROXIO_FEATURE_1_TEXT_1: '精简的设计流程确保快速交付，在紧迫的工期下仍能保证品质与细节不打折扣。',
 
     PROXIO_FEATURE_2_ICON_CLASS: 'fa-solid fa-comments',
+    PROXIO_FEATURE_2_ICON_IMG_URL: '', 
     PROXIO_FEATURE_2_TITLE_1: '协作式流程',
     PROXIO_FEATURE_2_TEXT_1: '与你紧密合作，融合反馈意见，打造超越预期的设计',
 
     PROXIO_FEATURE_3_ICON_CLASS: 'fa-solid fa-search',
+    PROXIO_FEATURE_2_ICON_IMG_URL: '',
     PROXIO_FEATURE_3_TITLE_1: '细节把控',
     PROXIO_FEATURE_3_TEXT_1: '精益求精雕琢每个元素，确保成品精致统一，令人过目难忘',
 
@@ -160,8 +170,10 @@ const CONFIG = {
     PROXIO_ABOUT_KEY_3: '交付项目',
     PROXIO_ABOUT_VAL_3: '5000+',
     PROXIO_ABOUT_KEY_4: '累积创作时长（小时）',
-    PROXIO_ABOUT_VAL_4: '10000+', 
+    PROXIO_ABOUT_VAL_4: '10000+',
 
+    PROXIO_ABOUT_BUTTON_URL: '/about',
+    PROXIO_ABOUT_BUTTON_TEXT: '关于我',
 
     // 横向滚动文字
     PROXIO_BRANDS_ENABLE: true, // 滚动文字