Compare commits
7 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| cbd03b435a | |||
| 52d8da1727 | |||
| b430c0010b | |||
| 8178f3406e | |||
| 36608a7f77 | |||
| 0016309645 | |||
| c272e413c6 |
327
src/app/page.tsx
327
src/app/page.tsx
@@ -10,6 +10,7 @@ import TeamCardTen from '@/components/sections/team/TeamCardTen';
|
|||||||
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
||||||
import ContactFaq from '@/components/sections/contact/ContactFaq';
|
import ContactFaq from '@/components/sections/contact/ContactFaq';
|
||||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||||
|
import DotGridBackground from '@/components/background/DotGridBackground';
|
||||||
import { Sparkles } from 'lucide-react';
|
import { Sparkles } from 'lucide-react';
|
||||||
|
|
||||||
export default function LandingPage() {
|
export default function LandingPage() {
|
||||||
@@ -67,164 +68,182 @@ export default function LandingPage() {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="work" data-section="work">
|
<div id="work" data-section="work" className="relative">
|
||||||
<ProductCardFour
|
<DotGridBackground size="medium" perspectiveThreeD={false} className="absolute inset-0 opacity-20" />
|
||||||
title="Featured Work"
|
<div className="relative z-10">
|
||||||
description="Explore our latest portfolio of high-impact web design projects that showcase our commitment to excellence and innovation."
|
<ProductCardFour
|
||||||
tag="Case Studies"
|
title="Featured Work"
|
||||||
products={[
|
description="Explore our latest portfolio of high-impact web design projects that showcase our commitment to excellence and innovation."
|
||||||
{
|
tag="Case Studies"
|
||||||
id: "1", name: "E-Commerce Platform Redesign", price: "2024", variant: "B2C Luxury Retail", imageSrc: "http://img.b2bpic.net/free-vector/online-shopping-sales-landing-page-template_23-2148826283.jpg", imageAlt: "E-commerce platform design"
|
products={[
|
||||||
},
|
{
|
||||||
{
|
id: "1", name: "E-Commerce Platform Redesign", price: "2024", variant: "B2C Luxury Retail", imageSrc: "http://img.b2bpic.net/free-vector/online-shopping-sales-landing-page-template_23-2148826283.jpg", imageAlt: "E-commerce platform design"
|
||||||
id: "2", name: "SaaS Dashboard Overhaul", price: "2024", variant: "Enterprise Software", imageSrc: "http://img.b2bpic.net/free-vector/gradient-landing-page-template-with-illustrations_23-2148264774.jpg", imageAlt: "SaaS dashboard interface"
|
},
|
||||||
},
|
{
|
||||||
{
|
id: "2", name: "SaaS Dashboard Overhaul", price: "2024", variant: "Enterprise Software", imageSrc: "http://img.b2bpic.net/free-vector/gradient-landing-page-template-with-illustrations_23-2148264774.jpg", imageAlt: "SaaS dashboard interface"
|
||||||
id: "3", name: "Creative Agency Website", price: "2023", variant: "Brand & Portfolio", imageSrc: "http://img.b2bpic.net/free-psd/creating-websites-landing-page-template_23-2148772426.jpg", imageAlt: "Creative agency portfolio"
|
},
|
||||||
}
|
{
|
||||||
]}
|
id: "3", name: "Creative Agency Website", price: "2023", variant: "Brand & Portfolio", imageSrc: "http://img.b2bpic.net/free-psd/creating-websites-landing-page-template_23-2148772426.jpg", imageAlt: "Creative agency portfolio"
|
||||||
gridVariant="three-columns-all-equal-width"
|
}
|
||||||
animationType="slide-up"
|
]}
|
||||||
textboxLayout="default"
|
gridVariant="three-columns-all-equal-width"
|
||||||
useInvertedBackground={false}
|
animationType="slide-up"
|
||||||
/>
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="services" data-section="services">
|
<div id="services" data-section="services" className="relative">
|
||||||
<FeatureCardSixteen
|
<DotGridBackground size="medium" perspectiveThreeD={false} className="absolute inset-0 opacity-15" />
|
||||||
title="What Sets Us Apart"
|
<div className="relative z-10">
|
||||||
description="We combine strategic thinking with pixel-perfect execution to deliver websites that don't just look beautiful—they perform."
|
<FeatureCardSixteen
|
||||||
tag="Our Approach"
|
title="What Sets Us Apart"
|
||||||
negativeCard={{
|
description="We combine strategic thinking with pixel-perfect execution to deliver websites that don't just look beautiful—they perform."
|
||||||
items: [
|
tag="Our Approach"
|
||||||
"Generic templates", "Slow load times", "Poor user experience", "No conversion focus"
|
negativeCard={{
|
||||||
]
|
items: [
|
||||||
}}
|
"Generic templates", "Slow load times", "Poor user experience", "No conversion focus"
|
||||||
positiveCard={{
|
|
||||||
items: [
|
|
||||||
"Custom-built solutions", "Lightning-fast performance", "Intuitive interactions", "Conversion-optimized design"
|
|
||||||
]
|
|
||||||
}}
|
|
||||||
animationType="slide-up"
|
|
||||||
textboxLayout="default"
|
|
||||||
useInvertedBackground={false}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="process" data-section="process">
|
|
||||||
<TeamCardTen
|
|
||||||
title="Our proven design process transforms your vision into digital reality through strategic planning, creative execution, and continuous optimization."
|
|
||||||
tag="Process"
|
|
||||||
members={[
|
|
||||||
{
|
|
||||||
id: "1", name: "Strategy & Discovery", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageAlt: "professional business headshot portrait"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "2", name: "Design & Prototyping", imageSrc: "http://img.b2bpic.net/free-photo/close-up-equity-analyst-working-proprietary-firm-reading-annual-company-reports-evaluate_482257-132953.jpg", imageAlt: "marketing director professional headshot"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "3", name: "Development & Testing", imageSrc: "http://img.b2bpic.net/free-photo/young-cheerful-man-classic-black-suit-white-shirt-with-wireless-earphones-happily-lookingin-camera-with-laptop-hands-while-spending-time-outdoor_574295-5776.jpg", imageAlt: "tech startup founder portrait"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "4", name: "Launch & Optimize", imageSrc: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-eyeglasses-crossed-arms-grey-background_613910-11786.jpg", imageAlt: "product manager professional headshot"
|
|
||||||
}
|
|
||||||
]}
|
|
||||||
memberVariant="default"
|
|
||||||
useInvertedBackground={false}
|
|
||||||
membersAnimation="slide-up"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="testimonials" data-section="testimonials">
|
|
||||||
<TestimonialCardSixteen
|
|
||||||
title="What Our Clients Say"
|
|
||||||
description="Real feedback from brands we've partnered with to transform their digital presence."
|
|
||||||
tag="Testimonials"
|
|
||||||
testimonials={[
|
|
||||||
{
|
|
||||||
id: "1", name: "Sarah Chen", role: "CEO", company: "Luxe Retail Co", rating: 5,
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageAlt: "professional business headshot portrait"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "2", name: "Marcus Johnson", role: "Founder", company: "CloudSync Analytics", rating: 5,
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-equity-analyst-working-proprietary-firm-reading-annual-company-reports-evaluate_482257-132953.jpg", imageAlt: "marketing director professional headshot"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "3", name: "Emily Rodriguez", role: "Marketing Director", company: "GrowthStudio Agency", rating: 5,
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/young-cheerful-man-classic-black-suit-white-shirt-with-wireless-earphones-happily-lookingin-camera-with-laptop-hands-while-spending-time-outdoor_574295-5776.jpg", imageAlt: "tech startup founder portrait"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "4", name: "David Park", role: "Product Lead", company: "InnovateTech Ventures", rating: 5,
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-eyeglasses-crossed-arms-grey-background_613910-11786.jpg", imageAlt: "product manager professional headshot"
|
|
||||||
}
|
|
||||||
]}
|
|
||||||
kpiItems={[
|
|
||||||
{ value: "150+", label: "Projects Delivered" },
|
|
||||||
{ value: "98%", label: "Client Satisfaction" },
|
|
||||||
{ value: "8+", label: "Years Excellence" }
|
|
||||||
]}
|
|
||||||
animationType="slide-up"
|
|
||||||
textboxLayout="default"
|
|
||||||
useInvertedBackground={false}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="contact" data-section="contact">
|
|
||||||
<ContactFaq
|
|
||||||
ctaTitle="Ready to Transform Your Web Presence?"
|
|
||||||
ctaDescription="Let's connect and discuss how Oasis can bring your vision to life with beautiful, high-performing design."
|
|
||||||
ctaButton={{ text: "Start Your Project", href: "mailto:massimomolin10@gmail.com" }}
|
|
||||||
ctaIcon={Sparkles}
|
|
||||||
faqs={[
|
|
||||||
{
|
|
||||||
id: "1", title: "What's your typical project timeline?", content: "Most projects take 8-12 weeks from discovery to launch, depending on scope and complexity. We work in collaborative sprints to ensure quality and your involvement throughout."
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "2", title: "Do you offer post-launch support?", content: "Absolutely. We provide 30 days of complimentary support after launch, plus optional ongoing maintenance and optimization packages to keep your site performing at its best."
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "3", title: "What's included in your design package?", content: "Our packages include strategy, wireframing, visual design, responsive prototyping, development, testing, and deployment. Exact deliverables vary based on project scope."
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "4", title: "How do you approach mobile responsiveness?", content: "We design mobile-first, ensuring your website looks and functions beautifully on all devices. Every interaction and layout is optimized for the user's context."
|
|
||||||
}
|
|
||||||
]}
|
|
||||||
useInvertedBackground={false}
|
|
||||||
animationType="slide-up"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="footer" data-section="footer">
|
|
||||||
<FooterSimple
|
|
||||||
columns={[
|
|
||||||
{
|
|
||||||
title: "Navigate", items: [
|
|
||||||
{ label: "Home", href: "#hero" },
|
|
||||||
{ label: "About", href: "#about" },
|
|
||||||
{ label: "Services", href: "#services" },
|
|
||||||
{ label: "Work", href: "#work" }
|
|
||||||
]
|
]
|
||||||
},
|
}}
|
||||||
{
|
positiveCard={{
|
||||||
title: "Resources", items: [
|
items: [
|
||||||
{ label: "Case Studies", href: "#work" },
|
"Custom-built solutions", "Lightning-fast performance", "Intuitive interactions", "Conversion-optimized design"
|
||||||
{ label: "Process", href: "#process" },
|
|
||||||
{ label: "Testimonials", href: "#testimonials" },
|
|
||||||
{ label: "Contact", href: "#contact" }
|
|
||||||
]
|
]
|
||||||
},
|
}}
|
||||||
{
|
animationType="slide-up"
|
||||||
title: "Connect", items: [
|
textboxLayout="default"
|
||||||
{ label: "Email", href: "mailto:massimomolin10@gmail.com" },
|
useInvertedBackground={false}
|
||||||
{ label: "LinkedIn", href: "https://linkedin.com" },
|
/>
|
||||||
{ label: "Instagram", href: "https://instagram.com" },
|
</div>
|
||||||
{ label: "Twitter", href: "https://twitter.com" }
|
</div>
|
||||||
]
|
|
||||||
}
|
<div id="process" data-section="process" className="relative">
|
||||||
]}
|
<DotGridBackground size="medium" perspectiveThreeD={false} className="absolute inset-0 opacity-20" />
|
||||||
bottomLeftText="© 2025 Oasis Design Agency. All rights reserved."
|
<div className="relative z-10">
|
||||||
bottomRightText="Crafted with precision and passion"
|
<TeamCardTen
|
||||||
/>
|
title="Our proven design process transforms your vision into digital reality through strategic planning, creative execution, and continuous optimization."
|
||||||
|
tag="Process"
|
||||||
|
members={[
|
||||||
|
{
|
||||||
|
id: "1", name: "Strategy & Discovery", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=1", imageAlt: "professional business headshot portrait"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "2", name: "Design & Prototyping", imageSrc: "http://img.b2bpic.net/free-photo/close-up-equity-analyst-working-proprietary-firm-reading-annual-company-reports-evaluate_482257-132953.jpg?_wi=1", imageAlt: "marketing director professional headshot"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "3", name: "Development & Testing", imageSrc: "http://img.b2bpic.net/free-photo/young-cheerful-man-classic-black-suit-white-shirt-with-wireless-earphones-happily-lookingin-camera-with-laptop-hands-while-spending-time-outdoor_574295-5776.jpg?_wi=1", imageAlt: "tech startup founder portrait"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "4", name: "Launch & Optimize", imageSrc: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-eyeglasses-crossed-arms-grey-background_613910-11786.jpg?_wi=1", imageAlt: "product manager professional headshot"
|
||||||
|
}
|
||||||
|
]}
|
||||||
|
memberVariant="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
membersAnimation="slide-up"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="testimonials" data-section="testimonials" className="relative">
|
||||||
|
<DotGridBackground size="medium" perspectiveThreeD={false} className="absolute inset-0 opacity-15" />
|
||||||
|
<div className="relative z-10">
|
||||||
|
<TestimonialCardSixteen
|
||||||
|
title="What Our Clients Say"
|
||||||
|
description="Real feedback from brands we've partnered with to transform their digital presence."
|
||||||
|
tag="Testimonials"
|
||||||
|
testimonials={[
|
||||||
|
{
|
||||||
|
id: "1", name: "Sarah Chen", role: "CEO", company: "Luxe Retail Co", rating: 5,
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=2", imageAlt: "professional business headshot portrait"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "2", name: "Marcus Johnson", role: "Founder", company: "CloudSync Analytics", rating: 5,
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-equity-analyst-working-proprietary-firm-reading-annual-company-reports-evaluate_482257-132953.jpg?_wi=2", imageAlt: "marketing director professional headshot"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "3", name: "Emily Rodriguez", role: "Marketing Director", company: "GrowthStudio Agency", rating: 5,
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/young-cheerful-man-classic-black-suit-white-shirt-with-wireless-earphones-happily-lookingin-camera-with-laptop-hands-while-spending-time-outdoor_574295-5776.jpg?_wi=2", imageAlt: "tech startup founder portrait"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "4", name: "David Park", role: "Product Lead", company: "InnovateTech Ventures", rating: 5,
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-eyeglasses-crossed-arms-grey-background_613910-11786.jpg?_wi=2", imageAlt: "product manager professional headshot"
|
||||||
|
}
|
||||||
|
]}
|
||||||
|
kpiItems={[
|
||||||
|
{ value: "150+", label: "Projects Delivered" },
|
||||||
|
{ value: "98%", label: "Client Satisfaction" },
|
||||||
|
{ value: "8+", label: "Years Excellence" }
|
||||||
|
]}
|
||||||
|
animationType="slide-up"
|
||||||
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="contact" data-section="contact" className="relative">
|
||||||
|
<DotGridBackground size="medium" perspectiveThreeD={false} className="absolute inset-0 opacity-20" />
|
||||||
|
<div className="relative z-10">
|
||||||
|
<ContactFaq
|
||||||
|
ctaTitle="Ready to Transform Your Web Presence?"
|
||||||
|
ctaDescription="Let's connect and discuss how Oasis can bring your vision to life with beautiful, high-performing design."
|
||||||
|
ctaButton={{ text: "Start Your Project", href: "mailto:massimomolin10@gmail.com" }}
|
||||||
|
ctaIcon={Sparkles}
|
||||||
|
faqs={[
|
||||||
|
{
|
||||||
|
id: "1", title: "What's your typical project timeline?", content: "Most projects take 8-12 weeks from discovery to launch, depending on scope and complexity. We work in collaborative sprints to ensure quality and your involvement throughout."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "2", title: "Do you offer post-launch support?", content: "Absolutely. We provide 30 days of complimentary support after launch, plus optional ongoing maintenance and optimization packages to keep your site performing at its best."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "3", title: "What's included in your design package?", content: "Our packages include strategy, wireframing, visual design, responsive prototyping, development, testing, and deployment. Exact deliverables vary based on project scope."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "4", title: "How do you approach mobile responsiveness?", content: "We design mobile-first, ensuring your website looks and functions beautifully on all devices. Every interaction and layout is optimized for the user's context."
|
||||||
|
}
|
||||||
|
]}
|
||||||
|
useInvertedBackground={false}
|
||||||
|
animationType="slide-up"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="footer" data-section="footer" className="relative">
|
||||||
|
<DotGridBackground size="medium" perspectiveThreeD={false} className="absolute inset-0 opacity-10" />
|
||||||
|
<div className="relative z-10">
|
||||||
|
<FooterSimple
|
||||||
|
columns={[
|
||||||
|
{
|
||||||
|
title: "Navigate", items: [
|
||||||
|
{ label: "Home", href: "#hero" },
|
||||||
|
{ label: "About", href: "#about" },
|
||||||
|
{ label: "Services", href: "#services" },
|
||||||
|
{ label: "Work", href: "#work" }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Resources", items: [
|
||||||
|
{ label: "Case Studies", href: "#work" },
|
||||||
|
{ label: "Process", href: "#process" },
|
||||||
|
{ label: "Testimonials", href: "#testimonials" },
|
||||||
|
{ label: "Contact", href: "#contact" }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Connect", items: [
|
||||||
|
{ label: "Email", href: "mailto:massimomolin10@gmail.com" },
|
||||||
|
{ label: "LinkedIn", href: "https://linkedin.com" },
|
||||||
|
{ label: "Instagram", href: "https://instagram.com" },
|
||||||
|
{ label: "Twitter", href: "https://twitter.com" }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]}
|
||||||
|
bottomLeftText="© 2025 Oasis Design Agency. All rights reserved."
|
||||||
|
bottomRightText="Crafted with precision and passion"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -12,13 +12,13 @@
|
|||||||
|
|
||||||
--background: #ffffff;
|
--background: #ffffff;
|
||||||
--card: #f9f9f9;
|
--card: #f9f9f9;
|
||||||
--foreground: #120a00e6;
|
--foreground: #000612e6;
|
||||||
--primary-cta: #FF7B05;
|
--primary-cta: #15479c;
|
||||||
--primary-cta-text: #ffffff;
|
--primary-cta-text: #ffffff;
|
||||||
--secondary-cta: #f9f9f9;
|
--secondary-cta: #f9f9f9;
|
||||||
--secondary-cta-text: #120a00e6;
|
--secondary-cta-text: #000612e6;
|
||||||
--accent: #e2e2e2;
|
--accent: #e2e2e2;
|
||||||
--background-accent: #FF7B05;
|
--background-accent: #c4c4c4;
|
||||||
|
|
||||||
/* text sizing - set by ThemeProvider */
|
/* text sizing - set by ThemeProvider */
|
||||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||||
|
|||||||
Reference in New Issue
Block a user