Merge version_2 into main
Merge version_2 into main
This commit was merged in pull request #1.
This commit is contained in:
197
src/app/page.tsx
197
src/app/page.tsx
@@ -22,9 +22,9 @@ export default function LandingPage() {
|
||||
contentWidth="small"
|
||||
sizing="largeSmall"
|
||||
background="none"
|
||||
cardStyle="outline"
|
||||
primaryButtonStyle="diagonal-gradient"
|
||||
secondaryButtonStyle="layered"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="primary-glow"
|
||||
secondaryButtonStyle="radial-glow"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
@@ -32,21 +32,13 @@ export default function LandingPage() {
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "Über uns",
|
||||
id: "about",
|
||||
},
|
||||
name: "Über uns", id: "about"},
|
||||
{
|
||||
name: "Dienstleistungen",
|
||||
id: "services",
|
||||
},
|
||||
name: "Dienstleistungen", id: "services"},
|
||||
{
|
||||
name: "Kontakt",
|
||||
id: "contact",
|
||||
},
|
||||
name: "Kontakt", id: "contact"},
|
||||
]}
|
||||
brandName="Relax Friseursalon"
|
||||
/>
|
||||
@@ -55,19 +47,14 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
variant: "gradient-bars"}}
|
||||
logoText="Relax Friseursalon"
|
||||
description="Dein Style. Deine Schönheit. Dein Relax Moment. Erlebe erstklassige Haarkunst und professionellen Service direkt in Geldern."
|
||||
buttons={[
|
||||
{
|
||||
text: "Termin buchen",
|
||||
href: "#contact",
|
||||
},
|
||||
text: "Termin buchen", href: "#contact"},
|
||||
{
|
||||
text: "Jetzt anrufen",
|
||||
href: "tel:028319169966",
|
||||
},
|
||||
text: "Jetzt anrufen", href: "tel:028319169966"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/young-bearded-man-getting-haircut-by-hairdresser-while-sitting-chair-barbershop-barber-soul_627829-6322.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
@@ -79,9 +66,7 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
title="Unser Herzschlag für dein Haar"
|
||||
description={[
|
||||
"Relax Friseursalon steht für moderne Haarkunst, persönliche Beratung und eine entspannte Atmosphäre. Wir bilden aktiv Nachwuchs aus und legen größten Wert auf herzlichen Kundenservice.",
|
||||
"Besuche uns für deinen Wohlfühl-Moment.",
|
||||
]}
|
||||
"Relax Friseursalon steht für moderne Haarkunst, persönliche Beratung und eine entspannte Atmosphäre. Wir bilden aktiv Nachwuchs aus und legen größten Wert auf herzlichen Kundenservice.", "Besuche uns für deinen Wohlfühl-Moment."]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -92,20 +77,11 @@ export default function LandingPage() {
|
||||
description="Von klassischen Schnitten bis hin zu trendigen Colorationen."
|
||||
accordionItems={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Damen- & Herrenhaarschnitt",
|
||||
content: "Klassische Schnitte oder moderne Trends für jeden Typ.",
|
||||
},
|
||||
id: "1", title: "Damen- & Herrenhaarschnitt", content: "Klassische Schnitte oder moderne Trends für jeden Typ."},
|
||||
{
|
||||
id: "2",
|
||||
title: "Haarefärben & Balayage",
|
||||
content: "Experten für strahlende Farbe, sanfte Übergänge und Balayage-Techniken.",
|
||||
},
|
||||
id: "2", title: "Haarefärben & Balayage", content: "Experten für strahlende Farbe, sanfte Übergänge und Balayage-Techniken."},
|
||||
{
|
||||
id: "3",
|
||||
title: "Styling & Bartpflege",
|
||||
content: "Perfektion bis ins letzte Detail, von Abend-Styling bis zur präzisen Bartformung.",
|
||||
},
|
||||
id: "3", title: "Styling & Bartpflege", content: "Perfektion bis ins letzte Detail, von Abend-Styling bis zur präzisen Bartformung."},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/haircare-product-near-scissors-combs_23-2147711608.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
@@ -117,54 +93,31 @@ export default function LandingPage() {
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
cardClassName="hover:shadow-[0_0_20px_rgba(218,165,32,0.3)] transition-all duration-500"
|
||||
metrics={[
|
||||
{
|
||||
id: "g1",
|
||||
value: "1",
|
||||
title: "Transformation",
|
||||
items: [
|
||||
"http://img.b2bpic.net/free-photo/front-view-women-posing-together_23-2148442185.jpg",
|
||||
],
|
||||
id: "g1", value: "1", title: "Transformation", items: [
|
||||
"http://img.b2bpic.net/free-photo/front-view-women-posing-together_23-2148442185.jpg"],
|
||||
},
|
||||
{
|
||||
id: "g2",
|
||||
value: "2",
|
||||
title: "Transformation",
|
||||
items: [
|
||||
"http://img.b2bpic.net/free-photo/young-gir-sitting-chair-hairdresser_23-2147769755.jpg",
|
||||
],
|
||||
id: "g2", value: "2", title: "Transformation", items: [
|
||||
"http://img.b2bpic.net/free-photo/young-gir-sitting-chair-hairdresser_23-2147769755.jpg"],
|
||||
},
|
||||
{
|
||||
id: "g3",
|
||||
value: "3",
|
||||
title: "Transformation",
|
||||
items: [
|
||||
"http://img.b2bpic.net/free-photo/hairdresser-giving-hairstyle-young-woman_23-2147769862.jpg",
|
||||
],
|
||||
id: "g3", value: "3", title: "Transformation", items: [
|
||||
"http://img.b2bpic.net/free-photo/hairdresser-giving-hairstyle-young-woman_23-2147769862.jpg"],
|
||||
},
|
||||
{
|
||||
id: "g4",
|
||||
value: "4",
|
||||
title: "Transformation",
|
||||
items: [
|
||||
"http://img.b2bpic.net/free-photo/woman-getting-her-hair-dyed-beauty-salon_23-2149167372.jpg",
|
||||
],
|
||||
id: "g4", value: "4", title: "Transformation", items: [
|
||||
"http://img.b2bpic.net/free-photo/woman-getting-her-hair-dyed-beauty-salon_23-2149167372.jpg"],
|
||||
},
|
||||
{
|
||||
id: "g5",
|
||||
value: "5",
|
||||
title: "Transformation",
|
||||
items: [
|
||||
"http://img.b2bpic.net/free-photo/happy-young-two-ladies-standing-yellow-wall_171337-15341.jpg",
|
||||
],
|
||||
id: "g5", value: "5", title: "Transformation", items: [
|
||||
"http://img.b2bpic.net/free-photo/happy-young-two-ladies-standing-yellow-wall_171337-15341.jpg"],
|
||||
},
|
||||
{
|
||||
id: "g6",
|
||||
value: "6",
|
||||
title: "Transformation",
|
||||
items: [
|
||||
"http://img.b2bpic.net/free-photo/beautician-styling-clients-hair_107420-94682.jpg",
|
||||
],
|
||||
id: "g6", value: "6", title: "Transformation", items: [
|
||||
"http://img.b2bpic.net/free-photo/beautician-styling-clients-hair_107420-94682.jpg"],
|
||||
},
|
||||
]}
|
||||
title="Vorher & Nachher"
|
||||
@@ -176,13 +129,9 @@ export default function LandingPage() {
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
logoCardClassName="hover:shadow-[0_0_15px_rgba(218,165,32,0.2)] transition-all duration-300 border-gold"
|
||||
names={[
|
||||
"4,7 Sterne",
|
||||
"75 Rezensionen",
|
||||
"Premium Salon",
|
||||
"Lokale Empfehlung",
|
||||
"Top Friseur Geldern",
|
||||
]}
|
||||
"4,7 Sterne", "75 Rezensionen", "Premium Salon", "Lokale Empfehlung", "Top Friseur Geldern"]}
|
||||
title="Unsere Bewertung"
|
||||
description="Wir sind stolz auf unsere hohe Kundenzufriedenheit."
|
||||
/>
|
||||
@@ -193,42 +142,18 @@ export default function LandingPage() {
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
cardClassName="hover:shadow-[0_0_25px_rgba(218,165,32,0.4)] transition-all duration-500 border-gold"
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah",
|
||||
role: "Kunde",
|
||||
testimonial: "Ein sehr guter Friseur mit super Preis-/Leistungsverhältnis.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-charismatic-happy-goodlooking-redhead-woman-red-lipstick-cross-hands-chest-smiling-motivate_1258-129302.jpg",
|
||||
},
|
||||
id: "1", name: "Sarah", role: "Kunde", testimonial: "Ein sehr guter Friseur mit super Preis-/Leistungsverhältnis.", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-charismatic-happy-goodlooking-redhead-woman-red-lipstick-cross-hands-chest-smiling-motivate_1258-129302.jpg"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Markus",
|
||||
role: "Kunde",
|
||||
testimonial: "Immer super freundlich und spontan.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-cut-hair-her-client-hair-salon_1157-27201.jpg",
|
||||
},
|
||||
id: "2", name: "Markus", role: "Kunde", testimonial: "Immer super freundlich und spontan.", imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-cut-hair-her-client-hair-salon_1157-27201.jpg"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Natalia",
|
||||
role: "Kunde",
|
||||
testimonial: "Natalia ist eine Künstlerin.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/attractive-young-woman-bathrobe-standing-front-mirror-putting-some-makeup_662251-2663.jpg",
|
||||
},
|
||||
id: "3", name: "Natalia", role: "Kunde", testimonial: "Natalia ist eine Künstlerin.", imageSrc: "http://img.b2bpic.net/free-photo/attractive-young-woman-bathrobe-standing-front-mirror-putting-some-makeup_662251-2663.jpg"},
|
||||
{
|
||||
id: "4",
|
||||
name: "Julia",
|
||||
role: "Kunde",
|
||||
testimonial: "Beste Atmosphäre!",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-standing-isolated-background-approving-doing-positive-gesture-with-hand-thumbs-up-smiling-happy-success-winner-gesture_839833-25820.jpg",
|
||||
},
|
||||
id: "4", name: "Julia", role: "Kunde", testimonial: "Beste Atmosphäre!", imageSrc: "http://img.b2bpic.net/free-photo/young-man-standing-isolated-background-approving-doing-positive-gesture-with-hand-thumbs-up-smiling-happy-success-winner-gesture_839833-25820.jpg"},
|
||||
{
|
||||
id: "5",
|
||||
name: "Stefan",
|
||||
role: "Kunde",
|
||||
testimonial: "Sehr zu empfehlen.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149229813.jpg",
|
||||
},
|
||||
id: "5", name: "Stefan", role: "Kunde", testimonial: "Sehr zu empfehlen.", imageSrc: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149229813.jpg"},
|
||||
]}
|
||||
title="Kundenstimmen"
|
||||
description="Was unsere Kunden über uns sagen."
|
||||
@@ -239,32 +164,18 @@ export default function LandingPage() {
|
||||
<FaqBase
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
accordionClassName="hover:shadow-[0_0_10px_rgba(218,165,32,0.2)] transition-all duration-300"
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "Wie sind eure Öffnungszeiten?",
|
||||
content: "Wir haben Montag bis Freitag von 09:00 bis 19:00 Uhr für dich geöffnet.",
|
||||
},
|
||||
id: "q1", title: "Wie sind eure Öffnungszeiten?", content: "Wir haben Montag bis Freitag von 09:00 bis 19:00 Uhr für dich geöffnet."},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Wie buche ich einen Termin?",
|
||||
content: "Du kannst uns telefonisch erreichen oder ganz einfach das Kontaktformular auf dieser Seite nutzen.",
|
||||
},
|
||||
id: "q2", title: "Wie buche ich einen Termin?", content: "Du kannst uns telefonisch erreichen oder ganz einfach das Kontaktformular auf dieser Seite nutzen."},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Wo seid ihr zu finden?",
|
||||
content: "Wir befinden uns in der Issumer Str. 74, 47608 Geldern.",
|
||||
},
|
||||
id: "q3", title: "Wo seid ihr zu finden?", content: "Wir befinden uns in der Issumer Str. 74, 47608 Geldern."},
|
||||
{
|
||||
id: "q4",
|
||||
title: "Bietet ihr auch Beratung an?",
|
||||
content: "Ja, wir legen großen Wert auf eine persönliche Stilberatung vor jedem Haarschnitt oder jeder Coloration.",
|
||||
},
|
||||
id: "q4", title: "Bietet ihr auch Beratung an?", content: "Ja, wir legen großen Wert auf eine persönliche Stilberatung vor jedem Haarschnitt oder jeder Coloration."},
|
||||
{
|
||||
id: "q5",
|
||||
title: "Gibt es Parkplätze?",
|
||||
content: "Ja, in unmittelbarer Nähe befinden sich ausreichend Parkmöglichkeiten.",
|
||||
},
|
||||
id: "q5", title: "Gibt es Parkplätze?", content: "Ja, in unmittelbarer Nähe befinden sich ausreichend Parkmöglichkeiten."},
|
||||
]}
|
||||
title="Häufige Fragen"
|
||||
description="Alle Informationen auf einen Blick."
|
||||
@@ -277,22 +188,14 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
title="Kontaktiere uns"
|
||||
description="Wir freuen uns auf deinen Besuch! Issumer Str. 74, 47608 Geldern. Telefon: 02831 9169966."
|
||||
formCardClassName="hover:shadow-[0_0_30px_rgba(218,165,32,0.4)] transition-all duration-700 border-gold"
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Name",
|
||||
},
|
||||
name: "name", type: "text", placeholder: "Name"},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "E-Mail",
|
||||
},
|
||||
name: "email", type: "email", placeholder: "E-Mail"},
|
||||
{
|
||||
name: "phone",
|
||||
type: "tel",
|
||||
placeholder: "Telefon",
|
||||
},
|
||||
name: "phone", type: "tel", placeholder: "Telefon"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/side-view-woman-getting-ready-giving-haircut-her-client_23-2148353413.jpg"
|
||||
/>
|
||||
@@ -302,16 +205,12 @@ export default function LandingPage() {
|
||||
<FooterLogoReveal
|
||||
logoText="Relax Friseursalon"
|
||||
leftLink={{
|
||||
text: "Datenschutz",
|
||||
href: "#",
|
||||
}}
|
||||
text: "Datenschutz", href: "#"}}
|
||||
rightLink={{
|
||||
text: "Impressum",
|
||||
href: "#",
|
||||
}}
|
||||
text: "Impressum", href: "#"}}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #ffffff;
|
||||
--card: #f9f9f9;
|
||||
--foreground: #2b180a;
|
||||
--primary-cta: #c5a059;
|
||||
--background: #0a0a0a;
|
||||
--card: #171717;
|
||||
--foreground: #f5f5f5;
|
||||
--primary-cta: #d4af37;
|
||||
--primary-cta-text: #ffffff;
|
||||
--secondary-cta: #000000;
|
||||
--secondary-cta: #1a1a1a;
|
||||
--secondary-cta-text: #ffffff;
|
||||
--accent: #e5e5e5;
|
||||
--background-accent: #efebe5;
|
||||
--accent: #d4af37;
|
||||
--background-accent: #262626;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user