diff --git a/package-lock.json b/package-lock.json index d131e9c..1170812 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,6 +15,7 @@ "@tailwindcss/vite": "^4.1.13", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", + "framer-motion": "^12.23.22", "lucide-react": "^0.544.0", "react": "^19.1.1", "react-dom": "^19.1.1", @@ -71,7 +72,6 @@ "integrity": "sha512-2BCOP7TN8M+gVDj7/ht3hsaO/B/n5oDbiAyyvnRlNOs+u1o+JWNYTQrmpuNp1/Wq2gcFrI01JAW+paEKDMx/CA==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@babel/code-frame": "^7.27.1", "@babel/generator": "^7.28.3", @@ -2306,7 +2306,6 @@ "integrity": "sha512-FYxk1I7wPv3K2XBaoyH2cTnocQEu8AOZ60hPbsyukMPLv5/5qr7V1i8PLHdl6Zf87I+xZXFvPCXYjiTFq+YSDQ==", "devOptional": true, "license": "MIT", - "peer": true, "dependencies": { "undici-types": "~7.12.0" } @@ -2317,7 +2316,6 @@ "integrity": "sha512-+kLxJpaJzXybyDyFXYADyP1cznTO8HSuBpenGlnKOAkH4hyNINiywvXS/tGJhsrGGP/gM185RA3xpjY0Yg4erA==", "devOptional": true, "license": "MIT", - "peer": true, "dependencies": { "csstype": "^3.0.2" } @@ -2328,7 +2326,6 @@ "integrity": "sha512-qXRuZaOsAdXKFyOhRBg6Lqqc0yay13vN7KrIg4L7N4aaHN68ma9OK3NE1BoDFgFOTfM7zg+3/8+2n8rLUH3OKQ==", "devOptional": true, "license": "MIT", - "peer": true, "peerDependencies": { "@types/react": "^19.0.0" } @@ -2385,7 +2382,6 @@ "integrity": "sha512-EHrrEsyhOhxYt8MTg4zTF+DJMuNBzWwgvvOYNj/zm1vnaD/IC5zCXFehZv94Piqa2cRFfXrTFxIvO95L7Qc/cw==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@typescript-eslint/scope-manager": "8.44.1", "@typescript-eslint/types": "8.44.1", @@ -2638,7 +2634,6 @@ "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==", "dev": true, "license": "MIT", - "peer": true, "bin": { "acorn": "bin/acorn" }, @@ -2769,7 +2764,6 @@ } ], "license": "MIT", - "peer": true, "dependencies": { "baseline-browser-mapping": "^2.8.3", "caniuse-lite": "^1.0.30001741", @@ -3194,7 +3188,6 @@ "integrity": "sha512-hB4FIzXovouYzwzECDcUkJ4OcfOEkXTv2zRY6B9bkwjx/cprAq0uvm1nl7zvQ0/TsUk0zQiN4uPfJpB9m+rPMQ==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@eslint-community/eslint-utils": "^4.8.0", "@eslint-community/regexpp": "^4.12.1", @@ -3498,6 +3491,33 @@ "dev": true, "license": "ISC" }, + "node_modules/framer-motion": { + "version": "12.23.22", + "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-12.23.22.tgz", + "integrity": "sha512-ZgGvdxXCw55ZYvhoZChTlG6pUuehecgvEAJz0BHoC5pQKW1EC5xf1Mul1ej5+ai+pVY0pylyFfdl45qnM1/GsA==", + "license": "MIT", + "dependencies": { + "motion-dom": "^12.23.21", + "motion-utils": "^12.23.6", + "tslib": "^2.4.0" + }, + "peerDependencies": { + "@emotion/is-prop-valid": "*", + "react": "^18.0.0 || ^19.0.0", + "react-dom": "^18.0.0 || ^19.0.0" + }, + "peerDependenciesMeta": { + "@emotion/is-prop-valid": { + "optional": true + }, + "react": { + "optional": true + }, + "react-dom": { + "optional": true + } + } + }, "node_modules/fsevents": { "version": "2.3.3", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz", @@ -4113,6 +4133,21 @@ "node": ">= 18" } }, + "node_modules/motion-dom": { + "version": "12.23.21", + "resolved": "https://registry.npmjs.org/motion-dom/-/motion-dom-12.23.21.tgz", + "integrity": "sha512-5xDXx/AbhrfgsQmSE7YESMn4Dpo6x5/DTZ4Iyy4xqDvVHWvFVoV+V2Ri2S/ksx+D40wrZ7gPYiMWshkdoqNgNQ==", + "license": "MIT", + "dependencies": { + "motion-utils": "^12.23.6" + } + }, + "node_modules/motion-utils": { + "version": "12.23.6", + "resolved": "https://registry.npmjs.org/motion-utils/-/motion-utils-12.23.6.tgz", + "integrity": "sha512-eAWoPgr4eFEOFfg2WjIsMoqJTW6Z8MTUCgn/GZ3VRpClWBdnbjryiA3ZSNLyxCTmCQx4RmYX6jX1iWHbenUPNQ==", + "license": "MIT" + }, "node_modules/ms": { "version": "2.1.3", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz", @@ -4328,7 +4363,6 @@ "resolved": "https://registry.npmjs.org/react/-/react-19.1.1.tgz", "integrity": "sha512-w8nqGImo45dmMIfljjMwOGtbmC/mk4CMYhWIicdSflH91J9TyCyczcPFXJzrZ/ZXcgGRFeP6BU0BEJTw6tZdfQ==", "license": "MIT", - "peer": true, "engines": { "node": ">=0.10.0" } @@ -4338,7 +4372,6 @@ "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.1.1.tgz", "integrity": "sha512-Dlq/5LAZgF0Gaz6yiqZCf6VCcZs1ghAJyrsu84Q/GT0gV+mCxbfmKNoGRKBYMJ8IEdGPqu49YWXD02GCknEDkw==", "license": "MIT", - "peer": true, "dependencies": { "scheduler": "^0.26.0" }, @@ -4358,7 +4391,6 @@ "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-9.2.0.tgz", "integrity": "sha512-ROY9fvHhwOD9ySfrF0wmvu//bKCQ6AeZZq1nJNtbDC+kk5DuSuNX/n6YWYF/SYy7bSba4D4FSz8DJeKY/S/r+g==", "license": "MIT", - "peer": true, "dependencies": { "@types/use-sync-external-store": "^0.0.6", "use-sync-external-store": "^1.4.0" @@ -4525,8 +4557,7 @@ "version": "5.0.1", "resolved": "https://registry.npmjs.org/redux/-/redux-5.0.1.tgz", "integrity": "sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w==", - "license": "MIT", - "peer": true + "license": "MIT" }, "node_modules/redux-thunk": { "version": "3.1.0", @@ -4807,7 +4838,6 @@ "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz", "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==", "license": "MIT", - "peer": true, "engines": { "node": ">=12" }, @@ -4876,7 +4906,6 @@ "integrity": "sha512-p1diW6TqL9L07nNxvRMM7hMMw4c5XOo/1ibL4aAIGmSAt9slTE1Xgw5KWuof2uTOvCg9BY7ZRi+GaF+7sfgPeQ==", "dev": true, "license": "Apache-2.0", - "peer": true, "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" @@ -5036,7 +5065,6 @@ "resolved": "https://registry.npmjs.org/vite/-/vite-7.1.7.tgz", "integrity": "sha512-VbA8ScMvAISJNJVbRDTJdCwqQoAareR/wutevKanhR2/1EkoXVZVkkORaYm/tNVCjP/UDTKtcw3bAkwOUdedmA==", "license": "MIT", - "peer": true, "dependencies": { "esbuild": "^0.25.0", "fdir": "^6.5.0", @@ -5128,7 +5156,6 @@ "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz", "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==", "license": "MIT", - "peer": true, "engines": { "node": ">=12" }, diff --git a/package.json b/package.json index 8057b79..1dd6a9a 100644 --- a/package.json +++ b/package.json @@ -17,6 +17,7 @@ "@tailwindcss/vite": "^4.1.13", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", + "framer-motion": "^12.23.22", "lucide-react": "^0.544.0", "react": "^19.1.1", "react-dom": "^19.1.1", diff --git a/src/App.tsx b/src/App.tsx index e5e9639..f3db33d 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,19 +1,21 @@ import React from "react"; -import { BrowserRouter, Routes, Route, Navigate } from "react-router-dom"; +import { BrowserRouter, Routes, Route} from "react-router-dom"; import Login from "./pages/Login"; import Signup from "./pages/Signup"; import DashboardLayout from "./components/layouts/DashboardLayouts"; import Overview from "./pages/Overview"; import Referrals from "./pages/Referrals"; import Earnings from "./pages/Earnings"; +import Landing from "./pages/Landing"; const App: React.FC = () => { return ( - } /> + } /> } /> + } /> }> } /> diff --git a/src/components/landing/Benefits.tsx b/src/components/landing/Benefits.tsx new file mode 100644 index 0000000..7c70e97 --- /dev/null +++ b/src/components/landing/Benefits.tsx @@ -0,0 +1,69 @@ +import { DollarSign, Clock, Activity, Layout, Headphones, Calendar } from "lucide-react" + +export function Benefits() { + const benefits = [ + { + title: "High Commission Rate", + description: "Earn 30% recurring commission on every sale you refer. The more you refer, the more you earn.", + icon: , + }, + { + title: "90-Day Cookie Duration", + description: + "Your referrals are tracked for 90 days, giving you plenty of time to earn commissions from your traffic.", + icon: , + }, + { + title: "Real-Time Tracking", + description: + "Monitor your earnings, clicks, and conversions in real-time with our comprehensive affiliate dashboard.", + icon: , + }, + { + title: "Marketing Materials", + description: + "Access professionally designed banners, landing pages, and promotional content to maximize conversions.", + icon: , + }, + { + title: "Dedicated Support", + description: "Get help from our dedicated affiliate support team whenever you need assistance or have questions.", + icon: , + }, + { + title: "Monthly Payouts", + description: "Receive your commissions monthly via PayPal or bank transfer with no minimum payout threshold.", + icon: , + }, + ] + + return ( +
+
+
+

+ Why join our affiliate program? +

+

+ We provide everything you need to succeed as an Planpost AI affiliate partner. +

+
+ +
+ {benefits.map((benefit, index) => ( +
+
+ {benefit.icon} +
+

{benefit.title}

+

{benefit.description}

+
+ ))} +
+
+
+ ) +} diff --git a/src/components/landing/CommissionDetails.tsx b/src/components/landing/CommissionDetails.tsx new file mode 100644 index 0000000..8aae21f --- /dev/null +++ b/src/components/landing/CommissionDetails.tsx @@ -0,0 +1,69 @@ +export default function CommissionDetails() { + return ( +
+
+
+

+ Maximize Your Earnings +

+

+ Our commission structure is designed to reward your efforts with recurring revenue +

+
+ +
+ {[ + { + title: "Lifetime Recurring", + description: + "Earn 30% commission on all subscription payments from your referrals, including renewals, for up to 12 months.", + iconPath: + "M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z", + }, + { + title: "Automatic Discount", + description: + "Your referrals automatically get 20% off at checkout - an exclusive offer only available through affiliates.", + iconPath: "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z", + }, + { + title: "Scale Your Income", + description: + "The more you refer, the more you earn. With just 5 Diamond plan referrals, earn $290 per month passively.", + iconPath: "M13 7h8m0 0v8m0-8l-8 8-4-4-6 6", + }, + { + title: "Easy Payouts", + description: + "Get paid monthly via PayPal. Your rewards are calculated at the end of each month and ready for cash-out.", + iconPath: "M3 10h18M7 15h1m4 0h1m-7 4h12a3 3 0 003-3V8a3 3 0 00-3-3H6a3 3 0 00-3 3v8a3 3 0 003 3z", + }, + ].map((item, index) => ( +
+
+ + + +
+

{item.title}

+

{item.description}

+
+ ))} +
+
+
+ ) +} diff --git a/src/components/landing/FAQ.tsx b/src/components/landing/FAQ.tsx new file mode 100644 index 0000000..8e84325 --- /dev/null +++ b/src/components/landing/FAQ.tsx @@ -0,0 +1,101 @@ +import { useState } from "react" +import { motion, AnimatePresence } from "framer-motion" + +interface FAQItem { + question: string + answer: string +} + +export function FAQ() { + const [openIndex, setOpenIndex] = useState(null) + + const faqs: FAQItem[] = [ + { + question: "What is my commission?", + answer: + "You will receive 30% commission on all future sales from any user you refer to Planpost AI Affiliates until they unsubscribe. For example, if you refer 100 users who purchase the monthly Silver plan, that's $1,176 pm to your pocket (after the 20% auto-applied discount)! Note: If a referral disputes a transaction, we reserve the right to delete the commission due for that payment.", + }, + { + question: "What discount do my referrals get?", + answer: + "All users you refer will automatically receive 20% off at checkout. This is unique to the Planpost AI Affiliates program and we don't offer this discount anywhere else, so make sure you use this in your promotional campaigns!", + }, + { + question: "How long do the cookies last for?", + answer: + "We use cookies to track your referrals. The cookies last for 60 days after someone clicks the link. If they click again, the 60 days start again.", + }, + { + question: "Can I use the affiliate link to make a purchase for myself?", + answer: + "No. Our provider incorporates protection mechanisms that monitor all purchases, IP addresses, and cookies. Planpost AI Affiliates also cross-checks accounts associated with a subscription to ensure they match the affiliate program account. Any misuse may result in account suspension and withheld payouts.", + }, + { + question: "Can I bid on 'Planpost AI' and other related keywords?", + answer: + "No, we do not permit bidding on our brand keywords on platforms such as Google Ads. Feel free to bid on any other search terms, including our competitors! Note: we reserve the right to disable affiliate accounts if they are found to be bidding on the 'Planpost AI' keyword.", + }, + { + question: "How do I get paid?", + answer: "Your rewards are calculated and available for cash-out via PayPal at the end of each month.", + }, + ] + + const toggleFAQ = (index: number) => { + setOpenIndex(openIndex === index ? null : index) + } + + return ( +
+
+ {/* Header */} +
+

+ Affiliate FAQ +

+

+ Everything you need to know about Planpost AI Affiliates. +

+
+ + {/* FAQ Items */} +
+ {faqs.map((faq, index) => ( + + + + + {openIndex === index && ( + +

{faq.answer}

+
+ )} +
+
+ ))} +
+
+
+ ) +} diff --git a/src/components/landing/FinalCTA.tsx b/src/components/landing/FinalCTA.tsx new file mode 100644 index 0000000..16c3c0f --- /dev/null +++ b/src/components/landing/FinalCTA.tsx @@ -0,0 +1,24 @@ +export function FinalCTA() { + return ( +
+
+ {/* Title */} +

+ Ready to start earning? +

+ + {/* Description */} +

+ Join our affiliate program today and start earning 30% recurring commissions on every referral. +

+ + {/* Button */} + + + +
+
+ ) +} diff --git a/src/components/landing/Footer.tsx b/src/components/landing/Footer.tsx new file mode 100644 index 0000000..ed6be1c --- /dev/null +++ b/src/components/landing/Footer.tsx @@ -0,0 +1,79 @@ +export function Footer() { + const footerLinks = { + Product: ["Features", "Integrations", "Pricing", "Changelog", "API"], + Company: ["About", "Blog", "Careers", "Press", "Partners"], + Resources: ["Community", "Contact", "Support", "Documentation", "Guides"], + Legal: ["Privacy", "Terms", "Security", "Cookies", "Licenses"], + } + + return ( + + ) +} diff --git a/src/components/landing/HeroSection.tsx b/src/components/landing/HeroSection.tsx new file mode 100644 index 0000000..f596957 --- /dev/null +++ b/src/components/landing/HeroSection.tsx @@ -0,0 +1,66 @@ +import { motion } from "framer-motion" + +export function HeroSection() { + return ( +
+ {/* Overlay */} +
+ +
+ {/* Left Text Content */} + + {/* Badge */} + + + Affiliate Program + + + + {/* Headline */} +

+ Earn 50% Commissions for Every Referral +

+ + {/* Description */} +

+ Turn your influence into income. Join Planpost AI’s affiliate program and earn recurring rewards — every month, + automatically. +

+ + {/* Single CTA Button */} + + Start Earning + +
+ + {/* Right Side Image */} + + Affiliate Program Illustration + +
+
+ ) +} diff --git a/src/components/landing/HowItWorks.tsx b/src/components/landing/HowItWorks.tsx new file mode 100644 index 0000000..28a1cb3 --- /dev/null +++ b/src/components/landing/HowItWorks.tsx @@ -0,0 +1,71 @@ +import { motion } from "framer-motion" + +export function HowItWorks() { + return ( +
+ {/* Decorative Glow Effects */} +
+
+ +
+
+ {/* Left Content */} + +

+ How does it work? +

+

+ Our partnership program is a powerful collaboration between Planpost AI and our partners. + Share our tools with your audience — and earn 30% recurring commissions for every active subscriber. +

+ + {/* Steps Section */} +
+ {[ + { icon: "💼", text: "Join our affiliate network in one simple step" }, + { icon: "🔗", text: "Share your referral link anywhere — web, email, or social" }, + { icon: "💰", text: "Earn recurring 30% commissions every month" }, + ].map((step, i) => ( + + {step.icon} +

{step.text}

+
+ ))} +
+
+ + {/* Right Image */} + +
+
+ How it works +
+ +
+
+
+ ) +} diff --git a/src/components/landing/Navigation.tsx b/src/components/landing/Navigation.tsx new file mode 100644 index 0000000..1481bc2 --- /dev/null +++ b/src/components/landing/Navigation.tsx @@ -0,0 +1,56 @@ +import { useEffect, useState } from "react" +import { Link } from "react-router-dom" + +export function Navigation() { + const [scrolled, setScrolled] = useState(false) + + useEffect(() => { + const handleScroll = () => { + if (window.scrollY > 30) { + setScrolled(true) + } else { + setScrolled(false) + } + } + window.addEventListener("scroll", handleScroll) + return () => window.removeEventListener("scroll", handleScroll) + }, []) + + return ( + + ) +} diff --git a/src/components/landing/PartnerTypes.tsx b/src/components/landing/PartnerTypes.tsx new file mode 100644 index 0000000..2bc6547 --- /dev/null +++ b/src/components/landing/PartnerTypes.tsx @@ -0,0 +1,62 @@ +import { Users, PenTool, FileText, Users2, Briefcase, BookOpen } from "lucide-react" + +export default function PartnerTypes() { + const partnerTypes = [ + { + title: "Marketing Agencies", + description: "Help your clients grow their social media presence with Planpost AI powerful tools", + icon: , + }, + { + title: "Content Creators", + description: "Share your experience with Planpost AI and earn from your engaged audience", + icon: , + }, + { + title: "Bloggers & Writers", + description: "Write about social media marketing and monetize your content effectively", + icon: , + }, + { + title: "Social Media Influencers", + description: "Leverage your following to promote the best content marketing platform", + icon: , + }, + { + title: "Marketing Consultants", + description: "Recommend Planpost AI to your clients and earn recurring commissions", + icon: , + }, + { + title: "Course Creators", + description: "Include Planpost AI in your marketing courses and training programs", + icon: , + }, + ] + + return ( +
+
+
+

Perfect for Every Creator

+

+ Whether you're an agency, influencer,
or consultant, our affiliate program is designed for you +

+
+ +
+ {partnerTypes.map((type, index) => ( +
+
{type.icon}
+

{type.title}

+

{type.description}

+
+ ))} +
+
+
+ ) +} diff --git a/src/components/landing/PricingTable.tsx b/src/components/landing/PricingTable.tsx new file mode 100644 index 0000000..6e3193a --- /dev/null +++ b/src/components/landing/PricingTable.tsx @@ -0,0 +1,51 @@ +export function PricingTable() { + const rows = [ + { referrals: "1 Referral", order: "1 monthly Gold Subscription", earn: "$24 / month" }, + { referrals: "1 Referral", order: "1 monthly Diamond Subscription", earn: "$58 / month" }, + { referrals: "2 Referrals", order: "2 monthly Gold Subscriptions", earn: "$48 / month" }, + { referrals: "5 Referrals", order: "5 monthly Diamond Subscriptions", earn: "$290 / month" }, + ] + + return ( +
+ {/* Decorative Glow */} +
+
+ +
+

+ How much can you get paid? +

+ +
+ + + + + + + + + + {rows.map((row, index) => ( + + + + + + ))} + + + + +
Referrals:They order:You earn:
{row.referrals}{row.order} + {row.earn} +
+
+
+
+ ) +} diff --git a/src/components/landing/Resources.tsx b/src/components/landing/Resources.tsx new file mode 100644 index 0000000..c42a6c7 --- /dev/null +++ b/src/components/landing/Resources.tsx @@ -0,0 +1,64 @@ +import { DollarSign, Clock, Activity, Layout, Headphones, Calendar } from "lucide-react" + +export default function Resources() { + const resources = [ + { + title: "Marketing Materials", + description: "Access banners, graphics, and promotional content", + icon: , + }, + { + title: "Tracking Dashboard", + description: "Monitor clicks, conversions, and earnings in real-time", + icon: , + }, + { + title: "Dedicated Support", + description: "Get help from our affiliate success team", + icon: , + }, + { + title: "Email Templates", + description: "Pre-written emails to share with your audience", + icon: , + }, + { + title: "Social Media Kit", + description: "Ready-to-post content for all platforms", + icon: , + }, + { + title: "Performance Tips", + description: "Best practices to maximize your conversions", + icon: , + }, + ] + + return ( +
+
+
+

Everything You Need to Succeed

+

+ We provide all the tools and resources to help you promote Planpost AI effectively +

+
+ +
+ {resources.map((resource, index) => ( +
+
+ {resource.icon} +
+

{resource.title}

+

{resource.description}

+
+ ))} +
+
+
+ ) +} diff --git a/src/components/landing/Stats.tsx b/src/components/landing/Stats.tsx new file mode 100644 index 0000000..876568f --- /dev/null +++ b/src/components/landing/Stats.tsx @@ -0,0 +1,33 @@ +export default function Stats() { + return ( +
+
+
+
+
+ 30% +
+
Recurring Commission
+

Earn up to 12 months from each referral

+
+ +
+
+ 20% +
+
Referral Discount
+

Automatic discount applied at checkout

+
+ +
+
+ 60 +
+
Days Cookie Duration
+

Extended tracking window for conversions

+
+
+
+
+ ) +} diff --git a/src/components/landing/Testimonials.tsx b/src/components/landing/Testimonials.tsx new file mode 100644 index 0000000..a4a591c --- /dev/null +++ b/src/components/landing/Testimonials.tsx @@ -0,0 +1,79 @@ +import { motion } from "framer-motion" + +export function Testimonials() { + const testimonials = [ + { + quote: + "The Planpost AI affiliate program has been a game-changer for my business. The 30% commission and excellent support make it easy to recommend.", + author: "Sarah Johnson", + role: "Digital Marketing Consultant", + avatar: "https://images.pexels.com/photos/733872/pexels-photo-733872.jpeg", + }, + { + quote: + "I've tried many affiliate programs, but Planpost AI stands out with its generous commission structure and reliable tracking system.", + author: "Michael Chen", + role: "Content Creator", + avatar: "https://images.pexels.com/photos/2379004/pexels-photo-2379004.jpeg", + }, + { + quote: + "The marketing materials and support provided make it incredibly easy to promote Planpost AI. My earnings have grown consistently month over month.", + author: "Emma Williams", + role: "Social Media Manager", + avatar: "https://images.pexels.com/photos/30767574/pexels-photo-30767574.jpeg", + }, + ] + + return ( +
+ {/* Decorative glow */} +
+
+ +
+ {/* Header */} +
+

+ What our affiliates say +

+

+ Join thousands of successful affiliates earning with Planpost AI +

+
+ + {/* Testimonials Cards */} +
+ {testimonials.map((testimonial, index) => ( + +
+ + + +
+

{testimonial.quote}

+
+ {testimonial.author} +
+
{testimonial.author}
+
{testimonial.role}
+
+
+
+ ))} +
+
+
+ ) +} diff --git a/src/components/landing/ThreeSteps.tsx b/src/components/landing/ThreeSteps.tsx new file mode 100644 index 0000000..87346ed --- /dev/null +++ b/src/components/landing/ThreeSteps.tsx @@ -0,0 +1,40 @@ +export function ThreeSteps() { + const steps = [ + { + image: "https://cdn.prod.website-files.com/605dd4e52b25d325bdc4370e/643fe73e6c78251cc7c6de1e_Join.png", + title: "Join", + description: "It's super simple to join! Just one approval to join the best marketing solution team around.", + }, + { + image: + "https://cdn.prod.website-files.com/605dd4e52b25d325bdc4370e/644b84254bdda05bc535bb94_Advertise%20(1)-2.png", + title: "Advertise", + description: "Share why you use Planpost AI with your audience or customers.", + }, + { + image: "https://cdn.prod.website-files.com/605dd4e52b25d325bdc4370e/643fe76acb809e0f993e160d_Earn.png", + title: "Earn", + description: "Earn lifetime recurring commission, including renewals.", + }, + ] + + return ( +
+
+
+ {steps.map((step, index) => ( +
+
+
+ {step.title} +
+
+

{step.title}

+

{step.description}

+
+ ))} +
+
+
+ ) +} diff --git a/src/components/landing/WhoCanJoin.tsx b/src/components/landing/WhoCanJoin.tsx new file mode 100644 index 0000000..dda50a5 --- /dev/null +++ b/src/components/landing/WhoCanJoin.tsx @@ -0,0 +1,77 @@ +import { Users, PenTool, FileText, Users2, Briefcase, BookOpen } from "lucide-react" +import { motion } from "framer-motion" + +export function WhoCanJoin() { + const types = [ + { + title: "Marketing Agencies", + description: "Help clients grow social media presence using Planpost AI tools.", + benefit: "Earn recurring revenue from multiple clients.", + icon: , + }, + { + title: "Content Creators", + description: "Share your experience and earn from your audience.", + benefit: "Monetize your engagement and influence.", + icon: , + }, + { + title: "Bloggers & Writers", + description: "Write about social media marketing and monetize your content.", + benefit: "Generate passive income through referrals.", + icon: , + }, + { + title: "Social Media Influencers", + description: "Promote Planpost AI to your followers.", + benefit: "Earn recurring commissions from every subscription.", + icon: , + }, + { + title: "Marketing Consultants", + description: "Recommend Planpost AI to clients.", + benefit: "Boost your revenue through trusted recommendations.", + icon: , + }, + { + title: "Course Creators", + description: "Include Planpost AI in your training programs.", + benefit: "Provide added value and earn extra income.", + icon: , + }, + ] + + return ( +
+
+

+ Who can become our Partner? +

+

+ Whether you’re an agency, influencer, blogger, or consultant, our affiliate program is designed for you. + Help your audience grow while earning recurring commissions with ease. +

+
+ +
+ {types.map((type, index) => ( + +
+ {type.icon} +
+

{type.title}

+

{type.description}

+

Benefit: {type.benefit}

+
+ ))} +
+
+ ) +} diff --git a/src/pages/Landing.tsx b/src/pages/Landing.tsx new file mode 100644 index 0000000..aa9468c --- /dev/null +++ b/src/pages/Landing.tsx @@ -0,0 +1,44 @@ + +import { Benefits } from "@/components/landing/Benefits"; +import CommissionDetails from "@/components/landing/CommissionDetails"; +import { FAQ } from "@/components/landing/FAQ"; +import { FinalCTA } from "@/components/landing/FinalCTA"; +import { Footer } from "@/components/landing/Footer"; +import { HeroSection } from "@/components/landing/HeroSection"; +import { HowItWorks } from "@/components/landing/HowItWorks"; +import { Navigation } from "@/components/landing/Navigation"; +import PartnerTypes from "@/components/landing/PartnerTypes"; + +import { PricingTable } from "@/components/landing/PricingTable"; +import Resources from "@/components/landing/Resources"; +import Stats from "@/components/landing/Stats"; +import { Testimonials } from "@/components/landing/Testimonials"; +import { ThreeSteps } from "@/components/landing/ThreeSteps"; +import { WhoCanJoin } from "@/components/landing/WhoCanJoin"; +import React from "react"; + +const Landing: React.FC = () => { + return ( +
+ + + + + + + + + + + + + + + +
+ ); +}; + +export default Landing;