|
|
|
@@ -1,6 +1,5 @@
|
|
|
|
"use client";
|
|
|
|
"use client";
|
|
|
|
|
|
|
|
import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
|
|
|
|
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
|
|
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
|
|
|
|
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
|
|
|
|
import SplitAbout from '@/components/sections/about/SplitAbout';
|
|
|
|
import SplitAbout from '@/components/sections/about/SplitAbout';
|
|
|
|
@@ -10,9 +9,11 @@ import TestimonialCardFifteen from '@/components/sections/testimonial/Testimonia
|
|
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
|
|
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
|
|
|
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
|
|
|
|
|
|
|
|
|
|
|
const navItems = [{ name: "Home", id: "/" }];
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
export default function HomePage() {
|
|
|
|
export default function HomePage() {
|
|
|
|
|
|
|
|
const navItems = [
|
|
|
|
|
|
|
|
{ name: 'Home', id: '/' },
|
|
|
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<ThemeProvider
|
|
|
|
<ThemeProvider
|
|
|
|
defaultButtonVariant="text-stagger"
|
|
|
|
defaultButtonVariant="text-stagger"
|
|
|
|
@@ -27,69 +28,69 @@ export default function HomePage() {
|
|
|
|
headingFontWeight="normal"
|
|
|
|
headingFontWeight="normal"
|
|
|
|
>
|
|
|
|
>
|
|
|
|
<div id="nav" data-section="nav">
|
|
|
|
<div id="nav" data-section="nav">
|
|
|
|
<NavbarStyleApple navItems={navItems} brandName="Webild" />
|
|
|
|
<NavbarStyleApple navItems={navItems} />
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
|
|
<div id="hero" data-section="hero">
|
|
|
|
<HeroBillboardTestimonial
|
|
|
|
<HeroBillboardTestimonial
|
|
|
|
title="Elevate Your Brand"
|
|
|
|
title="Experience Excellence"
|
|
|
|
description="We build high-performance digital experiences that convert."
|
|
|
|
description="Premium services for your success."
|
|
|
|
background={{ variant: "animated-grid" }}
|
|
|
|
background={{ variant: 'plain' }}
|
|
|
|
testimonials={[{ name: "Jane Doe", handle: "@janedoe", testimonial: "Fantastic service!", rating: 5 }]}
|
|
|
|
testimonials={[]}
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
|
|
<div id="about" data-section="about">
|
|
|
|
<SplitAbout
|
|
|
|
<SplitAbout
|
|
|
|
title="Our Story"
|
|
|
|
title="About Us"
|
|
|
|
description="Dedicated to excellence in design and development."
|
|
|
|
description="We focus on delivering high-quality solutions."
|
|
|
|
textboxLayout="default"
|
|
|
|
textboxLayout="default"
|
|
|
|
useInvertedBackground={false}
|
|
|
|
useInvertedBackground={false}
|
|
|
|
mediaAnimation="opacity"
|
|
|
|
mediaAnimation="none"
|
|
|
|
bulletPoints={[{ title: "Quality", description: "High standards" }, { title: "Speed", description: "Fast delivery" }]}
|
|
|
|
bulletPoints={[]}
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div id="menu" data-section="menu">
|
|
|
|
<div id="menu" data-section="menu">
|
|
|
|
<ProductCardFour
|
|
|
|
<ProductCardFour
|
|
|
|
title="Our Services"
|
|
|
|
title="Our Services"
|
|
|
|
description="Explore our offerings"
|
|
|
|
description="Explore our curated offerings."
|
|
|
|
gridVariant="bento-grid"
|
|
|
|
gridVariant="bento-grid"
|
|
|
|
animationType="slide-up"
|
|
|
|
animationType="none"
|
|
|
|
textboxLayout="default"
|
|
|
|
textboxLayout="default"
|
|
|
|
useInvertedBackground={false}
|
|
|
|
useInvertedBackground={false}
|
|
|
|
products={[{ id: "1", name: "Web Design", price: "$99", variant: "Pro", imageSrc: "/img1.jpg" }, { id: "2", name: "SEO", price: "$49", variant: "Basic", imageSrc: "/img2.jpg" }, { id: "3", name: "Marketing", price: "$199", variant: "Elite", imageSrc: "/img3.jpg" }]}
|
|
|
|
products={[]}
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
|
|
<div id="faq" data-section="faq">
|
|
|
|
<FaqSplitText
|
|
|
|
<FaqSplitText
|
|
|
|
faqs={[{ id: "1", title: "How do I start?", content: "Contact us today!" }, { id: "2", title: "Pricing?", content: "Custom quotes." }]}
|
|
|
|
sideTitle="Questions"
|
|
|
|
sideTitle="FAQ"
|
|
|
|
faqsAnimation="none"
|
|
|
|
faqsAnimation="slide-up"
|
|
|
|
faqs={[]}
|
|
|
|
useInvertedBackground={false}
|
|
|
|
useInvertedBackground={false}
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
|
|
<TestimonialCardFifteen
|
|
|
|
<TestimonialCardFifteen
|
|
|
|
testimonial="Best team ever!"
|
|
|
|
testimonial="Best service ever!"
|
|
|
|
rating={5}
|
|
|
|
rating={5}
|
|
|
|
author="John Smith"
|
|
|
|
author="John Doe"
|
|
|
|
avatars={[{ src: "/avatar.jpg", alt: "Author" }]}
|
|
|
|
avatars={[]}
|
|
|
|
ratingAnimation="slide-up"
|
|
|
|
ratingAnimation="none"
|
|
|
|
avatarsAnimation="slide-up"
|
|
|
|
avatarsAnimation="none"
|
|
|
|
useInvertedBackground={false}
|
|
|
|
useInvertedBackground={false}
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
|
|
<div id="contact" data-section="contact">
|
|
|
|
<ContactCenter
|
|
|
|
<ContactCenter
|
|
|
|
tag="Contact"
|
|
|
|
tag="Contact"
|
|
|
|
title="Get in touch"
|
|
|
|
title="Get in Touch"
|
|
|
|
description="Let's build something great."
|
|
|
|
description="Reach out to us today."
|
|
|
|
background={{ variant: "plain" }}
|
|
|
|
background={{ variant: 'plain' }}
|
|
|
|
useInvertedBackground={false}
|
|
|
|
useInvertedBackground={false}
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
|
|
<div id="footer" data-section="footer">
|
|
|
|
<FooterBaseReveal
|
|
|
|
<FooterBaseReveal
|
|
|
|
logoText="Webild"
|
|
|
|
logoText="Excellence"
|
|
|
|
columns={[{ title: "Navigate", items: [{ label: "Home", href: "/" }] }]}
|
|
|
|
columns={[]}
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</ThemeProvider>
|
|
|
|
</ThemeProvider>
|
|
|
|
|