Update src/app/page.tsx
This commit is contained in:
@@ -7,33 +7,38 @@ 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
|
||||
title="Welcome to Webild"
|
||||
description="Revolutionizing your digital experience with modern components."
|
||||
background={{ variant: "gradient-bars" }}
|
||||
testimonials={[]}
|
||||
title="Build Fast, Deploy Faster"
|
||||
description="Create beautiful, high-performing websites with our modular component library."
|
||||
background={{ variant: 'gradient-bars' }}
|
||||
testimonials={[{ name: 'Jane Doe', handle: '@janedoe', testimonial: 'Incredible speed and ease of use!', rating: 5 }]}
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureHoverPattern
|
||||
title="Core Features"
|
||||
description="Everything you need to succeed."
|
||||
title="Our Core Features"
|
||||
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: Target, title: "Precise", description: "Precision engineered tools." }
|
||||
{ icon: Zap, title: 'Instant Deployment', description: 'Get your site live in seconds.' },
|
||||
{ icon: Star, title: 'Premium Quality', description: 'Top-tier code and design.' }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -42,39 +47,39 @@ export default function HomePage() {
|
||||
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: "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: "" }
|
||||
{ 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: '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: '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
|
||||
testimonial="Amazing service!"
|
||||
testimonial="The best toolkit I've ever used for my projects."
|
||||
rating={5}
|
||||
author="John Doe"
|
||||
avatars={[]}
|
||||
ratingAnimation="slide-up"
|
||||
avatarsAnimation="slide-up"
|
||||
author="Alex Smith"
|
||||
avatars={[{ src: 'https://images.unsplash.com/photo-1534528741775-53994a69daeb?w=100', alt: 'Avatar' }]}
|
||||
ratingAnimation="blur-reveal"
|
||||
avatarsAnimation="blur-reveal"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
title="Get in Touch"
|
||||
description="We'd love to hear from you."
|
||||
inputs={[{ name: "email", type: "email", placeholder: "Email" }, { name: "name", type: "text", placeholder: "Name" }]}
|
||||
useInvertedBackground={false}
|
||||
title="Get In Touch"
|
||||
description="We're here to help you build something amazing."
|
||||
inputs={[
|
||||
{ name: 'name', type: 'text', placeholder: 'Your Name' },
|
||||
{ name: 'email', type: 'email', placeholder: 'Your Email' }
|
||||
]}
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Webild"
|
||||
columns={[{ title: "Links", items: [{ label: "Home", href: "/" }] }]}
|
||||
columns={[{ title: 'Navigation', items: [{ label: 'Home', href: '/' }, { label: 'About', href: '/about' }] }]}
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
|
||||
Reference in New Issue
Block a user