Merge version_2 into main #2
279
src/app/page.tsx
279
src/app/page.tsx
@@ -9,19 +9,19 @@ import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import TeamCardFive from '@/components/sections/team/TeamCardFive';
|
||||
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
||||
import { Clock, Coffee, Star } from "lucide-react";
|
||||
import { Clock, Coffee, Star, Scissors, Sparkles, Smile } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-shift"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
contentWidth="compact"
|
||||
sizing="mediumLargeSizeLargeTitles"
|
||||
defaultButtonVariant="hover-magnetic"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="rounded"
|
||||
contentWidth="mediumLarge"
|
||||
sizing="largeSizeMediumTitles"
|
||||
background="noiseDiagonalGradient"
|
||||
cardStyle="gradient-radial"
|
||||
primaryButtonStyle="double-inset"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="primary-glow"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
@@ -29,26 +29,11 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Hjem",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Om Oss",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Team",
|
||||
id: "team",
|
||||
},
|
||||
{
|
||||
name: "Anmeldelser",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Kontakt",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Hjem", id: "hero" },
|
||||
{ name: "Hvorfor oss", id: "about" },
|
||||
{ name: "Team", id: "team" },
|
||||
{ name: "Erfaringer", id: "testimonials" },
|
||||
{ name: "Kontakt", id: "contact" },
|
||||
]}
|
||||
brandName="MR. Barber"
|
||||
/>
|
||||
@@ -56,89 +41,31 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
title="Presisjon og Stil hos MR. Barber"
|
||||
description="Opplev byens beste fade, skjeggtrim og profesjonell service i en atmosfære der du alltid føler deg velkommen. Velkommen til din nye faste frisør i Lørenskog."
|
||||
tag="Best i byen"
|
||||
buttons={[
|
||||
{
|
||||
text: "Bestill time",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
title="Presisjon, Atmosfære og Ibrahim"
|
||||
description="MR. Barber setter standarden i Lørenskog. Fra den perfekte fade til god stemning i stolen - vi kombinerer rimelige priser med topp håndverk."
|
||||
tag="Din lokale favoritt"
|
||||
tagIcon={Scissors}
|
||||
buttons={[{ text: "Bestill din time", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/full-shot-man-getting-haircut_23-2149220553.jpg?_wi=1"
|
||||
imageAlt="MR. Barber interiør"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/smiling-broadly-business-woman-showing-thumb-up_1262-1127.jpg",
|
||||
alt: "Kunde 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205917.jpg",
|
||||
alt: "Kunde 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/headshot-handsome-bearded-man-smiling-standing-against-white-background_1258-112102.jpg",
|
||||
alt: "Kunde 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-vector/instagram-post-collection-template-with-photo_23-2148304306.jpg",
|
||||
alt: "Kunde 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/man-looking-mirror-medium-shot_23-2149141782.jpg",
|
||||
alt: "Kunde 5",
|
||||
},
|
||||
]}
|
||||
avatarText="Over 500+ fornøyde kunder"
|
||||
imageAlt="MR. Barber atmosfære"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Klassisk klipp",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Skjeggtrim",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Skinfade",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Hodebunnsmassasje",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Profesjonell styling",
|
||||
},
|
||||
{ type: "text", text: "Skinfade" },
|
||||
{ type: "text", text: "Skjeggtrim" },
|
||||
{ type: "text", text: "Klassisk Klipp" },
|
||||
{ type: "text", text: "Profesjonell service" },
|
||||
{ type: "text", text: "God stemning" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="Hvorfor velge MR. Barber?"
|
||||
title="Hvorfor MR. Barber er ditt førstevalg"
|
||||
metrics={[
|
||||
{
|
||||
icon: Star,
|
||||
label: "Kunder fornøyd",
|
||||
value: "100%",
|
||||
},
|
||||
{
|
||||
icon: Clock,
|
||||
label: "God tid til detaljer",
|
||||
value: "Alltid",
|
||||
},
|
||||
{
|
||||
icon: Coffee,
|
||||
label: "Gratis kaffe",
|
||||
value: "Ja",
|
||||
},
|
||||
{ icon: Star, label: "Presisjon", value: "100%" },
|
||||
{ icon: Clock, label: "God stemning", value: "Hver gang" },
|
||||
{ icon: Coffee, label: "Rimelige priser", value: "Alltid" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
@@ -148,159 +75,59 @@ export default function LandingPage() {
|
||||
<TeamCardFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="Møt Ibrahim og teamet"
|
||||
description="Hos oss er det Ibrahim og resten av gjengen som sørger for at du går ut døra med en ny, skarp stil hver gang. Velkommen til en barbershop som tar deg på alvor."
|
||||
team={[
|
||||
{
|
||||
id: "ibrahim",
|
||||
name: "Ibrahim",
|
||||
role: "Master Barber",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-looking-mirror-medium-shot_23-2149141782.jpg?_wi=1",
|
||||
imageAlt: "Ibrahim",
|
||||
id: "ibrahim", name: "Ibrahim", role: "Master Barber & Grunnlegger", imageSrc: "http://img.b2bpic.net/free-photo/man-looking-mirror-medium-shot_23-2149141782.jpg?_wi=1", imageAlt: "Ibrahim"
|
||||
},
|
||||
{
|
||||
id: "jihad",
|
||||
name: "Jihad",
|
||||
role: "Barber",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blurred-woman-shaving-man_23-2147778910.jpg?_wi=1",
|
||||
imageAlt: "Jihad",
|
||||
},
|
||||
id: "jihad", name: "Jihad", role: "Barber", imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205917.jpg?_wi=1", imageAlt: "Jihad"
|
||||
}
|
||||
]}
|
||||
title="Møt våre eksperter"
|
||||
description="Våre dyktige barbere brenner for faget sitt og tar seg alltid tid til å lytte til dine ønsker."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="Kundene våre forteller"
|
||||
description="Se hvorfor våre kunder i Lørenskog kommer tilbake igjen og igjen."
|
||||
tag="Kundeopplevelser"
|
||||
tagIcon={Smile}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Martin Skogheim",
|
||||
date: "4 måneder siden",
|
||||
title: "Beste opplevelsen!",
|
||||
quote: "Veldig dyktige barbere. Alle holder høy klasse.",
|
||||
tag: "Fast kunde",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/smiling-broadly-business-woman-showing-thumb-up_1262-1127.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-getting-haircut_23-2149220553.jpg?_wi=2",
|
||||
imageAlt: "barbershop interior classic style",
|
||||
id: "1", name: "Martin Skogheim", date: "Forrige måned", title: "Eksepsjonell presisjon", quote: "Ibrahim er i en klasse for seg selv. Beste fade i Lørenskog.", tag: "Stammis", avatarSrc: "http://img.b2bpic.net/free-photo/smiling-broadly-business-woman-showing-thumb-up_1262-1127.jpg", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-getting-haircut_23-2149220553.jpg?_wi=2"
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Omar",
|
||||
date: "8 måneder siden",
|
||||
title: "Perfekt fade",
|
||||
quote: "Ibrahim tok seg god tid til å lytte. Resultatet ble perfekt.",
|
||||
tag: "Anbefales",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205917.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-looking-mirror-medium-shot_23-2149141782.jpg?_wi=2",
|
||||
imageAlt: "barber portrait professional",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Ståle Hørlyk",
|
||||
date: "10 måneder siden",
|
||||
title: "Elegant interiør",
|
||||
quote: "Elegant interiør og meget dyktige fagfolk.",
|
||||
tag: "Topp service",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/headshot-handsome-bearded-man-smiling-standing-against-white-background_1258-112102.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blurred-woman-shaving-man_23-2147778910.jpg?_wi=2",
|
||||
imageAlt: "barber working on hair fade",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "John Kaluba",
|
||||
date: "7 måneder siden",
|
||||
title: "Klipper alt",
|
||||
quote: "De klipper alt slags typer hår inkludert skinfade.",
|
||||
tag: "Proff",
|
||||
avatarSrc: "http://img.b2bpic.net/free-vector/instagram-post-collection-template-with-photo_23-2148304306.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-broadly-business-woman-showing-thumb-up_1262-1127.jpg",
|
||||
imageAlt: "happy male customer smiling",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Erik Nilsen",
|
||||
date: "2 måneder siden",
|
||||
title: "Veldig fornøyd",
|
||||
quote: "Gjør alltid en fantastisk jobb, profesjonelt.",
|
||||
tag: "Stammis",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/smiling-broadly-business-woman-showing-thumb-up_1262-1127.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205917.jpg",
|
||||
imageAlt: "young customer happy smile",
|
||||
},
|
||||
id: "2", name: "Omar", date: "2 måneder siden", title: "Hyggelig atmosfære", quote: "Alltid god stemning, rimelig pris og fantastisk service.", tag: "Anbefales", avatarSrc: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205917.jpg", imageSrc: "http://img.b2bpic.net/free-photo/man-looking-mirror-medium-shot_23-2149141782.jpg?_wi=2"
|
||||
}
|
||||
]}
|
||||
title="Hva kundene sier"
|
||||
description="Vi er stolte av å være kundens foretrukne valg i Lørenskog."
|
||||
textboxLayout="split"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Bestill time"
|
||||
title="Klar for en ny klipp?"
|
||||
description="Besøk oss i dag for en profesjonell opplevelse i en behagelig atmosfære."
|
||||
buttons={[
|
||||
{
|
||||
text: "Ring oss",
|
||||
href: "tel:+4700000000",
|
||||
},
|
||||
]}
|
||||
tag="Booking"
|
||||
tagIcon={Sparkles}
|
||||
title="Klar for å oppgradere stilen?"
|
||||
description="Book din time hos MR. Barber i dag. Rimelige priser, presisjon i hver bevegelse og byens beste stemning."
|
||||
buttons={[{ text: "Ring oss for booking", href: "tel:+4700000000" }]}
|
||||
background={{ variant: "radial-gradient" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
columns={[
|
||||
{
|
||||
title: "MR. Barber",
|
||||
items: [
|
||||
{
|
||||
label: "Hjem",
|
||||
href: "#hero",
|
||||
},
|
||||
{
|
||||
label: "Om oss",
|
||||
href: "#about",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Tjenester",
|
||||
items: [
|
||||
{
|
||||
label: "Hårklipp",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Skjeggtrim",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Kontakt",
|
||||
items: [
|
||||
{
|
||||
label: "Lørenskog, Norge",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Følg oss på IG",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ title: "MR. Barber", items: [{ label: "Hjem", href: "#nav" }, { label: "Team", href: "#team" }] },
|
||||
{ title: "Tjenester", items: [{ label: "Fade", href: "#" }, { label: "Skjegg", href: "#" }] },
|
||||
{ title: "Kontakt", items: [{ label: "Lørenskog sentrum", href: "#" }, { label: "Instagram", href: "#" }] },
|
||||
]}
|
||||
copyrightText="© 2024 MR. Barber. Alle rettigheter reservert."
|
||||
copyrightText="© 2024 MR. Barber"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user