Update src/app/page.tsx

Merge version_2 into main

src/app/page.tsx

@@ -2,272 +2,101 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
-import HeroSplitDoubleCarousel from "@/components/sections/hero/HeroSplitDoubleCarousel";
-import ProductCardFour from "@/components/sections/product/ProductCardFour";
-import MediaAbout from "@/components/sections/about/MediaAbout";
-import FeatureHoverPattern from "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern";
-import TestimonialCardTwelve from "@/components/sections/testimonial/TestimonialCardTwelve";
-import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
-import ContactCenter from "@/components/sections/contact/ContactCenter";
-import FooterMedia from "@/components/sections/footer/FooterMedia";
-import {
-  UtensilsCrossed,
-  ShoppingCart,
-  Heart,
-  Star,
-  Zap,
-  MessageSquare,
-  TrendingUp,
-  Clock,
-  Shield,
-  Users,
-  CheckCircle,
-  MessageCircle,
-} from "lucide-react";
 
-export default function BubunibblePage() {
+export default function Home() {
   return (
     <ThemeProvider
       defaultButtonVariant="hover-magnetic"
       defaultTextAnimation="entrance-slide"
-      borderRadius="soft"
+      borderRadius="rounded"
-      contentWidth="smallMedium"
+      contentWidth="medium"
-      sizing="large"
+      sizing="medium"
       background="none"
-      cardStyle="inset"
+      cardStyle="solid"
-      primaryButtonStyle="double-inset"
+      primaryButtonStyle="gradient"
-      secondaryButtonStyle="radial-glow"
+      secondaryButtonStyle="glass"
-      headingFontWeight="semibold"
+      headingFontWeight="bold"
     >
       <div id="nav" data-section="nav">
         <NavbarStyleCentered
-          brandName="BUBUNIBBLE"
           navItems={[
-            { name: "Makanan", id: "products" },
+            { name: "Home", id: "/" },
-            { name: "Minuman", id: "products" },
+            { name: "About", id: "#about" },
-            { name: "Dessert", id: "products" },
+            { name: "Services", id: "#services" },
-            { name: "Tentang Kami", id: "about" },
+            { name: "Contact", id: "#contact" },
-            { name: "Kontak", id: "contact" },
           ]}
-          button={{ text: "Pesan Sekarang", href: "contact" }}
+          button={{ text: "Get Started", href: "#contact" }}
+          brandName="BUBUNIBBLE"
         />
       </div>
+      <main>
+        <div id="home" data-section="home" className="min-h-screen flex items-center justify-center bg-gradient-to-br from-red-50 to-orange-50">
+          <div className="text-center px-4">
+            <h1 className="text-4xl md:text-6xl font-bold text-gray-900 mb-4">
+              Selamat Datang di BUBUNIBBLE
+            </h1>
+            <p className="text-lg md:text-xl text-gray-600 mb-8">
+              Pesan makanan dan minuman terbaik dengan mudah, cepat, dan terpercaya
+            </p>
+            <button className="bg-red-600 hover:bg-red-700 text-white font-bold py-3 px-8 rounded-lg transition duration-300">
+              Mulai Pesan Sekarang
+            </button>
+          </div>
+        </div>
 
-      <div id="hero" data-section="hero">
+        <div id="about" data-section="about" className="min-h-screen flex items-center justify-center bg-white py-20 px-4">
-        <HeroSplitDoubleCarousel
+          <div className="max-w-3xl text-center">
-          title="Pesan Makanan & Minuman Terbaik dari BUBUNIBBLE"
+            <h2 className="text-4xl md:text-5xl font-bold text-gray-900 mb-6">Tentang BUBUNIBBLE</h2>
-          description="Jelajahi koleksi lengkap makanan lezat, minuman segar, dan dessert istimewa. Pesan sekarang dan nikmati pengalaman berbelanja yang mudah dan menyenangkan."
+            <p className="text-lg text-gray-600 leading-relaxed">
-          tag="Selamat Datang"
+              BUBUNIBBLE adalah platform pesan makanan online terpercaya yang menyediakan berbagai pilihan makanan lezat, minuman segar, dan dessert istimewa dari restoran dan kafe terbaik di kota Anda.
-          tagIcon={UtensilsCrossed}
+            </p>
-          tagAnimation="slide-up"
+          </div>
-          background={{ variant: "radial-gradient" }}
+        </div>
-          leftCarouselItems={[
-            {
-              imageSrc: "http://img.b2bpic.net/free-psd/delicious-nasi-goreng-with-fried-egg-fresh-chili_84443-64661.jpg?_wi=1",              imageAlt: "Nasi Goreng Spesial"},
-            {
-              imageSrc: "http://img.b2bpic.net/free-psd/refreshing-boba-tea-plastic-cup_191095-80342.jpg?_wi=1",              imageAlt: "Bubble Tea Signature"},
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/freshly-baked-homemade-chocolate-brownies_53876-105966.jpg?_wi=1",              imageAlt: "Brownies Premium"},
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/noodles-with-chicken-leg-chicken-fillet-blood-with-soup-thai-style-vegetable-boat-noodles-selective-focus_1150-45666.jpg?_wi=1",              imageAlt: "Mie Ayam Lezat"},
-          ]}
-          rightCarouselItems={[
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/cold-summer-coffee-drink-with-ice-orange-juice_169016-21399.jpg?_wi=1",              imageAlt: "Iced Coffee"},
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/italian-tiramisu-dessert-plate-served-bamboo-boards_140725-1379.jpg?_wi=1",              imageAlt: "Tiramisu Deluxe"},
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/green-curry-made-with-chicken-chili-basil-with-tomato-lime-kaffir-lime-leaves-garlic_1150-25723.jpg?_wi=1",              imageAlt: "Soto Ayam Hangat"},
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/healthy-raw-detox-smoothies-fruits-vegetables-wooden-background_482257-36253.jpg?_wi=1",              imageAlt: "Fresh Juice"},
-          ]}
-          buttons={[
-            { text: "Pesan Sekarang", href: "#products" },
-            { text: "Pelajari Lebih", href: "#about" },
-          ]}
-          buttonAnimation="slide-up"
-          carouselPosition="right"
-        />
-      </div>
 
-      <div id="products" data-section="products">
+        <div id="services" data-section="services" className="min-h-screen flex items-center justify-center bg-gray-50 py-20 px-4">
-        <ProductCardFour
+          <div className="max-w-5xl w-full">
-          title="Menu Kami"
+            <h2 className="text-4xl md:text-5xl font-bold text-gray-900 mb-12 text-center">Layanan Kami</h2>
-          description="Pilih kategori makanan, minuman, atau dessert favorit Anda dan tambahkan ke keranjang pesanan."
+            <div className="grid md:grid-cols-3 gap-8">
-          tag="Katalog Produk"
+              <div className="bg-white p-8 rounded-lg shadow-md text-center">
-          tagIcon={ShoppingCart}
+                <div className="text-4xl mb-4">🍔</div>
-          tagAnimation="slide-up"
+                <h3 className="text-xl font-bold text-gray-900 mb-4">Makanan Lezat</h3>
-          textboxLayout="default"
+                <p className="text-gray-600">Pilihan makanan dari restoran terbaik dengan cita rasa autentik</p>
-          animationType="slide-up"
+              </div>
-          useInvertedBackground={false}
+              <div className="bg-white p-8 rounded-lg shadow-md text-center">
-          gridVariant="three-columns-all-equal-width"
+                <div className="text-4xl mb-4">🥤</div>
-          carouselMode="buttons"
+                <h3 className="text-xl font-bold text-gray-900 mb-4">Minuman Segar</h3>
-          products={[
+                <p className="text-gray-600">Berbagai minuman segar untuk menemani hari Anda</p>
-            {
+              </div>
-              id: "food-1",              name: "Nasi Goreng Spesial",              price: "Rp 35.000",              variant: "Makanan • Porsi Besar",              imageSrc: "http://img.b2bpic.net/free-psd/delicious-nasi-goreng-with-fried-egg-fresh-chili_84443-64661.jpg?_wi=2",              imageAlt: "Nasi Goreng Spesial"},
+              <div className="bg-white p-8 rounded-lg shadow-md text-center">
-            {
+                <div className="text-4xl mb-4">🍰</div>
-              id: "food-2",              name: "Mie Ayam Lezat",              price: "Rp 30.000",              variant: "Makanan • Porsi Standar",              imageSrc: "http://img.b2bpic.net/free-photo/noodles-with-chicken-leg-chicken-fillet-blood-with-soup-thai-style-vegetable-boat-noodles-selective-focus_1150-45666.jpg?_wi=2",              imageAlt: "Mie Ayam Lezat"},
+                <h3 className="text-xl font-bold text-gray-900 mb-4">Dessert Istimewa</h3>
-            {
+                <p className="text-gray-600">Kue dan dessert premium dari kafe pilihan</p>
-              id: "food-3",              name: "Soto Ayam Hangat",              price: "Rp 28.000",              variant: "Makanan • Kuah Tradisional",              imageSrc: "http://img.b2bpic.net/free-photo/green-curry-made-with-chicken-chili-basil-with-tomato-lime-kaffir-lime-leaves-garlic_1150-25723.jpg?_wi=2",              imageAlt: "Soto Ayam Hangat"},
+              </div>
-            {
+            </div>
-              id: "drink-1",              name: "Bubble Tea Signature",              price: "Rp 22.000",              variant: "Minuman • Tapioka Premium",              imageSrc: "http://img.b2bpic.net/free-psd/refreshing-boba-tea-plastic-cup_191095-80342.jpg?_wi=2",              imageAlt: "Bubble Tea Signature"},
+          </div>
-            {
+        </div>
-              id: "drink-2",              name: "Iced Coffee Premium",              price: "Rp 18.000",              variant: "Minuman • Arabika Pilihan",              imageSrc: "http://img.b2bpic.net/free-photo/cold-summer-coffee-drink-with-ice-orange-juice_169016-21399.jpg?_wi=2",              imageAlt: "Iced Coffee"},
-            {
-              id: "drink-3",              name: "Fresh Juice Mix",              price: "Rp 20.000",              variant: "Minuman • Buah Segar",              imageSrc: "http://img.b2bpic.net/free-photo/healthy-raw-detox-smoothies-fruits-vegetables-wooden-background_482257-36253.jpg?_wi=2",              imageAlt: "Fresh Juice Mix"},
-            {
-              id: "dessert-1",              name: "Brownies Premium",              price: "Rp 25.000",              variant: "Dessert • Coklat Belgia",              imageSrc: "http://img.b2bpic.net/free-photo/freshly-baked-homemade-chocolate-brownies_53876-105966.jpg?_wi=2",              imageAlt: "Brownies Premium"},
-            {
-              id: "dessert-2",              name: "Tiramisu Deluxe",              price: "Rp 32.000",              variant: "Dessert • Italia Asli",              imageSrc: "http://img.b2bpic.net/free-photo/italian-tiramisu-dessert-plate-served-bamboo-boards_140725-1379.jpg?_wi=2",              imageAlt: "Tiramisu Deluxe"},
-            {
-              id: "dessert-3",              name: "Lava Cake Coklat",              price: "Rp 28.000",              variant: "Dessert • Molten Center",              imageSrc: "http://img.b2bpic.net/free-photo/chocolate-lava-cake-white-plate_1150-6317.jpg",              imageAlt: "Lava Cake Coklat"},
-          ]}
-        />
-      </div>
 
-      <div id="about" data-section="about">
+        <div id="contact" data-section="contact" className="min-h-screen flex items-center justify-center bg-red-600 py-20 px-4">
-        <MediaAbout
+          <div className="text-center max-w-2xl">
-          title="Tentang BUBUNIBBLE"
+            <h2 className="text-4xl md:text-5xl font-bold text-white mb-6">Hubungi Kami</h2>
-          description="BUBUNIBBLE adalah destinasi kuliner favorit untuk makanan berkualitas, minuman menyegarkan, dan dessert istimewa. Dengan komitmen pada cita rasa autentik dan pelayanan terbaik, kami menghadirkan pengalaman berbelanja yang tak terlupakan untuk setiap pelanggan setia kami."
+            <p className="text-lg text-red-100 mb-8">
-          tag="Kisah Kami"
+              Punya pertanyaan? Tim kami siap membantu Anda 24/7
-          tagIcon={Heart}
+            </p>
-          tagAnimation="slide-up"
+            <div className="flex flex-col gap-4">
-          imageSrc="http://img.b2bpic.net/free-photo/cocktails-bar-with-waitress-background_23-2147821271.jpg"
+              <button className="bg-white text-red-600 font-bold py-3 px-8 rounded-lg hover:bg-red-50 transition duration-300">
-          imageAlt="Toko BUBUNIBBLE"
+                WhatsApp: +62 812-3456-7890
-          useInvertedBackground={true}
+              </button>
-          buttons={[{ text: "Hubungi Kami", href: "contact" }]}
+              <button className="border-2 border-white text-white font-bold py-3 px-8 rounded-lg hover:bg-red-700 transition duration-300">
-          buttonAnimation="slide-up"
+                Email: info@bubunibble.com
-        />
+              </button>
-      </div>
+            </div>
+          </div>
+        </div>
+      </main>
 
-      <div id="features" data-section="features">
+      <footer className="bg-gray-900 text-white py-8 px-4 text-center">
-        <FeatureHoverPattern
+        <p>&copy; 2024 BUBUNIBBLE. Semua hak dilindungi.</p>
-          title="Mengapa Memilih BUBUNIBBLE?"
+      </footer>
-          description="Kami menyediakan pengalaman pesan-antar terbaik dengan sistem yang mudah, cepat, dan aman."
-          tag="Keunggulan Kami"
-          tagIcon={Star}
-          tagAnimation="slide-up"
-          textboxLayout="default"
-          animationType="slide-up"
-          useInvertedBackground={false}
-          features={[
-            {
-              icon: Zap,
-              title: "Pesan Cepat",              description: "Sistem pemesanan yang intuitif dan responsif memudahkan Anda memilih menu favorit dalam hitungan detik.",              button: { text: "Mulai Pesan", href: "#products" },
-            },
-            {
-              icon: MessageSquare,
-              title: "Integrasi WhatsApp",              description: "Kirim pesanan langsung ke WhatsApp kami. Konfirmasi instan dan update status pesanan real-time.",              button: { text: "Chat via WhatsApp", href: "#contact" },
-            },
-            {
-              icon: TrendingUp,
-              title: "Harga Terjangkau",              description: "Menu berkualitas dengan harga yang kompetitif. Nikmati promo spesial setiap hari.",              button: { text: "Lihat Menu", href: "#products" },
-            },
-            {
-              icon: Heart,
-              title: "Kesegaran Terjamin",              description: "Semua menu disiapkan fresh setiap hari dengan bahan-bahan pilihan terbaik.",              button: { text: "Pelajari Lebih", href: "#about" },
-            },
-            {
-              icon: Clock,
-              title: "Layanan Cepat",              description: "Pesanan disiapkan dengan cepat tanpa mengorbankan kualitas dan cita rasa.",              button: { text: "Hubungi Kami", href: "#contact" },
-            },
-            {
-              icon: Shield,
-              title: "Aman & Terpercaya",              description: "Sistem pembayaran aman dan terjamin. Data pelanggan dijaga dengan ketat.",              button: { text: "Info Keamanan", href: "#contact" },
-            },
-          ]}
-        />
-      </div>
-
-      <div id="testimonials" data-section="testimonials">
-        <TestimonialCardTwelve
-          testimonials={[
-            {
-              id: "1",              name: "Siti Rahma",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-friendly-woman-holding-shopping-bags_1098-1574.jpg?_wi=1",              imageAlt: "Siti Rahma"},
-            {
-              id: "2",              name: "Budi Santoso",              imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg?_wi=1",              imageAlt: "Budi Santoso"},
-            {
-              id: "3",              name: "Ani Wijaya",              imageSrc: "http://img.b2bpic.net/free-photo/woman-showing-ok-sign_23-2148990150.jpg",              imageAlt: "Ani Wijaya"},
-            {
-              id: "4",              name: "Roni Hermawan",              imageSrc: "http://img.b2bpic.net/free-photo/man-portrait-posing-loft-modern-space_158595-5367.jpg",              imageAlt: "Roni Hermawan"},
-            {
-              id: "5",              name: "Eka Putri",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-friendly-woman-holding-shopping-bags_1098-1574.jpg?_wi=2",              imageAlt: "Eka Putri"},
-            {
-              id: "6",              name: "Hendra Syaiful",              imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg?_wi=2",              imageAlt: "Hendra Syaiful"},
-          ]}
-          cardTitle="Ribuan pelanggan puas telah merasakan kelezatan menu BUBUNIBBLE dan kemudahan sistem pemesanan kami"
-          cardTag="Dipercaya oleh Pelanggan"
-          cardTagIcon={Users}
-          cardAnimation="slide-up"
-          useInvertedBackground={false}
-        />
-      </div>
-
-      <div id="socialproof" data-section="socialproof">
-        <SocialProofOne
-          title="Dipercaya oleh Ribuan Pelanggan"
-          description="Bergabunglah dengan komunitas pelanggan setia BUBUNIBBLE yang menikmati makanan berkualitas setiap hari."
-          tag="Kepercayaan Pelanggan"
-          tagIcon={CheckCircle}
-          tagAnimation="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={true}
-          names={[
-            "Keluarga Sidoarjo",            "Karyawan Kantoran",            "Mahasiswa Kampus",            "Ibu Rumah Tangga",            "Pengusaha Muda",            "Komunitas Foodies",            "Peserta Kantin Digital",            "Keluarga Besar Jakarta"]}
-          speed={40}
-          showCard={true}
-        />
-      </div>
-
-      <div id="contact" data-section="contact">
-        <ContactCenter
-          tag="Hubungi Kami"
-          title="Siap Menerima Pesanan Anda"
-          description="Jangan ragu untuk menghubungi BUBUNIBBLE melalui WhatsApp atau form di bawah ini. Tim kami siap membantu Anda dengan respons cepat dan profesional."
-          tagIcon={MessageCircle}
-          tagAnimation="slide-up"
-          background={{ variant: "rotated-rays-animated" }}
-          useInvertedBackground={false}
-          inputPlaceholder="Masukkan email Anda"
-          buttonText="Daftar Newsletter"
-          termsText="Kami menghormati privasi Anda. Unsubscribe kapan saja dengan mudah."
-        />
-      </div>
-
-      <div id="footer" data-section="footer">
-        <FooterMedia
-          imageSrc="http://img.b2bpic.net/free-photo/chicken-sticks-with-balsamic-vinegar-olive-oil_114579-2170.jpg"
-          imageAlt="BUBUNIBBLE Restaurant"
-          logoText="BUBUNIBBLE"
-          copyrightText="© 2025 BUBUNIBBLE | Semua Hak Dilindungi"
-          columns={[
-            {
-              title: "Produk",              items: [
-                { label: "Makanan", href: "#products" },
-                { label: "Minuman", href: "#products" },
-                { label: "Dessert", href: "#products" },
-                { label: "Menu Spesial", href: "#products" },
-              ],
-            },
-            {
-              title: "Perusahaan",              items: [
-                { label: "Tentang Kami", href: "#about" },
-                { label: "Hubungi Kami", href: "#contact" },
-                { label: "Testimoni", href: "#testimonials" },
-                { label: "Karir", href: "#" },
-              ],
-            },
-            {
-              title: "Kontak",              items: [
-                { label: "WhatsApp", href: "https://wa.me/62812345678" },
-                { label: "Email", href: "mailto:info@bubunibble.com" },
-                { label: "Instagram", href: "https://instagram.com/bubunibble" },
-                { label: "Facebook", href: "https://facebook.com/bubunibble" },
-              ],
-            },
-          ]}
-        />
-      </div>
     </ThemeProvider>
   );
 }