App - Copy this React, Tailwind Component to your project
Một giao diện hiện đại, chuyên nghiệp và thân thiện người dùng. Giao diện tích hợp chuyển động mượt mà, slide ảnh tương tác, và đầy đủ các chức năng: từ tìm kiếm thông tin đến quản lý tài khoản, chia sẻ kinh nghiệm, và liên hệ dễ dàng. 🧭 1. Header (Thanh điều hướng cố định) Logo tổ chức bên trái. Các mục chính: Trang chủ Tin tức Chia sẻ kinh nghiệm Đăng ký hiến máu Tìm địa điểm hiến máu Liên hệ 🔐 Góc phải: Biểu tượng tài khoản → click để hiển thị: Đăng nhập / Đăng ký Trang cá nhân Lịch sử hiến máu Đăng xuất 🖼️ 2. Banner chính (Hero Section) Hình ảnh truyền cảm hứng với khẩu hiệu mạnh mẽ như: “Một giọt máu cho đi – Một cuộc đời ở lại” Slide ảnh tự động trượt với điều khiển tay (Carousel) Nút CTA: “Đăng ký ngay”, “Tìm điểm hiến máu” 📰 3. Khu vực Tin tức & Blog Danh sách bài viết mới nhất với hình ảnh và tiêu đề nổi bật Phân loại theo: Kinh nghiệm hiến máu Sự kiện nổi bật Câu chuyện truyền cảm hứng 🧾 4. Tài nguyên - Câu hỏi & Hướng dẫn FAQ (câu hỏi thường gặp) về quy trình hiến máu Hướng dẫn chuẩn bị trước, trong và sau khi hiến máu Lợi ích và lưu ý khi tham gia 📷 5. Thư viện ảnh & video Giao diện slider ảnh Ảnh hoạt động cộng đồng, sự kiện thực tế Hiệu ứng zoom nhẹ khi rê chuột 🧍 6. Trang cá nhân (sau đăng nhập) Thông tin chi tiết người dùng: Họ tên Ngày sinh Nhóm máu Số lần hiến máu Tình trạng sức khỏe Lịch sử hiến máu Chỉnh sửa thông tin cá nhân Tải phiếu xác nhận hiến máu 📞 7. Footer - Liên hệ & Thông tin tổ chức plaintext Sao chép Chỉnh sửa -------------------------------------------------------------------- 🩸 Dự án vì cộng đồng: "Hiến Máu - Kết Nối Sự Sống" 📍 Địa chỉ: Tòa nhà XYZ, Đường ABC, Quận 1, TP.HCM 📞 Hotline: 0123 456 789 ✉️ Email: hotro@hienmau.vn 🌐 Website: www.hienmau.vn 📱 Theo dõi chúng tôi: [Facebook] [YouTube] [Zalo] [Tiktok] 🔒 Chính sách bảo mật | 📜 Điều khoản sử dụng -------------------------------------------------------------------- Hiển thị trên nền tối với chữ sáng, chia thành 3–4 cột: Giới thiệu | Liên hệ | Chính sách | MXH
