refactor: remove upsell de convite animado da pagina de sucesso
This commit is contained in:
parent
31aed0d1b7
commit
e5f23389c4
1 changed files with 1 additions and 73 deletions
|
|
@ -1,4 +1,4 @@
|
||||||
import { CheckCircle, Clock, PlayCircle, Star, ArrowRight } from "lucide-react";
|
import { CheckCircle } from "lucide-react";
|
||||||
import Footer from "../components/Footer";
|
import Footer from "../components/Footer";
|
||||||
|
|
||||||
export default function SuccessPage() {
|
export default function SuccessPage() {
|
||||||
|
|
@ -17,78 +17,6 @@ export default function SuccessPage() {
|
||||||
Você já pode começar a criar o seu kit exclusivo!
|
Você já pode começar a criar o seu kit exclusivo!
|
||||||
</p>
|
</p>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
{/* Upsell Offer */}
|
|
||||||
<section className="relative bg-gradient-to-br from-indigo-950 via-indigo-900 to-violet-900 rounded-3xl p-1 md:p-1.5 shadow-2xl overflow-hidden">
|
|
||||||
{/* Animated border effect */}
|
|
||||||
<div className="absolute inset-0 bg-gradient-to-r from-amber-400 via-pink-500 to-violet-400 animate-pulse opacity-50" />
|
|
||||||
|
|
||||||
<div className="relative bg-white rounded-[1.4rem] md:rounded-[1.3rem] p-6 text-center shadow-inner">
|
|
||||||
<div className="inline-flex items-center gap-2 bg-amber-100 text-amber-700 px-4 py-1.5 rounded-full text-sm font-bold tracking-wide uppercase mb-6">
|
|
||||||
<Clock className="w-4 h-4" /> Oferta Única
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<h2 className="text-2xl md:text-4xl font-display font-bold text-indigo-950 mb-4">
|
|
||||||
Espere! Leve também o <span className="text-pink-600">Convite Animado</span>
|
|
||||||
</h2>
|
|
||||||
<p className="text-indigo-600 mb-8 max-w-2xl mx-auto text-lg md:text-xl">
|
|
||||||
Quer impressionar ainda mais os convidados? Adicione ao seu pedido um convite em vídeo exclusivo com música, animações e o personagem do seu filho.
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<div className="flex flex-col md:flex-row items-center justify-center gap-8 mb-8">
|
|
||||||
{/* Mockup ou Imagem - usando um placeholder criativo */}
|
|
||||||
<div className="relative w-full max-w-xs aspect-[9/16] bg-indigo-950 rounded-2xl p-2 shadow-2xl overflow-hidden border-4 border-indigo-100">
|
|
||||||
<img
|
|
||||||
src="https://images.unsplash.com/photo-1541701494587-cb58502866ab?ixlib=rb-4.0.3&auto=format&fit=crop&w=800&q=80"
|
|
||||||
alt="Exemplo Convite Animado"
|
|
||||||
className="w-full h-full object-cover rounded-xl opacity-80"
|
|
||||||
/>
|
|
||||||
<div className="absolute inset-0 flex items-center justify-center">
|
|
||||||
<PlayCircle className="w-16 h-16 text-white/90 drop-shadow-xl" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="text-left space-y-6 flex-1 max-w-sm">
|
|
||||||
<ul className="space-y-4">
|
|
||||||
<li className="flex items-start gap-3">
|
|
||||||
<Star className="w-6 h-6 text-amber-400 shrink-0" fill="currentColor" />
|
|
||||||
<span className="font-medium text-indigo-900">Perfeito para enviar pelo WhatsApp</span>
|
|
||||||
</li>
|
|
||||||
<li className="flex items-start gap-3">
|
|
||||||
<Star className="w-6 h-6 text-amber-400 shrink-0" fill="currentColor" />
|
|
||||||
<span className="font-medium text-indigo-900">Música e efeitos sonoros super divertidos</span>
|
|
||||||
</li>
|
|
||||||
<li className="flex items-start gap-3">
|
|
||||||
<Star className="w-6 h-6 text-amber-400 shrink-0" fill="currentColor" />
|
|
||||||
<span className="font-medium text-indigo-900">Mantém a mesma temática escolhida da festa</span>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<div className="pt-4 border-t border-indigo-50">
|
|
||||||
<div className="text-sm text-indigo-500 line-through font-medium">De R$ 49,90 por apenas</div>
|
|
||||||
<div className="text-4xl font-black text-indigo-950">R$ 19,90</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="space-y-3">
|
|
||||||
<a
|
|
||||||
href="#"
|
|
||||||
className="group flex w-full justify-center md:inline-flex items-center gap-2 bg-gradient-to-r from-pink-500 to-violet-500 text-white px-8 py-4 rounded-full font-bold text-lg hover:-translate-y-1 hover:shadow-xl hover:shadow-pink-500/20 transition-all"
|
|
||||||
>
|
|
||||||
Adicionar ao Pedido <ArrowRight className="w-5 h-5 group-hover:translate-x-1 transition-transform" />
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<a
|
|
||||||
href="#"
|
|
||||||
className="block text-center text-sm font-medium text-indigo-400 hover:text-indigo-600 transition-colors uppercase tracking-wider"
|
|
||||||
>
|
|
||||||
Não, quero apenas o Kit Festa.
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
<Footer />
|
<Footer />
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue