diff --git a/LandingPage.tsx b/LandingPage.tsx index 8adb029..2a33f8c 100644 --- a/LandingPage.tsx +++ b/LandingPage.tsx @@ -1,69 +1,78 @@ import React, { useState } from 'react'; -import { LogIn, Compass, ArrowRight, Camera } from 'lucide-react'; +import { LogIn, Compass, ArrowRight, Map as MapIcon, UserPlus } from 'lucide-react'; import { LoginModal } from './LoginModal'; interface LandingPageProps { onContinue?: () => void; onGoToSignup?: () => void; + onGoToMap?: () => void; } -export const LandingPage: React.FC = ({ onContinue, onGoToSignup }) => { +export const LandingPage: React.FC = ({ onContinue, onGoToSignup, onGoToMap }) => { const [isLoginModalOpen, setIsLoginModalOpen] = useState(false); return ( -
- {/* Nửa bên trái: Ảnh background mặc định của dự án */} -
- Travel Planner Background - {/* Overlay màu xanh nhẹ đặc trưng của dự án */} -
- -
-
-
- -
- Travel Planner -
-

- Khám phá thế giới, lưu giữ kỉ niệm. -

-

- Hợp tác cùng bạn bè để lên lịch trình hoàn hảo nhất cho mọi chuyến đi. -

+
+ {/* Nửa bên trái: Hiển thị lưới ảnh du lịch */} +
+
+ Travel 1 + Travel 2
+
+ Travel 3 + Travel 4 +
+
{/* Nửa bên phải: Nội dung chào mừng và Hành động */} -
+
-
-

- Chào mừng bạn đến với trang tạo kế hoạch du lịch +
+ + Travel Planner +
+ +
+

+ Lên kế hoạch cho hành trình tiếp theo

-

- Đăng nhập để vào tạo kế hoạch cá nhân hoặc nhấn nút tiếp tục để tham quan các hình ảnh du lịch được chia sẻ. +

+ Khám phá các địa điểm nổi bật qua bản đồ cộng đồng hoặc đăng nhập để bắt đầu tự tạo chuyến đi cho riêng mình.

-
- {/* Nút Đăng nhập */} +
+ {/* Nút Khám phá Bản đồ (Cho khách công cộng) */} - {/* Nút Tiếp tục */} +
+ + +
+