Merge version_1 into main #2
329
src/app/page.tsx
329
src/app/page.tsx
@@ -25,230 +25,123 @@ export default function LandingPage() {
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Início",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Sobre",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Serviços",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Avaliações",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contato",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="The Best"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Início", id: "hero" },
|
||||
{ name: "Sobre", id: "about" },
|
||||
{ name: "Serviços", id: "services" },
|
||||
{ name: "Avaliações", id: "testimonials" },
|
||||
{ name: "Contato", id: "contact" },
|
||||
]}
|
||||
brandName="The Best"
|
||||
button={{ text: "Agendar", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlay
|
||||
title="A Excelência em Cada Corte"
|
||||
description="Na Barbearia The Best, transformamos o ritual de barbear em uma experiência de cuidado e estilo incomparável. Venha descobrir por que somos a escolha preferida de quem não abre mão da perfeição."
|
||||
buttons={[
|
||||
{
|
||||
text: "Agendar Agora",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/male-barber-sitting-his-shop_23-2149186515.jpg"
|
||||
imageAlt="Ambiente sofisticado da barbearia The Best"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-posing_23-2149438534.jpg",
|
||||
alt: "Cliente 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-serious-middle-age-bearded-male-dressed-plaid-flannel-shirt-grey-background_613910-16272.jpg",
|
||||
alt: "Cliente 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-handsome-man-wearing-business-clothes-thinking-looking-tired-bored-with-depression-problems-with-crossed-arms_839833-3990.jpg",
|
||||
alt: "Cliente 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-handsome-confident-stylish-hipster-lambersexual-modelmodern-man-dressed-elegant-white-suit-fashion-male-posing-street-background-europe-city-sunset-sunglasses_158538-22412.jpg",
|
||||
alt: "Cliente 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/handsome-tattooed-young-man-talking-phone-close-up-portrait-outdoors_1321-16.jpg",
|
||||
alt: "Cliente 5",
|
||||
},
|
||||
]}
|
||||
avatarText="+1000 clientes satisfeitos"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlay
|
||||
title="A Excelência em Cada Corte"
|
||||
description="Na Barbearia The Best, transformamos o ritual de barbear em uma experiência de cuidado e estilo incomparável. Venha descobrir por que somos a escolha preferida de quem não abre mão da perfeição."
|
||||
buttons={[{ text: "Agendar Agora", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/male-barber-sitting-his-shop_23-2149186515.jpg"
|
||||
imageAlt="Ambiente sofisticado da barbearia The Best"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-posing_23-2149438534.jpg", alt: "Cliente 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-serious-middle-age-bearded-male-dressed-plaid-flannel-shirt-grey-background_613910-16272.jpg", alt: "Cliente 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/young-handsome-man-wearing-business-clothes-thinking-looking-tired-bored-with-depression-problems-with-crossed-arms_839833-3990.jpg", alt: "Cliente 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-handsome-confident-stylish-hipster-lambersexual-modelmodern-man-dressed-elegant-white-suit-fashion-male-posing-street-background-europe-city-sunset-sunglasses_158538-22412.jpg", alt: "Cliente 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/handsome-tattooed-young-man-talking-phone-close-up-portrait-outdoors_1321-16.jpg", alt: "Cliente 5" }
|
||||
]}
|
||||
avatarText="+1000 clientes satisfeitos"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Tradição e Inovação"
|
||||
description="Combinamos técnicas clássicas de barbearia com as tendências modernas. Nossa equipe é dedicada a entregar não apenas um corte, mas a sua melhor versão."
|
||||
metrics={[
|
||||
{
|
||||
value: "1000+",
|
||||
title: "Clientes Satisfeitos",
|
||||
},
|
||||
{
|
||||
value: "5",
|
||||
title: "Anos de Excelência",
|
||||
},
|
||||
{
|
||||
value: "99%",
|
||||
title: "Avaliações 5 Estrelas",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/tools-from-barbershop-wooden-background_1303-10376.jpg?_wi=1"
|
||||
imageAlt="Ferramentas profissionais da The Best"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Tradição e Inovação"
|
||||
description="Combinamos técnicas clássicas de barbearia com as tendências modernas. Nossa equipe é dedicada a entregar não apenas um corte, mas a sua melhor versão."
|
||||
metrics={[
|
||||
{ value: "1000+", title: "Clientes Satisfeitos" },
|
||||
{ value: "5", title: "Anos de Excelência" },
|
||||
{ value: "99%", title: "Avaliações 5 Estrelas" }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/tools-from-barbershop-wooden-background_1303-10376.jpg"
|
||||
imageAlt="Ferramentas profissionais da The Best"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTwentyEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "s1",
|
||||
title: "Corte Clássico",
|
||||
subtitle: "Tesoura e navalha",
|
||||
category: "Corte",
|
||||
value: "R$ 60",
|
||||
},
|
||||
{
|
||||
id: "s2",
|
||||
title: "Barba Premium",
|
||||
subtitle: "Toalha quente e óleos",
|
||||
category: "Barba",
|
||||
value: "R$ 45",
|
||||
},
|
||||
{
|
||||
id: "s3",
|
||||
title: "Combo Completo",
|
||||
subtitle: "Corte + Barba + Tratamento",
|
||||
category: "Pacote",
|
||||
value: "R$ 95",
|
||||
},
|
||||
]}
|
||||
title="Nossos Serviços"
|
||||
description="Oferecemos uma gama completa de cuidados masculinos."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTwentyEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ id: "s1", title: "Corte Clássico", subtitle: "Tesoura e navalha", category: "Corte", value: "R$ 60" },
|
||||
{ id: "s2", title: "Barba Premium", subtitle: "Toalha quente e óleos", category: "Barba", value: "R$ 45" },
|
||||
{ id: "s3", title: "Combo Completo", subtitle: "Corte + Barba + Tratamento", category: "Pacote", value: "R$ 95" }
|
||||
]}
|
||||
title="Nossos Serviços"
|
||||
description="Oferecemos uma gama completa de cuidados masculinos."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Carlos Silva",
|
||||
role: "Empresário",
|
||||
testimonial: "Melhor barbearia de todas! Atendimento impecável.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-posing_23-2149438534.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "João Santos",
|
||||
role: "Advogado",
|
||||
testimonial: "Sempre saio renovado. Nota 10!",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-serious-middle-age-bearded-male-dressed-plaid-flannel-shirt-grey-background_613910-16272.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Pedro Lima",
|
||||
role: "Estudante",
|
||||
testimonial: "O serviço é excelente e o ambiente muito confortável.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-man-wearing-business-clothes-thinking-looking-tired-bored-with-depression-problems-with-crossed-arms_839833-3990.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Lucas Farias",
|
||||
role: "Arquiteto",
|
||||
testimonial: "Diferenciado. Vale cada centavo investido.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-confident-stylish-hipster-lambersexual-modelmodern-man-dressed-elegant-white-suit-fashion-male-posing-street-background-europe-city-sunset-sunglasses_158538-22412.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Ricardo Melo",
|
||||
role: "Designer",
|
||||
testimonial: "Muito bom, mas a espera foi longa uma vez. Nota 4.5.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-tattooed-young-man-talking-phone-close-up-portrait-outdoors_1321-16.jpg",
|
||||
},
|
||||
]}
|
||||
title="O Que Dizem Nossos Clientes"
|
||||
description="A excelência reflete em cada atendimento."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Carlos Silva", role: "Empresário", testimonial: "Melhor barbearia de todas! Atendimento impecável.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-posing_23-2149438534.jpg" },
|
||||
{ id: "2", name: "João Santos", role: "Advogado", testimonial: "Sempre saio renovado. Nota 10!", imageSrc: "http://img.b2bpic.net/free-photo/portrait-serious-middle-age-bearded-male-dressed-plaid-flannel-shirt-grey-background_613910-16272.jpg" },
|
||||
{ id: "3", name: "Pedro Lima", role: "Estudante", testimonial: "O serviço é excelente e o ambiente muito confortável.", imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-man-wearing-business-clothes-thinking-looking-tired-bored-with-depression-problems-with-crossed-arms_839833-3990.jpg" },
|
||||
{ id: "4", name: "Lucas Farias", role: "Arquiteto", testimonial: "Diferenciado. Vale cada centavo investido.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-confident-stylish-hipster-lambersexual-modelmodern-man-dressed-elegant-white-suit-fashion-male-posing-street-background-europe-city-sunset-sunglasses_158538-22412.jpg" },
|
||||
{ id: "5", name: "Ricardo Melo", role: "Designer", testimonial: "Muito bom, mas a espera foi longa uma vez. Nota 4.5.", imageSrc: "http://img.b2bpic.net/free-photo/handsome-tattooed-young-man-talking-phone-close-up-portrait-outdoors_1321-16.jpg" }
|
||||
]}
|
||||
title="O Que Dizem Nossos Clientes"
|
||||
description="A excelência reflete em cada atendimento."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Contato"
|
||||
title="Agende seu horário"
|
||||
description="Garanta sua vaga na melhor barbearia da região."
|
||||
mediaPosition="right"
|
||||
inputPlaceholder="Seu melhor e-mail"
|
||||
buttonText="Agendar Agora"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/tools-from-barbershop-wooden-background_1303-10376.jpg?_wi=2"
|
||||
imageAlt="Agendamento na The Best"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Contato"
|
||||
title="Agende seu horário"
|
||||
description="Garanta sua vaga na melhor barbearia da região."
|
||||
mediaPosition="right"
|
||||
inputPlaceholder="Seu melhor e-mail"
|
||||
buttonText="Agendar Agora"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/tools-from-barbershop-wooden-background_1303-10376.jpg"
|
||||
imageAlt="Agendamento na The Best"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Barbearia The Best",
|
||||
items: [
|
||||
{
|
||||
label: "Sobre nós",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Serviços",
|
||||
href: "#services",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacidade",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Termos",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
bottomLeftText="© 2024 Barbearia The Best."
|
||||
bottomRightText="Todos os direitos reservados."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Barbearia The Best", items: [
|
||||
{ label: "Sobre nós", href: "#about" },
|
||||
{ label: "Serviços", href: "#services" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Legal", items: [
|
||||
{ label: "Privacidade", href: "#" },
|
||||
{ label: "Termos", href: "#" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
bottomLeftText="© 2024 Barbearia The Best."
|
||||
bottomRightText="Todos os direitos reservados."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user