Update src/app/page.tsx

src/app/page.tsx

@@ -7,74 +7,79 @@ 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, Target, Shield, Star } from 'lucide-react';
+import { Zap, Star, MessageSquare } from 'lucide-react';
+
+export default function Page() {
+  const navItems = [
+    { name: 'Home', id: '/' },
+    { name: 'About', id: '/about' },
+    { name: 'Contact', id: '/contact' }
+  ];
 
-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 
+        <HeroBillboardTestimonial
-          title="Welcome to Webild"
+          title="Build Fast, Deploy Faster"
-          description="Revolutionizing your digital experience with modern components."
+          description="Create beautiful, high-performing websites with our modular component library."
-          background={{ variant: "gradient-bars" }}
+          background={{ variant: 'gradient-bars' }}
-          testimonials={[]}
+          testimonials={[{ name: 'Jane Doe', handle: '@janedoe', testimonial: 'Incredible speed and ease of use!', rating: 5 }]}
         />
       </div>
       <div id="features" data-section="features">
-        <FeatureHoverPattern 
+        <FeatureHoverPattern
-          title="Core Features"
+          title="Our Core Features"
-          description="Everything you need to succeed."
+          description="Designed for developers and designers who demand excellence."
           animationType="slide-up"
-          textboxLayout="default"
           useInvertedBackground={false}
+          textboxLayout="default"
           features={[
-            { icon: Zap, title: "Fast", description: "Lightning fast performance." },
+            { icon: Zap, title: 'Instant Deployment', description: 'Get your site live in seconds.' },
-            { icon: Target, title: "Precise", description: "Precision engineered tools." }
+            { icon: Star, title: 'Premium Quality', description: 'Top-tier code and design.' }
           ]}
         />
       </div>
       <div id="products" data-section="products">
-        <ProductCardTwo 
+        <ProductCardTwo
           gridVariant="three-columns-all-equal-width"
           animationType="slide-up"
           textboxLayout="default"
-          title="Our Products"
-          description="Quality items for your needs."
-          useInvertedBackground={false}
           products={[
-            { id: "1", brand: "Brand A", name: "Product 1", price: "$10", rating: 5, reviewCount: "10", imageSrc: "" },
+            { id: '1', brand: 'Webild', name: 'Dev Kit', price: '$99', rating: 5, reviewCount: '10', imageSrc: 'https://images.unsplash.com/photo-1550751827-4bd374c3f58b?w=800&q=80' },
-            { id: "2", brand: "Brand B", name: "Product 2", price: "$20", rating: 4, reviewCount: "20", imageSrc: "" },
+            { id: '2', brand: 'Webild', name: 'Design Assets', price: '$49', rating: 4, reviewCount: '5', imageSrc: 'https://images.unsplash.com/photo-1618005182384-a83a8bd57fbe?w=800&q=80' },
-            { id: "3", brand: "Brand C", name: "Product 3", price: "$30", rating: 5, reviewCount: "30", imageSrc: "" }
+            { id: '3', brand: 'Webild', name: 'UI Pack', price: '$79', rating: 5, reviewCount: '20', imageSrc: 'https://images.unsplash.com/photo-1522202176988-66273c2fd55f?w=800&q=80' }
           ]}
         />
       </div>
       <div id="testimonials" data-section="testimonials">
-        <TestimonialCardFifteen 
+        <TestimonialCardFifteen
-          testimonial="Amazing service!"
+          testimonial="The best toolkit I've ever used for my projects."
           rating={5}
-          author="John Doe"
+          author="Alex Smith"
-          avatars={[]}
+          avatars={[{ src: 'https://images.unsplash.com/photo-1534528741775-53994a69daeb?w=100', alt: 'Avatar' }]}
-          ratingAnimation="slide-up"
+          ratingAnimation="blur-reveal"
-          avatarsAnimation="slide-up"
+          avatarsAnimation="blur-reveal"
           useInvertedBackground={false}
         />
       </div>
       <div id="contact" data-section="contact">
-        <ContactSplitForm 
+        <ContactSplitForm
-          title="Get in Touch"
+          title="Get In Touch"
-          description="We'd love to hear from you."
+          description="We're here to help you build something amazing."
-          inputs={[{ name: "email", type: "email", placeholder: "Email" }, { name: "name", type: "text", placeholder: "Name" }]} 
+          inputs={[
-          useInvertedBackground={false}
+            { name: 'name', type: 'text', placeholder: 'Your Name' },
+            { name: 'email', type: 'email', placeholder: 'Your Email' }
+          ]}
+          useInvertedBackground={true}
         />
       </div>
       <div id="footer" data-section="footer">
-        <FooterBaseCard 
+        <FooterBaseCard
           logoText="Webild"
-          columns={[{ title: "Links", items: [{ label: "Home", href: "/" }] }]}
+          columns={[{ title: 'Navigation', items: [{ label: 'Home', href: '/' }, { label: 'About', href: '/about' }] }]}
         />
       </div>
     </ThemeProvider>