Update src/app/page.tsx

Merge version_2 into main

src/app/layout.tsx

@@ -2,7 +2,7 @@ import type { Metadata } from "next";
 import "./globals.css";
 
 export const metadata: Metadata = {
-  title: "Your Shop - Premium Collection",  description: "Explore our curated selection of premium products"
+  title: "Simple Landing Page",  description: "A simple landing page with hero, gallery and contact sections"
 };
 
 export default function RootLayout({

src/app/page.tsx

@@ -1,189 +1,124 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
-import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
+import HeroBillboardCarousel from "@/components/sections/hero/HeroBillboardCarousel";
-import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
+import FeatureCardOne from "@/components/sections/feature/FeatureCardOne";
-import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
+import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
-import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
+import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
-import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
+
-import ContactText from '@/components/sections/contact/ContactText';
+export default function Home() {
-import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+  const navItems = [
-import { Sparkles, Star } from 'lucide-react';
+    { name: "Home", id: "/" },
+    { name: "Gallery", id: "#gallery" },
+    { name: "Contact", id: "#contact" },
+  ];
+
+  const galleryImages = [
+    { imageSrc: "/placeholders/placeholder-16-9.svg?_wi=1", imageAlt: "Gallery item 1" },
+    { imageSrc: "/placeholders/placeholder-16-9.svg?_wi=2", imageAlt: "Gallery item 2" },
+    { imageSrc: "/placeholders/placeholder-16-9.svg?_wi=3", imageAlt: "Gallery item 3" },
+    { imageSrc: "/placeholders/placeholder-16-9.svg?_wi=4", imageAlt: "Gallery item 4" },
+    { imageSrc: "/placeholders/placeholder-16-9.svg?_wi=5", 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"
+      defaultButtonVariant="hover-magnetic"
-      defaultTextAnimation="reveal-blur"
+      defaultTextAnimation="entrance-slide"
-      borderRadius="pill"
+      borderRadius="rounded"
-      contentWidth="mediumLarge"
+      contentWidth="medium"
-      sizing="mediumLarge"
+      sizing="medium"
-      background="circleGradient"
+      background="none"
-      cardStyle="subtle-shadow"
+      cardStyle="solid"
       primaryButtonStyle="gradient"
       secondaryButtonStyle="solid"
-      headingFontWeight="semibold"
+      headingFontWeight="bold"
     >
-      <div id="nav" data-section="nav">
+      <NavbarStyleFullscreen
-        <NavbarStyleFullscreen
+        navItems={navItems}
-          navItems={[
+        brandName="Landing"
-            { name: "Home", id: "home" },
+        bottomLeftText="Global"
-            { name: "Collection", id: "products" },
+        bottomRightText="contact@example.com"
-            { name: "About", id: "about" },
+      />
-            { name: "Contact", id: "contact" },
-            { name: "Gallery", id: "featured" }
-          ]}
-          brandName="Your Shop"
-          bottomLeftText="Curated Collection"
-          bottomRightText="hello@yourshop.com"
-        />
-      </div>
 
       <div id="hero" data-section="hero">
-        <HeroBillboardScroll
+        <HeroBillboardCarousel
-          title="Discover Our Collection"
+          title="Welcome to Our Landing Page"
-          description="Explore our curated selection of premium products. Each item is carefully chosen for quality and style."
+          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: "#gallery" },
-            { text: "View Gallery", href: "#featured" }
+            { text: "Contact Us", href: "#contact" },
           ]}
+          mediaItems={galleryImages}
         />
       </div>
 
-      <div id="products" data-section="products">
+      <div id="gallery" data-section="gallery">
-        <ProductCardTwo
+        <FeatureCardOne
-          title="Featured Items"
+          features={galleryItems}
-          description="Our hand-selected collection of premium products. Browse through our carefully curated items."
+          title="Our Gallery"
-          tag="Collection"
+          description="Discover our collection of beautiful and inspiring work"
-          tagIcon={Star}
+          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
+        <ContactSplitForm
-          text="Interested in our collection? Get in touch to inquire about availability, custom orders, or to learn more about our products."
+          title="Get In Touch"
-          animationType="entrance-slide"
+          description="We'd love to hear from you. Send us a message and we'll respond as soon as possible."
-          background={{ variant: "plain" }}
+          inputs={[
-          useInvertedBackground={false}
+            { name: "name", type: "text", placeholder: "Your Name", required: true },
-          buttons={[
+            { name: "email", type: "email", placeholder: "Your Email", required: true },
-            { text: "Contact Us", href: "#" },
-            { text: "Subscribe for Updates", href: "#" }
           ]}
+          textarea={{
+            name: "message",            placeholder: "Your Message",            rows: 5,
+            required: true,
+          }}
+          useInvertedBackground={false}
+          imageSrc="/placeholders/placeholder-16-9.svg?_wi=6"
+          mediaAnimation="none"
+          buttonText="Send Message"
+          onSubmit={(data) => console.log("Form submitted:", data)}
         />
       </div>
 
-      <div id="footer" data-section="footer">
+      <footer>
         <FooterBaseCard
-          logoText="Your Shop"
+          logoText="Landing"
-          columns={[
+          columns={footerColumns}
-            {
+          copyrightText="© 2025 | Landing Page"
-              title: "Collection",              items: [
+          onPrivacyClick={() => console.log("Privacy clicked")}
-                { 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."
         />
-      </div>
+      </footer>
     </ThemeProvider>
   );
 }