Compare commits
16 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| acfe710ebd | |||
| d512f27da4 | |||
| b3aea5e514 | |||
| 5246b9ec3c | |||
| e9f28e8fa8 | |||
| 3805562aac | |||
| 849cfef128 | |||
| 72d0c7a122 | |||
| 0e38c53bd5 | |||
| 5b1375c254 | |||
| 3ad0575c29 | |||
| 353bdab3b8 | |||
| c8dc6a3e7d | |||
| 82ea292513 | |||
| b87ba0a2c7 | |||
| 62ac31c17a |
@@ -8,7 +8,7 @@ import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
|
||||
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
||||
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
||||
|
||||
import ContactText from '@/components/sections/contact/ContactText';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import { Award, CheckCircle, Shield, Sparkles, Star, Zap } from 'lucide-react';
|
||||
@@ -34,7 +34,7 @@ export default function LandingPage() {
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Portfolio", id: "portfolio" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Testimonials", id: "testimonials" }
|
||||
{ name: "Pricing", id: "pricing" }
|
||||
]}
|
||||
button={{ text: "Get Started", href: "#contact" }}
|
||||
/>
|
||||
@@ -65,7 +65,7 @@ export default function LandingPage() {
|
||||
|
||||
<div id="about" data-section="about" className="relative bg-opacity-50">
|
||||
<TextSplitAbout
|
||||
title="Crafting Digital Experiences Since 2015"
|
||||
title="Crafting Digital Experiences Since 2026"
|
||||
description={[
|
||||
"Based in the vibrant Northwest Florida community, Webild Design Studio has emerged as a trusted partner for businesses seeking exceptional web design and digital solutions. Our team combines creative excellence with strategic thinking to deliver websites that captivate audiences and drive conversions.", "From startups to established enterprises, we've helped over 200 businesses across the United States establish powerful digital presences. Our approach is collaborative, transparent, and results-driven—ensuring every project exceeds expectations and delivers measurable ROI."
|
||||
]}
|
||||
@@ -111,9 +111,9 @@ export default function LandingPage() {
|
||||
tagIcon={CheckCircle}
|
||||
tagAnimation="slide-up"
|
||||
buttons={[
|
||||
{ text: "Explore All Services", href: "#contact" }
|
||||
{ text: "Book Your Design Strategy Call", href: "#contact" }
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
buttonAnimation="blur-reveal"
|
||||
className="relative"
|
||||
containerClassName="max-w-7xl mx-auto px-4 py-16 md:py-24"
|
||||
textBoxTitleClassName="text-4xl md:text-5xl font-bold mb-4"
|
||||
@@ -129,15 +129,15 @@ export default function LandingPage() {
|
||||
description="Showcase of our latest web design projects and case studies highlighting our expertise across industries."
|
||||
products={[
|
||||
{
|
||||
id: "ecommerce-platform", brand: "Fashion Retail", name: "E-Commerce Platform Redesign", price: "$45K", rating: 5,
|
||||
id: "ecommerce-platform", brand: "Fashion Retail", name: "E-Commerce Platform Redesign", price: "$1.75K", rating: 5,
|
||||
reviewCount: "42 reviews", imageSrc: "http://img.b2bpic.net/free-vector/ecommerce-email-template_52683-49444.jpg", imageAlt: "Ecommerce website design portfolio"
|
||||
},
|
||||
{
|
||||
id: "corporate-website", brand: "B2B Services", name: "Corporate Identity Website", price: "$32K", rating: 5,
|
||||
id: "corporate-website", brand: "B2B Services", name: "Corporate Identity Website", price: "$1.2K", rating: 5,
|
||||
reviewCount: "38 reviews", imageSrc: "http://img.b2bpic.net/free-vector/flat-design-geometric-pattern-landing-page_23-2149945725.jpg", imageAlt: "Corporate business website design"
|
||||
},
|
||||
{
|
||||
id: "saas-platform", brand: "Tech Startup", name: "SaaS Platform Landing Site", price: "$28K", rating: 5,
|
||||
id: "saas-platform", brand: "Tech Startup", name: "SaaS Platform Landing Site", price: "$850", rating: 5,
|
||||
reviewCount: "35 reviews", imageSrc: "http://img.b2bpic.net/free-vector/launch-business-gradient-landing-page_52683-23194.jpg", imageAlt: "Startup website design modern"
|
||||
}
|
||||
]}
|
||||
@@ -186,9 +186,9 @@ export default function LandingPage() {
|
||||
<div id="metrics" data-section="metrics" className="relative bg-opacity-50">
|
||||
<MetricCardTwo
|
||||
metrics={[
|
||||
{ id: "projects", value: "200+", description: "Projects Delivered" },
|
||||
{ id: "clients", value: "150+", description: "Happy Clients" },
|
||||
{ id: "conversion", value: "45%", description: "Average Conversion Lift" }
|
||||
{ id: "conversion", value: "62%", description: "Average Conversion Lift" },
|
||||
{ id: "projects", value: "850+", description: "Projects Delivered" },
|
||||
{ id: "clients", value: "620+", description: "Happy Clients" }
|
||||
]}
|
||||
gridVariant="uniform-all-items-equal"
|
||||
animationType="slide-up"
|
||||
@@ -206,49 +206,7 @@ export default function LandingPage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials" className="relative">
|
||||
<TestimonialCardOne
|
||||
testimonials={[
|
||||
{
|
||||
id: "client-1", name: "Sarah Mitchell", role: "CEO", company: "Fashion Forward Inc", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/positive-businesswoman-work_1098-3861.jpg", imageAlt: "Sarah Mitchell"
|
||||
},
|
||||
{
|
||||
id: "client-2", name: "James Rodriguez", role: "Founder", company: "Tech Innovations Co", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-optimistic-businessman-formalwear_1262-3600.jpg", imageAlt: "James Rodriguez"
|
||||
},
|
||||
{
|
||||
id: "client-3", name: "Emily Chen", role: "Marketing Director", company: "Global Commerce Ltd", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-business-man-with-backpack_23-2149915912.jpg", imageAlt: "Emily Chen"
|
||||
},
|
||||
{
|
||||
id: "client-4", name: "Michael Thompson", role: "Business Owner", company: "Local Services Group", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-good-looking-hispanic-businessman-standing-arms-crossed-outside-office_662251-2067.jpg", imageAlt: "Michael Thompson"
|
||||
},
|
||||
{
|
||||
id: "client-5", name: "Jennifer Lee", role: "Product Manager", company: "Digital Solutions Pro", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-business-woman-portrait_23-2149280734.jpg", imageAlt: "Jennifer Lee"
|
||||
},
|
||||
{
|
||||
id: "client-6", name: "David Kumar", role: "Executive Director", company: "Enterprise Systems Inc", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blond-businessman-happy-expression_1194-3796.jpg", imageAlt: "David Kumar"
|
||||
}
|
||||
]}
|
||||
gridVariant="uniform-all-items-equal"
|
||||
animationType="slide-up"
|
||||
title="What Our Clients Say"
|
||||
description="Real feedback from real clients about their experience working with our design studio."
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
tag="Client Stories"
|
||||
tagIcon={Star}
|
||||
tagAnimation="slide-up"
|
||||
className="relative"
|
||||
containerClassName="max-w-7xl mx-auto px-4 py-16 md:py-24"
|
||||
textBoxTitleClassName="text-4xl md:text-5xl font-bold mb-4 text-center"
|
||||
textBoxDescriptionClassName="text-lg text-center text-opacity-80 mb-12"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="contact" data-section="contact" className="relative">
|
||||
<ContactText
|
||||
@@ -278,12 +236,12 @@ export default function LandingPage() {
|
||||
{ label: "Home", href: "/" },
|
||||
{ label: "Services", href: "#services" },
|
||||
{ label: "Portfolio", href: "#portfolio" },
|
||||
{ label: "Pricing", href: "/pricing" },
|
||||
{ label: "About", href: "#about" }
|
||||
]
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ label: "Testimonials", href: "#testimonials" },
|
||||
{ label: "Contact", href: "#contact" },
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" }
|
||||
|
||||
138
src/app/pricing/page.tsx
Normal file
138
src/app/pricing/page.tsx
Normal file
@@ -0,0 +1,138 @@
|
||||
"use client"
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
|
||||
import ContactText from '@/components/sections/contact/ContactText';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import { CheckCircle, Sparkles } from 'lucide-react';
|
||||
|
||||
export default function PricingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="rounded"
|
||||
contentWidth="compact"
|
||||
sizing="mediumLargeSizeLargeTitles"
|
||||
background="circleGradient"
|
||||
cardStyle="layered-gradient"
|
||||
primaryButtonStyle="double-inset"
|
||||
secondaryButtonStyle="radial-glow"
|
||||
headingFontWeight="medium"
|
||||
>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
brandName="Webild Design Studio"
|
||||
navItems={[
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Portfolio", id: "portfolio" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Pricing", id: "pricing" }
|
||||
]}
|
||||
button={{ text: "Get Started", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing" className="relative">
|
||||
<PricingCardEight
|
||||
title="Simple, Transparent Pricing"
|
||||
description="Choose the perfect plan for your web design needs. All plans include ongoing support and revisions."
|
||||
plans={[
|
||||
{
|
||||
id: "starter", badge: "Starter", badgeIcon: Sparkles,
|
||||
price: "$2,500", subtitle: "Perfect for small businesses getting started online", buttons: [
|
||||
{ text: "Choose Plan", href: "#contact" }
|
||||
],
|
||||
features: [
|
||||
"5-page responsive website", "Mobile-first design", "Basic SEO optimization", "Contact form integration", "3 rounds of revisions", "30-day support included", "SSL certificate included"
|
||||
]
|
||||
},
|
||||
{
|
||||
id: "professional", badge: "Professional", badgeIcon: CheckCircle,
|
||||
price: "$5,500", subtitle: "Ideal for growing businesses with advanced requirements", buttons: [
|
||||
{ text: "Choose Plan", href: "#contact" }
|
||||
],
|
||||
features: [
|
||||
"Up to 15-page custom website", "Advanced responsive design", "Comprehensive SEO strategy", "E-commerce integration", "Blog setup and optimization", "5 rounds of revisions", "90-day support included", "Analytics setup", "Custom animations and effects"
|
||||
]
|
||||
},
|
||||
{
|
||||
id: "enterprise", badge: "Enterprise", badgeIcon: CheckCircle,
|
||||
price: "Custom", subtitle: "Tailored solutions for large-scale digital transformation", buttons: [
|
||||
{ text: "Request Quote", href: "#contact" }
|
||||
],
|
||||
features: [
|
||||
"Unlimited pages and custom functionality", "Full design system development", "Advanced SEO and SEM strategy", "Complex integrations and APIs", "CMS implementation", "Unlimited revisions", "6-month dedicated support", "Performance optimization", "Security audit and hardening", "Ongoing maintenance retainer"
|
||||
]
|
||||
}
|
||||
]}
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
tag="Pricing Plans"
|
||||
tagIcon={Sparkles}
|
||||
tagAnimation="slide-up"
|
||||
className="relative"
|
||||
containerClassName="max-w-7xl mx-auto px-4 py-16 md:py-24"
|
||||
textBoxTitleClassName="text-4xl md:text-5xl font-bold mb-4 text-center"
|
||||
textBoxDescriptionClassName="text-lg text-center text-opacity-80 mb-12"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact" className="relative">
|
||||
<ContactText
|
||||
text="Ready to get started? Our team is here to help you choose the right plan and answer any questions you may have. Let's discuss your project and create a custom proposal if needed."
|
||||
animationType="entrance-slide"
|
||||
buttons={[
|
||||
{ text: "Send Us a Message", href: "mailto:hello@webild-design.com" },
|
||||
{ text: "Schedule a Consultation", href: "#" }
|
||||
]}
|
||||
background={{ variant: "radial-gradient" }}
|
||||
useInvertedBackground={false}
|
||||
ariaLabel="Contact us section"
|
||||
className="relative"
|
||||
containerClassName="max-w-4xl mx-auto px-4 py-20 md:py-32"
|
||||
contentClassName="text-center"
|
||||
textClassName="text-3xl md:text-4xl font-bold mb-8"
|
||||
buttonContainerClassName="flex flex-col sm:flex-row gap-4 justify-center mt-8"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer" className="relative border-t border-opacity-20">
|
||||
<FooterLogoEmphasis
|
||||
logoText="Webild Design Studio"
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{ label: "Home", href: "/" },
|
||||
{ label: "Services", href: "/#services" },
|
||||
{ label: "Portfolio", href: "/#portfolio" },
|
||||
{ label: "Pricing", href: "/pricing" },
|
||||
{ label: "About", href: "/#about" }
|
||||
]
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ label: "Contact", href: "/#contact" },
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" }
|
||||
]
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ label: "Email", href: "mailto:hello@webild-design.com" },
|
||||
{ label: "Phone", href: "tel:+1-850-555-0123" },
|
||||
{ label: "Northwest Florida", href: "#" },
|
||||
{ label: "Serving USA", href: "#" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
ariaLabel="Site footer"
|
||||
className="relative"
|
||||
containerClassName="max-w-7xl mx-auto px-4 py-16"
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #e3deea;
|
||||
--card: #ffffff;
|
||||
--foreground: #1f2027;
|
||||
--primary-cta: #1f2027;
|
||||
--primary-cta-text: #e3deea;
|
||||
--secondary-cta: #ffffff;
|
||||
--secondary-cta-text: #1f2027;
|
||||
--accent: #627dc6;
|
||||
--background-accent: #627dc6;
|
||||
--background: #ffffff;
|
||||
--card: #f9f9f9;
|
||||
--foreground: #000612e6;
|
||||
--primary-cta: #106EFB;
|
||||
--primary-cta-text: #ffffff;
|
||||
--secondary-cta: #f9f9f9;
|
||||
--secondary-cta-text: #000612e6;
|
||||
--accent: #e2e2e2;
|
||||
--background-accent: #106EFB;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user