Bob AI: Added pricing section with three tiers
This commit is contained in:
kudinDmitriyUp
@@ -1,213 +1,38 @@
|
||||
import AboutTestimonial from '@/components/sections/about/AboutTestimonial';
|
||||
import ContactCta from '@/components/sections/contact/ContactCta';
|
||||
import FaqSimple from '@/components/sections/faq/FaqSimple';
|
||||
import FeaturesRevealCards from '@/components/sections/features/FeaturesRevealCards';
|
||||
import HeroCenteredLogos from '@/components/sections/hero/HeroCenteredLogos';
|
||||
import MetricsSimpleCards from '@/components/sections/metrics/MetricsSimpleCards';
|
||||
import SocialProofMarquee from '@/components/sections/social-proof/SocialProofMarquee';
|
||||
import TestimonialMarqueeOverlayCards from '@/components/sections/testimonial/TestimonialMarqueeOverlayCards';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
// AUTO-GENERATED shell by per-section-migrate.
|
||||
// Section bodies live in ./<PageBase>/sections/<X>.tsx. Edit the section
|
||||
// files directly. Non-block content (wrappers, non-inlinable sections) is
|
||||
// preserved inline; extracted section blocks become <XSection/> refs.
|
||||
|
||||
export default function HomePage() {
|
||||
import React from 'react';
|
||||
import HeroSection from './HomePage/sections/Hero';
|
||||
import AboutSection from './HomePage/sections/About';
|
||||
import FeaturesSection from './HomePage/sections/Features';
|
||||
import SocialSection from './HomePage/sections/Social';
|
||||
import MetricsSection from './HomePage/sections/Metrics';
|
||||
import TestimonialsSection from './HomePage/sections/Testimonials';
|
||||
import FaqSection from './HomePage/sections/Faq';
|
||||
import ContactSection from './HomePage/sections/Contact';
|
||||
|
||||
|
||||
import PricingSection from './HomePage/sections/Pricing';export default function HomePage(): React.JSX.Element {
|
||||
return (
|
||||
<>
|
||||
<div id="hero" data-section="hero">
|
||||
<SectionErrorBoundary name="hero">
|
||||
<HeroCenteredLogos
|
||||
avatarsSrc={[
|
||||
"http://img.b2bpic.net/free-photo/3d-portrait-businessman_23-2150793883.jpg",
|
||||
"http://img.b2bpic.net/free-photo/beauty-style-fashion-age-concept-close-up-portrait-positive-elegant-50-year-old-female-with-gray-hair-wrinkled-face-posing-against-white-brick-wall_344912-1852.jpg",
|
||||
"http://img.b2bpic.net/free-photo/alone-specialist-handsome-daydreaming-collar_1262-870.jpg",
|
||||
"http://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg",
|
||||
]}
|
||||
avatarText="Junte-se a +5.000 alunos"
|
||||
title="Domine Suas Finanças e Escale no Digital"
|
||||
description="O guia definitivo para planejar seu futuro financeiro, investir com inteligência e construir um negócio digital sustentável."
|
||||
primaryButton={{
|
||||
text: "Adquirir Ebook",
|
||||
href: "#contact",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Saiba Mais",
|
||||
href: "#about",
|
||||
}}
|
||||
names={[
|
||||
"Finanças",
|
||||
"Empreendedorismo",
|
||||
"Investimentos",
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-vector/green-brochure-with-technological-style_1017-4253.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<>
|
||||
<HeroSection />
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SectionErrorBoundary name="about">
|
||||
<AboutTestimonial
|
||||
tag="Sobre o Autor"
|
||||
quote="A liberdade financeira não é sobre sorte, mas sobre estratégia. Este ebook reúne os métodos que transformaram a minha realidade e podem transformar a sua."
|
||||
author="Seu Nome Aqui"
|
||||
role="Estrategista Digital"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/portrait-man-cartoon-style_23-2151134160.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<AboutSection />
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<SectionErrorBoundary name="features">
|
||||
<FeaturesRevealCards
|
||||
tag="O que você vai aprender"
|
||||
title="Estratégias Poderosas para o seu Sucesso"
|
||||
description="Pilares fundamentais para organizar sua vida financeira e empreender sem amadorismo."
|
||||
items={[
|
||||
{
|
||||
title: "Planejamento Financeiro",
|
||||
description: "Saia do vermelho e crie uma reserva de emergência consistente.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/business-financial-management-document-icon_53876-14639.jpg",
|
||||
},
|
||||
{
|
||||
title: "Empreendedorismo Digital",
|
||||
description: "Crie produtos lucrativos e negócios escaláveis na internet.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/graph-growth-development-improvement-profit-success-concept_53876-123992.jpg",
|
||||
},
|
||||
{
|
||||
title: "Inteligência em Investimentos",
|
||||
description: "Faça o dinheiro trabalhar para você com segurança e estratégia.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/internet-banking-online-payment-technology-concept_53876-165260.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<FeaturesSection />
|
||||
|
||||
<div id="social" data-section="social">
|
||||
<SectionErrorBoundary name="social">
|
||||
<SocialProofMarquee
|
||||
tag="Visto em"
|
||||
title="Reconhecido pelos maiores players do mercado"
|
||||
description="Nossa metodologia é validada pelos maiores nomes do ecossistema digital."
|
||||
names={[
|
||||
"FinTech Weekly",
|
||||
"Digital Startups",
|
||||
"Investimento Diário",
|
||||
"Empreendedor News",
|
||||
"Tech Insights",
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<SocialSection />
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<SectionErrorBoundary name="metrics">
|
||||
<MetricsSimpleCards
|
||||
tag="Impacto"
|
||||
title="Resultados em Números"
|
||||
description="Veja o impacto que a estratégia financeira correta pode trazer."
|
||||
metrics={[
|
||||
{
|
||||
value: "+5.000",
|
||||
description: "Alunos Satisfeitos",
|
||||
},
|
||||
{
|
||||
value: "R$ 10M",
|
||||
description: "Gerados em Vendas",
|
||||
},
|
||||
{
|
||||
value: "15+",
|
||||
description: "Anos de Experiência",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<MetricsSection />
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<SectionErrorBoundary name="testimonials">
|
||||
<TestimonialMarqueeOverlayCards
|
||||
tag="Depoimentos"
|
||||
title="Quem leu recomenda"
|
||||
description="Veja o que as pessoas estão dizendo sobre o guia."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Ana Souza",
|
||||
role: "Empreendedora",
|
||||
company: "Growth Co.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-urban-environment-with-thumb-up_23-2147961614.jpg",
|
||||
},
|
||||
{
|
||||
name: "Lucas Lima",
|
||||
role: "Dev",
|
||||
company: "Tech Lab",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-confident-asian-man-with-arms-crossed_1262-884.jpg",
|
||||
},
|
||||
{
|
||||
name: "Mariana Costa",
|
||||
role: "Consultora",
|
||||
company: "Fin Solutions",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-blond-female-dressed-white-shirt-red-eyeglasses_613910-3571.jpg",
|
||||
},
|
||||
{
|
||||
name: "Pedro Silva",
|
||||
role: "Influenciador",
|
||||
company: "Digital Hub",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-white-shirt-wearing-glasses-pointing-with-index-fingers-his-fake-smile-sitting-table-with-laptop-office-folders-blue-wall-working-office_141793-127949.jpg",
|
||||
},
|
||||
{
|
||||
name: "Carla Mendes",
|
||||
role: "CEO",
|
||||
company: "Startup Brasil",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-young-businessman-showing-energy-saving-concept-paper_23-2147826593.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<TestimonialsSection />
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<SectionErrorBoundary name="faq">
|
||||
<FaqSimple
|
||||
tag="Dúvidas"
|
||||
title="Perguntas Frequentes"
|
||||
description="Tudo o que você precisa saber antes de começar."
|
||||
items={[
|
||||
{
|
||||
question: "O ebook é indicado para iniciantes?",
|
||||
answer: "Sim, a linguagem é simples e didática, ideal para quem está começando do zero.",
|
||||
},
|
||||
{
|
||||
question: "Como recebo o acesso?",
|
||||
answer: "O acesso é imediato após a confirmação do pagamento por e-mail.",
|
||||
},
|
||||
{
|
||||
question: "Tem garantia?",
|
||||
answer: "Oferecemos 7 dias de garantia incondicional.",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<FaqSection />
|
||||
<PricingSection />
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<ContactCta
|
||||
tag="Comece agora"
|
||||
text="Pronto para transformar sua vida financeira?"
|
||||
primaryButton={{
|
||||
text: "Quero comprar agora",
|
||||
href: "#",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Falar com suporte",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<ContactSection />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
22
src/pages/HomePage/sections/About.tsx
Normal file
22
src/pages/HomePage/sections/About.tsx
Normal file
@@ -0,0 +1,22 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "about" section.
|
||||
|
||||
import React from 'react';
|
||||
import AboutTestimonial from '@/components/sections/about/AboutTestimonial';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function AboutSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="about" data-section="about">
|
||||
<SectionErrorBoundary name="about">
|
||||
<AboutTestimonial
|
||||
tag="Sobre o Autor"
|
||||
quote="A liberdade financeira não é sobre sorte, mas sobre estratégia. Este ebook reúne os métodos que transformaram a minha realidade e podem transformar a sua."
|
||||
author="Seu Nome Aqui"
|
||||
role="Estrategista Digital"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/portrait-man-cartoon-style_23-2151134160.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
27
src/pages/HomePage/sections/Contact.tsx
Normal file
27
src/pages/HomePage/sections/Contact.tsx
Normal file
@@ -0,0 +1,27 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "contact" section.
|
||||
|
||||
import React from 'react';
|
||||
import ContactCta from '@/components/sections/contact/ContactCta';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function ContactSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<ContactCta
|
||||
tag="Comece agora"
|
||||
text="Pronto para transformar sua vida financeira?"
|
||||
primaryButton={{
|
||||
text: "Quero comprar agora",
|
||||
href: "#",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Falar com suporte",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
34
src/pages/HomePage/sections/Faq.tsx
Normal file
34
src/pages/HomePage/sections/Faq.tsx
Normal file
@@ -0,0 +1,34 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "faq" section.
|
||||
|
||||
import React from 'react';
|
||||
import FaqSimple from '@/components/sections/faq/FaqSimple';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function FaqSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="faq" data-section="faq">
|
||||
<SectionErrorBoundary name="faq">
|
||||
<FaqSimple
|
||||
tag="Dúvidas"
|
||||
title="Perguntas Frequentes"
|
||||
description="Tudo o que você precisa saber antes de começar."
|
||||
items={[
|
||||
{
|
||||
question: "O ebook é indicado para iniciantes?",
|
||||
answer: "Sim, a linguagem é simples e didática, ideal para quem está começando do zero.",
|
||||
},
|
||||
{
|
||||
question: "Como recebo o acesso?",
|
||||
answer: "O acesso é imediato após a confirmação do pagamento por e-mail.",
|
||||
},
|
||||
{
|
||||
question: "Tem garantia?",
|
||||
answer: "Oferecemos 7 dias de garantia incondicional.",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
37
src/pages/HomePage/sections/Features.tsx
Normal file
37
src/pages/HomePage/sections/Features.tsx
Normal file
@@ -0,0 +1,37 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "features" section.
|
||||
|
||||
import React from 'react';
|
||||
import FeaturesRevealCards from '@/components/sections/features/FeaturesRevealCards';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function FeaturesSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="features" data-section="features">
|
||||
<SectionErrorBoundary name="features">
|
||||
<FeaturesRevealCards
|
||||
tag="O que você vai aprender"
|
||||
title="Estratégias Poderosas para o seu Sucesso"
|
||||
description="Pilares fundamentais para organizar sua vida financeira e empreender sem amadorismo."
|
||||
items={[
|
||||
{
|
||||
title: "Planejamento Financeiro",
|
||||
description: "Saia do vermelho e crie uma reserva de emergência consistente.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/business-financial-management-document-icon_53876-14639.jpg",
|
||||
},
|
||||
{
|
||||
title: "Empreendedorismo Digital",
|
||||
description: "Crie produtos lucrativos e negócios escaláveis na internet.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/graph-growth-development-improvement-profit-success-concept_53876-123992.jpg",
|
||||
},
|
||||
{
|
||||
title: "Inteligência em Investimentos",
|
||||
description: "Faça o dinheiro trabalhar para você com segurança e estratégia.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/internet-banking-online-payment-technology-concept_53876-165260.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
40
src/pages/HomePage/sections/Hero.tsx
Normal file
40
src/pages/HomePage/sections/Hero.tsx
Normal file
@@ -0,0 +1,40 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "hero" section.
|
||||
|
||||
import React from 'react';
|
||||
import HeroCenteredLogos from '@/components/sections/hero/HeroCenteredLogos';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function HeroSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="hero" data-section="hero">
|
||||
<SectionErrorBoundary name="hero">
|
||||
<HeroCenteredLogos
|
||||
avatarsSrc={[
|
||||
"http://img.b2bpic.net/free-photo/3d-portrait-businessman_23-2150793883.jpg",
|
||||
"http://img.b2bpic.net/free-photo/beauty-style-fashion-age-concept-close-up-portrait-positive-elegant-50-year-old-female-with-gray-hair-wrinkled-face-posing-against-white-brick-wall_344912-1852.jpg",
|
||||
"http://img.b2bpic.net/free-photo/alone-specialist-handsome-daydreaming-collar_1262-870.jpg",
|
||||
"http://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg",
|
||||
]}
|
||||
avatarText="Junte-se a +5.000 alunos"
|
||||
title="Domine Suas Finanças e Escale no Digital"
|
||||
description="O guia definitivo para planejar seu futuro financeiro, investir com inteligência e construir um negócio digital sustentável."
|
||||
primaryButton={{
|
||||
text: "Adquirir Ebook",
|
||||
href: "#contact",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Saiba Mais",
|
||||
href: "#about",
|
||||
}}
|
||||
names={[
|
||||
"Finanças",
|
||||
"Empreendedorismo",
|
||||
"Investimentos",
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-vector/green-brochure-with-technological-style_1017-4253.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
34
src/pages/HomePage/sections/Metrics.tsx
Normal file
34
src/pages/HomePage/sections/Metrics.tsx
Normal file
@@ -0,0 +1,34 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "metrics" section.
|
||||
|
||||
import React from 'react';
|
||||
import MetricsSimpleCards from '@/components/sections/metrics/MetricsSimpleCards';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function MetricsSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="metrics" data-section="metrics">
|
||||
<SectionErrorBoundary name="metrics">
|
||||
<MetricsSimpleCards
|
||||
tag="Impacto"
|
||||
title="Resultados em Números"
|
||||
description="Veja o impacto que a estratégia financeira correta pode trazer."
|
||||
metrics={[
|
||||
{
|
||||
value: "+5.000",
|
||||
description: "Alunos Satisfeitos",
|
||||
},
|
||||
{
|
||||
value: "R$ 10M",
|
||||
description: "Gerados em Vendas",
|
||||
},
|
||||
{
|
||||
value: "15+",
|
||||
description: "Anos de Experiência",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
120
src/pages/HomePage/sections/Pricing.tsx
Normal file
120
src/pages/HomePage/sections/Pricing.tsx
Normal file
@@ -0,0 +1,120 @@
|
||||
import { Check } from "lucide-react";
|
||||
import Tag from "@/components/ui/Tag";
|
||||
import TextAnimation from "@/components/ui/TextAnimation";
|
||||
import ScrollReveal from "@/components/ui/ScrollReveal";
|
||||
import Card from "@/components/ui/Card";
|
||||
import Button from "@/components/ui/Button";
|
||||
|
||||
export default function PricingSection() {
|
||||
const plans = [
|
||||
{
|
||||
tag: "Ebook Digital",
|
||||
price: "R$ 47",
|
||||
description: "O guia completo de Estratégia Financeira e Empreendedorismo Digital.",
|
||||
features: [
|
||||
"Acesso imediato ao Ebook",
|
||||
"Planilha de planejamento financeiro",
|
||||
"Checklist de criação de negócios",
|
||||
"Atualizações gratuitas por 1 ano"
|
||||
],
|
||||
primaryButton: { text: "Comprar Ebook", href: "#contact" },
|
||||
},
|
||||
{
|
||||
tag: "Combo Premium",
|
||||
price: "R$ 97",
|
||||
description: "Ebook + Curso em Vídeo e ferramentas exclusivas para acelerar seus resultados.",
|
||||
highlight: "Mais Vendido",
|
||||
features: [
|
||||
"Tudo do plano Ebook Digital",
|
||||
"3 horas de aulas em vídeo",
|
||||
"Acesso à comunidade VIP",
|
||||
"Templates de negócios prontos",
|
||||
"Suporte prioritário por email"
|
||||
],
|
||||
primaryButton: { text: "Garantir Combo", href: "#contact" },
|
||||
},
|
||||
{
|
||||
tag: "Mentoria Individual",
|
||||
price: "R$ 497",
|
||||
description: "Acompanhamento personalizado para aplicar as estratégias no seu negócio.",
|
||||
features: [
|
||||
"Tudo do Combo Premium",
|
||||
"2 sessões de mentoria (1h cada)",
|
||||
"Análise do seu planejamento",
|
||||
"Plano de ação personalizado",
|
||||
"Acesso direto via WhatsApp"
|
||||
],
|
||||
primaryButton: { text: "Agendar Mentoria", href: "#contact" },
|
||||
}
|
||||
];
|
||||
|
||||
return (
|
||||
<section data-webild-section="pricing" id="pricing" className="relative w-full py-24 bg-background">
|
||||
<div className="w-content-width mx-auto">
|
||||
<div className="text-center max-w-3xl mx-auto mb-16">
|
||||
<ScrollReveal variant="fade">
|
||||
<Tag text="Investimento" className="mb-4" />
|
||||
</ScrollReveal>
|
||||
<TextAnimation
|
||||
text="Escolha o Plano Ideal para o Seu Crescimento"
|
||||
variant="fade-blur"
|
||||
tag="h2"
|
||||
gradientText={false}
|
||||
className="text-4xl md:text-5xl font-bold text-foreground mb-6"
|
||||
/>
|
||||
<TextAnimation
|
||||
text="Opções acessíveis para você começar a transformar sua realidade financeira e digital hoje mesmo."
|
||||
variant="fade-blur"
|
||||
tag="p"
|
||||
gradientText={false}
|
||||
className="text-lg text-accent"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
|
||||
{plans.map((plan, index) => (
|
||||
<ScrollReveal variant="fade" key={index} delay={index * 0.1} className="h-full">
|
||||
<Card className={`relative h-full flex flex-col p-8 ${plan.highlight ? 'ring-2 ring-primary-cta shadow-xl scale-105 z-10' : ''}`}>
|
||||
{plan.highlight && (
|
||||
<div className="absolute -top-4 left-1/2 -translate-x-1/2">
|
||||
<span className="bg-primary-cta text-primary-cta-text text-xs font-bold px-3 py-1 rounded-full uppercase tracking-wider">
|
||||
{plan.highlight}
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="mb-8">
|
||||
<h3 className="text-xl font-semibold text-foreground mb-2">{plan.tag}</h3>
|
||||
<div className="flex items-baseline gap-1 mb-4">
|
||||
<span className="text-4xl font-bold text-foreground">{plan.price}</span>
|
||||
</div>
|
||||
<p className="text-accent text-sm">{plan.description}</p>
|
||||
</div>
|
||||
|
||||
<div className="flex-grow">
|
||||
<ul className="space-y-4 mb-8">
|
||||
{plan.features.map((feature, fIndex) => (
|
||||
<li key={fIndex} className="flex items-start gap-3">
|
||||
<Check className="w-5 h-5 text-primary-cta shrink-0 mt-0.5" />
|
||||
<span className="text-foreground text-sm">{feature}</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div className="mt-auto">
|
||||
<Button
|
||||
text={plan.primaryButton.text}
|
||||
href={plan.primaryButton.href}
|
||||
variant={plan.highlight ? "primary" : "secondary"}
|
||||
className="w-full justify-center"
|
||||
/>
|
||||
</div>
|
||||
</Card>
|
||||
</ScrollReveal>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
27
src/pages/HomePage/sections/Social.tsx
Normal file
27
src/pages/HomePage/sections/Social.tsx
Normal file
@@ -0,0 +1,27 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "social" section.
|
||||
|
||||
import React from 'react';
|
||||
import SocialProofMarquee from '@/components/sections/social-proof/SocialProofMarquee';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function SocialSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="social" data-section="social">
|
||||
<SectionErrorBoundary name="social">
|
||||
<SocialProofMarquee
|
||||
tag="Visto em"
|
||||
title="Reconhecido pelos maiores players do mercado"
|
||||
description="Nossa metodologia é validada pelos maiores nomes do ecossistema digital."
|
||||
names={[
|
||||
"FinTech Weekly",
|
||||
"Digital Startups",
|
||||
"Investimento Diário",
|
||||
"Empreendedor News",
|
||||
"Tech Insights",
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
57
src/pages/HomePage/sections/Testimonials.tsx
Normal file
57
src/pages/HomePage/sections/Testimonials.tsx
Normal file
@@ -0,0 +1,57 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "testimonials" section.
|
||||
|
||||
import React from 'react';
|
||||
import TestimonialMarqueeOverlayCards from '@/components/sections/testimonial/TestimonialMarqueeOverlayCards';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function TestimonialsSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<SectionErrorBoundary name="testimonials">
|
||||
<TestimonialMarqueeOverlayCards
|
||||
tag="Depoimentos"
|
||||
title="Quem leu recomenda"
|
||||
description="Veja o que as pessoas estão dizendo sobre o guia."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Ana Souza",
|
||||
role: "Empreendedora",
|
||||
company: "Growth Co.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-urban-environment-with-thumb-up_23-2147961614.jpg",
|
||||
},
|
||||
{
|
||||
name: "Lucas Lima",
|
||||
role: "Dev",
|
||||
company: "Tech Lab",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-confident-asian-man-with-arms-crossed_1262-884.jpg",
|
||||
},
|
||||
{
|
||||
name: "Mariana Costa",
|
||||
role: "Consultora",
|
||||
company: "Fin Solutions",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-blond-female-dressed-white-shirt-red-eyeglasses_613910-3571.jpg",
|
||||
},
|
||||
{
|
||||
name: "Pedro Silva",
|
||||
role: "Influenciador",
|
||||
company: "Digital Hub",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-white-shirt-wearing-glasses-pointing-with-index-fingers-his-fake-smile-sitting-table-with-laptop-office-folders-blue-wall-working-office_141793-127949.jpg",
|
||||
},
|
||||
{
|
||||
name: "Carla Mendes",
|
||||
role: "CEO",
|
||||
company: "Startup Brasil",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-young-businessman-showing-energy-saving-concept-paper_23-2147826593.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user