Merge version_1 into main #2
281
src/app/page.tsx
281
src/app/page.tsx
@@ -30,147 +30,58 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Galerie",
|
||||
id: "gallery",
|
||||
},
|
||||
{
|
||||
name: "Artists",
|
||||
id: "artists",
|
||||
},
|
||||
{
|
||||
name: "Anfrage",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Galerie", id: "gallery" },
|
||||
{ name: "Artists", id: "artists" },
|
||||
{ name: "Anfrage", id: "contact" },
|
||||
]}
|
||||
brandName="Tätowiert Bergheim"
|
||||
button={{
|
||||
text: "Termin Anfragen",
|
||||
href: "#contact",
|
||||
}}
|
||||
text: "Termin Anfragen", href: "#contact"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCentered
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
variant: "radial-gradient"}}
|
||||
title="Tätowiert Bergheim"
|
||||
description="Kunst unter die Haut. Exklusive Tattoo-Expertise in Bergheim."
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-tattoo-artist-indoors_23-2149445991.jpg",
|
||||
alt: "Sidney",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-tattoed-middle-age-hipster-man-with-beard-hairstyle-dressed-checkered-shirt-hat-pose-with-crossed-arms-studio-isolated-dark-textured-background_613910-4999.jpg",
|
||||
alt: "Marlon",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-brutal-bearded-male-with-tattoos-his-crossed-arms_613910-9495.jpg",
|
||||
alt: "Simone",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-attractive-tattoo-artist-black-gloves-is-tuning-her-tattoo-machine-before-tattoo-session_613910-17248.jpg",
|
||||
alt: "Sidney Team Member",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/pretty-expirienced-tattoo-artist-glasses-is-tuning-her-new-tattoo-machine-before-tattooing-session_613910-6063.jpg",
|
||||
alt: "Marlon Team Member",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-tattoo-artist-indoors_23-2149445991.jpg", alt: "Sidney" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-tattoed-middle-age-hipster-man-with-beard-hairstyle-dressed-checkered-shirt-hat-pose-with-crossed-arms-studio-isolated-dark-textured-background_613910-4999.jpg", alt: "Marlon" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-brutal-bearded-male-with-tattoos-his-crossed-arms_613910-9495.jpg", alt: "Simone" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/young-attractive-tattoo-artist-black-gloves-is-tuning-her-tattoo-machine-before-tattoo-session_613910-17248.jpg", alt: "Sidney Team Member" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/pretty-expirienced-tattoo-artist-glasses-is-tuning-her-new-tattoo-machine-before-tattooing-session_613910-6063.jpg", alt: "Marlon Team Member" },
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Termin anfragen",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
text: "Instagram",
|
||||
href: "https://instagram.com",
|
||||
},
|
||||
{
|
||||
text: "WhatsApp",
|
||||
href: "https://wa.me",
|
||||
},
|
||||
{ text: "Termin anfragen", href: "#contact" },
|
||||
{ text: "Instagram", href: "https://instagram.com" },
|
||||
{ text: "WhatsApp", href: "https://wa.me" },
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Realism & Portrait",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Fine Line & Dotwork",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Traditional & Black/Grey",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Geometric Design",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Individuelle Kunst",
|
||||
},
|
||||
{ type: "text", text: "Realism & Portrait" },
|
||||
{ type: "text", text: "Fine Line & Dotwork" },
|
||||
{ type: "text", text: "Traditional & Black/Grey" },
|
||||
{ type: "text", text: "Geometric Design" },
|
||||
{ type: "text", text: "Individuelle Kunst" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="gallery" data-section="gallery">
|
||||
<ProductCardFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Realism Portrait",
|
||||
price: "Artist: Sidney",
|
||||
variant: "Realism",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/shirtless-tattooed-hipster-young-man-with-flower-his-body-piercing-his-ears-nose-looking-camera_23-2148121956.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Fine Line Floral",
|
||||
price: "Artist: Simone",
|
||||
variant: "Fine Line",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-girl-smoking-cigarette-outdoors-background-wooden-stumps-concept-nicotine-addiction-by-teenagers_627829-10786.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Black & Grey Skull",
|
||||
price: "Artist: Marlon",
|
||||
variant: "B&G",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/black-white-mermaid-water_23-2151726903.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Dotwork Mandala",
|
||||
price: "Artist: Sidney",
|
||||
variant: "Dotwork",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-geometric-background-shapes-texture_1194-315214.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Traditional Sailor",
|
||||
price: "Artist: Marlon",
|
||||
variant: "Trad",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/asian-style-monster-tattoo-illustration_23-2150921863.jpg",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
name: "Geometric Abstract",
|
||||
price: "Artist: Simone",
|
||||
variant: "Abstract",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qyuwm0",
|
||||
},
|
||||
{ id: "1", name: "Realism Portrait", price: "Artist: Sidney", variant: "Realism", imageSrc: "http://img.b2bpic.net/free-photo/shirtless-tattooed-hipster-young-man-with-flower-his-body-piercing-his-ears-nose-looking-camera_23-2148121956.jpg" },
|
||||
{ id: "2", name: "Fine Line Floral", price: "Artist: Simone", variant: "Fine Line", imageSrc: "http://img.b2bpic.net/free-photo/young-girl-smoking-cigarette-outdoors-background-wooden-stumps-concept-nicotine-addiction-by-teenagers_627829-10786.jpg" },
|
||||
{ id: "3", name: "Black & Grey Skull", price: "Artist: Marlon", variant: "B&G", imageSrc: "http://img.b2bpic.net/free-photo/black-white-mermaid-water_23-2151726903.jpg" },
|
||||
{ id: "4", name: "Dotwork Mandala", price: "Artist: Sidney", variant: "Dotwork", imageSrc: "http://img.b2bpic.net/free-photo/abstract-geometric-background-shapes-texture_1194-315214.jpg" },
|
||||
{ id: "5", name: "Traditional Sailor", price: "Artist: Marlon", variant: "Trad", imageSrc: "http://img.b2bpic.net/free-vector/asian-style-monster-tattoo-illustration_23-2150921863.jpg" },
|
||||
{ id: "6", name: "Geometric Abstract", price: "Artist: Simone", variant: "Abstract", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qyuwm0" },
|
||||
]}
|
||||
title="Unsere Werke"
|
||||
description="Erlebe unsere neuesten Tattoo-Kreationen von Realism bis Fine Line."
|
||||
@@ -184,24 +95,9 @@ export default function LandingPage() {
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
members={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sidney",
|
||||
role: "Realism & Portrait Specialist",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-confident-stylish-hipster-lambersexual-model-sexy-modern-man-dressed-black-jacket-naked-torso-with-tattoosfashion-male-posing-studio-dark-background-spectacles_158538-21697.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Marlon",
|
||||
role: "Traditional & Black/Grey",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-bearded-male-with-tattooed-arms-dressed-plaid-flannel-shirt-sits-chair-dark-grey-background_613910-16042.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Simone",
|
||||
role: "Fine Line & Dotwork",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-brutal-bearded-male-sunglasses-with-tattoos-arms-neck_613910-9528.jpg",
|
||||
},
|
||||
{ id: "1", name: "Sidney", role: "Realism & Portrait Specialist", imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-confident-stylish-hipster-lambersexual-model-sexy-modern-man-dressed-black-jacket-naked-torso-with-tattoosfashion-male-posing-studio-dark-background-spectacles_158538-21697.jpg" },
|
||||
{ id: "2", name: "Marlon", role: "Traditional & Black/Grey", imageSrc: "http://img.b2bpic.net/free-photo/portrait-bearded-male-with-tattooed-arms-dressed-plaid-flannel-shirt-sits-chair-dark-grey-background_613910-16042.jpg" },
|
||||
{ id: "3", name: "Simone", role: "Fine Line & Dotwork", imageSrc: "http://img.b2bpic.net/free-photo/portrait-brutal-bearded-male-sunglasses-with-tattoos-arms-neck_613910-9528.jpg" },
|
||||
]}
|
||||
title="Unsere Artists"
|
||||
description="Triff unser Expertenteam hinter Tätowiert Bergheim."
|
||||
@@ -213,21 +109,9 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Was kostet ein Tattoo?",
|
||||
content: "Das hängt von Größe und Aufwand ab. Gerne besprechen wir das in einem Beratungstermin.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Wie alt muss ich sein?",
|
||||
content: "Tattoos werden bei uns ab dem 18. Lebensjahr gestochen.",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Wie bereite ich mich vor?",
|
||||
content: "Komme ausgeschlafen, fit und mit etwas Zucker im Blut. Pflegehinweise geben wir dir nach dem Stechen.",
|
||||
},
|
||||
{ id: "1", title: "Was kostet ein Tattoo?", content: "Das hängt von Größe und Aufwand ab. Gerne besprechen wir das in einem Beratungstermin." },
|
||||
{ id: "2", title: "Wie alt muss ich sein?", content: "Tattoos werden bei uns ab dem 18. Lebensjahr gestochen." },
|
||||
{ id: "3", title: "Wie bereite ich mich vor?", content: "Komme ausgeschlafen, fit und mit etwas Zucker im Blut. Pflegehinweise geben wir dir nach dem Stechen." },
|
||||
]}
|
||||
title="Alles was du wissen musst"
|
||||
description="Häufige Fragen rund um deinen Tattoo-Termin."
|
||||
@@ -240,61 +124,11 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah",
|
||||
date: "vor 2 Wochen",
|
||||
title: "Perfekte Arbeit",
|
||||
quote: "Ich liebe mein neues Fine Line Tattoo!",
|
||||
tag: "Sehr zufrieden",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/man-receiving-manicure-beauty-salon-relaxing-drinking-coffee-while-beautician-master-does-manicure-procedure_613910-20780.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pills-dark-environment_23-2151438426.jpg",
|
||||
imageAlt: "satisfied customer tattoo studio",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Markus",
|
||||
date: "vor 1 Monat",
|
||||
title: "Extrem kompetent",
|
||||
quote: "Super Beratung und mega Ergebnis.",
|
||||
tag: "Top Artist",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-glasses-smiling-pointing-fingers-up_176420-9500.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/shirtless-tattooed-hipster-young-man-with-flower-his-body-piercing-his-ears-nose-looking-camera_23-2148121956.jpg?_wi=2",
|
||||
imageAlt: "satisfied customer tattoo studio",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Lena",
|
||||
date: "vor 2 Monaten",
|
||||
title: "Sehr sauber",
|
||||
quote: "Alles steril und sehr professionell.",
|
||||
tag: "Empfehlenswert",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-charming-blonde-girl-posing-studio_176420-29622.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-girl-smoking-cigarette-outdoors-background-wooden-stumps-concept-nicotine-addiction-by-teenagers_627829-10786.jpg?_wi=2",
|
||||
imageAlt: "satisfied customer tattoo studio",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Tom",
|
||||
date: "vor 3 Monaten",
|
||||
title: "Beste Adresse",
|
||||
quote: "Für mich das beste Studio in NRW.",
|
||||
tag: "Immer wieder",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/smiling-artist_23-2147781629.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/black-white-mermaid-water_23-2151726903.jpg?_wi=2",
|
||||
imageAlt: "satisfied customer tattoo studio",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Julia",
|
||||
date: "vor 4 Monaten",
|
||||
title: "Traumhaft schön",
|
||||
quote: "Mein Portrait sieht absolut lebensecht aus.",
|
||||
tag: "Exzellent",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/bearded-stylish-man-sitting-cafe_273609-4481.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-geometric-background-shapes-texture_1194-315214.jpg?_wi=2",
|
||||
imageAlt: "satisfied customer tattoo studio",
|
||||
},
|
||||
{ id: "1", name: "Sarah", date: "vor 2 Wochen", title: "Perfekte Arbeit", quote: "Ich liebe mein neues Fine Line Tattoo!", tag: "Sehr zufrieden", avatarSrc: "http://img.b2bpic.net/free-photo/man-receiving-manicure-beauty-salon-relaxing-drinking-coffee-while-beautician-master-does-manicure-procedure_613910-20780.jpg", imageSrc: "http://img.b2bpic.net/free-photo/pills-dark-environment_23-2151438426.jpg", imageAlt: "satisfied customer tattoo studio" },
|
||||
{ id: "2", name: "Markus", date: "vor 1 Monat", title: "Extrem kompetent", quote: "Super Beratung und mega Ergebnis.", tag: "Top Artist", avatarSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-glasses-smiling-pointing-fingers-up_176420-9500.jpg", imageSrc: "http://img.b2bpic.net/free-photo/shirtless-tattooed-hipster-young-man-with-flower-his-body-piercing-his-ears-nose-looking-camera_23-2148121956.jpg", imageAlt: "satisfied customer tattoo studio" },
|
||||
{ id: "3", name: "Lena", date: "vor 2 Monaten", title: "Sehr sauber", quote: "Alles steril und sehr professionell.", tag: "Empfehlenswert", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-charming-blonde-girl-posing-studio_176420-29622.jpg", imageSrc: "http://img.b2bpic.net/free-photo/young-girl-smoking-cigarette-outdoors-background-wooden-stumps-concept-nicotine-addiction-by-teenagers_627829-10786.jpg", imageAlt: "satisfied customer tattoo studio" },
|
||||
{ id: "4", name: "Tom", date: "vor 3 Monaten", title: "Beste Adresse", quote: "Für mich das beste Studio in NRW.", tag: "Immer wieder", avatarSrc: "http://img.b2bpic.net/free-photo/smiling-artist_23-2147781629.jpg", imageSrc: "http://img.b2bpic.net/free-photo/black-white-mermaid-water_23-2151726903.jpg", imageAlt: "satisfied customer tattoo studio" },
|
||||
{ id: "5", name: "Julia", date: "vor 4 Monaten", title: "Traumhaft schön", quote: "Mein Portrait sieht absolut lebensecht aus.", tag: "Exzellent", avatarSrc: "http://img.b2bpic.net/free-photo/bearded-stylish-man-sitting-cafe_273609-4481.jpg", imageSrc: "http://img.b2bpic.net/free-photo/abstract-geometric-background-shapes-texture_1194-315214.jpg", imageAlt: "satisfied customer tattoo studio" },
|
||||
]}
|
||||
title="Kundenstimmen"
|
||||
description="Erfahrungen unserer zufriedenen Kunden."
|
||||
@@ -306,13 +140,7 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"Eternal Ink",
|
||||
"Dynamic Ink",
|
||||
"Cheyenne",
|
||||
"KWADRON",
|
||||
"World Famous",
|
||||
"InkTrox",
|
||||
"Stencil Stuff",
|
||||
"Eternal Ink", "Dynamic Ink", "Cheyenne", "KWADRON", "World Famous", "InkTrox", "Stencil Stuff"
|
||||
]}
|
||||
title="Vertraut von unseren Partnern"
|
||||
description="Wir arbeiten nur mit hochwertigsten Farben und Materialien."
|
||||
@@ -323,8 +151,7 @@ export default function LandingPage() {
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
variant: "radial-gradient"}}
|
||||
title="Werde Teil der Kunst"
|
||||
description="Starte jetzt deine Anfrage für deinen nächsten Wunsch-Termin bei uns."
|
||||
inputPlaceholder="Deine E-Mail Adresse"
|
||||
@@ -338,34 +165,16 @@ export default function LandingPage() {
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Hauptstr. 18, 50126 Bergheim",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Mo-Fr: 12–18 Uhr",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Sa: 12–16 Uhr",
|
||||
href: "#",
|
||||
},
|
||||
{ label: "Hauptstr. 18, 50126 Bergheim", href: "#" },
|
||||
{ label: "Mo-Fr: 12–18 Uhr", href: "#" },
|
||||
{ label: "Sa: 12–16 Uhr", href: "#" },
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Instagram",
|
||||
href: "https://instagram.com",
|
||||
},
|
||||
{
|
||||
label: "WhatsApp",
|
||||
href: "https://wa.me",
|
||||
},
|
||||
{
|
||||
label: "Datenschutz",
|
||||
href: "#",
|
||||
},
|
||||
{ label: "Instagram", href: "https://instagram.com" },
|
||||
{ label: "WhatsApp", href: "https://wa.me" },
|
||||
{ label: "Datenschutz", href: "#" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
Reference in New Issue
Block a user