diff --git a/app/components/home/GallerySection.tsx b/app/components/home/GallerySection.tsx new file mode 100644 index 0000000..cb24933 --- /dev/null +++ b/app/components/home/GallerySection.tsx @@ -0,0 +1,80 @@ +"use client"; + +const BASE = process.env.NEXT_PUBLIC_BASE_PATH || ""; + +type GalleryItem = { + src: string; + alt: string; + span: "wide" | "normal" | "full"; +}; + +type Props = { + data: { + eyebrow: string; + title: string; + description: string; + items: GalleryItem[]; + }; +}; + +// Map span → Tailwind col-span classes +const spanClass: Record = { + wide: "md:col-span-2 lg:col-span-2", + normal: "", + full: "md:col-span-2 lg:col-span-3", +}; + +// Map span → chiều cao ảnh +const heightClass: Record = { + wide: "h-[240px] md:h-[340px] lg:h-[420px]", + normal: "h-[240px] md:h-[340px] lg:h-[420px]", + full: "h-[260px] md:h-[360px] lg:h-[480px]", +}; + +export default function GallerySection({ data }: Props) { + return ( + + ); +} diff --git a/app/components/home/HomePageClient.tsx b/app/components/home/HomePageClient.tsx index ef236b2..c392b7c 100644 --- a/app/components/home/HomePageClient.tsx +++ b/app/components/home/HomePageClient.tsx @@ -5,6 +5,8 @@ import HeroSection from "@/app/components/home/HeroSection"; import VisionSection from "@/app/components/home/VisionSection"; import StatsSection from "@/app/components/home/StatsSection"; import AgendaSection from "@/app/components/home/AgendaSection"; +import SpeakerSpotlightSection from "@/app/components/home/SpeakerSpotlightSection"; +import GallerySection from "@/app/components/home/GallerySection"; import PartnersCarousel from "@/app/components/home/PartnersCarousel"; export default function HomePageClient() { @@ -16,7 +18,9 @@ export default function HomePageClient() { - + + + ); } diff --git a/app/components/home/PartnersCarousel.tsx b/app/components/home/PartnersCarousel.tsx index 88bc246..df7e87d 100644 --- a/app/components/home/PartnersCarousel.tsx +++ b/app/components/home/PartnersCarousel.tsx @@ -73,17 +73,23 @@ function CarouselRow({ ); } -export default function PartnersCarousel() { +export default function PartnersCarousel({ + eyebrow = "Partners & Sponsors", + title = "Trusted by Industry Leaders", +}: { + eyebrow?: string; + title?: string; +}) { const base = process.env.NEXT_PUBLIC_BASE_PATH || ""; return (

- Partners & Sponsors + {eyebrow}

- Trusted by Industry Leaders + {title}

diff --git a/app/components/home/SpeakerSpotlightSection.tsx b/app/components/home/SpeakerSpotlightSection.tsx new file mode 100644 index 0000000..cdbb9fb --- /dev/null +++ b/app/components/home/SpeakerSpotlightSection.tsx @@ -0,0 +1,93 @@ +"use client"; + +const BASE = process.env.NEXT_PUBLIC_BASE_PATH || ""; + +type SpeakerItem = { + name: string; + title: string; + photo: string; + quote: string; +}; + +type Props = { + data: { + eyebrow: string; + title: string; + items: SpeakerItem[]; + }; +}; + +export default function SpeakerSpotlightSection({ data }: Props) { + const speaker = data.items[0]; + + return ( +
+ {/* Section header */} +
+ + {data.eyebrow} + +

+ {data.title} +

+
+ + {/* Card: 3/10 image — 7/10 quote */} +
+ + {/* LEFT — 30%: ảnh + tên + chức danh */} +
+ {/* Ảnh tròn */} +
+ {/* Ring gold trang trí */} +
+ {/* eslint-disable-next-line @next/next/no-img-element */} + {speaker.name} +
+ + {/* Tên */} +

+ {speaker.name} +

+ + {/* Chức danh */} +

+ {speaker.title} +

+
+ + {/* RIGHT — 70%: quote dàn hàng ngang */} +
+ {/* Dấu nháy mở trang trí */} + + +
+ {/* Quote */} +
+ “{speaker.quote}” +
+ + {/* Gold divider */} +
+ + {/* Attribution nhỏ */} +

+ {speaker.name} — {speaker.title} +

+
+
+ +
+
+ ); +} diff --git a/app/data/home.json b/app/data/home.json index e9de8ba..2f19a05 100644 --- a/app/data/home.json +++ b/app/data/home.json @@ -40,6 +40,18 @@ { "value": "50+", "label": "Tech Partners" } ] }, + "speakers": { + "eyebrow": "FEATURED SPEAKER", + "title": "Voices of Leadership", + "items": [ + { + "name": "Dr. Sureswaran Ramadass", + "title": "Chairman, APAC IPv6 Council", + "photo": "/assets/img/speakers/speakes.jpg", + "quote": "The transition to IPv6 is not just a technical upgrade — it is the fundamental infrastructure for the AI-driven economy of ASEAN." + } + ] + }, "agenda": { "id": "agenda", "eyebrow": "SCHEDULE", @@ -65,6 +77,25 @@ "description": "Closed-door discussion for regulators and industry leaders." } ] + }, + "partners": { + "eyebrow": "Partners & Sponsors", + "title": "Trusted by Industry Leaders" + }, + "gallery": { + "eyebrow": "Visual Journey", + "title": "Event Gallery", + "description": "Moments from our global journey toward IPv6 excellence.", + "items": [ + { "src": "/assets/img/gallery/ipv6_1.jpg", "alt": "IPv6 & AI Keynote Stage", "span": "wide" }, + { "src": "/assets/img/gallery/ipv6_2.png", "alt": "Networking Reception", "span": "normal" }, + { "src": "/assets/img/gallery/ipv6_3.png", "alt": "Tech Expo", "span": "normal" }, + { "src": "/assets/img/gallery/ipv6_4.png", "alt": "ASEAN Digital Future Stage", "span": "wide" }, + { "src": "/assets/img/gallery/ipv6_5.png", "alt": "Networking Breakfast", "span": "normal" }, + { "src": "/assets/img/gallery/ipv6_6.png", "alt": "Panel Discussion — IPV6", "span": "normal" }, + { "src": "/assets/img/gallery/ipv6_7.png", "alt": "IPv6 Summit 2026 Registration", "span": "normal" }, + { "src": "/assets/img/gallery/ipv6_8.jpg", "alt": "Network Visualization", "span": "full" } + ] } } diff --git a/app/data/home.vi.json b/app/data/home.vi.json index 263a1de..8848fe7 100644 --- a/app/data/home.vi.json +++ b/app/data/home.vi.json @@ -40,6 +40,18 @@ { "value": "50+", "label": "Đối Tác Công Nghệ" } ] }, + "speakers": { + "eyebrow": "DIỄN GIẢ NỔI BẬT", + "title": "Tiếng Nói Lãnh Đạo", + "items": [ + { + "name": "Dr. Sureswaran Ramadass", + "title": "Chủ tịch, Hội đồng IPv6 APAC", + "photo": "/assets/img/speakers/speakes.jpg", + "quote": "Chuyển đổi sang IPv6 không chỉ là nâng cấp kỹ thuật — đó là nền tảng hạ tầng thiết yếu cho nền kinh tế số được dẫn dắt bởi AI tại ASEAN." + } + ] + }, "agenda": { "id": "agenda", "eyebrow": "LỊCH TRÌNH", @@ -65,5 +77,24 @@ "description": "Thảo luận kín dành cho cơ quan quản lý và lãnh đạo ngành." } ] + }, + "partners": { + "eyebrow": "Đối tác và Nhà tài trợ", + "title": "Được các nhà lãnh đạo trong ngành tin cậy" + }, + "gallery": { + "eyebrow": "Hành Trình Hình Ảnh", + "title": "Thư Viện Ảnh", + "description": "Những khoảnh khắc từ hành trình hướng tới sự xuất sắc của IPv6.", + "items": [ + { "src": "/assets/img/gallery/ipv6_1.jpg", "alt": "Sân khấu Keynote IPv6 & AI", "span": "wide" }, + { "src": "/assets/img/gallery/ipv6_2.png", "alt": "Tiệc Networking", "span": "normal" }, + { "src": "/assets/img/gallery/ipv6_3.png", "alt": "Triển lãm Công nghệ", "span": "normal" }, + { "src": "/assets/img/gallery/ipv6_4.png", "alt": "Sân khấu Tương lai Số ASEAN", "span": "wide" }, + { "src": "/assets/img/gallery/ipv6_5.png", "alt": "Bữa sáng Networking", "span": "normal" }, + { "src": "/assets/img/gallery/ipv6_6.png", "alt": "Phiên thảo luận — IPV6", "span": "normal" }, + { "src": "/assets/img/gallery/ipv6_7.png", "alt": "Quầy đăng ký IPv6 Summit 2026", "span": "normal" }, + { "src": "/assets/img/gallery/ipv6_8.jpg", "alt": "Hình ảnh mạng lưới kết nối", "span": "full" } + ] } } diff --git a/public/assets/img/gallery/ipv6_1.jpg b/public/assets/img/gallery/ipv6_1.jpg new file mode 100644 index 0000000..9c21578 Binary files /dev/null and b/public/assets/img/gallery/ipv6_1.jpg differ diff --git a/public/assets/img/gallery/ipv6_2.png b/public/assets/img/gallery/ipv6_2.png new file mode 100644 index 0000000..84a00bc Binary files /dev/null and b/public/assets/img/gallery/ipv6_2.png differ diff --git a/public/assets/img/gallery/ipv6_3.png b/public/assets/img/gallery/ipv6_3.png new file mode 100644 index 0000000..cb12cf2 Binary files /dev/null and b/public/assets/img/gallery/ipv6_3.png differ diff --git a/public/assets/img/gallery/ipv6_4.png b/public/assets/img/gallery/ipv6_4.png new file mode 100644 index 0000000..707a848 Binary files /dev/null and b/public/assets/img/gallery/ipv6_4.png differ diff --git a/public/assets/img/gallery/ipv6_5.png b/public/assets/img/gallery/ipv6_5.png new file mode 100644 index 0000000..ffd04a0 Binary files /dev/null and b/public/assets/img/gallery/ipv6_5.png differ diff --git a/public/assets/img/gallery/ipv6_6.png b/public/assets/img/gallery/ipv6_6.png new file mode 100644 index 0000000..b44374e Binary files /dev/null and b/public/assets/img/gallery/ipv6_6.png differ diff --git a/public/assets/img/gallery/ipv6_7.png b/public/assets/img/gallery/ipv6_7.png new file mode 100644 index 0000000..8fc5a1d Binary files /dev/null and b/public/assets/img/gallery/ipv6_7.png differ diff --git a/public/assets/img/gallery/ipv6_8.jpg b/public/assets/img/gallery/ipv6_8.jpg new file mode 100644 index 0000000..a92150f Binary files /dev/null and b/public/assets/img/gallery/ipv6_8.jpg differ diff --git a/public/assets/img/speakers/speakes.jpg b/public/assets/img/speakers/speakes.jpg new file mode 100644 index 0000000..75b04c7 Binary files /dev/null and b/public/assets/img/speakers/speakes.jpg differ