diff --git a/app/page.tsx b/app/page.tsx index 3b9c101..5344ed4 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -6,6 +6,7 @@ import { CTA } from "@/components/cta"; import { Footer } from "@/components/footer"; import { Testimonial } from "@/components/testimonial"; import { Faq } from "@/components/faq"; +import { ProofLoop } from "@/components/proof-loop"; export default function Home() { return ( @@ -14,6 +15,7 @@ export default function Home() { + diff --git a/components/proof-loop.tsx b/components/proof-loop.tsx new file mode 100644 index 0000000..f22f4c2 --- /dev/null +++ b/components/proof-loop.tsx @@ -0,0 +1,86 @@ +"use client"; + +import { FileCheck2, ListChecks, WalletCards } from "lucide-react"; +import { motion } from "framer-motion"; + +import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; +import { FADE_UP_ANIMATION_VARIANTS } from "@/lib/framer-variants"; + +const steps = [ + { + icon: ListChecks, + eyebrow: "1. Define acceptance", + title: "Make the outcome clear", + description: + "Describe the exact deliverable, proof format, due date, reward asset, and approval criteria before work begins.", + }, + { + icon: FileCheck2, + eyebrow: "2. Submit evidence", + title: "Show the work, not just a promise", + description: + "Attach a public PR, URL, demo, or reproducible notes so the creator can review the result against the brief.", + }, + { + icon: WalletCards, + eyebrow: "3. Review and pay", + title: "Approval unlocks payout", + description: + "Creators review openly and approve the submission. Once approved, the funded reward is released to the worker's wallet.", + }, +]; + +export function ProofLoop() { + return ( + + +

A clearer path from work to payout

+

+ Funded work moves faster when proof is easy to review +

+

+ Align the brief, the evidence, and the review cadence so creators and workers know what happens next on desktop or mobile. +

+
+ + + {steps.map(({ icon: Icon, eyebrow, title, description }) => ( + + +
+ + +

{eyebrow}

+
+ {title} +
+ +

{description}

+
+
+ ))} +
+ + + Rewards are released after the creator approves qualifying work; submitting alone does not guarantee payment. + +
+ ); +} diff --git a/docs/landing-proof-loop.md b/docs/landing-proof-loop.md new file mode 100644 index 0000000..6dfe96b --- /dev/null +++ b/docs/landing-proof-loop.md @@ -0,0 +1,17 @@ +# Landing page proof loop + +## What changed + +The landing page now explains the path from a funded work brief to an approved payout: + +1. Define the deliverable and acceptance criteria. +2. Submit a public, reviewable proof of the work. +3. Review the result and release the funded reward. + +The section is responsive, uses the existing card and motion primitives, and explicitly notes that the workflow can be reviewed from desktop or mobile. The copy also makes the approval condition clear: submitting work alone does not guarantee payment. + +## Verification + +- `node_modules/next/dist/bin/next build` +- TypeScript and Next.js lint checks completed during the production build. +- Local landing page inspected at `/` after the production build.