changed the page path, added old footer, fixed oil cube display ** problem

src/router.tsx

@@ -9,30 +9,30 @@ const rootRoute = createRootRoute({
   component: Layout,
 })
 
-// Main page route (new landing page)
+// Home page route (main landing page at /)
 const indexRoute = createRoute({
   getParentRoute: () => rootRoute,
   path: '/',
-  component: MainPage,
-})
-
-// Home page route (old content)
-const homeRoute = createRoute({
-  getParentRoute: () => rootRoute,
-  path: '/home',
   component: HomePage,
 })
 
-// Recipe page route
+// Main page route (40+ page)
+const mainRoute = createRoute({
+  getParentRoute: () => rootRoute,
+  path: '/40+',
+  component: MainPage,
+})
+
+// Recipe page route (under 40+)
 const recipeRoute = createRoute({
   getParentRoute: () => rootRoute,
-  path: '/recipe',
+  path: '/40+/recipe',
   component: RecipePage,
 })
 
 // Create the router
 const router = createRouter({
-  routeTree: rootRoute.addChildren([indexRoute, homeRoute, recipeRoute]),
+  routeTree: rootRoute.addChildren([indexRoute, mainRoute, recipeRoute]),
 })
 
 export default router