Compare commits
3 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| d1982155bd | |||
| 8cf1368416 | |||
| 31622bf6bc |
147
src/app/page.tsx
147
src/app/page.tsx
@@ -2,7 +2,7 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||||
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
|
||||
import FooterCard from '@/components/sections/footer/FooterCard';
|
||||
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
|
||||
@@ -31,25 +31,19 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Services", id: "services"},
|
||||
{
|
||||
name: "Process", id: "process"},
|
||||
{
|
||||
name: "Portfolio", id: "portfolio"},
|
||||
{
|
||||
name: "Pricing", id: "pricing"},
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Process", id: "process" },
|
||||
{ name: "Portfolio", id: "portfolio" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
]}
|
||||
button={{
|
||||
text: "Contact", href: "#contact"}}
|
||||
button={{ text: "Contact", href: "#contact" }}
|
||||
brandName="Marcos Digital Studio"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{
|
||||
variant: "sparkles-gradient"}}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
title="Modern Websites. Built Fast. Designed to Convert."
|
||||
description="I design and rebuild websites for businesses that want a clean, professional online presence — fast, simple, and stress-free."
|
||||
buttons={[
|
||||
@@ -63,7 +57,8 @@ export default function LandingPage() {
|
||||
},
|
||||
{
|
||||
text: "View Work",
|
||||
href: "#portfolio", onClick: () => {
|
||||
href: "#portfolio",
|
||||
onClick: () => {
|
||||
const el = document.getElementById('portfolio');
|
||||
el?.scrollIntoView({ behavior: 'smooth' });
|
||||
}
|
||||
@@ -82,12 +77,9 @@ export default function LandingPage() {
|
||||
title="About Marcos"
|
||||
description="I’m a freelance web designer focused on building clean, modern websites for businesses that need a stronger online presence. My approach is simple: fast communication, clean design, and results-focused work. I keep everything straightforward — no complicated agency process, no delays, just high-quality websites delivered quickly."
|
||||
bulletPoints={[
|
||||
{
|
||||
title: "Fast Communication", description: "Responsive and quick answers."},
|
||||
{
|
||||
title: "Modern Designs", description: "High-converting, clean interfaces."},
|
||||
{
|
||||
title: "Simple Process", description: "No stress, just delivery."},
|
||||
{ title: "Fast Communication", description: "Responsive and quick answers." },
|
||||
{ title: "Modern Designs", description: "High-converting, clean interfaces." },
|
||||
{ title: "Simple Process", description: "No stress, just delivery." },
|
||||
]}
|
||||
imageSrc="https://img.b2bpic.net/free-photo/close-up-glowing-computer-screen_23-2148700057.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
@@ -100,18 +92,9 @@ export default function LandingPage() {
|
||||
textboxLayout="split-description"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
id: "f1", title: "Website Design", author: "Custom Build", description: "Modern, responsive websites built from scratch.", tags: [
|
||||
"New Business", "High Tech"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/bucharest-romania-july-30th-2024-corporate-leader-reading-daily-news-online_482257-116998.jpg"},
|
||||
{
|
||||
id: "f2", title: "Website Redesign", author: "Transformation", description: "Transform outdated websites into high-converting sites.", tags: [
|
||||
"Redesign", "Conversion"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-nutritional-counter-app_23-2149880598.jpg"},
|
||||
{
|
||||
id: "f3", title: "SEO Optimization", author: "Growth", description: "Improve visibility and help customers find you.", tags: [
|
||||
"Visibility", "SEO"],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/gradient-ui-ux-elements_23-2149061049.jpg"},
|
||||
{ id: "f1", title: "Website Design", author: "Custom Build", description: "Modern, responsive websites built from scratch.", tags: ["New Business", "High Tech"], imageSrc: "http://img.b2bpic.net/free-photo/bucharest-romania-july-30th-2024-corporate-leader-reading-daily-news-online_482257-116998.jpg" },
|
||||
{ id: "f2", title: "Website Redesign", author: "Transformation", description: "Transform outdated websites into high-converting sites.", tags: ["Redesign", "Conversion"], imageSrc: "http://img.b2bpic.net/free-photo/top-view-nutritional-counter-app_23-2149880598.jpg" },
|
||||
{ id: "f3", title: "SEO Optimization", author: "Growth", description: "Improve visibility and help customers find you.", tags: ["Visibility", "SEO"], imageSrc: "http://img.b2bpic.net/free-vector/gradient-ui-ux-elements_23-2149061049.jpg" },
|
||||
]}
|
||||
title="Services"
|
||||
description="Premium web design solutions built for your business growth."
|
||||
@@ -124,12 +107,9 @@ export default function LandingPage() {
|
||||
title="Simple 3-Step Process"
|
||||
tag="How I Work"
|
||||
metrics={[
|
||||
{
|
||||
id: "m1", value: "01", description: "Contact me with your project goals."},
|
||||
{
|
||||
id: "m2", value: "02", description: "I design a conversion-focused website."},
|
||||
{
|
||||
id: "m3", value: "03", description: "Launch your new digital home."},
|
||||
{ id: "m1", value: "01", description: "Contact me with your project goals." },
|
||||
{ id: "m2", value: "02", description: "I design a conversion-focused website." },
|
||||
{ id: "m3", value: "03", description: "Launch your new digital home." },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
@@ -141,18 +121,9 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
id: "w1", title: "Fast Turnaround", author: "Efficiency", description: "Fast delivery, no stress.", tags: [
|
||||
"Speed", "Quick"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/mid-section-unrecognizable-man-taking-picture-work-plan-phone_1098-18712.jpg"},
|
||||
{
|
||||
id: "w2", title: "Premium Design", author: "Aesthetics", description: "Looks professional and modern.", tags: [
|
||||
"Design", "High End"],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/flat-design-coworking-app-template_23-2150249509.jpg"},
|
||||
{
|
||||
id: "w3", title: "Simple Pricing", author: "Transparency", description: "One-time payment, no contracts.", tags: [
|
||||
"Pricing", "Clear"],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/modern-infographic-element-collection_52683-1776.jpg"},
|
||||
{ id: "w1", title: "Fast Turnaround", author: "Efficiency", description: "Fast delivery, no stress.", tags: ["Speed", "Quick"], imageSrc: "http://img.b2bpic.net/free-photo/mid-section-unrecognizable-man-taking-picture-work-plan-phone_1098-18712.jpg" },
|
||||
{ id: "w2", title: "Premium Design", author: "Aesthetics", description: "Looks professional and modern.", tags: ["Design", "High End"], imageSrc: "http://img.b2bpic.net/free-vector/flat-design-coworking-app-template_23-2150249509.jpg" },
|
||||
{ id: "w3", title: "Simple Pricing", author: "Transparency", description: "One-time payment, no contracts.", tags: ["Pricing", "Clear"], imageSrc: "http://img.b2bpic.net/free-vector/modern-infographic-element-collection_52683-1776.jpg" },
|
||||
]}
|
||||
title="Why Work With Me?"
|
||||
description="You get a website that looks like a premium agency build — without the agency price."
|
||||
@@ -166,18 +137,12 @@ export default function LandingPage() {
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1", name: "Tech Startup Site", price: "Concept", variant: "Minimal", imageSrc: "https://img.b2bpic.net/premium-photo/digital-technology-global-internet-network-ai-artificial-intelligence-big-data-concept-computer-programmer-software-engineer-coding-laptop-global-network-cyber-security_928174-8320.jpg?id=382220369"},
|
||||
{
|
||||
id: "p2", name: "Local Gym Site", price: "Concept", variant: "Modern", imageSrc: "https://img.b2bpic.net/free-photo/unrecognizable-athletic-woman-tying-sports-shoe-health-club_637285-8468.jpg?id=26402468"},
|
||||
{
|
||||
id: "p3", name: "Real Estate UI", price: "Concept", variant: "Clean", imageSrc: "https://img.b2bpic.net/free-photo/modern-real-estate-website-interface_23-2149806451.jpg"},
|
||||
{
|
||||
id: "p4", name: "Creative Studio", price: "Concept", variant: "Futuristic", imageSrc: "https://img.b2bpic.net/free-vector/architecture-background-design_1168-29.jpg?id=1003664"},
|
||||
{
|
||||
id: "p5", name: "Restaurant Concept", price: "Concept", variant: "Modern", imageSrc: "https://img.b2bpic.net/free-photo/top-view-table-full-food_23-2149209253.jpg?id=21088367"},
|
||||
{
|
||||
id: "p6", name: "SaaS Platform", price: "Concept", variant: "Dark", imageSrc: "https://img.b2bpic.net/free-photo/person-working-relation-innovation_53876-16535.jpg?id=2792075"},
|
||||
{ id: "p1", name: "Tech Startup Site", price: "Concept", variant: "Minimal", imageSrc: "https://img.b2bpic.net/premium-photo/digital-technology-global-internet-network-ai-artificial-intelligence-big-data-concept-computer-programmer-software-engineer-coding-laptop-global-network-cyber-security_928174-8320.jpg?id=382220369" },
|
||||
{ id: "p2", name: "Local Gym Site", price: "Concept", variant: "Modern", imageSrc: "https://img.b2bpic.net/free-photo/unrecognizable-athletic-woman-tying-sports-shoe-health-club_637285-8468.jpg?id=26402468" },
|
||||
{ id: "p3", name: "Real Estate UI", price: "Concept", variant: "Clean", imageSrc: "https://img.b2bpic.net/free-photo/modern-real-estate-website-interface_23-2149806451.jpg" },
|
||||
{ id: "p4", name: "Creative Studio", price: "Concept", variant: "Futuristic", imageSrc: "https://img.b2bpic.net/free-vector/architecture-background-design_1168-29.jpg?id=1003664" },
|
||||
{ id: "p5", name: "Restaurant Concept", price: "Concept", variant: "Modern", imageSrc: "https://img.b2bpic.net/free-photo/top-view-table-full-food_23-2149209253.jpg?id=21088367" },
|
||||
{ id: "p6", name: "SaaS Platform", price: "Concept", variant: "Dark", imageSrc: "https://img.b2bpic.net/free-photo/person-working-relation-innovation_53876-16535.jpg?id=2792075" },
|
||||
]}
|
||||
title="Portfolio"
|
||||
description="Showcasing high-quality concept builds."
|
||||
@@ -190,30 +155,9 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{
|
||||
id: "starter", name: "Starter", price: "Starter $500", buttons: [
|
||||
{
|
||||
text: "Contact", href: "#contact"},
|
||||
],
|
||||
features: [
|
||||
"One-page site", "Fast delivery", "Responsive design"],
|
||||
},
|
||||
{
|
||||
id: "business", name: "Business", price: " Basic $800", buttons: [
|
||||
{
|
||||
text: "Contact", href: "#contact"},
|
||||
],
|
||||
features: [
|
||||
"Multi-page site", "SEO setup", "Optimized layout"],
|
||||
},
|
||||
{
|
||||
id: "premium", name: "Premium", price: "Premium $1,200", buttons: [
|
||||
{
|
||||
text: "Contact", href: "#contact"},
|
||||
],
|
||||
features: [
|
||||
"Advanced design", "Full branding", "Custom animations"],
|
||||
},
|
||||
{ id: "starter", name: "Starter", price: "Starter $500", buttons: [{ text: "Contact", href: "#contact" }], features: ["One-page site", "Fast delivery", "Responsive design"] },
|
||||
{ id: "business", name: "Business", price: " Basic $800", buttons: [{ text: "Contact", href: "#contact" }], features: ["Multi-page site", "SEO setup", "Optimized layout"] },
|
||||
{ id: "premium", name: "Premium", price: "Premium $1,200", buttons: [{ text: "Contact", href: "#contact" }], features: ["Advanced design", "Full branding", "Custom animations"] },
|
||||
]}
|
||||
title="Simple Pricing"
|
||||
description="One-time payment options available. No confusing contracts."
|
||||
@@ -221,23 +165,14 @@ export default function LandingPage() {
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Let’s Build Your Website"
|
||||
description="If you need a modern, clean, and professional website, I can build it fast."
|
||||
inputs={[
|
||||
{
|
||||
name: "name", type: "text", placeholder: "Name", required: true,
|
||||
},
|
||||
{
|
||||
name: "email", type: "email", placeholder: "Email", required: true,
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message", placeholder: "Describe your project...", required: true,
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/minimalist-spacious-interior-design_23-2150378904.jpg"
|
||||
/>
|
||||
<ContactCTA
|
||||
tag="Ready to start?"
|
||||
title="Let’s Build Your Website"
|
||||
description="I am accepting new projects. Let's discuss your vision and get started today."
|
||||
buttons={[{ text: "Let's Chat", href: "mailto:marcos@digital.studio" }]}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
@@ -245,13 +180,11 @@ export default function LandingPage() {
|
||||
logoText="Digital Excellence"
|
||||
copyrightText="© 2025 | Marcos Digital Studio"
|
||||
socialLinks={[
|
||||
{
|
||||
icon: Instagram,
|
||||
href: "https://instagram.com/marcoswebdesigns", ariaLabel: "Instagram"},
|
||||
{ icon: Instagram, href: "https://instagram.com/marcoswebdesigns", ariaLabel: "Instagram" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user