bender/403ffac1-a5f0-41f2-a7e2-df864e939b4c
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_2 bender:version_1
...
pull from: bender:main
Branches Tags
bender:main bender:version_2 bender:version_1

23 Commits
version_1 ... main

Author SHA1 Message Date
bender
a146777676 Merge version_2 into main 
Merge version_2 into main
 2026-04-09 12:37:57 +00:00
bender
bb1aaa9fd5 Update src/app/page.tsx 2026-04-09 12:37:54 +00:00
bender
fc2d93e232 Merge version_2 into main 
Merge version_2 into main
 2026-04-09 12:34:50 +00:00
bender
11609a67e8 Update src/app/page.tsx 2026-04-09 12:34:43 +00:00
bender
f6e27cdf1d Merge version_2 into main 
Merge version_2 into main
 2026-04-09 12:24:37 +00:00
bender
44e4d894ee Update theme colors 2026-04-09 12:24:30 +00:00
bender
abdc412f35 Merge version_2 into main 
Merge version_2 into main
 2026-04-09 12:24:08 +00:00
bender
ebd0aabecf Update theme colors 2026-04-09 12:24:05 +00:00
bender
be4a37cfd7 Merge version_2 into main 
Merge version_2 into main
 2026-04-09 12:23:24 +00:00
bender
ead80d39a3 Update theme colors 2026-04-09 12:23:20 +00:00
bender
cfc69ad288 Merge version_2 into main 
Merge version_2 into main
 2026-04-09 12:22:44 +00:00
bender
15dc5eea0e Update theme colors 2026-04-09 12:22:41 +00:00
bender
4a01d92e2d Merge version_2 into main 
Merge version_2 into main
 2026-04-09 12:22:16 +00:00
bender
db558f0967 Update theme colors 2026-04-09 12:22:13 +00:00
bender
96a3fe58eb Merge version_2 into main 
Merge version_2 into main
 2026-04-09 12:20:00 +00:00
bender
569aee7d1e Update theme colors 2026-04-09 12:19:57 +00:00
bender
6c80d7b5fc Merge version_2 into main 
Merge version_2 into main
 2026-04-09 12:19:53 +00:00
bender
f1f11082af Update theme colors 2026-04-09 12:19:50 +00:00
bender
c8810661f8 Merge version_2 into main 
Merge version_2 into main
 2026-04-09 12:18:35 +00:00
bender
31956b0e95 Update src/app/page.tsx 2026-04-09 12:18:31 +00:00
bender
680084a98b Merge version_1 into main 
Merge version_1 into main
 2026-04-09 12:16:40 +00:00
bender
e1bf2f7761 Merge version_1 into main 
Merge version_1 into main
 2026-04-09 12:16:16 +00:00
bender
4bd2d4e28d Merge version_1 into main 
Merge version_1 into main
 2026-04-09 12:15:40 +00:00
2 changed files with 60 additions and 126 deletions
Expand all files Collapse all files

168
src/app/page.tsx
View File

@@ -29,18 +29,12 @@ export default function LandingPage() {
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{
name: "Home", id: "hero"},
{
name: "About", id: "about"},
{
name: "Services", id: "services"},
{
name: "Gallery", id: "gallery"},
{
name: "Reviews", id: "reviews"},
{
name: "Contact", id: "contact"},
{ name: "Home", id: "hero" },
{ name: "Chi Siamo", id: "about" },
{ name: "Servizi", id: "services" },
{ name: "Galleria", id: "gallery" },
{ name: "Recensioni", id: "reviews" },
{ name: "Contatti", id: "contact" },
]}
brandName="Black & White Hair Studio"
/>
@@ -48,46 +42,29 @@ export default function LandingPage() {
<div id="hero" data-section="hero">
<HeroOverlay
title="Precision Craftsmanship, Modern Style"
description="Black & White Hair Studio offers professional haircutting, coloring, and barbershop services in the heart of Follonica. Experience the contrast of quality and elegance."
title="Artigianato di Precisione, Stile Moderno"
description="Black & White Hair Studio offre servizi professionali di taglio, colore e barbiere nel cuore di Follonica. Scopri il contrasto tra qualità ed eleganza."
buttons={[
{
text: "Book Now", href: "#contact"},
{
text: "Our Services", href: "#services"},
{ text: "Prenota Ora", href: "#contact" },
{ text: "I Nostri Servizi", href: "#services" },
]}
imageSrc="http://img.b2bpic.net/free-photo/barber-putting-towel-face-client_23-2147736960.jpg"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3C7W4V1UBQTadLYp2RUIyyoS2Xg/uploaded-1775737938314-5s0m4x1m.jpg"
showDimOverlay={true}
avatars={[
{
src: "http://img.b2bpic.net/free-photo/portrait-smiling-woman-sitting-sofa-looking-camera-high-quality-photo_114579-31508.jpg", alt: "Client 1"},
{
src: "http://img.b2bpic.net/free-photo/side-view-smile-bride-chair_23-2149860772.jpg", alt: "Client 2"},
{
src: "http://img.b2bpic.net/free-photo/young-woman-smiling_1187-3775.jpg", alt: "Client 3"},
{
src: "http://img.b2bpic.net/free-photo/young-woman-smiling_1187-3773.jpg", alt: "Client 4"},
{
src: "http://img.b2bpic.net/free-photo/young-black-people-taking-care-afro-hair_23-2149575478.jpg", alt: "Client 5"},
]}
avatarText="Join 100+ weekly happy clients"
avatarText="Unisciti ai nostri 100+ clienti felici ogni settimana"
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
useInvertedBackground={false}
title="Welcome to Black & White"
description="Located at Via Bicocchi 27, we blend modern precision with a welcoming, stylish atmosphere. Whether you're here for a fresh cut, vibrant coloring, or extensions, our team is dedicated to perfection at an affordable price."
title="Benvenuti da Black & White"
description="Situati in Via Bicocchi 27, uniamo precisione moderna e un'atmosfera accogliente ed elegante. Che tu sia qui per un taglio fresco, un colore vibrante o extension, il nostro team è dedicato alla perfezione a un prezzo accessibile."
metrics={[
{
value: "5.0", title: "Star Rating"},
{
value: "100+", title: "Weekly Clients"},
{
value: "7PM", title: "Open Until"},
{ value: "5.0", title: "Valutazione" },
{ value: "100+", title: "Clienti Settimanali" },
{ value: "19:00", title: "Orario di Chiusura" },
]}
imageSrc="http://img.b2bpic.net/free-photo/mid-section-barber-wiping-clients-face-with-hot-towel_107420-94798.jpg"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3C7W4V1UBQTadLYp2RUIyyoS2Xg/uploaded-1775737728045-ym11mht6.jpg"
mediaAnimation="slide-up"
metricsAnimation="slide-up"
/>
@@ -100,27 +77,21 @@ export default function LandingPage() {
useInvertedBackground={true}
features={[
{
title: "Haircutting & Styling", description: "Expert cuts for men and women, tailored to your personality.", phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-drying-woman39s-hair_657883-585.jpg?_wi=1"},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/female-hairdresser-proposes-colour-dying-hair_329181-1945.jpg?_wi=1"},
title: "Taglio & Styling", description: "Tagli esperti per uomo e donna, personalizzati secondo il tuo stile.", phoneOne: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3C7W4V1UBQTadLYp2RUIyyoS2Xg/uploaded-1775737630838-d6hf8ul8.jpg" },
phoneTwo: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3C7W4V1UBQTadLYp2RUIyyoS2Xg/uploaded-1775737630838-aj1agz4z.jpg" },
},
{
title: "Coloring & Transformations", description: "Modern coloring techniques using premium professional products.", phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/tools-profession-hairdresser_23-2150668439.jpg?_wi=1"},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-drying-woman39s-hair_657883-585.jpg?_wi=2"},
title: "Colore & Trasformazioni", description: "Tecniche di colorazione moderne con prodotti professionali premium.", phoneOne: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3C7W4V1UBQTadLYp2RUIyyoS2Xg/uploaded-1775737630838-1d5ldsld.jpg" },
phoneTwo: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3C7W4V1UBQTadLYp2RUIyyoS2Xg/uploaded-1775738160473-xsnjvd67.jpg" },
},
{
title: "Hair Extensions", description: "High-quality extensions to add volume and length with natural finish.", phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/female-hairdresser-proposes-colour-dying-hair_329181-1945.jpg?_wi=2"},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/tools-profession-hairdresser_23-2150668439.jpg?_wi=2"},
title: "Fade ", description: "Fade e styling ", phoneOne: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3C7W4V1UBQTadLYp2RUIyyoS2Xg/uploaded-1775738160473-3rxuxuyl.jpg" },
phoneTwo: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3C7W4V1UBQTadLYp2RUIyyoS2Xg/uploaded-1775738160473-p3zuv5ox.jpg" },
},
]}
showStepNumbers={false}
title="Our Professional Services"
description="From classic barbershop cuts to advanced coloring techniques, we cater to all your hair needs with unmatched professional care."
title="I Nostri Servizi Professionali"
description="Dai classici tagli da barbiere alle tecniche di colorazione avanzate, ci prendiamo cura di tutte le tue esigenze con un'attenzione professionale senza pari."
/>
</div>
@@ -131,27 +102,12 @@ export default function LandingPage() {
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{
id: "g1", brand: "Studio", name: "Modern Blonde", price: "Transformation", rating: 5,
reviewCount: "1", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-drag-posing-with-jewelry_23-2149247370.jpg?_wi=1"},
{
id: "g2", brand: "Studio", name: "Sharp Fade", price: "Barbershop", rating: 5,
reviewCount: "1", imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-young-woman-with-red-lips-unusual-hair-style-gray_158538-2314.jpg?_wi=1"},
{
id: "g3", brand: "Studio", name: "Length & Volume", price: "Extensions", rating: 5,
reviewCount: "1", imageSrc: "http://img.b2bpic.net/free-photo/cute-studio-girl-cool-hispanic_1187-6234.jpg?_wi=1"},
{
id: "g4", brand: "Studio", name: "Deep Brunette", price: "Styling", rating: 5,
reviewCount: "1", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-drag-posing-with-jewelry_23-2149247370.jpg?_wi=2"},
{
id: "g5", brand: "Studio", name: "Textured Cut", price: "Styling", rating: 5,
reviewCount: "1", imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-young-woman-with-red-lips-unusual-hair-style-gray_158538-2314.jpg?_wi=2"},
{
id: "g6", brand: "Studio", name: "Elegant Updo", price: "Styling", rating: 5,
reviewCount: "1", imageSrc: "http://img.b2bpic.net/free-photo/cute-studio-girl-cool-hispanic_1187-6234.jpg?_wi=2"},
{ id: "g1", brand: "Studio", name: "Biondo Moderno", price: "Trasformazione", rating: 5, reviewCount: "1", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-drag-posing-with-jewelry_23-2149247370.jpg?_wi=1" },
{ id: "g2", brand: "Studio", name: "Sfumatura Sharp", price: "Barber", rating: 5, reviewCount: "1", imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-young-woman-with-red-lips-unusual-hair-style-gray_158538-2314.jpg?_wi=1" },
{ id: "g3", brand: "Studio", name: "Volume & Lunghezza", price: "Extension", rating: 5, reviewCount: "1", imageSrc: "http://img.b2bpic.net/free-photo/cute-studio-girl-cool-hispanic_1187-6234.jpg?_wi=1" },
]}
title="Transformations"
description="See our latest work and experience the Black & White standard of style."
title="Trasformazioni"
description="Scopri i nostri ultimi lavori ed esplora lo standard di stile di Black & White."
/>
</div>
@@ -162,40 +118,25 @@ export default function LandingPage() {
gridVariant="uniform-all-items-equal"
useInvertedBackground={true}
testimonials={[
{
id: "t1", name: "Marco Rossi", role: "Client", company: "Follonica", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-woman-sitting-sofa-looking-camera-high-quality-photo_114579-31508.jpg"},
{
id: "t2", name: "Elena Bianchi", role: "Client", company: "Follonica", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/side-view-smile-bride-chair_23-2149860772.jpg"},
{
id: "t3", name: "Luca Verdi", role: "Client", company: "Follonica", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-smiling_1187-3775.jpg"},
{
id: "t4", name: "Giulia Neri", role: "Client", company: "Follonica", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-smiling_1187-3773.jpg"},
{
id: "t5", name: "Alessio Bruno", role: "Client", company: "Follonica", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-black-people-taking-care-afro-hair_23-2149575478.jpg"},
{ id: "t1", name: "Marco Rossi", role: "Cliente", company: "Follonica", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-woman-sitting-sofa-looking-camera-high-quality-photo_114579-31508.jpg" },
{ id: "t2", name: "Elena Bianchi", role: "Cliente", company: "Follonica", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/side-view-smile-bride-chair_23-2149860772.jpg" },
{ id: "t3", name: "Luca Verdi", role: "Cliente", company: "Follonica", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-woman-smiling_1187-3775.jpg" },
]}
title="What Our Clients Say"
description="Join our community of satisfied clients."
title="Cosa Dicono i Nostri Clienti"
description="Unisciti alla nostra community di clienti soddisfatti."
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={false}
background={{
variant: "plain"}}
tag="Visit Us"
title="Book Your Transformation"
description="Ready to redefine your look? Visit us in Follonica or call to book your appointment."
background={{ variant: "plain" }}
tag="Vieni a Trovarci"
title="Prenota la Tua Trasformazione"
description="Pronto a ridefinire il tuo look? Passa a trovarci a Follonica o chiama per prenotare il tuo appuntamento."
buttons={[
{
text: "Call +39 366 861 0081", href: "tel:+393668610081"},
{
text: "Get Directions", href: "https://maps.google.com"},
{ text: "Chiama +39 366 861 0081", href: "tel:+393668610081" },
{ text: "Ottieni Indicazioni", href: "https://maps.google.com" },
]}
/>
</div>
@@ -206,28 +147,21 @@ export default function LandingPage() {
columns={[
{
title: "Studio", items: [
{
label: "Services", href: "#services"},
{
label: "About", href: "#about"},
{
label: "Reviews", href: "#reviews"},
{ label: "Servizi", href: "#services" },
{ label: "Chi Siamo", href: "#about" },
{ label: "Recensioni", href: "#reviews" },
],
},
{
title: "Connect", items: [
{
label: "Call Us", href: "tel:+393668610081"},
{
label: "Visit Us", href: "https://maps.google.com"},
title: "Contatti", items: [
{ label: "Chiama", href: "tel:+393668610081" },
{ label: "Indicazioni", href: "https://maps.google.com" },
],
},
{
title: "Legal", items: [
{
label: "Privacy Policy", href: "#"},
{
label: "Terms of Service", href: "#"},
title: "Legale", items: [
{ label: "Privacy", href: "#" },
{ label: "Termini", href: "#" },
],
},
]}

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

@@ -10,15 +10,15 @@
--accent: #ffffff;
--background-accent: #ffffff; */
--background: #ffffff;
--card: #f0f0f0;
--foreground: #000000;
--primary-cta: #000000;
--primary-cta-text: #ffffff;
--secondary-cta: #ffffff;
--secondary-cta-text: #000000;
--accent: #333333;
--background-accent: #e0e0e0;
--background: #0a0a0a;
--card: #1a1a1a;
--foreground: #ffffffe6;
--primary-cta: #e6e6e6;
--primary-cta-text: #0a0a0a;
--secondary-cta: #1a1a1a;
--secondary-cta-text: #ffffffe6;
--accent: #737373;
--background-accent: #737373;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);