bender/be051af4-fa55-4441-bf1d-107ff8b6e4ec
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_1 into main #7

Merged
bender merged 1 commits from version_1 into main 2026-04-23 01:35:48 +00:00
Conversation 0 Commits 1 Files Changed 1 +57 -11
1 changed files with 57 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
src/app/page.tsx
View File

@@ -1,5 +1,6 @@
'use client';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
@@ -9,7 +10,7 @@ import FaqBase from '@/components/sections/faq/FaqBase';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import { Zap, CheckCircle } from 'lucide-react';
import { Shield, Zap, CheckCircle, Star, Target, MessageSquare } from 'lucide-react';
export default function HomePage() {
const navItems = [
@@ -19,33 +20,78 @@ export default function HomePage() {
];
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">
<NavbarStyleApple navItems={navItems} brandName="Webild" />
</div>
<div id="hero" data-section="hero">
<HeroOverlay title="Transform Your Future" description="Innovating tomorrow with state-of-the-art solutions today." buttons={[{ text: "Get Started", href: "/contact" }]} />
<HeroOverlay title="Welcome to Webild" description="Building the future of web components." />
</div>
<div id="features" data-section="features">
<FeatureCardEight title="Powerful Features" description="Everything you need to scale." textboxLayout="default" features={[{ title: "Fast", description: "High performance", imageSrc: "https://images.unsplash.com/photo-1518770660439-4636190af475?q=80&w=800&auto=format&fit=crop" }, { title: "Secure", description: "Top protection", imageSrc: "https://images.unsplash.com/photo-1563986768609-322da13575f3?q=80&w=800&auto=format&fit=crop" }]} useInvertedBackground={false} />
<FeatureCardEight
title="Core Features"
description="Powerful components for modern apps."
features={[{ title: "Fast", description: "High performance." }, { title: "Secure", description: "Safety first." }]}
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
<div id="status" data-section="status">
<MetricCardOne title="Performance Stats" description="Key metrics that drive our growth." metrics={[{ id: "1", value: "99%", title: "Uptime", description: "Continuous service", icon: Zap }, { id: "2", value: "2M+", title: "Users", description: "Community reach", icon: CheckCircle }]} gridVariant="uniform-all-items-equal" animationType="slide-up" textboxLayout="default" useInvertedBackground={false} />
<MetricCardOne
title="Stats"
description="Key metrics overview."
metrics={[{ id: "1", value: "10k", title: "Users", description: "Active users", icon: Shield }]}
gridVariant="uniform-all-items-equal"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSixteen title="Happy Clients" description="What they say about us." kpiItems={[{ value: "100%", label: "Satisfaction" }, { value: "500+", label: "Projects" }, { value: "24/7", label: "Support" }]} animationType="slide-up" textboxLayout="default" useInvertedBackground={false} testimonials={[{ id: "1", name: "Alice", role: "CEO", company: "TechCorp", rating: 5 }]} />
<TestimonialCardSixteen
title="Testimonials"
description="See what others think."
testimonials={[{ id: "1", name: "Jane Doe", role: "CEO", company: "Tech Corp", rating: 5 }]}
kpiItems={[{ value: "100%", label: "Happy" }, { value: "24/7", label: "Support" }, { value: "5ms", label: "Latency" }]}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
<div id="faq" data-section="faq">
<FaqBase title="Frequently Asked Questions" description="Answers to common queries." faqs={[{ id: "1", title: "What is Webild?", content: "A platform for growth." }]} faqsAnimation="slide-up" textboxLayout="default" useInvertedBackground={false} />
<FaqBase
title="FAQ"
description="Common questions."
faqs={[{ id: "1", title: "What is Webild?", content: "A UI library." }]}
faqsAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout title="About Us" description="Dedicated to excellence." metrics={[{ value: "10+ years", title: "Experience" }]} useInvertedBackground={false} mediaAnimation="slide-up" metricsAnimation="slide-up" />
<MetricSplitMediaAbout
title="About Us"
description="Learn about our journey."
metrics={[{ value: "10", title: "Years" }]}
useInvertedBackground={false}
mediaAnimation="slide-up"
metricsAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter tag="Contact" title="Reach Out" description="Let's build something great." background={{ variant: "plain" }} useInvertedBackground={false} />
<ContactCenter
tag="Join Us"
title="Stay in touch"
description="Sign up for our newsletter."
background={{ variant: "plain" }}
useInvertedBackground={false}
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard logoText="Webild" columns={[{ title: "Company", items: [{ label: "About", href: "/about" }] }]} />
<FooterBaseCard
logoText="Webild"
columns={[{ title: "Resources", items: [{ label: "Blog", href: "/blog" }] }]}
/>
</div>
</ThemeProvider>
);