Update src/app/page.tsx

Merge version_1 into main

src/app/layout.tsx

@@ -11,8 +11,8 @@ import { Libre_Baskerville, Inter } from "next/font/google";
 
 
 export const metadata: Metadata = {
-  title: 'Innovation Driven Website',
-  description: 'Explore our signature products and expert services.',
+  title: 'Welcome to Our Platform',
+  description: 'Experience the future of digital solutions today.',
   openGraph: {
     "title": "L.B.'s Family Restaurant | Where Every Table Feels Like Home",
     "description": "Thompson's staple diner since day one. Quality food, hearty portions, and community spirit.",

src/app/page.tsx

@@ -1,4 +1,4 @@
-"use client";
+'use client';
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
 import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
@@ -10,8 +10,9 @@ import TeamCardOne from '@/components/sections/team/TeamCardOne';
 import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import FooterSimple from '@/components/sections/footer/FooterSimple';
 
+const navItems = [{ name: "Home", id: "/" }];
+
 export default function Page() {
-  const navItems = [{ name: "Home", id: "/" }];
   return (
     <ThemeProvider
       defaultButtonVariant="text-stagger"
@@ -26,31 +27,101 @@ export default function Page() {
       headingFontWeight="normal"
     >
       <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen navItems={navItems} />
+        <NavbarStyleFullscreen 
+          navItems={navItems}
+          logoSrc="/logo.svg"
+          logoAlt="Logo"
+        />
       </div>
       <div id="hero" data-section="hero">
-        <HeroSplitDoubleCarousel title="Experience Innovation" description="Redefining excellence in every detail." background={{ variant: "plain" }} leftCarouselItems={[]} rightCarouselItems={[]} />
+        <HeroSplitDoubleCarousel 
+          title="Welcome to Our Platform"
+          description="Experience the future of digital solutions today."
+          background={{ variant: "glowing-orb" }}
+          leftCarouselItems={[{ imageSrc: "/placeholder.jpg", imageAlt: "Hero" }]}
+          rightCarouselItems={[{ imageSrc: "/placeholder.jpg", imageAlt: "Hero" }]}
+        />
       </div>
       <div id="about" data-section="about">
-        <TextSplitAbout title="About Us" description={["We are a team dedicated to excellence."]} useInvertedBackground={false} />
+        <TextSplitAbout 
+          title="About Us"
+          description={["We are a team dedicated to excellence.", "Building the future with passion."]}
+          useInvertedBackground={false}
+        />
       </div>
       <div id="menu" data-section="menu">
-        <FeatureCardNineteen title="Our Features" description="Explore what makes us unique." features={[{ tag: "New", title: "Feature 1", subtitle: "Innovation", description: "High quality service." }, { tag: "Update", title: "Feature 2", subtitle: "Advanced", description: "Built for performance." }]} textboxLayout="default" useInvertedBackground={false} />
+        <FeatureCardNineteen 
+          title="Our Services"
+          description="Comprehensive services tailored to your needs."
+          textboxLayout="split"
+          useInvertedBackground={false}
+          features={[
+            { tag: "Fast", title: "Service 1", subtitle: "Subtitle", description: "High-speed performance", imageSrc: "/placeholder.jpg" },
+            { tag: "Secure", title: "Service 2", subtitle: "Subtitle", description: "Enterprise-grade security", imageSrc: "/placeholder.jpg" }
+          ]}
+        />
       </div>
       <div id="signatures" data-section="signatures">
-        <ProductCardThree title="Signatures" description="Exclusive collections." gridVariant="three-columns-all-equal-width" animationType="slide-up" textboxLayout="default" products={[{ id: "1", name: "Signature 1", price: "$99", imageSrc: "/images/product1.jpg" }, { id: "2", name: "Signature 2", price: "$149", imageSrc: "/images/product2.jpg" }, { id: "3", name: "Signature 3", price: "$199", imageSrc: "/images/product3.jpg" }]} useInvertedBackground={false} />
+        <ProductCardThree 
+          title="Signatures"
+          description="Unique products curated for you."
+          textboxLayout="default"
+          gridVariant="asymmetric-60-wide-40-narrow"
+          animationType="blur-reveal"
+          useInvertedBackground={false}
+          products={[
+            { id: "p1", name: "Signature 1", price: "$10", imageSrc: "/placeholder.jpg" },
+            { id: "p2", name: "Signature 2", price: "$20", imageSrc: "/placeholder.jpg" },
+            { id: "p3", name: "Signature 3", price: "$30", imageSrc: "/placeholder.jpg" }
+          ]}
+        />
       </div>
       <div id="reviews" data-section="reviews">
-        <TestimonialCardOne title="Client Reviews" description="What they say about us." gridVariant="three-columns-all-equal-width" animationType="slide-up" textboxLayout="default" testimonials={[{ id: "1", name: "John Doe", role: "CEO", company: "Tech Corp", rating: 5 }, { id: "2", name: "Jane Smith", role: "CTO", company: "Design Inc", rating: 5 }]} useInvertedBackground={false} />
+        <TestimonialCardOne 
+          title="Testimonials"
+          description="What our clients say about us."
+          textboxLayout="default"
+          gridVariant="uniform-all-items-equal"
+          animationType="blur-reveal"
+          useInvertedBackground={false}
+          testimonials={[
+            { id: "t1", name: "Client 1", role: "CEO", company: "Comp A", rating: 5 },
+            { id: "t2", name: "Client 2", role: "CTO", company: "Comp B", rating: 5 }
+          ]}
+        />
       </div>
       <div id="atmosphere" data-section="atmosphere">
-        <TeamCardOne title="Our Atmosphere" description="Meet the people behind the magic." gridVariant="three-columns-all-equal-width" animationType="slide-up" textboxLayout="default" members={[{ id: "1", name: "Alice", role: "Lead Designer" }, { id: "2", name: "Bob", role: "Engineer" }]} useInvertedBackground={false} />
+        <TeamCardOne 
+          title="Our Team"
+          description="Meet the experts behind our success."
+          textboxLayout="default"
+          gridVariant="uniform-all-items-equal"
+          animationType="blur-reveal"
+          useInvertedBackground={false}
+          members={[
+            { id: "m1", name: "John", role: "Founder", imageSrc: "/placeholder.jpg" },
+            { id: "m2", name: "Jane", role: "Engineer", imageSrc: "/placeholder.jpg" }
+          ]}
+        />
       </div>
       <div id="contact" data-section="contact">
-        <ContactSplitForm title="Contact Us" description="Get in touch with our team today." inputs={[{ name: "name", type: "text", placeholder: "Name", required: true }, { name: "email", type: "email", placeholder: "Email", required: true }]} useInvertedBackground={false} />
+        <ContactSplitForm 
+          title="Contact Us"
+          description="Get in touch with our team."
+          useInvertedBackground={false}
+          inputs={[
+            { name: "name", type: "text", placeholder: "Name", required: true },
+            { name: "email", type: "email", placeholder: "Email", required: true }
+          ]}
+          buttonText="Submit"
+        />
       </div>
       <div id="footer" data-section="footer">
-        <FooterSimple columns={[{ title: "Links", items: [{ label: "Home", href: "/" }] }]} bottomLeftText="© 2024" bottomRightText="All Rights Reserved" />
+        <FooterSimple 
+          bottomLeftText="© 2024 Webild"
+          bottomRightText="All Rights Reserved"
+          columns={[{ title: "Links", items: [{ label: "Home", href: "/" }] }]}
+        />
       </div>
     </ThemeProvider>
   );