Spaces:
Build error
Build error
File size: 2,185 Bytes
3eebcd0 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 | "use client";
import { DollarSign, Plus } from "lucide-react";
import { Button } from "@/components/ui/button";
import { Card, CardContent } from "@/components/ui/card";
import { Badge } from "@/components/ui/badge";
export default function MonetizationTab() {
const platforms = [
{ name: "OnlyFans", type: "subscription", fee: "20%", color: "from-blue-500 to-cyan-500", legal: "Adult content permitido" },
{ name: "Patreon", type: "subscription", fee: "12%", color: "from-orange-500 to-red-500", legal: "Sin adult content real" },
{ name: "Fansly", type: "mixed", fee: "20%", color: "from-purple-500 to-pink-500", legal: "Adult content permitido" },
{ name: "Fanvue", type: "subscription", fee: "15%", color: "from-green-500 to-teal-500", legal: "Adult content permitido" },
{ name: "Ko-fi", type: "tips", fee: "0%", color: "from-sky-500 to-blue-500", legal: "Sin adult content" },
{ name: "Instagram", type: "free", fee: "0%", color: "from-pink-500 to-purple-500", legal: "Sin desnudez" },
];
return (
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
{platforms.map((p) => (
<Card key={p.name} className="bg-slate-900/50 border-slate-800">
<CardContent className="p-4">
<div className={`w-10 h-10 rounded-lg bg-gradient-to-br ${p.color} flex items-center justify-center mb-3`}>
<DollarSign className="h-5 w-5 text-white" />
</div>
<h3 className="font-semibold">{p.name}</h3>
<p className="text-xs text-slate-400 mt-1">Fee: {p.fee}</p>
<Badge variant="outline" className="mt-2 text-xs">{p.type}</Badge>
<p className="text-xs text-amber-400 mt-2">⚖️ {p.legal}</p>
<Button size="sm" className="w-full mt-3 bg-violet-600 hover:bg-violet-700">
<Plus className="h-3 w-3 mr-1" />Conectar
</Button>
</CardContent>
</Card>
))}
</div>
);
}
|