Files
3ccf532d-f690-4945-b4d2-e2a…/src/app/page.tsx
2026-03-03 14:48:56 +00:00

153 lines
8.0 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroLogo from '@/components/sections/hero/HeroLogo';
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FooterCard from '@/components/sections/footer/FooterCard';
import { Mail, Twitter, Linkedin, Github, Star } from 'lucide-react';
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="hover-bubble"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="largeSizeMediumTitles"
background="noise"
cardStyle="layered-gradient"
primaryButtonStyle="double-inset"
secondaryButtonStyle="solid"
headingFontWeight="bold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Webild"
navItems={[
{ name: "Features", id: "features" },
{ name: "About", id: "about" },
{ name: "Testimonials", id: "testimonials" },
{ name: "Contact", id: "contact" }
]}
button={{
text: "Get Started", href: "#contact"
}}
animateOnLoad={true}
/>
</div>
<div id="hero" data-section="hero">
<HeroLogo
logoText="Webild"
description="Build amazing digital experiences with modern design and innovative solutions"
buttons={[
{ text: "Get Started", href: "#contact" },
{ text: "Learn More", href: "#features" }
]}
imageSrc="http://img.b2bpic.net/free-photo/abstract-flowing-gradient-waves-blue-purple_84443-75015.jpg"
imageAlt="Hero background"
showDimOverlay={false}
buttonAnimation="slide-up"
/>
</div>
<div id="features" data-section="features">
<FeatureCardThree
title="Why Choose Us"
description="Discover the features that make our platform exceptional"
tag="Features"
features={[
{
id: "01", title: "Modern Design", description: "Beautiful, responsive interfaces that work on any device", imageSrc: "http://img.b2bpic.net/free-psd/rules-ui-design-landing-page-template_23-2149193135.jpg", imageAlt: "design ui interface creative"
},
{
id: "02", title: "Fast Performance", description: "Lightning-quick load times and smooth interactions", imageSrc: "http://img.b2bpic.net/free-photo/high-speed-optical-cable-fast-data-broadband-transfer-fiber-connection-abstract-tech-background_272375-5414.jpg", imageAlt: "speed performance fast technology"
},
{
id: "03", title: "Easy Integration", description: "Seamless integration with your existing tools and systems", imageSrc: "http://img.b2bpic.net/free-vector/business-infographic-with-image_23-2148340472.jpg", imageAlt: "integration workflow process connection"
},
{
id: "04", title: "24/7 Support", description: "Round-the-clock customer support and technical assistance", imageSrc: "http://img.b2bpic.net/free-photo/sales-assistant-being-employed-customer-care-support-job-working-telemarketing-call-center-helpdesk-female-receptionist-with-helpline-service-helping-clients-remote-communication_482257-43021.jpg", imageAlt: "support help service customer"
}
]}
textboxLayout="default"
gridVariant="two-columns-alternating-heights"
animationType="slide-up"
useInvertedBackground={false}
/>
</div>
<div id="about" data-section="about">
<InlineImageSplitTextAbout
heading={[
{ type: "text", content: "About" },
{ type: "image", src: "http://img.b2bpic.net/free-vector/geometric-harmony-hills-private-school-logo-template_742173-18879.jpg", alt: "Company logo" },
{ type: "text", content: "Webild" }
]}
buttons={[
{ text: "Our Story", href: "#" }
]}
useInvertedBackground={false}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwo
title="Customer Reviews"
description="See what our satisfied customers have to say about us"
tag="Testimonials"
testimonials={[
{
id: "1", name: "Sarah Johnson", role: "CEO, TechCorp", testimonial: "Webild transformed our digital presence. The design is stunning and the support team is incredibly responsive.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=1", imageAlt: "portrait person professional headshot", icon: Star
},
{
id: "2", name: "Michael Chen", role: "Product Manager, InnovateLab", testimonial: "Outstanding service and exceptional attention to detail. Highly recommend to anyone looking for quality web solutions.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=2", imageAlt: "portrait person professional headshot", icon: Star
},
{
id: "3", name: "Emily Rodriguez", role: "Marketing Director, GrowthCo", testimonial: "The platform is intuitive and powerful. Our team was able to get up and running in just days.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=3", imageAlt: "portrait person professional headshot", icon: Star
},
{
id: "4", name: "David Kim", role: "Founder, StartupXYZ", testimonial: "Best investment we made for our business. The results have been beyond our expectations.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=4", imageAlt: "portrait person professional headshot", icon: Star
}
]}
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
carouselMode="buttons"
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
tag="Get Started"
tagIcon={Mail}
title="Ready to Transform Your Digital Vision?"
description="Let's work together to create something extraordinary. Our team is excited to help you build your next project."
buttons={[
{ text: "Contact Us", href: "mailto:hello@webild.com" },
{ text: "Schedule Demo", href: "#" }
]}
background={{ variant: "plain" }}
useInvertedBackground={false}
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Webild"
copyrightText="© 2025 Webild. All rights reserved."
socialLinks={[
{ icon: Twitter, href: "https://twitter.com/webild", ariaLabel: "Twitter" },
{ icon: Linkedin, href: "https://linkedin.com/company/webild", ariaLabel: "LinkedIn" },
{ icon: Github, href: "https://github.com/webild", ariaLabel: "GitHub" }
]}
/>
</div>
</ThemeProvider>
);
}