Merge version_1 into main #2
368
src/app/page.tsx
368
src/app/page.tsx
@@ -13,274 +13,122 @@ import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-shift"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="pill"
|
||||
defaultButtonVariant="text-shift"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Inquiry Portal"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Inquiry Portal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlayTestimonial
|
||||
title="Build Your Project With Confidence"
|
||||
description="I'm here to bring your vision to life. Share your goals, business needs, and budget, and let's get started."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Alex R.",
|
||||
handle: "@alexdev",
|
||||
testimonial: "Excellent communication and high-quality results every time.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg?_wi=1",
|
||||
imageAlt: "minimalist clean workspace high tech",
|
||||
},
|
||||
{
|
||||
name: "Sarah P.",
|
||||
handle: "@sarahbiz",
|
||||
testimonial: "Highly recommended for any custom business project.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/elegant-smartwatch-with-abstract-background_1134-390.jpg?_wi=1",
|
||||
imageAlt: "digital interface abstract technology",
|
||||
},
|
||||
{
|
||||
name: "Mike L.",
|
||||
handle: "@mlabs",
|
||||
testimonial: "Professional, efficient, and very reliable.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg?_wi=2",
|
||||
imageAlt: "minimalist clean workspace high tech",
|
||||
},
|
||||
{
|
||||
name: "Jane D.",
|
||||
handle: "@janedesign",
|
||||
testimonial: "Understands requirements perfectly. Great experience.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/elegant-smartwatch-with-abstract-background_1134-390.jpg?_wi=2",
|
||||
imageAlt: "digital interface abstract technology",
|
||||
},
|
||||
{
|
||||
name: "Tom B.",
|
||||
handle: "@tombuilds",
|
||||
testimonial: "Solid delivery. Will work with again.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg?_wi=3",
|
||||
imageAlt: "minimalist clean workspace high tech",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg?_wi=4"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg",
|
||||
alt: "Avatar 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg",
|
||||
alt: "Avatar 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg",
|
||||
alt: "Avatar 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg",
|
||||
alt: "Avatar 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg",
|
||||
alt: "Avatar 5",
|
||||
},
|
||||
]}
|
||||
avatarText="Trusted by 50+ clients"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlayTestimonial
|
||||
title="Build Your Project With Confidence"
|
||||
description="I'm here to bring your vision to life. Share your goals, business needs, and budget, and let's get started."
|
||||
testimonials={[
|
||||
{ name: "Alex R.", handle: "@alexdev", testimonial: "Excellent communication and high-quality results every time.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg", imageAlt: "minimalist clean workspace high tech" },
|
||||
{ name: "Sarah P.", handle: "@sarahbiz", testimonial: "Highly recommended for any custom business project.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/elegant-smartwatch-with-abstract-background_1134-390.jpg", imageAlt: "digital interface abstract technology" },
|
||||
{ name: "Mike L.", handle: "@mlabs", testimonial: "Professional, efficient, and very reliable.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg", imageAlt: "minimalist clean workspace high tech" },
|
||||
{ name: "Jane D.", handle: "@janedesign", testimonial: "Understands requirements perfectly. Great experience.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/elegant-smartwatch-with-abstract-background_1134-390.jpg", imageAlt: "digital interface abstract technology" },
|
||||
{ name: "Tom B.", handle: "@tombuilds", testimonial: "Solid delivery. Will work with again.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg", imageAlt: "minimalist clean workspace high tech" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg", alt: "Avatar 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg", alt: "Avatar 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg", alt: "Avatar 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg", alt: "Avatar 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg", alt: "Avatar 5" },
|
||||
]}
|
||||
avatarText="Trusted by 50+ clients"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Transparent Pricing"
|
||||
description="Select the plan that fits your project needs."
|
||||
plans={[
|
||||
{
|
||||
id: "basic",
|
||||
price: "$500",
|
||||
name: "Starter",
|
||||
buttons: [
|
||||
{
|
||||
text: "Get Started",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
features: [
|
||||
"Responsive Design",
|
||||
"Basic SEO",
|
||||
"Contact Form",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "pro",
|
||||
price: "$1200",
|
||||
name: "Professional",
|
||||
buttons: [
|
||||
{
|
||||
text: "Get Started",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
features: [
|
||||
"Everything in Starter",
|
||||
"Custom CMS",
|
||||
"Advanced Analytics",
|
||||
"Priority Support",
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Transparent Pricing"
|
||||
description="Select the plan that fits your project needs."
|
||||
plans={[
|
||||
{ id: "basic", price: "$500", name: "Starter", buttons: [{ text: "Get Started", href: "#contact" }], features: ["Responsive Design", "Basic SEO", "Contact Form"] },
|
||||
{ id: "pro", price: "$1200", name: "Professional", buttons: [{ text: "Get Started", href: "#contact" }], features: ["Everything in Starter", "Custom CMS", "Advanced Analytics", "Priority Support"] },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metric" data-section="metric">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
title="Proven Performance"
|
||||
description="Delivering measurable results for businesses of all sizes."
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "100+",
|
||||
description: "Projects Completed",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "95%",
|
||||
description: "Client Satisfaction",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "24/7",
|
||||
description: "Support Availability",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="metric" data-section="metric">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
title="Proven Performance"
|
||||
description="Delivering measurable results for businesses of all sizes."
|
||||
metrics={[
|
||||
{ id: "m1", value: "100+", description: "Projects Completed" },
|
||||
{ id: "m2", value: "95%", description: "Client Satisfaction" },
|
||||
{ id: "m3", value: "24/7", description: "Support Availability" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="feature" data-section="feature">
|
||||
<FeatureCardSix
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Our Development Process"
|
||||
description="We ensure a seamless experience from concept to launch."
|
||||
features={[
|
||||
{
|
||||
title: "Consultation",
|
||||
description: "Discussing goals and defining the scope.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg?_wi=5",
|
||||
imageAlt: "Consulting",
|
||||
},
|
||||
{
|
||||
title: "Design",
|
||||
description: "Creating wireframes and prototypes.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/elegant-smartwatch-with-abstract-background_1134-390.jpg?_wi=3",
|
||||
imageAlt: "Design",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="feature" data-section="feature">
|
||||
<FeatureCardSix
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Our Development Process"
|
||||
description="We ensure a seamless experience from concept to launch."
|
||||
features={[
|
||||
{ title: "Consultation", description: "Discussing goals and defining the scope.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg", imageAlt: "Consulting" },
|
||||
{ title: "Design", description: "Creating wireframes and prototypes.", imageSrc: "http://img.b2bpic.net/free-photo/elegant-smartwatch-with-abstract-background_1134-390.jpg", imageAlt: "Design" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={true}
|
||||
title="Start Your Project"
|
||||
description="Please fill out the form below. Once submitted, your request will be sent directly for review."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Full Name",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Email Address",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "phone",
|
||||
type: "tel",
|
||||
placeholder: "Phone Number",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "businessName",
|
||||
type: "text",
|
||||
placeholder: "Business Name",
|
||||
required: false,
|
||||
},
|
||||
]}
|
||||
multiSelect={{
|
||||
name: "budget",
|
||||
label: "Project Budget Range",
|
||||
options: [
|
||||
"$300 - $600",
|
||||
"$600 - $1000",
|
||||
"$1000 - $1500",
|
||||
"$1500 - $2000",
|
||||
],
|
||||
}}
|
||||
textarea={{
|
||||
name: "reason",
|
||||
placeholder: "Please tell me the reason you're building this site and your project requirements...",
|
||||
rows: 5,
|
||||
required: true,
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/elegant-smartwatch-with-abstract-background_1134-390.jpg?_wi=4"
|
||||
onSubmit={(data) => { console.log('Routing data to 762-201-7158 and elrodjace196@gmail.com', data); alert('Inquiry sent successfully!'); }}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={true}
|
||||
title="Start Your Project"
|
||||
description="Please fill out the form below. Once submitted, your request will be sent directly for review."
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Your Full Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Email Address", required: true },
|
||||
{ name: "phone", type: "tel", placeholder: "Phone Number", required: true },
|
||||
{ name: "businessName", type: "text", placeholder: "Business Name", required: false },
|
||||
]}
|
||||
multiSelect={{ name: "budget", label: "Project Budget Range", options: ["$300 - $600", "$600 - $1000", "$1000 - $1500", "$1500 - $2000"] }}
|
||||
textarea={{ name: "reason", placeholder: "Please tell me the reason you're building this site and your project requirements...", rows: 5, required: true }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/elegant-smartwatch-with-abstract-background_1134-390.jpg"
|
||||
onSubmit={(data) => { console.log('Routing data', data); alert('Inquiry sent successfully!'); }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Links",
|
||||
items: [
|
||||
{
|
||||
label: "Back to Top",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
{
|
||||
label: "Email: elrodjace196@gmail.com",
|
||||
href: "mailto:elrodjace196@gmail.com",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
bottomLeftText="© 2024 Inquiry Portal"
|
||||
bottomRightText="Built for Success"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{ title: "Links", items: [{ label: "Back to Top", href: "#" }] },
|
||||
{ title: "Contact", items: [{ label: "Email: elrodjace196@gmail.com", href: "mailto:elrodjace196@gmail.com" }] },
|
||||
]}
|
||||
bottomLeftText="© 2024 Inquiry Portal"
|
||||
bottomRightText="Built for Success"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user