Merge pull request 'fix: ui title home page, add pricing card registration page' (#13) from feat/toan-19052026-paypal into develop

Reviewed-on: UKSOURCE/ipv6#13

app/components/forms/RegistrationPageClient.tsx

@@ -7,6 +7,13 @@ import RegistrationForm from "@/app/components/forms/RegistrationForm";
 export default function RegistrationPageClient() {
   const { registration, lang } = useTranslation();
   const backLabel = lang === "vi" ? "Quay Về Trang Chủ" : "Back to Home";
+  const ticket = registration.ticket as {
+    label: string;
+    price: string;
+    currency: string;
+    note: string;
+    perks: string[];
+  };
 
   return (
     <main className="pt-[120px] pb-[80px] px-[var(--spacing-gutter)] flex justify-center">
@@ -31,6 +38,39 @@ export default function RegistrationPageClient() {
             <p className="text-on-surface-variant text-lg">{registration.subtitle}</p>
           </div>
 
+          {/* Pricing Card */}
+          <div className="mb-[32px] glass-panel rounded-xl p-6 md:p-8 relative overflow-hidden border border-primary/30">
+            <div className="absolute top-0 left-0 w-full h-[2px] bg-gradient-to-r from-transparent via-primary to-transparent" />
+            <div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-6">
+              <div className="flex items-start gap-4">
+                <div className="w-12 h-12 rounded-xl gold-gradient-bg flex items-center justify-center shrink-0">
+                  <span className="material-symbols-outlined text-on-primary text-[22px]">confirmation_number</span>
+                </div>
+                <div>
+                  <p className="text-outline text-xs uppercase tracking-widest mb-1">{ticket.label}</p>
+                  <div className="flex items-baseline gap-2">
+                    <span className="font-[var(--font-display-lg)] text-[2.5rem] leading-none text-primary">
+                      {ticket.price}
+                    </span>
+                    <span className="text-on-surface-variant text-base font-medium">{ticket.currency}</span>
+                  </div>
+                  <p className="text-outline text-xs mt-1 flex items-center gap-1">
+                    <span className="material-symbols-outlined text-[14px]">payments</span>
+                    {ticket.note}
+                  </p>
+                </div>
+              </div>
+              <ul className="space-y-2 sm:text-right">
+                {ticket.perks.map((perk, i) => (
+                  <li key={i} className="flex sm:flex-row-reverse items-center gap-2 text-on-surface-variant text-sm">
+                    <span className="material-symbols-outlined text-primary text-[16px]">check_circle</span>
+                    {perk}
+                  </li>
+                ))}
+              </ul>
+            </div>
+          </div>
+
           <div className="glass-panel p-[32px] md:p-12 rounded-xl shadow-2xl relative overflow-hidden">
             <div className="absolute top-0 left-0 w-full h-[1px] bg-gradient-to-r from-transparent via-primary/20 to-transparent" />
             <RegistrationForm data={registration} />

app/components/home/HeroSection.tsx

@@ -25,7 +25,15 @@ export default function HeroSection({
             </span>
           </div>
           <h1 className="font-[var(--font-display-lg)] text-on-surface mb-6 lg:mb-8 leading-[1.1] text-[clamp(1.75rem,3.5vw+1rem,4.25rem)]">
-            {data.title}
+            {data.title.includes(" AI") ? (
+              <>
+                {data.title.split(" AI")[0]}
+                <br />
+                {"AI" + data.title.split(" AI").slice(1).join(" AI")}
+              </>
+            ) : (
+              data.title
+            )}
           </h1>
           <p className="text-on-surface-variant text-base lg:text-[22px] mb-8 lg:mb-16 max-w-3xl leading-relaxed opacity-90">
             {data.subtitle}

app/data/home.json

@@ -2,7 +2,7 @@
   "hero": {
     "badgeIcon": "calendar_today",
     "badgeText": "June 2026 | Ho Chi Minh City, Vietnam",
-    "title": "IPv6 for AI & Data Centre Summit 2026",
+    "title": "IPv6 - Enhanced for AI & Data Centre Summit 2026",
     "subtitle": "Unlocking the Potential of Next-Gen Infrastructure. Join global leaders in redefining ASEAN's digital connectivity for the age of AI.",
     "primaryCta": { "label": "Register", "href": "/registration" },
     "secondaryCta": { "label": "View Agenda", "href": "#agenda" }

app/data/home.vi.json

@@ -2,7 +2,7 @@
   "hero": {
     "badgeIcon": "calendar_today",
     "badgeText": "Tháng 6/2026 | TP. Hồ Chí Minh, Việt Nam",
-    "title": "IPv6 for AI & Data Centre Summit 2026",
+    "title": "IPv6 - Enhanced for AI & Data Centre Summit 2026",
     "subtitle": "Khám phá tiềm năng Hạ tầng thế hệ mới. Chung sức định hình kỷ nguyên kết nối số tại ASEAN cùng doanh nghiệp hàng đầu quốc tế.",
     "primaryCta": { "label": "Đăng Ký", "href": "/registration" },
     "secondaryCta": { "label": "Xem Lịch Trình", "href": "#agenda" }

app/data/registration.json

@@ -1,6 +1,19 @@
 {
   "title": "Summit Registration",
   "subtitle": "Secure your presence at the forefront of IPv6 innovation for AI and Data Centres.",
+  "ticket": {
+    "label": "Delegate Pass",
+    "price": "$120",
+    "currency": "USD",
+    "note": "One-time payment via PayPal",
+    "perks": [
+      "Full-day conference access",
+      "Networking sessions & workshops",
+      "Lunch & refreshments included",
+      "Digital summit materials",
+      "Certificate of attendance"
+    ]
+  },
   "sections": {
     "personal": { "title": "Personal Info", "fullName": "Full Name", "phone": "Phone Number", "email": "Business Email" },
     "professional": { "title": "Professional Info", "company": "Company Name", "jobTitle": "Job Title" },

app/data/registration.vi.json

@@ -1,6 +1,19 @@
 {
   "title": "Đăng Ký Tham Dự Hội Nghị",
   "subtitle": "Nắm bắt cơ hội tiên phong thời kỳ đổi mới IPv6 cho AI và trung tâm dữ liệu.",
+  "ticket": {
+    "label": "Vé Đại Biểu",
+    "price": "$120",
+    "currency": "USD",
+    "note": "Thanh toán một lần qua PayPal",
+    "perks": [
+      "Tham dự toàn bộ hội nghị trong ngày",
+      "Phiên kết nối & hội thảo chuyên đề",
+      "Bữa trưa & giải khát",
+      "Tài liệu hội nghị kỹ thuật số",
+      "Chứng chỉ tham dự"
+    ]
+  },
   "sections": {
     "personal": {
       "title": "Thông Tin Cá Nhân",

app/data/sponsor.json

@@ -2,7 +2,7 @@
   "hero": {
     "eyebrow": "OPPORTUNITY AWAITS",
     "title": "Become a Sponsor",
-    "subtitle": "IPv6 for AI & Data Centre Summit 2026 — 18 June 2026, Ho Chi Minh City",
+    "subtitle": "IPv6 - Enhanced AI & Data Centre Summit 2026 — 18 June 2026, Ho Chi Minh City",
     "description": "Join industry leaders at the forefront of the technological evolution. We invite innovative companies to co-sponsor an elite gathering focusing on AI, IPv6, Cloud Computing, Cybersecurity, Blockchain, and Data Centres. Align your brand with the architects of tomorrow's infrastructure.",
     "primaryCta": { "label": "Download Prospectus", "href": "#" },
     "secondaryCta": { "label": "Speak to an Agent", "href": "#contact" }

app/layout.tsx

@@ -9,7 +9,7 @@ export const metadata: Metadata = {
   metadataBase: new URL(process.env.NEXT_PUBLIC_BASE_URL || "http://localhost:3000"),
   title: "IPv6 Enhanced 2026 | Infrastructure for AI",
   description:
-    "IPv6 for AI & Data Centre Enhanced 2026 — a premier event for next-gen infrastructure in ASEAN.",
+    "IPv6 - Enhanced for AI & Data Centre Enhanced 2026 — a premier event for next-gen infrastructure in ASEAN.",
 };
 
 export default function RootLayout({ children }: { children: React.ReactNode }) {