Welcome to Evora!
+
+
+
);
};
diff --git a/frontend/src/assets/.gitkeep b/frontend/src/assets/.gitkeep
deleted file mode 100644
index e69de29..0000000
diff --git a/frontend/src/assets/bg.jpg b/frontend/src/assets/bg.jpg
new file mode 100644
index 0000000..8167891
Binary files /dev/null and b/frontend/src/assets/bg.jpg differ
diff --git a/frontend/src/assets/hero.jpg b/frontend/src/assets/hero.jpg
new file mode 100644
index 0000000..7c00288
Binary files /dev/null and b/frontend/src/assets/hero.jpg differ
diff --git a/frontend/src/assets/logo.jpg b/frontend/src/assets/logo.jpg
new file mode 100644
index 0000000..db4acc1
Binary files /dev/null and b/frontend/src/assets/logo.jpg differ
diff --git a/frontend/src/assets/logo1.png b/frontend/src/assets/logo1.png
new file mode 100644
index 0000000..d14c2c2
Binary files /dev/null and b/frontend/src/assets/logo1.png differ
diff --git a/frontend/src/assets/review-UI.txt b/frontend/src/assets/review-UI.txt
new file mode 100644
index 0000000..98a1340
--- /dev/null
+++ b/frontend/src/assets/review-UI.txt
@@ -0,0 +1,11 @@
+MVP: https://evora-17c.onrender.com
+Feedback UI: Nên follow vào MVP để điều chỉnh
+- Web dùng full tiếng Việt
+- Login cho User:
+ + Form nhỏ lại tí hoặc thêm content j đó vào phần bên phải chứ trống quá
+ + Chữ trong button Login hơi nhỏ
+- Login cho Admin: thêm phần Quên mật khẩu
+- Homepage:
+ + Tích hợp phần header phía trên vào thanh nav bar cho gọn
+ + Category trên nav bar chuyển xuống dưới thay bằng các option khác follow MVP như: Sự kiện, Đơn vị tổ chức, Giới thiệu,...
+ + Copy banner MVP thêm vào ngay bên dưới nav bar
diff --git a/frontend/src/components/.gitkeep b/frontend/src/components/.gitkeep
deleted file mode 100644
index e69de29..0000000
diff --git a/frontend/src/components/Banner.tsx b/frontend/src/components/Banner.tsx
new file mode 100644
index 0000000..90d6957
--- /dev/null
+++ b/frontend/src/components/Banner.tsx
@@ -0,0 +1,44 @@
+import React from 'react';
+// Đảm bảo đường dẫn hình ảnh đúng
+import { NavLink } from 'react-router-dom';
+
+import hero from '@/assets/hero.jpg';
+import { path } from '@/ultils/constant';
+
+const Banner: React.FC = () => {
+ return (
+
+ 
+
+ );
+};
+
+export default Banner;
diff --git a/frontend/src/components/Button.tsx b/frontend/src/components/Button.tsx
new file mode 100644
index 0000000..c51bcf1
--- /dev/null
+++ b/frontend/src/components/Button.tsx
@@ -0,0 +1,37 @@
+import React, { FC, memo } from 'react';
+
+interface ButtonProps {
+ text: string;
+ textColor?: string;
+ bgColor?: string;
+ IcAfter?: React.ElementType;
+ IcBefor?: React.ElementType;
+ onClick?: () => void;
+ fullWidth?: boolean;
+}
+
+export const Button: FC
+ {' '}
+ {/* Đảm bảo chiều cao của container */}
+
+
+ {' '}
+ {/* Căn giữa theo chiều dọc */}
+
+
+
+ + nơi gắn kết sự kiện và trải nghiệm của bạn! +
+EVORA
++ ĐẶT SỰ KIỆN TRỰC TUYẾN +
+
+
+
+
+
+ Xem thêm
+
+
+ 
+
+ );
+};
+
+export default Contacts;
diff --git a/frontend/src/components/InputField.tsx b/frontend/src/components/InputField.tsx
new file mode 100644
index 0000000..030e1c5
--- /dev/null
+++ b/frontend/src/components/InputField.tsx
@@ -0,0 +1,25 @@
+interface InputFieldProps {
+ id: string;
+ label: string;
+ type: string;
+}
+
+const InputField: React.FC{text.content}
+
+ {text.contact.map((item: Contact) => {
+ return (
+
+
+
+ {item.text}
+
+
+ {item.phone}
+
+
+ {item.zalo}
+
+
+ );
+ })}
+
+
+
+
+ );
+};
+
+export default InputField;
diff --git a/frontend/src/components/Intro.tsx b/frontend/src/components/Intro.tsx
new file mode 100644
index 0000000..29b869e
--- /dev/null
+++ b/frontend/src/components/Intro.tsx
@@ -0,0 +1,54 @@
+import { text } from '../ultils/dataIntro';
+import icons from '../ultils/icons';
+import React, { memo } from 'react';
+
+const { FaStar } = icons;
+const stars = [1, 2, 3, 4, 5];
+
+interface Statistic {
+ value: string;
+ name: string;
+}
+
+const Intro: React.FC = () => {
+ return (
+
+
+ );
+};
+
+export default memo(Intro);
diff --git a/frontend/src/components/Item.tsx b/frontend/src/components/Item.tsx
new file mode 100644
index 0000000..fb3839e
--- /dev/null
+++ b/frontend/src/components/Item.tsx
@@ -0,0 +1,59 @@
+import React from 'react';
+
+const Item: React.FC = () => {
+ return (
+ {text.title}
++ {text.description} + + {text.description2} +
+
+ {text.statistic.map((item: Statistic) => {
+ return (
+
+
+
+ );
+ })}
+ {item.value}
+{item.name}
+{text.price}
+
+ {stars.map((item) => {
+ return (
+
+
+ {text.comment}
+ {text.author} +{text.question}
+{text.answer}
+ +
+
+ );
+};
+
+export default Item;
diff --git a/frontend/src/components/List.tsx b/frontend/src/components/List.tsx
new file mode 100644
index 0000000..f9fa1bf
--- /dev/null
+++ b/frontend/src/components/List.tsx
@@ -0,0 +1,27 @@
+import React from 'react';
+
+import { Item } from '@/components';
+
+interface ListProps {
+ categoriesCode?: string;
+}
+
+const List: React.FC
+ 
+
+
+
+
+
+
+
+
+ + Wooden House, Florida +
+
+
+ 5.0
+
+ + Enter a freshly updated and thoughtfully furnished peaceful home + surrounded by ancient trees, stone walls, and open meadows. +
+
+
+
+ 💲
+ $129 per night
+
+
+ 📶
+ Free wifi
+
+
+
+
+
+
+ );
+};
+
+export default List;
diff --git a/frontend/src/components/TopBar.tsx b/frontend/src/components/TopBar.tsx
new file mode 100644
index 0000000..c5dad9a
--- /dev/null
+++ b/frontend/src/components/TopBar.tsx
@@ -0,0 +1,50 @@
+import React from 'react';
+
+import icons from '@/ultils/icons';
+
+const { FaBirthdayCake, BiPhoneCall, BiEnvelope } = icons;
+
+const TopBar: React.FC = () => {
+ return (
+
+
+
+ Danh sách tin đăng
+ Cập nhật: 12:05 24/12/2024 +
+
+
+
+ );
+};
+
+export default TopBar;
diff --git a/frontend/src/components/index.ts b/frontend/src/components/index.ts
new file mode 100644
index 0000000..0f32271
--- /dev/null
+++ b/frontend/src/components/index.ts
@@ -0,0 +1,9 @@
+export { default as Button } from './Button';
+export { default as Intro } from './Intro';
+export { default as Contact } from './Contact';
+export { default as List } from './List';
+export { default as Item } from './Item';
+export { default as TopBar } from './TopBar';
+export { default as Banner } from './Banner';
+export { default as InputField } from './InputField';
+export { default as ButtonForLogin } from './ButtonForLogin';
diff --git a/frontend/src/containers/public/.gitkeep b/frontend/src/containers/public/.gitkeep
deleted file mode 100644
index e69de29..0000000
diff --git a/frontend/src/containers/public/Footer.tsx b/frontend/src/containers/public/Footer.tsx
new file mode 100644
index 0000000..4177143
--- /dev/null
+++ b/frontend/src/containers/public/Footer.tsx
@@ -0,0 +1,123 @@
+import React from 'react';
+
+import bg from '@/assets/bg.jpg';
+// Đảm bảo đường dẫn chính xác
+import icons from '@/ultils/icons';
+
+const {
+ FaBirthdayCake,
+ CiLocationOn,
+ IoMailOpenOutline,
+ CiPhone,
+ FaArrowRightLong,
+} = icons;
+
+const Footer: React.FC = () => {
+ return (
+
+ );
+};
+
+export default Footer;
diff --git a/frontend/src/containers/public/Header.tsx b/frontend/src/containers/public/Header.tsx
new file mode 100644
index 0000000..07416ae
--- /dev/null
+++ b/frontend/src/containers/public/Header.tsx
@@ -0,0 +1,53 @@
+import React, { useState } from 'react';
+import { Link } from 'react-router-dom';
+
+import logo1 from '@/assets/logo1.png';
+import { Button } from '@/components';
+import icons from '@/ultils/icons';
+
+const { CiLogin, RiAdminLine, RiUserLine } = icons;
+
+const Header: React.FC = () => {
+ const [isShowMenu, setIsShowMenu] = useState(false);
+
+ return (
+
+ {/* Email Section */}
+
+
+
+
+
+
+
+
+ + Email Us +
+ evora.17c@gmail.com +
+
+
+ {/* Contact Section */}
+
+
+
+
+ Evora
+
+
+
+
+
+
+ + Liên hệ +
+ +012 345 6789 +
+ 
+
+ );
+};
+
+export default Header;
diff --git a/frontend/src/containers/public/Home.tsx b/frontend/src/containers/public/Home.tsx
new file mode 100644
index 0000000..0ba80c6
--- /dev/null
+++ b/frontend/src/containers/public/Home.tsx
@@ -0,0 +1,26 @@
+import React from 'react';
+import { Outlet } from 'react-router-dom';
+
+import { Banner, Contact, Intro, TopBar } from '@/components';
+import { Footer, Navigation } from '@/containers/public';
+
+const Home: React.FC = () => {
+ return (
+
+
+
+
+ );
+};
+
+export default Home;
diff --git a/frontend/src/containers/public/HomePage.tsx b/frontend/src/containers/public/HomePage.tsx
new file mode 100644
index 0000000..05ae9ec
--- /dev/null
+++ b/frontend/src/containers/public/HomePage.tsx
@@ -0,0 +1,25 @@
+import React from 'react';
+
+import { List } from '@/components';
+
+const HomePage: React.FC = () => {
+ return (
+
+
+
+
+
+
+
+
+ );
+};
+
+export default HomePage;
diff --git a/frontend/src/containers/public/LoginAdmin.tsx b/frontend/src/containers/public/LoginAdmin.tsx
new file mode 100644
index 0000000..5c729a2
--- /dev/null
+++ b/frontend/src/containers/public/LoginAdmin.tsx
@@ -0,0 +1,62 @@
+import React from 'react';
+
+import logo1 from '@/assets/logo1.png';
+import { ButtonForLogin, InputField } from '@/components';
+
+const LoginAdmin: React.FC = () => {
+ return (
+
+
+ + Danh sách sự kiện nổi bật +
++ KHÁM PHÁ NGAY +
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {/* Left Column */}
+
+
+
+
+ {/* Right Column */}
+
+
+
+
+ {/* Username and Password Fields */}
+ + Login for Admin! +
+
+
+
+
+
+
+ + We are more than just a company +
++ Lorem ipsum dolor sit amet, consectetur adipisicing elit, + sed do eiusmod tempor incididunt ut labore et dolore magna + aliqua. Ut enim ad minim veniam, quis nostrud exercitation + ullamco laboris nisi ut aliquip ex ea commodo consequat. +
+
+
+
+
+
+
+
+
+
+ {/* Left Column */}
+
+
+
+
+ {/* Right Column */}
+
+
+
+
+ {/* Username and Password Fields */}
+ + Login for User! +
+
+
+
+ {/* Register Section */}
+
+
+ Register
+
+
+ Don't have an account?
+
+
+
+
+ + We are more than just a company +
++ Lorem ipsum dolor sit amet, consectetur adipisicing elit, + sed do eiusmod tempor incididunt ut labore et dolore magna + aliqua. Ut enim ad minim veniam, quis nostrud exercitation + ullamco laboris nisi ut aliquip ex ea commodo consequat. +
+
+
+ );
+};
+
+export default Navigation;
diff --git a/frontend/src/containers/public/RegisterUser.tsx b/frontend/src/containers/public/RegisterUser.tsx
new file mode 100644
index 0000000..dd0dd1a
--- /dev/null
+++ b/frontend/src/containers/public/RegisterUser.tsx
@@ -0,0 +1,176 @@
+import React from 'react';
+import { NavLink } from 'react-router-dom';
+
+import logo1 from '@/assets/logo1.png';
+import { path } from '@/ultils/constant';
+
+const RegisterUser: React.FC = () => {
+ return (
+
+ (isActive ? active : notActive)}
+ >
+ TRANG CHỦ
+
+ (isActive ? active : notActive)}
+ >
+ SINH NHẬT
+
+ (isActive ? active : notActive)}
+ >
+ THÔI NÔI
+
+ (isActive ? active : notActive)}
+ >
+ KHAI TRƯƠNG
+
+ (isActive ? active : notActive)}
+ >
+ ĐÁM CƯỚI
+
+ (isActive ? active : notActive)}
+ >
+ SỰ KIỆN
+
+ (isActive ? active : notActive)}
+ >
+ ĐƠN VỊ TỔ CHỨC
+
+ (isActive ? active : notActive)}
+ >
+ GIỚI THIỆU
+
+ (isActive ? active : notActive)}
+ >
+ LIÊN HỆ
+
+
+ {/* Dropdown Button for Login */}
+
+
+
+
+ {/* Dropdown Menu */}
+ {isShowMenu && (
+
+
+
+
+ )}
+
+
+
+
+
+
+
+
+ + Register for a New Account +
+
+ {/* Left Column */}
+
+
+
+ {/* Full Name Input */}
+
+
+ {/* Right Column */}
+
+
+
+
+
+ {/* Email Input */}
+
+
+
+
+
+ {/* Phone Number Input */}
+
+
+
+
+
+ {/* Date of Birth Input */}
+
+
+
+
+
+ {/* Address Input */}
+
+
+
+
+
+
+ {/* Gender Dropdown */}
+
+
+
+
+
+ {/* Password Input */}
+
+
+
+
+
+ {/* Confirm Password Input */}
+
+
+
+
+
+
+
+
+
+
+ Log in
+
+
+ Already have an account?
+