14 Commits

Author SHA1 Message Date
c77a9def53 Update src/app/page.tsx 2026-03-10 17:52:09 +00:00
5651059c3b Update src/app/page.tsx 2026-03-10 17:40:02 +00:00
d79b40a094 Update src/app/page.tsx 2026-03-10 17:10:11 +00:00
5457ee757f Update src/app/page.tsx 2026-03-10 16:56:40 +00:00
8048cbb2f1 Merge version_5 into main
Merge version_5 into main
2026-03-09 16:55:49 +00:00
187cd039b2 Update theme colors 2026-03-09 16:55:43 +00:00
083c9bd426 Merge version_5 into main
Merge version_5 into main
2026-03-09 16:52:51 +00:00
7702733f1a Update src/app/layout.tsx 2026-03-09 16:52:47 +00:00
2e7b72f578 Merge version_5 into main
Merge version_5 into main
2026-03-09 16:51:51 +00:00
801164924d Update src/app/page.tsx 2026-03-09 16:51:47 +00:00
78bb761641 Update src/app/layout.tsx 2026-03-09 16:51:46 +00:00
302643190f Merge version_4 into main
Merge version_4 into main
2026-03-09 15:03:37 +00:00
f7d8e466d9 Update src/app/page.tsx 2026-03-09 15:03:32 +00:00
2c85140b24 Merge version_3 into main
Merge version_3 into main
2026-03-09 14:57:15 +00:00
3 changed files with 236 additions and 1537 deletions

File diff suppressed because it is too large Load Diff

View File

@@ -1,211 +1,292 @@
"use client";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroCentered from "@/components/sections/hero/HeroCentered";
import MediaAbout from "@/components/sections/about/MediaAbout";
import FeatureCardTwentySeven from "@/components/sections/feature/FeatureCardTwentySeven";
import ProductCardOne from "@/components/sections/product/ProductCardOne";
import MetricCardTwo from "@/components/sections/metrics/MetricCardTwo";
import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
import FooterCard from "@/components/sections/footer/FooterCard";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { Sparkles, Zap, Briefcase, TrendingUp, Quote, Facebook } from "lucide-react";
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
import HeroCentered from "@/components/sections/hero/HeroCentered";
import SplitAbout from "@/components/sections/about/SplitAbout";
import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
import PricingCardNine from "@/components/sections/pricing/PricingCardNine";
import MetricCardTwo from "@/components/sections/metrics/MetricCardTwo";
import TeamCardOne from "@/components/sections/team/TeamCardOne";
import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
import ContactFaq from "@/components/sections/contact/ContactFaq";
import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
import { Lightbulb, Target, Zap, Phone } from "lucide-react";
import Link from "next/link";
export default function LandingPage() {
export default function Home() {
return (
<ThemeProvider
defaultButtonVariant="text-shift"
defaultButtonVariant="hover-bubble"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="medium"
sizing="largeSizeMediumTitles"
background="circleGradient"
cardStyle="gradient-mesh"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="layered"
headingFontWeight="medium"
borderRadius="pill"
contentWidth="mediumLarge"
sizing="mediumLarge"
background="none"
cardStyle="solid"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Webbug"
<NavbarStyleApple
navItems={[
{ name: "Services", id: "services" },
{ name: "Portfolio", id: "portfolio" },
{ name: "Home", id: "/" },
{ name: "About", id: "about" },
{ name: "Testimonials", id: "testimonials" },
{ name: "Services", id: "services" },
{ name: "Pricing", id: "pricing" },
{ name: "Contact", id: "contact" }
]}
button={{ text: "Get a Free Quote", href: "contact" }}
animateOnLoad={true}
brandName="Webbug"
/>
</div>
<div id="hero" data-section="hero">
<HeroCentered
title="Websites That Turn Visitors Into Customers"
description="Professional web design for local service businesses. We create fast, modern websites designed to generate leads and drive conversions."
background={{ variant: "plain" }}
avatars={[
{ src: "http://img.b2bpic.net/free-photo/handsome-black-man-posing-public-library_74855-1939.jpg?_wi=2", alt: "Team member 1" },
{ src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-posing_23-2148924772.jpg?_wi=2", alt: "Team member 2" },
{ src: "/placeholders/placeholder1.webp", alt: "User 1" },
{ src: "/placeholders/placeholder1.webp", alt: "User 2" },
{ src: "/placeholders/placeholder1.webp", alt: "User 3" }
]}
avatarText="Trusted by 100+ practices"
title="Professional Web Design for Medical & Dental Practices"
description="HIPAA-compliant websites designed to build patient trust and grow your practice"
buttons={[
{ text: "Get a Free Quote", href: "contact" },
{ text: "View Our Work", href: "portfolio" },
{ text: "Get Started", href: "contact" },
{ text: "Learn More", href: "about" }
]}
buttonAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<MediaAbout
title="Modern Web Design for Local Services"
description="We specialize in creating professional websites for service-based businesses. Our designs are fast, mobile-friendly, and optimized to convert visitors into paying customers. With years of experience in the service industry, we understand your business and what your customers need."
tag="About Webbug"
buttons={[{ text: "Learn More", href: "services" }]}
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-people-working-together_23-2149145155.jpg"
imageAlt="Webbug creative team collaborating"
useInvertedBackground={false}
/>
</div>
<div id="services" data-section="services">
<FeatureCardTwentySeven
title="Our Services"
description="We help local businesses grow online with fast, modern websites designed to generate leads."
tag="What We Offer"
tagIcon={Zap}
tagAnimation="slide-up"
<SplitAbout
title="Why Choose Webbug?"
description="We specialize in creating professional websites for healthcare providers"
textboxLayout="default"
useInvertedBackground={false}
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
features={[
bulletPoints={[
{
id: "business-websites", title: "Business Websites", description: "Professional websites designed to build trust and generate calls and form submissions.", imageSrc: "http://img.b2bpic.net/free-vector/business-landing-page-flat-design_23-2148257414.jpg", imageAlt: "Professional business website design"
title: "HIPAA Compliant", description: "All websites meet HIPAA security standards", icon: Lightbulb
},
{
id: "landing-pages", title: "Landing Pages", description: "High-converting landing pages built specifically for ads and marketing campaigns.", imageSrc: "http://img.b2bpic.net/free-vector/flat-design-minimal-technology-landing-page_23-2149188470.jpg", imageAlt: "High-converting landing page design"
title: "Patient Focused", description: "Design optimized for patient experience", icon: Target
},
{
id: "website-redesign", title: "Website Redesign", description: "We transform outdated websites into modern, fast, mobile-friendly experiences.", imageSrc: "http://img.b2bpic.net/free-vector/technology-landing-page-template-with-photo_52683-21230.jpg", imageAlt: "Website redesign mockup"
},
title: "SEO Optimized", description: "Better visibility in search results", icon: Zap
}
]}
imageSrc="/placeholders/placeholder1.webp"
imageAlt="Medical practice team"
imagePosition="right"
mediaAnimation="none"
buttons={[
{ text: "Schedule a Call", href: "contact" }
]}
/>
</div>
<div id="portfolio" data-section="portfolio">
<ProductCardOne
title="Recent Projects"
description="Websites we've created for local service businesses."
tag="Portfolio"
tagIcon={Briefcase}
tagAnimation="slide-up"
<div id="services" data-section="services">
<FeatureCardTwentyFive
features={[
{
title: "Website Design", description: "Custom websites tailored to your practice", icon: Target,
mediaItems: [
{ imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Website design" },
{ imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Website design 2" }
]
},
{
title: "Patient Portal", description: "Secure patient communication platform", icon: Lightbulb,
mediaItems: [
{ imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Patient portal" },
{ imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Patient portal 2" }
]
},
{
title: "SEO Services", description: "Improve your online visibility", icon: Zap,
mediaItems: [
{ imageSrc: "/placeholders/placeholder1.webp", imageAlt: "SEO services" },
{ imageSrc: "/placeholders/placeholder1.webp", imageAlt: "SEO services 2" }
]
},
{
title: "Maintenance", description: "24/7 support and updates", icon: Target,
mediaItems: [
{ imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Maintenance" },
{ imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Maintenance 2" }
]
}
]}
title="Our Services"
description="Comprehensive web solutions for healthcare providers"
textboxLayout="default"
useInvertedBackground={false}
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
products={[
buttons={[
{ text: "View All Services", href: "contact" }
]}
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardNine
plans={[
{
id: "1", name: "Local Plumbing Website", price: "View Case Study", imageSrc: "http://img.b2bpic.net/free-vector/electrician-landing-page_23-2148716532.jpg", imageAlt: "Professional plumbing company website"
id: "basic", title: "Basic", price: "$999", period: "/month", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Basic plan", button: { text: "Get Started", href: "contact" },
features: [
"Professional Website", "Mobile Responsive", "Basic SEO Setup", "Email Support"
]
},
{
id: "2", name: "Construction Company Website", price: "View Case Study", imageSrc: "http://img.b2bpic.net/free-vector/real-estate-business-landing-page-template_23-2149874298.jpg", imageAlt: "Construction company website portfolio"
id: "professional", title: "Professional", price: "$1,999", period: "/month", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Professional plan", button: { text: "Get Started", href: "contact" },
features: [
"All Basic Features", "Patient Portal", "Advanced SEO", "Priority Support", "Monthly Analytics"
]
},
{
id: "3", name: "Cleaning Service Website", price: "View Case Study", imageSrc: "http://img.b2bpic.net/free-vector/laundry-service-vertical-web-page-set-with-prices-contacts-symbols_1284-9614.jpg", imageAlt: "Professional cleaning service website"
},
id: "enterprise", title: "Enterprise", price: "Custom", period: "/month", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Enterprise plan", button: { text: "Schedule Call", href: "contact" },
features: [
"All Professional Features", "Custom Integrations", "24/7 Support", "Dedicated Account Manager", "Advanced Analytics"
]
}
]}
title="Transparent Pricing"
description="Choose the plan that fits your practice needs"
textboxLayout="default"
useInvertedBackground={false}
animationType="slide-up"
buttons={[
{ text: "View Full Details", href: "contact" }
]}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardTwo
metrics={[
{ id: "1", value: "100+", description: "Medical Practices Served" },
{ id: "2", value: "98%", description: "Client Satisfaction" },
{ id: "3", value: "50K+", description: "Patient Appointments Booked" },
{ id: "4", value: "24/7", description: "Technical Support Available" }
]}
title="Our Impact"
description="Proven results for local service businesses."
tag="Key Metrics"
tagIcon={TrendingUp}
tagAnimation="slide-up"
description="Delivering results for healthcare providers"
gridVariant="uniform-all-items-equal"
textboxLayout="default"
useInvertedBackground={false}
gridVariant="uniform-all-items-equal"
animationType="slide-up"
metrics={[
{ id: "1", value: "150+", description: "Websites Created" },
{ id: "2", value: "3x", description: "Average Lead Increase" },
{ id: "3", value: "98%", description: "Client Satisfaction" },
{ id: "4", value: "50K+", description: "Leads Generated for Clients" },
]}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardThirteen
title="What Our Clients Say"
description="Hear from service business owners who've transformed their online presence."
tag="Testimonials"
tagIcon={Quote}
tagAnimation="slide-up"
<div id="team" data-section="team">
<TeamCardOne
members={[
{
id: "1", name: "Sarah Johnson", role: "Lead Designer", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Sarah Johnson"
},
{
id: "2", name: "Michael Chen", role: "Founder & CEO", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Michael Chen"
},
{
id: "3", name: "Emily Rodriguez", role: "Patient Experience Lead", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Emily Rodriguez"
},
{
id: "4", name: "David Park", role: "Technical Director", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "David Park"
}
]}
title="Meet Our Team"
description="Experts dedicated to your success"
textboxLayout="default"
useInvertedBackground={false}
showRating={true}
gridVariant="four-items-2x2-equal-grid"
animationType="slide-up"
testimonials={[
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
faqs={[
{
id: "1", name: "Mike Rodriguez", handle: "Owner, Rodriguez Plumbing", testimonial: "Webbug transformed our online presence. Within 3 months, we were getting 3x more lead inquiries through our website. Professional team, great communication, and results that exceeded expectations.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/handsome-black-man-posing-public-library_74855-1939.jpg?_wi=2", imageAlt: "Mike Rodriguez"
id: "1", title: "Is my patient data secure?", content: "Yes, all our websites are HIPAA compliant and use industry-leading security standards to protect sensitive patient information."
},
{
id: "2", name: "Sarah Chen", handle: "CEO, BuildRight Construction", testimonial: "We were looking for a web design company that understood the construction industry. Webbug nailed it. The website looks fantastic and has significantly increased our customer inquiries.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-posing_23-2148924772.jpg?_wi=2", imageAlt: "Sarah Chen"
id: "2", title: "How long does it take to build a website?", content: "Typical websites are completed within 4-6 weeks, depending on complexity and your requirements."
},
{
id: "3", name: "David Thompson", handle: "Manager, Clean Sweep Services", testimonial: "Our new website is beautiful, easy to navigate, and actually brings in customers. The team was responsive, professional, and delivered on time. Highly recommend Webbug!", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/elegant-businessman-with-document_1098-294.jpg?_wi=2", imageAlt: "David Thompson"
id: "3", title: "Do you provide ongoing support?", content: "Yes, we offer 24/7 technical support and maintenance packages to keep your website running smoothly."
},
{
id: "4", name: "Jennifer Martinez", handle: "Owner, Martinez HVAC", testimonial: "Best decision we made for our business. Webbug took the time to understand our services and created a website that converts. Our phone has been ringing non-stop!", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/friendly-successful-business-woman-posing-with-arms-crossed_74855-2813.jpg", imageAlt: "Jennifer Martinez"
},
id: "4", title: "Can you integrate with our current systems?", content: "Absolutely. We can integrate with EMR systems, appointment scheduling software, and other healthcare platforms."
}
]}
imageSrc="/placeholders/placeholder1.webp"
imageAlt="FAQ support"
title="Frequently Asked Questions"
description="Find answers to common questions about our services"
textboxLayout="default"
useInvertedBackground={false}
mediaPosition="left"
mediaAnimation="none"
faqsAnimation="slide-up"
buttons={[
{ text: "Still have questions?", href: "contact" }
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
title="Need a Website That Brings You Customers?"
description="Let's discuss your project and create a website that drives real results for your business."
useInvertedBackground={false}
inputs={[
{ name: "name", type: "text", placeholder: "Your Name", required: true },
{ name: "email", type: "email", placeholder: "Your Email", required: true },
{ name: "business", type: "text", placeholder: "Business Name", required: true },
{ name: "phone", type: "tel", placeholder: "Phone Number", required: true },
<ContactFaq
faqs={[
{
id: "1", title: "What makes your designs HIPAA compliant?", content: "We follow strict HIPAA guidelines including data encryption, secure authentication, and audit logging to ensure all patient information is protected."
},
{
id: "2", title: "How do you handle website updates?", content: "We provide regular updates for security patches, plugin updates, and performance optimization. Monthly maintenance is included with our plans."
},
{
id: "3", title: "Can you help with patient acquisition?", content: "Yes, our SEO and patient portal features are designed to help attract and retain patients through improved online visibility and engagement."
}
]}
textarea={{
name: "message", placeholder: "Tell us about your project and business goals...", rows: 5,
required: true,
}}
imageSrc="http://img.b2bpic.net/free-photo/business-leader-professional-office-strategizing-development-success_482257-124038.jpg"
imageAlt="Professional team working on project"
mediaAnimation="blur-reveal"
mediaPosition="right"
buttonText="Start Your Project"
ctaTitle="Schedule Your Free Consultation"
ctaDescription="Let's discuss how we can help your practice grow online"
ctaButton={{ text: "Book a Call", href: "https://calendly.com" }}
ctaIcon={Phone}
useInvertedBackground={false}
animationType="slide-up"
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Webbug"
copyrightText="© 2025 Webbug. All rights reserved."
socialLinks={[
{
icon: Facebook,
href: "https://facebook.com/webbugnow", ariaLabel: "Facebook"
},
]}
/>
</div>
<FooterBaseCard
logoText="Webbug"
columns={[
{
title: "Product", items: [
{ label: "Website Design", href: "services" },
{ label: "Patient Portal", href: "services" },
{ label: "SEO Services", href: "services" },
{ label: "Pricing", href: "pricing" }
]
},
{
title: "Company", items: [
{ label: "About Us", href: "about" },
{ label: "Team", href: "team" },
{ label: "Blog", href: "/" },
{ label: "Contact", href: "contact" }
]
},
{
title: "Resources", items: [
{ label: "Documentation", href: "/" },
{ label: "Support", href: "contact" },
{ label: "FAQ", href: "faq" },
{ label: "Privacy Policy", href: "/" }
]
}
]}
copyrightText="© 2025 Webbug | Professional Web Design for Healthcare"
/>
</ThemeProvider>
);
}
}

View File

@@ -10,15 +10,15 @@
--accent: #ffffff;
--background-accent: #ffffff; */
--background: #fcf6ec;
--card: #f3ede2;
--foreground: #2e2521;
--primary-cta: #2e2521;
--primary-cta-text: #fcf6ec;
--background: #f5faff;
--card: #f1f8ff;
--foreground: #001122;
--primary-cta: #15479c;
--primary-cta-text: #f5faff;
--secondary-cta: #ffffff;
--secondary-cta-text: #2e2521;
--accent: #b2a28b;
--background-accent: #b2a28b;
--secondary-cta-text: #001122;
--accent: #a8cce8;
--background-accent: #7ba3cf;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);