Merge version_1 into main #2
370
src/app/page.tsx
370
src/app/page.tsx
@@ -31,22 +31,10 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Portfolio",
|
||||
id: "#portfolio",
|
||||
},
|
||||
{
|
||||
name: "Process",
|
||||
id: "#process",
|
||||
},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "#pricing",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
{ name: "Portfolio", id: "#portfolio" },
|
||||
{ name: "Process", id: "#process" },
|
||||
{ name: "Pricing", id: "#pricing" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="Studio Morocco"
|
||||
/>
|
||||
@@ -57,76 +45,35 @@ export default function LandingPage() {
|
||||
title="Websites That Make Businesses Look Expensive — And Sell Better."
|
||||
description="We design high-converting websites for restaurants, clinics, agencies, gyms and salons that want to look premium and turn visitors into customers."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get a Free Website Audit",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
text: "View Demo Projects",
|
||||
href: "#portfolio",
|
||||
},
|
||||
{ text: "Get a Free Website Audit", href: "#contact" },
|
||||
{ text: "View Demo Projects", href: "#portfolio" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/row-identical-laptops-monochrome-light-corporate-teams-digital-device-fleet_169016-70819.jpg?_wi=1"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/row-identical-laptops-monochrome-light-corporate-teams-digital-device-fleet_169016-70819.jpg"
|
||||
imageAlt="Professional website agency mockup"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/web-design-user-interface-concept_53876-120767.jpg",
|
||||
alt: "Client profile 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-it-remote-employee-writing-code-using-mockup-notebook_482257-116241.jpg",
|
||||
alt: "Client profile 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/laptop-with-copy-space-display-empty-desk-performance-metrics_482257-126532.jpg",
|
||||
alt: "Client profile 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/arabic-laptop-front-side_187299-38055.jpg",
|
||||
alt: "Client profile 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/man-restaurant-concentrating-laptop_23-2147826852.jpg",
|
||||
alt: "Client profile 5",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/web-design-user-interface-concept_53876-120767.jpg", alt: "Client profile 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/close-up-it-remote-employee-writing-code-using-mockup-notebook_482257-116241.jpg", alt: "Client profile 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/laptop-with-copy-space-display-empty-desk-performance-metrics_482257-126532.jpg", alt: "Client profile 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/arabic-laptop-front-side_187299-38055.jpg", alt: "Client profile 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/man-restaurant-concentrating-laptop_23-2147826852.jpg", alt: "Client profile 5" },
|
||||
]}
|
||||
avatarText="Trusted by 50+ local businesses"
|
||||
testimonials={[
|
||||
{
|
||||
name: "Sarah Miller",
|
||||
handle: "@sarahsmiller",
|
||||
testimonial: "The design quality is unmatched. My restaurant bookings doubled within the first month of the new site.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-restaurant-concentrating-laptop_23-2147826852.jpg",
|
||||
},
|
||||
name: "Sarah Miller", handle: "@sarahsmiller", testimonial: "The design quality is unmatched. My restaurant bookings doubled within the first month of the new site.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-restaurant-concentrating-laptop_23-2147826852.jpg"},
|
||||
{
|
||||
name: "Dr. James Aris",
|
||||
handle: "@drjamesaris",
|
||||
testimonial: "Finally, a website that looks professional and builds trust with my patients. Seamless experience.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/health-specialist-showing-horizontal-greenscreen-tablet-patient-looking-display-mockup-isolated-template-with-blank-copyspace-chroma-key-background-gadget-close-up_482257-45685.jpg",
|
||||
},
|
||||
name: "Dr. James Aris", handle: "@drjamesaris", testimonial: "Finally, a website that looks professional and builds trust with my patients. Seamless experience.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/health-specialist-showing-horizontal-greenscreen-tablet-patient-looking-display-mockup-isolated-template-with-blank-copyspace-chroma-key-background-gadget-close-up_482257-45685.jpg"},
|
||||
{
|
||||
name: "Elena Rossi",
|
||||
handle: "@elena_rossi",
|
||||
testimonial: "Studio Morocco made my architecture portfolio look world-class. The attention to detail is superb.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/architecture-real-estate-building-concept_53876-124771.jpg",
|
||||
},
|
||||
name: "Elena Rossi", handle: "@elena_rossi", testimonial: "Studio Morocco made my architecture portfolio look world-class. The attention to detail is superb.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/architecture-real-estate-building-concept_53876-124771.jpg"},
|
||||
{
|
||||
name: "Mark Thornton",
|
||||
handle: "@thorntonfitness",
|
||||
testimonial: "High-converting, sleek, and fast. My gym sign-ups have increased significantly since launch.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/build-body-daily-workout-concept_53876-13877.jpg",
|
||||
},
|
||||
name: "Mark Thornton", handle: "@thorntonfitness", testimonial: "High-converting, sleek, and fast. My gym sign-ups have increased significantly since launch.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/build-body-daily-workout-concept_53876-13877.jpg"},
|
||||
{
|
||||
name: "Linda Vance",
|
||||
handle: "@lvancebeauty",
|
||||
testimonial: "The booking system integrated perfectly. My clients love the elegant, feminine aesthetic.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-beauty-women-elegent-enjoy-concept_53876-132577.jpg",
|
||||
},
|
||||
name: "Linda Vance", handle: "@lvancebeauty", testimonial: "The booking system integrated perfectly. My clients love the elegant, feminine aesthetic.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-beauty-women-elegent-enjoy-concept_53876-132577.jpg"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -148,65 +95,33 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Business Website",
|
||||
description: "Professional hub for your brand.",
|
||||
icon: Globe,
|
||||
title: "Business Website", description: "Professional hub for your brand.", icon: Globe,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-nutritional-counter-app-composition_23-2149880622.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/laptop-with-replaceable-screen-hospital-cabinet-doctor-wearing-coat-arriving-health-clinic-nurse-writing-prescription-notebook-with-green-screen-medic-clinic_482257-3034.jpg",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/row-identical-laptops-monochrome-light-corporate-teams-digital-device-fleet_169016-70819.jpg?_wi=2",
|
||||
imageAlt: "cafe website mockup UI",
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/high-angle-nutritional-counter-app-composition_23-2149880622.jpg" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/laptop-with-replaceable-screen-hospital-cabinet-doctor-wearing-coat-arriving-health-clinic-nurse-writing-prescription-notebook-with-green-screen-medic-clinic_482257-3034.jpg" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Landing Page",
|
||||
description: "High-conversion single page focus.",
|
||||
icon: Zap,
|
||||
title: "Landing Page", description: "High-conversion single page focus.", icon: Zap,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/real-estate-accommodation-property-investment-graphic-word_53876-124687.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-laptop-seaside_23-2148968962.jpg",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/still-life-device-table_23-2150994346.jpg",
|
||||
imageAlt: "cafe website mockup UI",
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/real-estate-accommodation-property-investment-graphic-word_53876-124687.jpg" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-laptop-seaside_23-2148968962.jpg" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Booking Website",
|
||||
description: "Seamless scheduling for your services.",
|
||||
icon: Calendar,
|
||||
title: "Booking Website", description: "Seamless scheduling for your services.", icon: Calendar,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beauty-salon-with-cosmetology-equipment-anime-style_23-2151500977.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-korean-woman-making-toast-watching-video-digital-tablet-looking-screen_1258-190989.jpg",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/dentist-pointing-digital-tablet-screen-female-patient-sitting-chair_23-2147879187.jpg",
|
||||
imageAlt: "cafe website mockup UI",
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/beauty-salon-with-cosmetology-equipment-anime-style_23-2151500977.jpg" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-korean-woman-making-toast-watching-video-digital-tablet-looking-screen_1258-190989.jpg" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Website Redesign",
|
||||
description: "Modernize your existing presence.",
|
||||
icon: RefreshCw,
|
||||
title: "Website Redesign", description: "Modernize your existing presence.", icon: RefreshCw,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/coffee-relaxation-beverage-planning-data-digital-concept_53876-63189.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/homepage-seen-laptop-screen_23-2149416731.jpg?_wi=1",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/real-estate-accommodation-property-investment-graphic-word_53876-127370.jpg?_wi=1",
|
||||
imageAlt: "cafe website mockup UI",
|
||||
},
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/coffee-relaxation-beverage-planning-data-digital-concept_53876-63189.jpg" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/homepage-seen-laptop-screen_23-2149416731.jpg" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
title="We turn your online presence into a sales asset."
|
||||
description="Our solutions are tailored to local business needs, focusing on trust and conversion."
|
||||
@@ -220,48 +135,12 @@ export default function LandingPage() {
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Premium Café Redesign",
|
||||
price: "Concept Project",
|
||||
variant: "Hospitality",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/coffee-relaxation-beverage-planning-data-digital-concept_53876-63189.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Dental Clinic Landing",
|
||||
price: "Demo Redesign",
|
||||
variant: "Medical",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/homepage-seen-laptop-screen_23-2149416731.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Real Estate Agency",
|
||||
price: "Concept Project",
|
||||
variant: "Real Estate",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/real-estate-accommodation-property-investment-graphic-word_53876-127370.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Fitness Coach Booking",
|
||||
price: "Sample Case Study",
|
||||
variant: "Wellness",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-training-with-laptop_23-2150384088.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Architecture Portfolio",
|
||||
price: "Concept Project",
|
||||
variant: "Studio",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/architects-working-project_53876-46878.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Beauty Salon Booking",
|
||||
price: "Demo Redesign",
|
||||
variant: "Beauty",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/appointment-booking-landing-page_23-2148552092.jpg",
|
||||
},
|
||||
{ id: "p1", name: "Premium Café Redesign", price: "Concept Project", variant: "Hospitality", imageSrc: "http://img.b2bpic.net/free-photo/coffee-relaxation-beverage-planning-data-digital-concept_53876-63189.jpg" },
|
||||
{ id: "p2", name: "Dental Clinic Landing", price: "Demo Redesign", variant: "Medical", imageSrc: "http://img.b2bpic.net/free-photo/homepage-seen-laptop-screen_23-2149416731.jpg" },
|
||||
{ id: "p3", name: "Real Estate Agency", price: "Concept Project", variant: "Real Estate", imageSrc: "http://img.b2bpic.net/free-photo/real-estate-accommodation-property-investment-graphic-word_53876-127370.jpg" },
|
||||
{ id: "p4", name: "Fitness Coach Booking", price: "Sample Case Study", variant: "Wellness", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-training-with-laptop_23-2150384088.jpg" },
|
||||
{ id: "p5", name: "Architecture Portfolio", price: "Concept Project", variant: "Studio", imageSrc: "http://img.b2bpic.net/free-photo/architects-working-project_53876-46878.jpg" },
|
||||
{ id: "p6", name: "Beauty Salon Booking", price: "Demo Redesign", variant: "Beauty", imageSrc: "http://img.b2bpic.net/free-vector/appointment-booking-landing-page_23-2148552092.jpg" },
|
||||
]}
|
||||
title="Concept Demo Projects"
|
||||
description="Built to demonstrate our process and capabilities."
|
||||
@@ -274,56 +153,11 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "01",
|
||||
title: "Audit",
|
||||
items: [
|
||||
"Deep dive into current site",
|
||||
"Competitor research",
|
||||
"Identify growth opportunities",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "02",
|
||||
title: "Strategy",
|
||||
items: [
|
||||
"Define business goals",
|
||||
"Target audience analysis",
|
||||
"Conversion path design",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "03",
|
||||
title: "Design",
|
||||
items: [
|
||||
"Premium interface mockups",
|
||||
"Modern brand alignment",
|
||||
"User experience focus",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "m4",
|
||||
value: "04",
|
||||
title: "Build",
|
||||
items: [
|
||||
"Responsive web development",
|
||||
"Performance optimization",
|
||||
"SEO foundations",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "m5",
|
||||
value: "05",
|
||||
title: "Launch",
|
||||
items: [
|
||||
"Deployment & testing",
|
||||
"Quality assurance",
|
||||
"Final handover & support",
|
||||
],
|
||||
},
|
||||
{ id: "m1", value: "01", title: "Audit", items: ["Deep dive into current site", "Competitor research", "Identify growth opportunities"] },
|
||||
{ id: "m2", value: "02", title: "Strategy", items: ["Define business goals", "Target audience analysis", "Conversion path design"] },
|
||||
{ id: "m3", value: "03", title: "Design", items: ["Premium interface mockups", "Modern brand alignment", "User experience focus"] },
|
||||
{ id: "m4", value: "04", title: "Build", items: ["Responsive web development", "Performance optimization", "SEO foundations"] },
|
||||
{ id: "m5", value: "05", title: "Launch", items: ["Deployment & testing", "Quality assurance", "Final handover & support"] },
|
||||
]}
|
||||
title="Simple process. Fast delivery."
|
||||
description="Our five-step framework ensures quality, clarity, and speed."
|
||||
@@ -336,60 +170,9 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "starter",
|
||||
tag: "Starter",
|
||||
period: "once",
|
||||
price: "Starting from $999",
|
||||
description: "Professional entry-level presence.",
|
||||
button: {
|
||||
text: "Get Quote",
|
||||
href: "#contact",
|
||||
},
|
||||
featuresTitle: "Includes:",
|
||||
features: [
|
||||
"1-3 pages",
|
||||
"Responsive design",
|
||||
"Contact form",
|
||||
"WhatsApp button",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "growth",
|
||||
tag: "Growth",
|
||||
period: "once",
|
||||
price: "Starting from $1,999",
|
||||
description: "Lead-focused digital growth.",
|
||||
button: {
|
||||
text: "Get Quote",
|
||||
href: "#contact",
|
||||
},
|
||||
featuresTitle: "Everything in Starter, plus:",
|
||||
features: [
|
||||
"4-6 pages",
|
||||
"SEO Basics",
|
||||
"Booking/contact flow",
|
||||
"Analytics setup",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "premium",
|
||||
tag: "Premium",
|
||||
period: "once",
|
||||
price: "Starting from $3,499",
|
||||
description: "Full-service digital system.",
|
||||
button: {
|
||||
text: "Get Quote",
|
||||
href: "#contact",
|
||||
},
|
||||
featuresTitle: "Everything in Growth, plus:",
|
||||
features: [
|
||||
"Landing page strategy",
|
||||
"Brand direction",
|
||||
"SEO structure",
|
||||
"Content guidance",
|
||||
],
|
||||
},
|
||||
{ id: "starter", tag: "Starter", period: "once", price: "Starting from $999", description: "Professional entry-level presence.", button: { text: "Get Quote", href: "#contact" }, featuresTitle: "Includes:", features: ["1-3 pages", "Responsive design", "Contact form", "WhatsApp button"] },
|
||||
{ id: "growth", tag: "Growth", period: "once", price: "Starting from $1,999", description: "Lead-focused digital growth.", button: { text: "Get Quote", href: "#contact" }, featuresTitle: "Everything in Starter, plus:", features: ["4-6 pages", "SEO Basics", "Booking/contact flow", "Analytics setup"] },
|
||||
{ id: "premium", tag: "Premium", period: "once", price: "Starting from $3,499", description: "Full-service digital system.", button: { text: "Get Quote", href: "#contact" }, featuresTitle: "Everything in Growth, plus:", features: ["Landing page strategy", "Brand direction", "SEO structure", "Content guidance"] },
|
||||
]}
|
||||
title="Flexible Service Packages"
|
||||
description="Professional web systems tailored to your needs."
|
||||
@@ -409,18 +192,11 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
background={{ variant: "radial-gradient" }}
|
||||
tag="FREE AUDIT"
|
||||
title="Want to know what your website is costing you?"
|
||||
description="Get a custom audit to see how we can improve your conversion and customer trust."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Free Website Audit",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Get Free Website Audit", href: "#" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -429,37 +205,17 @@ export default function LandingPage() {
|
||||
logoText="Studio Morocco"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation",
|
||||
items: [
|
||||
{
|
||||
label: "Portfolio",
|
||||
href: "#portfolio",
|
||||
},
|
||||
{
|
||||
label: "Process",
|
||||
href: "#process",
|
||||
},
|
||||
{
|
||||
label: "Pricing",
|
||||
href: "#pricing",
|
||||
},
|
||||
title: "Navigation", items: [
|
||||
{ label: "Portfolio", href: "#portfolio" },
|
||||
{ label: "Process", href: "#process" },
|
||||
{ label: "Pricing", href: "#pricing" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
{
|
||||
label: "WhatsApp",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Email",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Instagram",
|
||||
href: "#",
|
||||
},
|
||||
title: "Contact", items: [
|
||||
{ label: "WhatsApp", href: "#" },
|
||||
{ label: "Email", href: "#" },
|
||||
{ label: "Instagram", href: "#" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
Reference in New Issue
Block a user