ans box link to url

src/components/new_ui/info.tsx

@@ -11,6 +11,7 @@ interface InfoData {
     title: string
     image: string
     description: string
+    url?: string
 }
 
 const infoData: InfoData[] = [
@@ -18,7 +19,8 @@ const infoData: InfoData[] = [
         id: 1,
         title: '膽固醇\n超標',
         image: '/images/new/info_1.webp',
-        description: `長期攝取過多**飽和脂肪及反式脂肪（例如牛油、加工食品、或重複使用嘅煎炸油）**，會令體內**壞膽固醇（LDL）上升、好膽固醇（HDL）下降**，導致膽固醇積聚喺血管內壁，形成血塊堵塞血管，有機會引致**中風、心肌梗塞，**甚至**心臟病**等嚴重後果。`
+        description: `長期攝取過多**飽和脂肪及反式脂肪（例如牛油、加工食品、或重複使用嘅煎炸油）**，會令體內**壞膽固醇（LDL）上升、好膽固醇（HDL）下降**，導致膽固醇積聚喺血管內壁，形成血塊堵塞血管，有機會引致**中風、心肌梗塞，**甚至**心臟病**等嚴重後果。`,
+        url: 'https://www.perplexity.ai/search/a0afe979-4fbd-41bf-a160-18b3ecfb86c9'
     },
     {
         id: 2,
@@ -26,7 +28,8 @@ const infoData: InfoData[] = [
         image: '/images/new/info_2.webp',
         description: `研究指出，將煎炸油長時間加熱至超過煙點或重複使用，會令**油質氧化，**產生聚合物及自由基。前者會令油變黏稠、有油膩味，**增加肝臟負擔；**後者會攻擊細胞，加速身體衰老並提升患上慢性病嘅風險。
 
-長期攝取呢類油脂，會干擾身體脂肪代謝速度，**令過多脂肪積聚喺肝臟，**並削弱其解毒功能，令毒素累積喺體內，最終導致**脂肪肝**。如果肝臟持續受損，可能就會留下永久損傷，最後導致**肝硬化**。`
+長期攝取呢類油脂，會干擾身體脂肪代謝速度，**令過多脂肪積聚喺肝臟，**並削弱其解毒功能，令毒素累積喺體內，最終導致**脂肪肝**。如果肝臟持續受損，可能就會留下永久損傷，最後導致**肝硬化**。`,
+        url: 'https://www.perplexity.ai/search/eab711d2-ff94-4c78-8351-9d5b298bfc01'
     },
     {
         id: 3,
@@ -34,7 +37,8 @@ const infoData: InfoData[] = [
         image: '/images/new/info_3.webp',
         description: `好多人以為「滴油不沾」先健康，但其實**持續攝取適量又優質嘅油脂，**先可以促進毛髮健康生長，同時令皮膚保持彈性同水潤。
 
-因為**脂肪係製造荷爾蒙**嘅重要原素，而脂溶性維他命A、D、E、K亦必須喺有油嘅情況下先可以被吸收，長遠先能真正發揮對皮膚、頭髮同整體健康嘅作用，呈現由內而外嘅自然光澤。`
+因為**脂肪係製造荷爾蒙**嘅重要原素，而脂溶性維他命A、D、E、K亦必須喺有油嘅情況下先可以被吸收，長遠先能真正發揮對皮膚、頭髮同整體健康嘅作用，呈現由內而外嘅自然光澤。`,
+        url: 'https://www.perplexity.ai/search/92ad98b8-458f-418b-a39a-5bb9582ed51f'
     },
     {
         id: 4,
@@ -42,7 +46,8 @@ const infoData: InfoData[] = [
         image: '/images/new/info_4.webp',
         description: `香港人生活節奏急促，一日三餐唔係叫外賣就出街食，而餐廳普遍使用 Omega-6 偏高嘅食油（如大豆油）。**長期攝取會令體內Omega-6遠多於Omega-3，脂肪酸比例失衡，促進身體慢性發炎。**
 
-如果失衡未能改善，尤其Omega-3長期攝取不足，就容易出現易攰、記憶力下降、專注力不足等情況。隨住狀況持續惡化，仲可能影響腦部神經傳導，提升**腦霧同失智症**風險。`
+如果失衡未能改善，尤其Omega-3長期攝取不足，就容易出現易攰、記憶力下降、專注力不足等情況。隨住狀況持續惡化，仲可能影響腦部神經傳導，提升**腦霧同失智症**風險。`,
+        url: 'https://www.perplexity.ai/search/969824ce-4976-4bfa-9825-d8780f6b4405'
     }
 ]
 
@@ -137,6 +142,13 @@ function Info() {
                     whileInView={{ opacity: 1, scale: 1 }}
                     viewport={{ once: true, amount: 0.3 }}
                     transition={{ duration: 0.8, delay: 0.4, ease: "easeOut" }}
+                    cursor="pointer"
+                    onClick={() => {
+                        const url = infoData.find(info => info.id === selectedInfo)?.url;
+                        if (url) {
+                            window.open(url, '_blank');
+                        }
+                    }}
                 >
                     <Image
                         src={infoData.find(info => info.id === selectedInfo)?.image}