Update src/app/page.tsx

src/app/page.tsx

@@ -1,5 +1,4 @@
 'use client';
-
 import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
@@ -8,85 +7,74 @@ import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
 import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
 import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
-import { Zap, Shield, Star } from 'lucide-react';
+import { Zap, Target, Shield, Star, Rocket } from 'lucide-react';
+import Link from 'next/link';
 
-const navItems = [
-  { name: 'Home', id: '/' },
-  { name: 'About', id: '/about' },
-  { name: 'Contact', id: '/contact' }
-];
-
-export default function Page() {
+export default function HomePage() {
+  const navItems = [{ name: "Home", id: "/" }, { name: "Contact", id: "/contact" }];
   return (
-    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
+    <ThemeProvider>
       <div id="nav" data-section="nav">
         <NavbarStyleCentered navItems={navItems} />
       </div>
       <div id="hero" data-section="hero">
         <HeroBillboardTestimonial 
-          title="Build Your Future"
-          description="Innovative solutions for modern businesses."
-          background={{ variant: 'radial-gradient' }}
+          title="Welcome to Webild"
+          description="Revolutionizing your digital experience with modern components."
+          background={{ variant: "gradient-bars" }}
           testimonials={[]}
         />
       </div>
       <div id="features" data-section="features">
-        <FeatureHoverPattern
-          title="Our Core Features"
-          description="We deliver excellence through proven methodologies."
-          features={[
-            { icon: Zap, title: 'Speed', description: 'Fast deployment cycles.' },
-            { icon: Shield, title: 'Security', description: 'Enterprise-grade protection.' },
-            { icon: Star, title: 'Quality', description: 'Best in class standards.' }
-          ]}
+        <FeatureHoverPattern 
+          title="Core Features"
+          description="Everything you need to succeed."
           animationType="slide-up"
           textboxLayout="default"
           useInvertedBackground={false}
+          features={[
+            { icon: Zap, title: "Fast", description: "Lightning fast performance." },
+            { icon: Target, title: "Precise", description: "Precision engineered tools." }
+          ]}
         />
       </div>
       <div id="products" data-section="products">
-        <ProductCardTwo
-          title="Our Products"
-          description="Select from our curated list of professional tools."
-          products={[
-            { id: '1', brand: 'Brand A', name: 'Tool Alpha', price: '$99', rating: 5, reviewCount: '10', imageSrc: '/placeholder.jpg' },
-            { id: '2', brand: 'Brand B', name: 'Tool Beta', price: '$149', rating: 4, reviewCount: '25', imageSrc: '/placeholder.jpg' },
-            { id: '3', brand: 'Brand C', name: 'Tool Gamma', price: '$199', rating: 5, reviewCount: '50', imageSrc: '/placeholder.jpg' }
-          ]}
+        <ProductCardTwo 
           gridVariant="three-columns-all-equal-width"
           animationType="slide-up"
           textboxLayout="default"
-          useInvertedBackground={false}
+          title="Our Products"
+          description="Quality items for your needs."
+          products={[
+            { id: "1", brand: "Brand A", name: "Product 1", price: "$10", rating: 5, reviewCount: "10", imageSrc: "" },
+            { id: "2", brand: "Brand B", name: "Product 2", price: "$20", rating: 4, reviewCount: "20", imageSrc: "" },
+            { id: "3", brand: "Brand C", name: "Product 3", price: "$30", rating: 5, reviewCount: "30", imageSrc: "" }
+          ]}
         />
       </div>
       <div id="testimonials" data-section="testimonials">
-        <TestimonialCardFifteen
-          testimonial="The service provided was exceptional and exceeded our expectations."
+        <TestimonialCardFifteen 
+          testimonial="Amazing service!"
           rating={5}
-          author="Jane Doe"
-          avatars={[{ src: '/avatar.jpg', alt: 'Author' }]}
+          author="John Doe"
+          avatars={[]}
           ratingAnimation="slide-up"
           avatarsAnimation="slide-up"
           useInvertedBackground={false}
         />
       </div>
       <div id="contact" data-section="contact">
-        <ContactSplitForm
+        <ContactSplitForm 
           title="Get in Touch"
-          description="We're here to help. Send us a message today."
-          inputs={[
-            { name: 'name', type: 'text', placeholder: 'Full Name', required: true },
-            { name: 'email', type: 'email', placeholder: 'Email Address', required: true }
-          ]}
+          description="We'd love to hear from you."
+          inputs={[{ name: "email", type: "email", placeholder: "Email" }, { name: "name", type: "text", placeholder: "Name" }]} 
           useInvertedBackground={false}
         />
       </div>
       <div id="footer" data-section="footer">
-        <FooterBaseCard
+        <FooterBaseCard 
           logoText="Webild"
-          columns={[
-            { title: 'Company', items: [{ label: 'About', href: '/about' }, { label: 'Contact', href: '/contact' }] }
-          ]}
+          columns={[{ title: "Links", items: [{ label: "Home", href: "/" }] }]}
         />
       </div>
     </ThemeProvider>