bender/c2e29bbf-4bdb-40d9-9cc7-7085fe1406e9
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Update src/app/page.tsx

Browse Source
This commit is contained in:
bender
2026-04-30 10:51:05 +00:00
parent 056e84d2ca
commit cb53964998
1 changed files with 13 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src/app/page.tsx
View File

@@ -11,41 +11,42 @@ import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import FaqBase from '@/components/sections/faq/FaqBase';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { Zap, Target, Star, CheckCircle } from 'lucide-react';
const navItems = [{ name: "Home", id: "/" }];
export default function Page() {
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">
<NavbarStyleFullscreen navItems={navItems} />
<NavbarStyleFullscreen navItems={navItems} logoText="Webild" />
</div>
<div id="hero" data-section="hero">
<HeroOverlay title="Welcome" description="Description" />
<HeroOverlay title="Welcome to Our Platform" description="Revolutionizing your workflow with ease." />
</div>
<div id="features" data-section="features">
<FeatureCardMedia title="Features" description="Features desc" animationType="slide-up" textboxLayout="default" useInvertedBackground={false} features={[{ id: "f1", title: "Feature 1", description: "Desc 1", tag: "Tag 1" }, { id: "f2", title: "Feature 2", description: "Desc 2", tag: "Tag 2" }]} />
<FeatureCardMedia title="Key Features" description="Explore what we offer." animationType="slide-up" features={[{ id: "1", title: "Speed", description: "Fast as lightning.", tag: "Fast" }, { id: "2", title: "Security", description: "Safety first.", tag: "Secure" }]} />
</div>
<div id="services" data-section="services">
<ProductCardFour title="Services" description="Services desc" gridVariant="bento-grid" animationType="slide-up" textboxLayout="default" useInvertedBackground={false} products={[{ id: "p1", name: "Prod 1", price: "$10", variant: "V1", imageSrc: "img1" }, { id: "p2", name: "Prod 2", price: "$20", variant: "V2", imageSrc: "img2" }, { id: "p3", name: "Prod 3", price: "$30", variant: "V3", imageSrc: "img3" }]} />
<ProductCardFour title="Our Services" description="We provide top-notch services." gridVariant="four-items-2x2-equal-grid" animationType="slide-up" textboxLayout="split" useInvertedBackground={false} products={[{ id: "1", name: "Basic", price: "$10", variant: "Standard", imageSrc: "https://images.unsplash.com/photo-1593642532744-d377abf07dc4" }, { id: "2", name: "Pro", price: "$20", variant: "Premium", imageSrc: "https://images.unsplash.com/photo-1593642532744-d377abf07dc4" }, { id: "3", name: "Enterprise", price: "$50", variant: "Custom", imageSrc: "https://images.unsplash.com/photo-1593642532744-d377abf07dc4" }]} />
</div>
<div id="projects" data-section="projects">
<MediaAbout title="Projects" description="Projects desc" useInvertedBackground={false} />
<MediaAbout title="Our Journey" description="From humble beginnings to global impact." useInvertedBackground={false} />
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwelve cardTitle="Testimonials" cardTag="Tag" cardAnimation="slide-up" useInvertedBackground={false} testimonials={[{ id: "t1", name: "Name 1", imageSrc: "img1" }, { id: "t2", name: "Name 2", imageSrc: "img2" }]} />
<TestimonialCardTwelve cardTitle="Client Stories" cardTag="Feedback" cardAnimation="slide-up" useInvertedBackground={false} testimonials={[{ id: "1", name: "John Doe", imageSrc: "https://images.unsplash.com/photo-1535713875002-d1d0cf377fde" }, { id: "2", name: "Jane Smith", imageSrc: "https://images.unsplash.com/photo-1535713875002-d1d0cf377fde" }]} />
</div>
<div id="savings" data-section="savings">
<MetricCardSeven title="Savings" description="Savings desc" animationType="slide-up" textboxLayout="default" useInvertedBackground={false} metrics={[{ id: "m1", value: "10%", title: "Metric 1", items: ["Item 1"] }, { id: "m2", value: "20%", title: "Metric 2", items: ["Item 2"] }]} />
<MetricCardSeven title="Growth Metrics" description="Numbers that define our success." animationType="slide-up" textboxLayout="split" useInvertedBackground={false} metrics={[{ id: "1", value: "99%", title: "Satisfaction", items: ["Fast Support", "Reliable Service"] }, { id: "2", value: "500k+", title: "Users", items: ["Global Reach", "Community First"] }]} />
</div>
<div id="faq" data-section="faq">
<FaqBase title="FAQ" description="FAQ desc" faqsAnimation="slide-up" textboxLayout="default" useInvertedBackground={false} faqs={[{ id: "q1", title: "Q1", content: "A1" }, { id: "q2", title: "Q2", content: "A2" }]} />
<FaqBase title="Frequently Asked Questions" description="Answers to common queries." faqsAnimation="slide-up" textboxLayout="split" useInvertedBackground={false} faqs={[{ id: "1", title: "How does it work?", content: "Simply sign up and start building." }, { id: "2", title: "Is it free?", content: "We have a generous free tier." }]} />
</div>
<div id="contact" data-section="contact">
<ContactCenter tag="Contact" title="Get in touch" description="Contact us" useInvertedBackground={false} background={{ variant: "plain" }} />
<ContactCenter tag="Contact Us" title="Get in touch" description="We're here to help you grow." background={{ variant: "animated-grid" }} useInvertedBackground={false} />
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal logoText="Brand" leftLink={{ text: "Link 1" }} rightLink={{ text: "Link 2" }} />
<FooterLogoReveal logoText="Webild" leftLink={{ text: "Privacy", href: "#" }} rightLink={{ text: "Terms", href: "#" }} />
</div>
</ThemeProvider>
);