Merge version_1 into main #3
259
src/app/page.tsx
259
src/app/page.tsx
@@ -2,13 +2,13 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
|
||||
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
|
||||
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
||||
import TeamCardEleven from '@/components/sections/team/TeamCardEleven';
|
||||
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
|
||||
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
||||
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
|
||||
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
|
||||
import TeamCardEleven from '@/components/sections/team/TeamCardEleven';
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -25,134 +25,139 @@ export default function LandingPage() {
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "Testimonials", id: "/testimonials" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
]}
|
||||
brandName="Omema Dev"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
brandName="Omema Dev"
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "Testimonials", id: "/testimonials" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{ variant: "radial-gradient" }}
|
||||
logoText="Omema Dev"
|
||||
description="Crafting high-quality, responsive, and modern websites tailored to your business needs."
|
||||
buttons={[
|
||||
{ text: "Get Started", href: "/contact" },
|
||||
{ text: "About Me", href: "/about" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/little-girl-with-books-notepads-sits-front-computer-top-view_169016-49260.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{ variant: "radial-gradient" }}
|
||||
logoText="Omema Dev"
|
||||
description="Crafting high-quality, responsive, and modern websites tailored to your business needs."
|
||||
buttons={[
|
||||
{ text: "Get Started", href: "/contact" },
|
||||
{ text: "About Me", href: "/about" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/little-girl-with-books-notepads-sits-front-computer-top-view_169016-49260.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="My Development Packages"
|
||||
description="Flexible solutions tailored to help you scale your business online."
|
||||
plans={[
|
||||
{
|
||||
id: "starter", badge: "Starter", price: "$500", subtitle: "Perfect for personal branding.", buttons: [{ text: "Select Starter", href: "/contact" }],
|
||||
features: ["One-page layout", "Mobile responsive", "Basic SEO", "Contact form"],
|
||||
},
|
||||
{
|
||||
id: "pro", badge: "Professional", price: "$1200", subtitle: "For growing businesses.", buttons: [{ text: "Select Pro", href: "/contact" }],
|
||||
features: ["Multi-page site", "Custom CMS integration", "Enhanced speed optimization", "Priority support"],
|
||||
},
|
||||
{
|
||||
id: "enterprise", badge: "Enterprise", price: "Custom", subtitle: "Fully tailored complex solutions.", buttons: [{ text: "Get Quote", href: "/contact" }],
|
||||
features: ["Advanced web apps", "API integrations", "E-commerce capabilities", "Dedicated 24/7 maintenance"],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="My Development Packages"
|
||||
description="Flexible solutions tailored to help you scale your business online."
|
||||
plans={[
|
||||
{
|
||||
id: "starter", badge: "Starter", price: "$500", subtitle: "Perfect for personal branding.", buttons: [{ text: "Select Starter", href: "/contact" }],
|
||||
features: ["One-page layout", "Mobile responsive", "Basic SEO", "Contact form"],
|
||||
},
|
||||
{
|
||||
id: "pro", badge: "Professional", price: "$1200", subtitle: "For growing businesses.", buttons: [{ text: "Select Pro", href: "/contact" }],
|
||||
features: ["Multi-page site", "Custom CMS integration", "Enhanced speed optimization", "Priority support"],
|
||||
},
|
||||
{
|
||||
id: "enterprise", badge: "Enterprise", price: "Custom", subtitle: "Fully tailored complex solutions.", buttons: [{ text: "Get Quote", href: "/contact" }],
|
||||
features: ["Advanced web apps", "API integrations", "E-commerce capabilities", "Dedicated 24/7 maintenance"],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metric" data-section="metric">
|
||||
<MetricCardEleven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="My Professional Impact"
|
||||
description="Quantifiable results achieved through dedicated development and strategy."
|
||||
metrics={[
|
||||
{
|
||||
id: "m1", value: "50+", title: "Projects Completed", description: "Successfully launched diverse digital solutions."},
|
||||
{
|
||||
id: "m2", value: "99%", title: "Client Satisfaction", description: "Commitment to excellence and customer success."},
|
||||
{
|
||||
id: "m3", value: "5", title: "Years Experience", description: "Continuous growth in web technologies."},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="metric" data-section="metric">
|
||||
<MetricCardEleven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="My Professional Impact"
|
||||
description="Quantifiable results achieved through dedicated development and strategy."
|
||||
metrics={[
|
||||
{
|
||||
id: "m1", value: "50+", title: "Projects Completed", description: "Successfully launched diverse digital solutions.", videoSrc: "none"
|
||||
},
|
||||
{
|
||||
id: "m2", value: "99%", title: "Client Satisfaction", description: "Commitment to excellence and customer success.", videoSrc: "none"
|
||||
},
|
||||
{
|
||||
id: "m3", value: "5", title: "Years Experience", description: "Continuous growth in web technologies.", videoSrc: "none"
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardEleven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Collaborative Synergy"
|
||||
description="While I operate independently, I thrive by working closely with designers and project managers to deliver the best result."
|
||||
groups={[
|
||||
{
|
||||
id: "g1", groupTitle: "Core Collaborators", members: [
|
||||
{
|
||||
id: "mem1", title: "Creative Lead", subtitle: "UI/UX Specialist", detail: "Ensures user-centric designs are brought to life perfectly."},
|
||||
{
|
||||
id: "mem2", title: "Strategy Partner", subtitle: "Project Manager", detail: "Keeps projects on timeline and business goals aligned."},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardEleven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Collaborative Synergy"
|
||||
description="While I operate independently, I thrive by working closely with designers and project managers to deliver the best result."
|
||||
groups={[
|
||||
{
|
||||
id: "g1", groupTitle: "Core Collaborators", members: [
|
||||
{
|
||||
id: "mem1", title: "Creative Lead", subtitle: "UI/UX Specialist", detail: "Ensures user-centric designs are brought to life perfectly."
|
||||
},
|
||||
{
|
||||
id: "mem2", title: "Strategy Partner", subtitle: "Project Manager", detail: "Keeps projects on timeline and business goals aligned."
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="feature" data-section="feature">
|
||||
<FeatureCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="My Workflow Philosophy"
|
||||
description="Transparent steps to ensure high-quality delivery at every stage."
|
||||
showStepNumbers={true}
|
||||
features={[
|
||||
{
|
||||
title: "Discovery Phase", description: "Understanding your vision and technical requirements.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/portrait-hacker_23-2148165939.jpg" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/man-typing-laptop-taking-cup-drink-home_23-2148112676.jpg" },
|
||||
},
|
||||
{
|
||||
title: "Implementation", description: "Agile development cycles with regular feedback.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/confident-businessman-smiling_107420-84734.jpg" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/positive-confident-businessman-posing-outside_74855-1183.jpg" },
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="feature" data-section="feature">
|
||||
<FeatureCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="My Workflow Philosophy"
|
||||
description="Transparent steps to ensure high-quality delivery at every stage."
|
||||
showStepNumbers={true}
|
||||
features={[
|
||||
{
|
||||
title: "Discovery Phase", description: "Understanding your vision and technical requirements.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/portrait-hacker_23-2148165939.jpg" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/man-typing-laptop-taking-cup-drink-home_23-2148112676.jpg" },
|
||||
},
|
||||
{
|
||||
title: "Implementation", description: "Agile development cycles with regular feedback.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/confident-businessman-smiling_107420-84734.jpg" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/positive-confident-businessman-posing-outside_74855-1183.jpg" },
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Omema Dev"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigate", items: [
|
||||
{ label: "Home", href: "/" },
|
||||
{ label: "About", href: "/about" },
|
||||
{ label: "Testimonials", href: "/testimonials" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact", items: [{ label: "03340036992", href: "tel:03340036992" }],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2025 Omema. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Omema Dev"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigate", items: [
|
||||
{ label: "Home", href: "/" },
|
||||
{ label: "About", href: "/about" },
|
||||
{ label: "Testimonials", href: "/testimonials" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact", items: [{ label: "03340036992", href: "tel:03340036992" }],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2025 Omema. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user