From fd9d341e15894f50a92cb5e55f59b309aaa72ad8 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Mon, 9 Mar 2026 05:57:30 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 249 +++++++++++++++++------------------------------
 1 file changed, 92 insertions(+), 157 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 4c396d7..9e0aad0 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,189 +1,124 @@
 "use client";
 
-import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
-import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
-import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
-import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
-import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
-import ContactText from '@/components/sections/contact/ContactText';
-import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
-import { Sparkles, Star } from 'lucide-react';
+import { ThemeProvider } from "@/components/providers/ThemeProvider";
+import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import HeroBillboardCarousel from "@/components/sections/hero/HeroBillboardCarousel";
+import FeatureCardOne from "@/components/sections/feature/FeatureCardOne";
+import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
+import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
+
+export default function Home() {
+  const navItems = [
+    { name: "Home", id: "/" },
+    { name: "Gallery", id: "#gallery" },
+    { name: "Contact", id: "#contact" },
+  ];
+
+  const galleryImages = [
+    { imageSrc: "/placeholders/placeholder-16-9.svg", imageAlt: "Gallery item 1" },
+    { imageSrc: "/placeholders/placeholder-16-9.svg", imageAlt: "Gallery item 2" },
+    { imageSrc: "/placeholders/placeholder-16-9.svg", imageAlt: "Gallery item 3" },
+    { imageSrc: "/placeholders/placeholder-16-9.svg", imageAlt: "Gallery item 4" },
+    { imageSrc: "/placeholders/placeholder-16-9.svg", imageAlt: "Gallery item 5" },
+  ];
+
+  const galleryItems = galleryImages.map((item, index) => ({
+    title: `Item ${index + 1}`,
+    description: `Beautiful gallery item showcasing our work and creativity`,
+    imageSrc: item.imageSrc,
+    imageAlt: item.imageAlt,
+  }));
+
+  const footerColumns = [
+    {
+      title: "Product",      items: [
+        { label: "Features", href: "#gallery" },
+        { label: "Gallery", href: "#gallery" },
+      ],
+    },
+    {
+      title: "Company",      items: [
+        { label: "About", href: "/" },
+        { label: "Contact", href: "#contact" },
+      ],
+    },
+  ];
 
-export default function LandingPage() {
   return (
     <ThemeProvider
-      defaultButtonVariant="hover-bubble"
-      defaultTextAnimation="reveal-blur"
-      borderRadius="pill"
-      contentWidth="mediumLarge"
-      sizing="mediumLarge"
-      background="circleGradient"
-      cardStyle="subtle-shadow"
+      defaultButtonVariant="hover-magnetic"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="medium"
+      background="none"
+      cardStyle="solid"
       primaryButtonStyle="gradient"
       secondaryButtonStyle="solid"
-      headingFontWeight="semibold"
+      headingFontWeight="bold"
     >
-      <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen
-          navItems={[
-            { name: "Home", id: "home" },
-            { name: "Collection", id: "products" },
-            { name: "About", id: "about" },
-            { name: "Contact", id: "contact" },
-            { name: "Gallery", id: "featured" }
-          ]}
-          brandName="Your Shop"
-          bottomLeftText="Curated Collection"
-          bottomRightText="hello@yourshop.com"
-        />
-      </div>
+      <NavbarStyleFullscreen
+        navItems={navItems}
+        brandName="Landing"
+        bottomLeftText="Global"
+        bottomRightText="contact@example.com"
+      />
 
       <div id="hero" data-section="hero">
-        <HeroBillboardScroll
-          title="Discover Our Collection"
-          description="Explore our curated selection of premium products. Each item is carefully chosen for quality and style."
+        <HeroBillboardCarousel
+          title="Welcome to Our Landing Page"
+          description="Explore our beautiful gallery and get in touch with us today"
+          background={{ variant: "plain" }}
           tag="Showcase"
-          tagIcon={Sparkles}
-          background={{ variant: "canvas-reveal" }}
-          imageSrc="http://img.b2bpic.net/free-photo/high-angle-orange-slices-drinkl_23-2149418285.jpg"
-          imageAlt="Premium product showcase"
           buttons={[
-            { text: "Browse Collection", href: "#products" },
-            { text: "View Gallery", href: "#featured" }
+            { text: "View Gallery", href: "#gallery" },
+            { text: "Contact Us", href: "#contact" },
           ]}
+          mediaItems={galleryImages}
         />
       </div>
 
-      <div id="products" data-section="products">
-        <ProductCardTwo
-          title="Featured Items"
-          description="Our hand-selected collection of premium products. Browse through our carefully curated items."
-          tag="Collection"
-          tagIcon={Star}
+      <div id="gallery" data-section="gallery">
+        <FeatureCardOne
+          features={galleryItems}
+          title="Our Gallery"
+          description="Discover our collection of beautiful and inspiring work"
+          tag="Portfolio"
           textboxLayout="default"
-          useInvertedBackground={false}
+          gridVariant="uniform-all-items-equal"
           animationType="slide-up"
-          gridVariant="bento-grid"
-          products={[
-            {
-              id: "1",              brand: "Premium Line",              name: "Signature Collection Item",              price: "Contact for pricing",              rating: 5,
-              reviewCount: "showcased",              imageSrc: "http://img.b2bpic.net/free-photo/woman-leaning-studio-lamp_23-2148565483.jpg",              imageAlt: "Premium product one"
-            },
-            {
-              id: "2",              brand: "Exclusive",              name: "Luxury Selection Piece",              price: "Contact for pricing",              rating: 5,
-              reviewCount: "showcased",              imageSrc: "http://img.b2bpic.net/free-photo/food-crisis-concept-still-life_23-2150198337.jpg",              imageAlt: "Premium product two"
-            },
-            {
-              id: "3",              brand: "Curated",              name: "Special Edition Item",              price: "Contact for pricing",              rating: 5,
-              reviewCount: "showcased",              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-still-life-arrangement-with-water_23-2149176106.jpg",              imageAlt: "Premium product three"
-            }
-          ]}
-        />
-      </div>
-
-      <div id="about" data-section="about">
-        <InlineImageSplitTextAbout
-          heading={[
-            { type: "text", content: "Our Collection" }
-          ]}
           useInvertedBackground={false}
-          buttons={[
-            { text: "Learn More", href: "#featured" }
-          ]}
-        />
-      </div>
-
-      <div id="featured" data-section="featured">
-        <FeatureCardMedia
-          title="Highlighted Selections"
-          description="Explore our most sought-after items, each representing quality craftsmanship and unique design."
-          tag="Featured"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          animationType="slide-up"
-          features={[
-            {
-              id: "1",              title: "Bestseller",              description: "Our most popular item, loved for its exceptional quality and timeless appeal.",              tag: "#1 Choice",              imageSrc: "http://img.b2bpic.net/free-photo/elegant-cozy-office-with-laptop-desk_23-2149636248.jpg"
-            },
-            {
-              id: "2",              title: "Limited Edition",              description: "Exclusive selection featuring rare items with unique characteristics and premium finish.",              tag: "Exclusive",              imageSrc: "http://img.b2bpic.net/free-photo/young-woman-sitting-blanket-with-cup-coffee_23-2147911498.jpg"
-            },
-            {
-              id: "3",              title: "Customer Favorite",              description: "Highly rated collection pieces chosen by our most discerning customers.",              tag: "Fan Pick",              imageSrc: "http://img.b2bpic.net/free-photo/happy-women-traveling-train-vacation-travel-ideas_1150-14786.jpg"
-            },
-            {
-              id: "4",              title: "New Addition",              description: "Latest items added to our collection, showcasing contemporary design and quality.",              tag: "New",              imageSrc: "http://img.b2bpic.net/free-photo/cheerful-woman-with-paper-bags_23-2147771813.jpg"
-            }
-          ]}
-        />
-      </div>
-
-      <div id="socialproof" data-section="socialproof">
-        <SocialProofOne
-          title="Trusted By"
-          description="Our collection is appreciated by customers and featured in leading publications."
-          tag="Partners"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          names={[
-            "Premium Retailers",            "Design Magazines",            "Lifestyle Brands",            "Fashion Platforms",            "Curated Collections",            "Style Influencers",            "Design Studios"
-          ]}
-          speed={40}
-          showCard={true}
         />
       </div>
 
       <div id="contact" data-section="contact">
-        <ContactText
-          text="Interested in our collection? Get in touch to inquire about availability, custom orders, or to learn more about our products."
-          animationType="entrance-slide"
-          background={{ variant: "plain" }}
-          useInvertedBackground={false}
-          buttons={[
-            { text: "Contact Us", href: "#" },
-            { text: "Subscribe for Updates", href: "#" }
+        <ContactSplitForm
+          title="Get In Touch"
+          description="We'd love to hear from you. Send us a message and we'll respond as soon as possible."
+          inputs={[
+            { name: "name", type: "text", placeholder: "Your Name", required: true },
+            { name: "email", type: "email", placeholder: "Your Email", required: true },
           ]}
+          textarea={{
+            name: "message",            placeholder: "Your Message",            rows: 5,
+            required: true,
+          }}
+          useInvertedBackground={false}
+          imageSrc="/placeholders/placeholder-16-9.svg"
+          mediaAnimation="none"
+          buttonText="Send Message"
+          onSubmit={(data) => console.log("Form submitted:", data)}
         />
       </div>
 
-      <div id="footer" data-section="footer">
+      <footer>
         <FooterBaseCard
-          logoText="Your Shop"
-          columns={[
-            {
-              title: "Collection",              items: [
-                { label: "All Items", href: "#products" },
-                { label: "Featured", href: "#featured" },
-                { label: "New Arrivals", href: "#" }
-              ]
-            },
-            {
-              title: "Company",              items: [
-                { label: "About Us", href: "#about" },
-                { label: "Our Story", href: "#" },
-                { label: "Contact", href: "#contact" }
-              ]
-            },
-            {
-              title: "Support",              items: [
-                { label: "FAQ", href: "#" },
-                { label: "Inquiries", href: "#" },
-                { label: "Information", href: "#" }
-              ]
-            },
-            {
-              title: "Legal",              items: [
-                { label: "Privacy Policy", href: "#" },
-                { label: "Terms of Use", href: "#" },
-                { label: "Cookies", href: "#" }
-              ]
-            }
-          ]}
-          copyrightText="© 2025 Your Shop. All rights reserved."
+          logoText="Landing"
+          columns={footerColumns}
+          copyrightText="© 2025 | Landing Page"
+          onPrivacyClick={() => console.log("Privacy clicked")}
         />
-      </div>
+      </footer>
     </ThemeProvider>
   );
 }