bender/73dfab2c-ac2f-4a63-af0a-cb656670a317
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

merge into: bender:version_1
Branches Tags
bender:main bender:version_4 bender:version_2 bender:version_3 bender:version_1
...
pull from: bender:version_3
Branches Tags
bender:main bender:version_4 bender:version_2 bender:version_3 bender:version_1

6 Commits
version_1 ... version_3

Author SHA1 Message Date
bender
c63427d5a7 Update src/app/styles/variables.css 2026-04-28 15:44:30 +00:00
bender
04843862eb Update src/app/page.tsx 2026-04-28 15:44:30 +00:00
bender
034d113ccc Merge version_2 into main 
Merge version_2 into main
 2026-04-28 15:32:02 +00:00
bender
edec34c6da Update src/app/page.tsx 2026-04-28 15:31:59 +00:00
bender
b0d8609904 Merge version_1 into main 
Merge version_1 into main
 2026-04-28 15:24:58 +00:00
bender
63e048656e Merge version_1 into main 
Merge version_1 into main
 2026-04-28 15:24:31 +00:00
2 changed files with 55 additions and 77 deletions
Expand all files Collapse all files

124
src/app/page.tsx
View File

@@ -11,7 +11,8 @@ import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import { Shield, Sparkles, Star } from "lucide-react";
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import { Shield, Sparkles, Star, Users } from "lucide-react";
export default function LandingPage() {
return (
@@ -31,12 +32,11 @@ export default function LandingPage() {
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{
name: "Inicio", id: "hero"},
{
name: "Servicios", id: "servicios"},
{
name: "Contacto", id: "contacto"},
{ name: "Inicio", id: "hero" },
{ name: "Servicios", id: "servicios" },
{ name: "Tarifas", id: "tarifas" },
{ name: "Contacto", id: "contacto" },
{ name: "Instagram", id: "instagram" }
]}
brandName="Barbería Amigos"
/>
@@ -44,20 +44,16 @@ export default function LandingPage() {
<div id="hero" data-section="hero">
<HeroBillboardGallery
background={{
variant: "gradient-bars"}}
background={{ variant: "gradient-bars" }}
title="Barbería Amigos: Expertos en Degradados y Estilo Urbano"
description="Cortes de precisión, dibujos artísticos y el mejor ambiente de Castro Urdiales."
buttons={[
{
text: "Llamar Ahora", href: "tel:602379374"},
{ text: "Llamar Ahora", href: "tel:602379374" },
]}
mediaItems={[
{ imageSrc: "http://img.b2bpic.net/free-photo/man-with-glass-liquor-barbershop_23-2147737089.jpg", imageAlt: "barber shop skin fade" },
{ imageSrc: "http://img.b2bpic.net/free-photo/side-view-young-woman-skin-texture_23-2149457576.jpg", imageAlt: "skin fade close up" },
{ imageSrc: "http://img.b2bpic.net/free-photo/child-getting-haircut-salon_23-2150462518.jpg", imageAlt: "barber cutting kids hair" },
{ imageSrc: "http://img.b2bpic.net/free-photo/front-view-beautiful-happy-woman_23-2148778287.jpg", imageAlt: "hair tattoo pattern" },
{ imageSrc: "http://img.b2bpic.net/free-photo/blonde-woman-getting-her-hair-done_23-2148108777.jpg", imageAlt: "barber shop interior" },
{ imageSrc: "https://images.unsplash.com/photo-1503951914875-452182b05f69?auto=format&fit=crop&q=80&w=800", imageAlt: "barber shop interior style" },
{ imageSrc: "https://images.unsplash.com/photo-1599351431202-180f0b4b26a5?auto=format&fit=crop&q=80&w=800", imageAlt: "professional haircut fade" },
{ imageSrc: "https://images.unsplash.com/photo-1622286342621-abd5686f8fe1?auto=format&fit=crop&q=80&w=800", imageAlt: "barber grooming tools" },
]}
mediaAnimation="slide-up"
/>
@@ -72,22 +68,22 @@ export default function LandingPage() {
{
title: "Degradados Modernos", description: "Especialistas en Skin Fade y acabados de alta definición.", icon: Sparkles,
mediaItems: [
{ imageSrc: "http://img.b2bpic.net/free-photo/from-hands-shaving-neck_23-2147778916.jpg", imageAlt: "skin fade close up" },
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairdresser-trimming-hair_23-2148256872.jpg", imageAlt: "skin fade close up" },
{ imageSrc: "https://images.unsplash.com/photo-1585747860715-2ba37e788b70?auto=format&fit=crop&q=80&w=400", imageAlt: "skin fade detail" },
{ imageSrc: "https://images.unsplash.com/photo-1599351431202-180f0b4b26a5?auto=format&fit=crop&q=80&w=400", imageAlt: "hairdresser trimming" },
]
},
{
title: "Corte Infantil", description: "Expertos en los más pequeños, con paciencia y estilo.", icon: Star,
mediaItems: [
{ imageSrc: "http://img.b2bpic.net/free-photo/smiling-preschooler-boy-getting-haircut-older-sister-cuts-her-little-brother-with-trimmer-against-brick-wall_613910-5738.jpg", imageAlt: "barber cutting kids hair" },
{ imageSrc: "http://img.b2bpic.net/free-photo/children-hairdresser-with-scissors-is-cutting-little-boy-against-dark-background-contented-cute-preschooler-boy-getting-haircut_613910-19721.jpg", imageAlt: "barber cutting kids hair" },
{ imageSrc: "https://images.unsplash.com/photo-1595152772835-219674b2a0a6?auto=format&fit=crop&q=80&w=400", imageAlt: "kid haircut" },
{ imageSrc: "https://images.unsplash.com/photo-1521119989659-a83eee488004?auto=format&fit=crop&q=80&w=400", imageAlt: "boy getting haircut" },
]
},
{
title: "Arreglo de Barba", description: "Perfilado y cuidado tradicional para un look impecable.", icon: Shield,
mediaItems: [
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-drinking-straw-texture_23-2148133310.jpg", imageAlt: "hair tattoo pattern" },
{ imageSrc: "http://img.b2bpic.net/free-vector/linear-flat-abstract-lines-pattern_23-2148953433.jpg", imageAlt: "hair tattoo pattern" },
{ imageSrc: "https://images.unsplash.com/photo-1621607516531-294b63519842?auto=format&fit=crop&q=80&w=400", imageAlt: "beard trim" },
{ imageSrc: "https://images.unsplash.com/photo-1626273718968-450f38e6e580?auto=format&fit=crop&q=80&w=400", imageAlt: "barber tools" },
]
},
]}
@@ -96,18 +92,29 @@ export default function LandingPage() {
/>
</div>
<div id="tarifas" data-section="tarifas">
<PricingCardThree
animationType="slide-up"
title="Servicio sin Citas"
description="Atención por orden de llegada. Ven a vernos directamente en el salón."
textboxLayout="split"
useInvertedBackground={false}
plans={[
{ id: "p1", name: "Corte de Caballero", price: "15€", badge: "Popular", badgeIcon: Users, features: ["Degradado moderno", "Perfilado incluido", "Atención inmediata"], buttons: [{ text: "Ven ahora" }] },
{ id: "p2", name: "Corte Infantil", price: "12€", features: ["Corte con paciencia", "Estilo personalizado", "Atención inmediata"], buttons: [{ text: "Ven ahora" }] }
]}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardEleven
animationType="blur-reveal"
textboxLayout="default"
useInvertedBackground={false}
metrics={[
{
id: "m1", value: "Wi-Fi", title: "Conectividad", description: "Wi-Fi Gratis para clientes.", imageSrc: "http://img.b2bpic.net/free-photo/man-having-his-hair-fixed-with-comb-hairdryer_23-2148256901.jpg", imageAlt: "barber shop skin fade"},
{
id: "m2", value: "NFC", title: "Pagos", description: "Pago con Móvil/NFC rápido.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-preschooler-boy-getting-haircut-older-sister-cuts-her-little-brother-with-trimmer-against-brick-wall_613910-19671.jpg", imageAlt: "barber cutting kids hair"},
{
id: "m3", value: "20:30", title: "Horario", description: "Abierto hasta las 20:30.", imageSrc: "http://img.b2bpic.net/free-photo/digital-art-style-illustration-mental-health-day-awareness_23-2151813238.jpg", imageAlt: "hair tattoo pattern"},
{ id: "m1", value: "Wi-Fi", title: "Conectividad", description: "Wi-Fi Gratis para clientes.", imageSrc: "https://images.unsplash.com/photo-1594967916422-5c2f57560a3a?auto=format&fit=crop&q=80&w=400", imageAlt: "Wi-Fi symbol" },
{ id: "m2", value: "NFC", title: "Pagos", description: "Pago con Móvil/NFC rápido.", imageSrc: "https://images.unsplash.com/photo-1563013544-824ae1b704d3?auto=format&fit=crop&q=80&w=400", imageAlt: "nfc payment" },
{ id: "m3", value: "20:30", title: "Horario", description: "Abierto hasta las 20:30.", imageSrc: "https://images.unsplash.com/photo-1506784365847-bbad939e9335?auto=format&fit=crop&q=80&w=400", imageAlt: "clock icon" },
]}
title="Compromiso con el Cliente"
description="Tecnología y servicios modernos a tu disposición."
@@ -118,16 +125,9 @@ export default function LandingPage() {
<TestimonialCardTwelve
useInvertedBackground={true}
testimonials={[
{
id: "1", name: "Juan García", imageSrc: "http://img.b2bpic.net/free-photo/young-bearded-man-getting-haircut-by-hairdresser-while-sitting-chair-barbershop-barber-soul_627829-6410.jpg", imageAlt: "happy customer barber"},
{
id: "2", name: "Pedro López", imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-barbershop-concept_23-2148506210.jpg", imageAlt: "clean beard fade"},
{
id: "3", name: "Carlos Ruiz", imageSrc: "http://img.b2bpic.net/free-photo/close-up-young-man-listening-music-headphone_23-2147892843.jpg", imageAlt: "trendy male haircut"},
{
id: "4", name: "Luis Miguel", imageSrc: "http://img.b2bpic.net/free-photo/customer-getting-new-haircut-from_23-2148257021.jpg", imageAlt: "sharp haircut result"},
{
id: "5", name: "Javier Torres", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-handsome-man_23-2148884350.jpg", imageAlt: "skin fade profile"},
{ id: "1", name: "Juan García", imageSrc: "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?auto=format&fit=crop&q=80&w=200", imageAlt: "Juan G" },
{ id: "2", name: "Pedro López", imageSrc: "https://images.unsplash.com/photo-1535713875002-d1d0cf377fde?auto=format&fit=crop&q=80&w=200", imageAlt: "Pedro L" },
{ id: "3", name: "Carlos Ruiz", imageSrc: "https://images.unsplash.com/photo-1633332755192-727a05c4013d?auto=format&fit=crop&q=80&w=200", imageAlt: "Carlos R" },
]}
cardTitle="Lo que dicen nuestros amigos"
cardTag="Opiniones"
@@ -139,12 +139,9 @@ export default function LandingPage() {
<FaqSplitText
useInvertedBackground={false}
faqs={[
{
id: "f1", title: "¿Necesito cita previa?", content: "Recomendamos reservar para asegurar disponibilidad."},
{
id: "f2", title: "¿Aceptan tarjetas?", content: "Sí, aceptamos tarjetas y pagos móviles/NFC."},
{
id: "f3", title: "¿Dónde están ubicados?", content: "En Calle Santander, 14, Castro-Urdiales."},
{ id: "f1", title: "¿Necesito cita previa?", content: "No, trabajamos exclusivamente por orden de llegada para ofrecer atención inmediata." },
{ id: "f2", title: "¿Aceptan tarjetas?", content: "Sí, aceptamos tarjetas y pagos móviles/NFC." },
{ id: "f3", title: "¿Dónde están ubicados?", content: "En Calle Santander, 14, Castro-Urdiales." },
]}
sideTitle="Preguntas frecuentes"
faqsAnimation="blur-reveal"
@@ -155,8 +152,7 @@ export default function LandingPage() {
<SocialProofOne
textboxLayout="default"
useInvertedBackground={true}
names={[
"Productos Premium", "Calidad Garantizada", "Excelencia", "Innovación", "Estilo Moderno", "Puntualidad", "Atención Personalizada"]}
names={["Productos Premium", "Calidad Garantizada", "Excelencia", "Innovación", "Estilo Moderno"]}
title="Nuestros Aliados en Estilo"
description="La excelencia y calidad respaldan nuestro trabajo día a día."
/>
@@ -165,19 +161,15 @@ export default function LandingPage() {
<div id="contacto" data-section="contacto">
<ContactSplitForm
useInvertedBackground={false}
title="Reserva tu cita"
description="Estamos listos para renovar tu estilo. Visítanos en C. Santander, 14."
title="Contáctanos"
description="Estamos listos para renovar tu estilo. Llámanos o visítanos directamente en C. Santander, 14."
inputs={[
{
name: "nombre", type: "text", placeholder: "Tu nombre", required: true,
},
{
name: "email", type: "email", placeholder: "Tu email", required: true,
},
{
name: "telefono", type: "tel", placeholder: "Tu teléfono"},
{ name: "nombre", type: "text", placeholder: "Tu nombre", required: true },
{ name: "mensaje", type: "text", placeholder: "Tu mensaje" },
]}
imageSrc="http://img.b2bpic.net/free-photo/full-shot-man-getting-groomed_23-2149141754.jpg"
buttonText="Llamar Ahora"
onSubmit={() => window.location.href = 'tel:602379374'}
imageSrc="https://images.unsplash.com/photo-1507413245164-6160d8298b31?auto=format&fit=crop&q=80&w=1200"
imageAlt="barber shop interior"
/>
</div>
@@ -185,22 +177,8 @@ export default function LandingPage() {
<div id="footer" data-section="footer">
<FooterLogoEmphasis
columns={[
{
items: [
{
label: "Calle Santander, 14", href: "#"},
{
label: "Castro-Urdiales", href: "#"},
],
},
{
items: [
{
label: "Abierto hasta las 20:30", href: "#"},
{
label: "Reserva ahora", href: "tel:602379374"},
],
},
{ items: [{ label: "Calle Santander, 14", href: "#" }, { label: "Castro-Urdiales", href: "#" }] },
{ items: [{ label: "Abierto hasta las 20:30", href: "#" }, { label: "Llamar: 602379374", href: "tel:602379374" }] },
]}
logoText="Barbería Amigos"
/>

8
src/app/styles/variables.css
View File

@@ -11,14 +11,14 @@
--background-accent: #ffffff; */
--background: #ffffff;
--card: #f9f9f9;
--card: #000000;
--foreground: #000000;
--primary-cta: #106EFB;
--primary-cta-text: #ffffff;
--secondary-cta: #ffffff;
--secondary-cta: #000000;
--secondary-cta-text: #000000;
--accent: #000000;
--background-accent: #106EFB;
--accent: #106EFB;
--background-accent: #f9f9f9;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);