Update src/app/page.tsx

This commit is contained in:
2026-04-22 20:08:44 +00:00
parent 530c45bc9e
commit 3d2f35be55

View File

@@ -1,5 +1,4 @@
'use client';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
@@ -12,134 +11,45 @@ import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactText from '@/components/sections/contact/ContactText';
import FooterSimple from '@/components/sections/footer/FooterSimple';
export default function HomePage() {
const navItems = [{ name: "Home", id: "/" }];
export default function Page() {
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={[
{ name: "Home", id: "/" }
]}
/>
<NavbarStyleApple navItems={navItems} />
</div>
<div id="hero" data-section="hero">
<HeroBillboardRotatedCarousel
title="Welcome to Our Platform"
description="Experience the future of digital solutions with our innovative approach."
background={{ variant: "gradient-bars" }}
carouselItems={[
{ id: "1", imageSrc: "https://images.unsplash.com/photo-1506744038136-46273834b3fb?w=800" },
{ id: "2", imageSrc: "https://images.unsplash.com/photo-1470071459604-3b5ec3a7fe05?w=800" },
{ id: "3", imageSrc: "https://images.unsplash.com/photo-1441974231531-c6227db76b6e?w=800" },
{ id: "4", imageSrc: "https://images.unsplash.com/photo-1501854140801-50d01698950b?w=800" },
{ id: "5", imageSrc: "https://images.unsplash.com/photo-1447752875215-b2761acb3c5d?w=800" },
{ id: "6", imageSrc: "https://images.unsplash.com/photo-1469474968028-56623f02e42e?w=800" }
]}
title="Revolutionizing Digital Experiences"
description="Crafting high-impact solutions for the modern era."
background={{ variant: "animated-grid" }}
carouselItems={Array.from({ length: 6 }).map((_, i) => ({ id: `hero-${i}`, imageSrc: "https://picsum.photos/400/600" }))}
/>
</div>
<div id="trust" data-section="trust">
<SocialProofOne
names={["Acme Corp", "Global Tech", "Innovate Inc", "NextGen"]}
title="Trusted by Industry Leaders"
description="We work with the best in the business to deliver outstanding results."
textboxLayout="default"
useInvertedBackground={false}
/>
<SocialProofOne names={["Acme", "Globex", "Soylent", "Initech"]} title="Trusted by industry leaders" description="" />
</div>
<div id="services" data-section="services">
<FeatureCardMedia
title="Our Core Services"
description="Comprehensive solutions tailored to your specific business needs."
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{ id: "f1", title: "Strategic Planning", description: "Mapping your path to success with data-driven insights.", tag: "Strategy" },
{ id: "f2", title: "Creative Design", description: "Building beautiful and functional experiences for your users.", tag: "Design" }
]}
/>
<FeatureCardMedia title="Our Services" description="We deliver excellence." animationType="slide-up" textboxLayout="default" features={[]} />
</div>
<div id="work" data-section="work">
<ProductCardOne
title="Featured Work"
description="Explore our recent projects and success stories."
gridVariant="bento-grid"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
products={[
{ id: "p1", name: "Product Alpha", price: "$99", imageSrc: "https://images.unsplash.com/photo-1505740420928-5e560c06d30e?w=500" },
{ id: "p2", name: "Product Beta", price: "$149", imageSrc: "https://images.unsplash.com/photo-1523275335684-37898b6baf30?w=500" },
{ id: "p3", name: "Product Gamma", price: "$199", imageSrc: "https://images.unsplash.com/photo-1572635196237-14b3f281503f?w=500" }
]}
/>
<ProductCardOne title="Recent Projects" description="Selected works." animationType="slide-up" gridVariant="bento-grid" textboxLayout="default" products={[]} />
</div>
<div id="process" data-section="process">
<MetricCardEleven
title="Our Process"
description="Transparent steps to get you from concept to reality."
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
metrics={[
{ id: "m1", value: "1", title: "Consultation", description: "Understanding your vision and goals.", imageSrc: "https://images.unsplash.com/photo-1522202176988-66273c2fd55f?w=500" },
{ id: "m2", value: "2", title: "Execution", description: "Bringing the vision to life with precision.", imageSrc: "https://images.unsplash.com/photo-1552664730-d307ca884978?w=500" }
]}
/>
<MetricCardEleven title="Our Process" description="Efficiency at scale." animationType="slide-up" metrics={[]} />
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwo
title="Client Feedback"
description="See what our clients have to say about working with us."
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{ id: "t1", name: "Jane Doe", role: "CEO", testimonial: "An incredible team that delivered beyond expectations." },
{ id: "t2", name: "John Smith", role: "CTO", testimonial: "Seamless communication and top-tier results every time." }
]}
/>
<TestimonialCardTwo title="Client Stories" description="What they say about us." animationType="slide-up" textboxLayout="default" testimonials={[]} />
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
title="Frequently Asked Questions"
description="Find quick answers to common inquiries."
faqsAnimation="slide-up"
mediaAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{ id: "q1", title: "How do we get started?", content: "Simply reach out through our contact section." },
{ id: "q2", title: "What is your timeline?", content: "Timelines vary based on project scope, but we prioritize quality." }
]}
/>
<FaqSplitMedia title="FAQ" description="Common questions answered." faqsAnimation="slide-up" textboxLayout="default" faqs={[]} />
</div>
<div id="cta" data-section="cta">
<ContactText
text="Ready to start your project? Let's connect."
background={{ variant: "gradient-bars" }}
useInvertedBackground={false}
/>
<ContactText text="Ready to start?" background={{ variant: "plain" }} />
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{ title: "Navigation", items: [{ label: "Home", href: "/" }] }
]}
bottomLeftText="© 2024 Your Brand"
bottomRightText="All rights reserved."
/>
<FooterSimple columns={[]} bottomLeftText="© 2024 Webild" bottomRightText="All rights reserved." />
</div>
</ThemeProvider>
);