From c6cd15040d6637b0f5bf687df80d99c0e30da76a Mon Sep 17 00:00:00 2001
From: zihanjian <zihan.jian@outlook.com>
Date: Fri, 4 Jul 2025 17:33:22 +0800
Subject: [PATCH] =?UTF-8?q?=E4=B8=BA=E5=B9=BF=E5=91=8A=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E7=82=B9=E5=87=BB=E8=B7=B3=E8=BD=AC=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 竖向广告和横向Banner都添加了链接包装
- 点击广告将在新标签页打开Google主页
- 添加了hover效果提升交互体验
- 使用了安全的链接属性（target="_blank" rel="noopener noreferrer"）

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 components/HorizontalBanner.tsx | 11 +++++++----
 components/VerticalAd.tsx       | 11 +++++++----
 2 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/components/HorizontalBanner.tsx b/components/HorizontalBanner.tsx
index 67bea49..40f097e 100644
--- a/components/HorizontalBanner.tsx
+++ b/components/HorizontalBanner.tsx
@@ -4,14 +4,17 @@ export default function HorizontalBanner() {
   return (
     <div className="w-full bg-gray-100">
       {/* 横向 Banner - 7:1 比例 */}
-      <div 
-        className="relative w-full bg-gray-200 overflow-hidden"
+      <a 
+        href="https://www.google.com"
+        target="_blank"
+        rel="noopener noreferrer"
+        className="block relative w-full bg-gray-200 overflow-hidden hover:opacity-90 transition-opacity duration-300 cursor-pointer"
         style={{
           aspectRatio: '7/1'
         }}
       >
         {/* 占位内容 */}
-        <div className="absolute inset-0 flex items-center justify-center">
+        <div className="absolute inset-0 flex items-center justify-center pointer-events-none">
           <div className="text-center">
             <div className="text-gray-500 text-base sm:text-lg">广告横幅</div>
             <div className="text-gray-400 text-xs sm:text-sm">7:1 横向广告</div>
@@ -24,7 +27,7 @@ export default function HorizontalBanner() {
           alt="横幅广告"
           className="w-full h-full object-cover"
         />
-      </div>
+      </a>
     </div>
   );
 }
\ No newline at end of file
diff --git a/components/VerticalAd.tsx b/components/VerticalAd.tsx
index b8b0771..a1c068b 100644
--- a/components/VerticalAd.tsx
+++ b/components/VerticalAd.tsx
@@ -34,15 +34,18 @@ export default function VerticalAd() {
         </button>
 
         {/* 广告内容 - 3:5 比例（宽:高） */}
-        <div 
-          className="relative bg-gray-200 rounded-lg overflow-hidden shadow-xl"
+        <a 
+          href="https://www.google.com"
+          target="_blank"
+          rel="noopener noreferrer"
+          className="block relative bg-gray-200 rounded-lg overflow-hidden shadow-xl hover:shadow-2xl transition-shadow duration-300 cursor-pointer"
           style={{
             width: 'min(300px, 60vw)',
             aspectRatio: '3/5'
           }}
         >
           {/* 占位内容 */}
-          <div className="absolute inset-0 flex items-center justify-center">
+          <div className="absolute inset-0 flex items-center justify-center pointer-events-none">
             <div className="text-center">
               <div className="text-gray-500 text-lg mb-2">广告位</div>
               <div className="text-gray-400 text-sm">3:5 竖向广告</div>
@@ -55,7 +58,7 @@ export default function VerticalAd() {
             alt="广告"
             className="w-full h-full object-cover"
           />
-        </div>
+        </a>
       </div>
     </div>
   );