bender/64f09bed-a46b-4b63-adc7-bd1db4fc3623
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_2 into main

Browse Source 
Merge version_2 into main
This commit was merged in pull request #1.
This commit is contained in:
bender
2026-03-31 21:20:29 +00:00
parent 90b40e6a42 448525b958
commit 1c1cdb6aab
5 changed files with 95 additions and 516 deletions
Download Patch File Download Diff File Expand all files Collapse all files

140
src/app/about/page.tsx
View File

@@ -1,127 +1,29 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import SplitAbout from '@/components/sections/about/SplitAbout';
import TeamCardTwo from '@/components/sections/team/TeamCardTwo';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import { Users } from "lucide-react";
export default function LandingPage() {
export default function AboutPage() {
return (
<ThemeProvider
defaultButtonVariant="expand-hover"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="mediumLarge"
sizing="mediumLarge"
background="grid"
cardStyle="soft-shadow"
primaryButtonStyle="gradient"
secondaryButtonStyle="radial-glow"
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{
name: "Home",
id: "/",
},
{
name: "Services",
id: "/services",
},
{
name: "About",
id: "/about",
},
{
name: "Contact",
id: "/contact",
},
]}
brandName="Masi Digital"
button={{
text: "Get a Free Preview",
href: "/contact",
}}
/>
</div>
<div id="about" data-section="about">
<SplitAbout
textboxLayout="default"
useInvertedBackground={false}
title="Built for Growth"
description="Masi Digital was founded to bridge the gap between aesthetic design and technical lead generation."
bulletPoints={[
{
title: "Local Focus",
description: "We understand the Long Island market.",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-woman-working-interior-design-project_23-2150346478.jpg"
mediaAnimation="opacity"
/>
</div>
<div id="team" data-section="team">
<TeamCardTwo
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
title="Our Leadership"
description="Meet the team building your future."
members={[
{
id: "t1",
name: "Masi Team",
role: "Digital Strategists",
description: "Focused on your success.",
imageSrc: "http://img.b2bpic.net/free-photo/happy-successful-business-leader-posing_1262-21162.jpg",
},
]}
/>
</div>
<div id="footer" data-section="footer">
<ThemeProvider>
<NavbarLayoutFloatingOverlay
navItems={[{ name: "Home", id: "/" }, { name: "Services", id: "/services" }, { name: "About", id: "/about" }, { name: "Contact", id: "/contact" }]}
brandName="Masi Digital"
button={{ text: "Get a Free Preview", href: "/contact" }}
/>
<TestimonialAboutCard
tag="Our Story"
title="Built for Long Island Businesses"
description="Masi Digital was founded on the principle that local businesses deserve the same technical sophistication as global corporations."
subdescription="We combine modern web design with cutting-edge AI systems to save you time and maximize revenue."
icon={Users}
/>
<FooterBaseCard
logoText="Masi Digital"
columns={[
{
title: "Links",
items: [
{
label: "Services",
href: "/services",
},
{
label: "About",
href: "/about",
},
{
label: "Contact",
href: "/contact",
},
],
},
{
title: "Contact",
items: [
{
label: "masidigitalco@gmail.com",
href: "mailto:masidigitalco@gmail.com",
},
],
},
]}
copyrightText="© 2025 Masi Digital. All Rights Reserved."
/>
</div>
</ReactLenis>
logoText="Masi Digital"
columns={[{ title: "Links", items: [{ label: "Home", href: "/" }, { label: "Services", href: "/services" }, { label: "Contact", href: "/contact" }] }]}
/>
</ThemeProvider>
);
}
}

134
src/app/contact/page.tsx
View File

@@ -1,119 +1,31 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FaqBase from '@/components/sections/faq/FaqBase';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import { Mail } from "lucide-react";
export default function LandingPage() {
export default function ContactPage() {
return (
<ThemeProvider
defaultButtonVariant="expand-hover"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="mediumLarge"
sizing="mediumLarge"
background="grid"
cardStyle="soft-shadow"
primaryButtonStyle="gradient"
secondaryButtonStyle="radial-glow"
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{
name: "Home",
id: "/",
},
{
name: "Services",
id: "/services",
},
{
name: "About",
id: "/about",
},
{
name: "Contact",
id: "/contact",
},
]}
brandName="Masi Digital"
button={{
text: "Get a Free Preview",
href: "/contact",
}}
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
useInvertedBackground={false}
background={{
variant: "plain",
}}
tag="Get in touch"
title="Start Your Project"
description="Let's talk about how to get you more customers."
/>
</div>
<div id="faq" data-section="faq">
<FaqBase
textboxLayout="default"
useInvertedBackground={false}
title="Quick Answers"
description="Don't see your question? Email us."
faqsAnimation="opacity"
faqs={[
{
id: "c1",
title: "Can I get a custom quote?",
content: "Yes, contact us via email.",
},
]}
/>
</div>
<div id="footer" data-section="footer">
<ThemeProvider>
<NavbarLayoutFloatingOverlay
navItems={[{ name: "Home", id: "/" }, { name: "Services", id: "/services" }, { name: "About", id: "/about" }, { name: "Contact", id: "/contact" }]}
brandName="Masi Digital"
button={{ text: "Get a Free Preview", href: "/contact" }}
/>
<ContactFaq
ctaTitle="Ready to transform your business?"
ctaDescription="Send us a quick message to discuss your digital needs."
ctaButton={{ text: "Email Us", href: "mailto:masidigitalco@gmail.com" }}
ctaIcon={Mail}
animationType="slide-up"
useInvertedBackground={false}
faqs={[{ id: "1", title: "How do we get started?", content: "Contact us today and we'll setup a free discovery call." }]}
/>
<FooterBaseCard
logoText="Masi Digital"
columns={[
{
title: "Links",
items: [
{
label: "Services",
href: "/services",
},
{
label: "About",
href: "/about",
},
{
label: "Contact",
href: "/contact",
},
],
},
{
title: "Contact",
items: [
{
label: "masidigitalco@gmail.com",
href: "mailto:masidigitalco@gmail.com",
},
],
},
]}
copyrightText="© 2025 Masi Digital. All Rights Reserved."
/>
</div>
</ReactLenis>
logoText="Masi Digital"
columns={[{ title: "Links", items: [{ label: "Home", href: "/" }, { label: "Services", href: "/services" }, { label: "About", href: "/about" }] }]}
/>
</ThemeProvider>
);
}
}

180
src/app/page.tsx
View File

@@ -29,70 +29,29 @@ export default function LandingPage() {
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{
name: "Home",
id: "/",
},
{
name: "Services",
id: "/services",
},
{
name: "About",
id: "/about",
},
{
name: "Contact",
id: "/contact",
},
{ name: "Home", id: "/" },
{ name: "Services", id: "/services" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
]}
brandName="Masi Digital"
button={{
text: "Get a Free Preview",
href: "/contact",
}}
button={{ text: "Get a Free Preview", href: "/contact" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardCarousel
background={{
variant: "plain",
}}
background={{ variant: "plain" }}
title="Your Business Is Losing Customers Right Now."
description="Every day without a professional website is a day someone searches for your business and calls your competitor instead. Masi Digital changes that."
tag="WEB DESIGN · AUTOMATION · AI"
buttons={[
{
text: "Get a Free Preview",
href: "/contact",
},
{
text: "masidigitalco@gmail.com",
href: "mailto:masidigitalco@gmail.com",
},
{ text: "Get a Free Preview", href: "/contact" },
{ text: "masidigitalco@gmail.com", href: "mailto:masidigitalco@gmail.com" },
]}
mediaItems={[
{
imageSrc: "http://img.b2bpic.net/free-vector/business-landing-page-template-with-photo_52683-19826.jpg",
imageAlt: "Typography driven visual",
},
{
imageSrc: "http://img.b2bpic.net/free-vector/dashboard-user-panel-template_52683-31485.jpg",
imageAlt: "Modern web dashboard",
},
{
imageSrc: "http://img.b2bpic.net/free-vector/bright-wavy-lines-black-background_1035-6329.jpg",
imageAlt: "AI automation flow",
},
{
imageSrc: "http://img.b2bpic.net/free-vector/furniture-shopping-app-design_23-2148646512.jpg",
imageAlt: "Mobile responsive preview",
},
{
imageSrc: "http://img.b2bpic.net/free-vector/business-landing-page-template-with-photo_52683-19804.jpg",
imageAlt: "Conversion focused layout",
},
{ imageSrc: "http://img.b2bpic.net/free-vector/business-landing-page-template-with-photo_52683-19826.jpg", imageAlt: "Typography driven visual" },
{ imageSrc: "http://img.b2bpic.net/free-vector/dashboard-user-panel-template_52683-31485.jpg", imageAlt: "Modern web dashboard" },
]}
/>
</div>
@@ -103,57 +62,8 @@ export default function LandingPage() {
textboxLayout="default"
useInvertedBackground={false}
plans={[
{
id: "tier1",
badge: "TIER 01",
price: "Starting at $1,000",
subtitle: "Professional Website",
buttons: [
{
text: "See what's included",
href: "/services",
},
],
features: [
"Professional design",
"Mobile responsive",
"Local SEO setup",
],
},
{
id: "tier2",
badge: "TIER 02 — MOST POPULAR",
price: "Starting at $1,000",
subtitle: "Website + Lead Automation",
buttons: [
{
text: "See what's included",
href: "/services",
},
],
features: [
"Everything in Tier 1",
"Instant automated text",
"Full CRM dashboard",
],
},
{
id: "tier3",
badge: "TIER 03 — FULL SYSTEM",
price: "Starting at $1,000",
subtitle: "The Full System",
buttons: [
{
text: "See what's included",
href: "/services",
},
],
features: [
"Everything in Tier 2",
"AI Receptionist 24/7",
"Automated Booking",
],
},
{ id: "tier1", badge: "TIER 01", price: "Starting at $1,000", subtitle: "Professional Website", buttons: [{ text: "See what's included", href: "/services" }], features: ["Professional design", "Mobile responsive", "Local SEO setup"] },
{ id: "tier2", badge: "TIER 02 — MOST POPULAR", price: "Starting at $1,000", subtitle: "Website + Lead Automation", buttons: [{ text: "See what's included", href: "/services" }], features: ["Everything in Tier 1", "Instant automated text", "Full CRM dashboard"] },
]}
title="Three Levels. One Goal. More Jobs."
description="You do the work. We make sure the phone never stops ringing."
@@ -166,13 +76,7 @@ export default function LandingPage() {
useInvertedBackground={false}
title="Trusted by Local Leaders"
description="We partner with businesses that demand excellence and results."
names={[
"Long Island HVAC",
"Metro Construction",
"Elite Landscaping",
"Island Auto Repair",
"Coastal Plumbing",
]}
names={["Long Island HVAC", "Metro Construction", "Elite Landscaping", "Island Auto Repair", "Coastal Plumbing"]}
/>
</div>
@@ -184,16 +88,8 @@ export default function LandingPage() {
description="Everything you need to know about our digital transformation process."
faqsAnimation="slide-up"
faqs={[
{
id: "f1",
title: "How long does a website take?",
content: "Most projects are completed within 2 to 4 weeks depending on complexity.",
},
{
id: "f2",
title: "Do you offer SEO?",
content: "Yes, we build every site with local SEO best practices to ensure you get found.",
},
{ id: "f1", title: "How long does a website take?", content: "Most projects are completed within 2 to 4 weeks depending on complexity." },
{ id: "f2", title: "Do you offer SEO?", content: "Yes, we build every site with local SEO best practices to ensure you get found." },
]}
/>
</div>
@@ -207,20 +103,8 @@ export default function LandingPage() {
title="Real World Results"
description="We don't just build sites; we build high-performing business engines."
metrics={[
{
id: "m1",
value: "2x",
title: "Lead Volume",
description: "Average increase in inquiries",
icon: TrendingUp,
},
{
id: "m2",
value: "90%",
title: "Automation",
description: "Task reduction for owners",
icon: Star,
},
{ id: "m1", value: "2x", title: "Lead Volume", description: "Average increase in inquiries", icon: TrendingUp },
{ id: "m2", value: "90%", title: "Automation", description: "Task reduction for owners", icon: Star },
]}
/>
</div>
@@ -229,32 +113,8 @@ export default function LandingPage() {
<FooterBaseCard
logoText="Masi Digital"
columns={[
{
title: "Links",
items: [
{
label: "Services",
href: "/services",
},
{
label: "About",
href: "/about",
},
{
label: "Contact",
href: "/contact",
},
],
},
{
title: "Contact",
items: [
{
label: "masidigitalco@gmail.com",
href: "mailto:masidigitalco@gmail.com",
},
],
},
{ title: "Links", items: [{ label: "Services", href: "/services" }, { label: "About", href: "/about" }, { label: "Contact", href: "/contact" }] },
{ title: "Contact", items: [{ label: "masidigitalco@gmail.com", href: "mailto:masidigitalco@gmail.com" }] },
]}
copyrightText="© 2025 Masi Digital. All Rights Reserved."
/>
@@ -262,4 +122,4 @@ export default function LandingPage() {
</ReactLenis>
</ThemeProvider>
);
}
}

145
src/app/services/page.tsx
View File

@@ -1,128 +1,33 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import SplitAbout from '@/components/sections/about/SplitAbout';
import { Globe } from "lucide-react";
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import { ChevronRight } from "lucide-react";
export default function LandingPage() {
export default function ServicesPage() {
return (
<ThemeProvider
defaultButtonVariant="expand-hover"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="mediumLarge"
sizing="mediumLarge"
background="grid"
cardStyle="soft-shadow"
primaryButtonStyle="gradient"
secondaryButtonStyle="radial-glow"
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{
name: "Home",
id: "/",
},
{
name: "Services",
id: "/services",
},
{
name: "About",
id: "/about",
},
{
name: "Contact",
id: "/contact",
},
]}
brandName="Masi Digital"
button={{
text: "Get a Free Preview",
href: "/contact",
}}
/>
</div>
<div id="about" data-section="about">
<SplitAbout
textboxLayout="default"
useInvertedBackground={false}
title="Tailored Web Solutions"
description="High-conversion web design matched with intelligent automation systems."
bulletPoints={[
{
title: "Clean Design",
description: "Minimalist UI that drives action.",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/employee-office-leaving-desk-present-revenue-figures-tablet_482257-126652.jpg"
mediaAnimation="slide-up"
/>
</div>
<div id="metric" data-section="metric">
<MetricCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
title="Our Services Impact"
description="Quantifiable growth for your business."
metrics={[
{
id: "ms1",
value: "100+",
title: "Web Projects",
description: "Successfully launched",
icon: Globe,
},
]}
/>
</div>
<div id="footer" data-section="footer">
<ThemeProvider>
<NavbarLayoutFloatingOverlay
navItems={[{ name: "Home", id: "/" }, { name: "Services", id: "/services" }, { name: "About", id: "/about" }, { name: "Contact", id: "/contact" }]}
brandName="Masi Digital"
button={{ text: "Get a Free Preview", href: "/contact" }}
/>
<FeatureCardTwentySix
title="Our Core Services"
description="High-impact digital solutions designed for local business growth."
textboxLayout="default"
useInvertedBackground={false}
features={[
{ title: "Professional Web Design", description: "High-converting, responsive websites.", buttonIcon: ChevronRight },
{ title: "Lead Automation", description: "Instant response systems for new inquiries.", buttonIcon: ChevronRight },
{ title: "AI Systems", description: "Intelligent customer service integration.", buttonIcon: ChevronRight }
]}
/>
<FooterBaseCard
logoText="Masi Digital"
columns={[
{
title: "Links",
items: [
{
label: "Services",
href: "/services",
},
{
label: "About",
href: "/about",
},
{
label: "Contact",
href: "/contact",
},
],
},
{
title: "Contact",
items: [
{
label: "masidigitalco@gmail.com",
href: "mailto:masidigitalco@gmail.com",
},
],
},
]}
copyrightText="© 2025 Masi Digital. All Rights Reserved."
/>
</div>
</ReactLenis>
logoText="Masi Digital"
columns={[{ title: "Links", items: [{ label: "Home", href: "/" }, { label: "About", href: "/about" }, { label: "Contact", href: "/contact" }] }]}
/>
</ThemeProvider>
);
}
}

12
src/app/styles/variables.css
View File

@@ -11,14 +11,14 @@
--background-accent: #ffffff; */
--background: #ffffff;
--card: #f9f9f9;
--foreground: #0f172a;
--primary-cta: #3b82f6;
--card: #ffffff;
--foreground: #000b1d;
--primary-cta: #00205b;
--primary-cta-text: #ffffff;
--secondary-cta: #ffffff;
--secondary-cta: #f1f5f9;
--secondary-cta-text: #3b82f6;
--accent: #e2e8f0;
--background-accent: #eff6ff;
--accent: #007bff;
--background-accent: #e0e7ff;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);