final updated

public/.htaccess

@@ -0,0 +1,16 @@
+Options -MultiViews
+RewriteEngine On
+RewriteBase /
+
+# Don't rewrite files or directories
+RewriteCond %{REQUEST_FILENAME} -f [OR]
+RewriteCond %{REQUEST_FILENAME} -d
+RewriteRule ^ - [L]
+
+# Don't rewrite assets, images, fonts
+RewriteCond %{REQUEST_URI} ^/(assets|images|fonts)/ [OR]
+RewriteCond %{REQUEST_URI} \.(js|css|jpg|jpeg|png|gif|webp|svg|ico|woff|woff2|ttf|otf|eot)$ [NC]
+RewriteRule ^ - [L]
+
+# Route everything else to index.html
+RewriteRule ^ /index.html [L]

src/components/header.tsx

@@ -74,7 +74,7 @@ function Header({ showMenu = false }: HeaderProps) {
 
     const scrollToSection = (sectionId: string) => {
         const targetId = sectionId.replace('#', '');
-        const isOn40PlusPage = location.pathname === '/40+';
+        const isOn40PlusPage = location.pathname === '/40plus';
         const element = isOn40PlusPage ? document.getElementById(targetId) : null;
 
         if (element) {
@@ -97,7 +97,7 @@ function Header({ showMenu = false }: HeaderProps) {
         }
 
         if (!isOn40PlusPage) {
-            router.navigate({ to: '/40+' });
+            router.navigate({ to: '/40plus' });
         }
     };
 
@@ -128,7 +128,7 @@ function Header({ showMenu = false }: HeaderProps) {
 
     const handleMenuClick = (itemId: string) => {
         if (itemId === 'recipes') {
-            const isOnRecipePage = location.pathname === '/40+/recipe';
+            const isOnRecipePage = location.pathname === '/40plus/recipe';
             
             if (isOnRecipePage) {
                 // Already on recipe page, just close drawer
@@ -137,7 +137,7 @@ function Header({ showMenu = false }: HeaderProps) {
             }
             
             // Navigate to recipe page - force reload to ensure Instagram embeds work
-            window.location.href = '/40+/recipe';
+            window.location.href = '/40plus/recipe';
             return;
         } else {
             // Scroll to section (drawer will be closed inside scrollToSection)

src/components/new_ui/info.tsx

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

src/components/new_ui/oilInfo.tsx

@@ -13,7 +13,7 @@ function OilInfo() {
     const { location } = useRouterState();
 
     const handleRecipeNavigation = () => {
-        const isOnRecipePage = location.pathname === '/40+/recipe';
+        const isOnRecipePage = location.pathname === '/40plus/recipe';
         
         if (isOnRecipePage) {
             // Already on recipe page
@@ -21,7 +21,7 @@ function OilInfo() {
         }
         
         // Navigate from main page - force reload to ensure Instagram embeds work
-        window.location.href = '/40+/recipe';
+        window.location.href = '/40plus/recipe';
     };
 
     return (

src/pages/main.tsx

@@ -17,7 +17,7 @@ function MainPage() {
   const { location } = useRouterState()
 
   useEffect(() => {
-    if (location.pathname !== '/40+') {
+    if (location.pathname !== '/40plus') {
       return
     }
 

src/pages/recipe.tsx

@@ -163,7 +163,7 @@ function Recipe() {
                 alignItems="center"
                 top={{ base: "140px", md: "140px", lg: "140px", xl: "140px" }}
                 left={{ base: "0vw", md: "2vw", lg: "2vw", xl: "2vw" }}
-                onClick={() => router.navigate({ to: '/40+' })}
+                onClick={() => router.navigate({ to: '/40plus' })}
                 cursor="pointer"
                 _hover={{ opacity: 0.8 }}
             >

src/router.tsx

@@ -19,20 +19,21 @@ const indexRoute = createRoute({
 // Main page route (40+ page)
 const mainRoute = createRoute({
   getParentRoute: () => rootRoute,
-  path: '/40+',
+  path: '/40plus',
   component: MainPage,
 })
 
 // Recipe page route (under 40+)
 const recipeRoute = createRoute({
   getParentRoute: () => rootRoute,
-  path: '/40+/recipe',
+  path: '/40plus/recipe',
   component: RecipePage,
 })
 
-// Create the router
+// Create the router with hash-based routing for FTP server compatibility
 const router = createRouter({
   routeTree: rootRoute.addChildren([indexRoute, mainRoute, recipeRoute]),
+  defaultPreload: 'intent',
 })
 
 export default router