Update src/app/page.tsx

This commit is contained in:
2026-05-06 20:32:08 +00:00
parent 6fd155ac13
commit ba83e271b5

View File

@@ -3,10 +3,10 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import AboutMetric from '@/components/sections/about/AboutMetric';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
@@ -31,18 +31,10 @@ export default function LandingPage() {
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{
name: "Home",
id: "hero",
},
{
name: "Usluge",
id: "services",
},
{
name: "Rezervacija",
id: "contact",
},
{ name: "Home", id: "hero" },
{ name: "Usluge", id: "services" },
{ name: "Galerija", id: "gallery" },
{ name: "Kontakt", id: "contact" },
]}
brandName="ELITE BARBER"
/>
@@ -51,109 +43,12 @@ export default function LandingPage() {
<div id="hero" data-section="hero">
<HeroBillboardTestimonial
useInvertedBackground={false}
background={{
variant: "gradient-bars",
}}
background={{ variant: "gradient-bars" }}
title="Vrhunsko iskustvo dotjerivanja"
description="Zakoračite u svijet gdje se tradicija susreće sa modernom preciznošću. Naš tim stručnjaka posvećen je vašem besprijekornom izgledu."
testimonials={[
{
name: "Marko P.",
handle: "@marko",
testimonial: "Najbolji barbershop u gradu, vrhunska usluga.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-washbasin_107420-94763.jpg?_wi=1",
imageAlt: "luxurious barbershop interior dark theme",
},
{
name: "Ivan K.",
handle: "@ivan",
testimonial: "Profesionalizam i elegancija na svakom koraku.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/hairdressing-equipment-white-background_23-2147711627.jpg",
imageAlt: "luxurious barbershop interior dark theme",
},
{
name: "Luka M.",
handle: "@luka",
testimonial: "Uvijek izađem zadovoljan, svaka preporuka.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-getting-groomed_23-2149141771.jpg",
imageAlt: "luxurious barbershop interior dark theme",
},
{
name: "Filip S.",
handle: "@filip",
testimonial: "Ambijent je fantastičan, usluga jos bolja.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-with-his-dog_23-2147840130.jpg",
imageAlt: "luxurious barbershop interior dark theme",
},
{
name: "Dino B.",
handle: "@dino",
testimonial: "Prava muška oaza, vrhunski majstori.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-head-young-bearded-man-getting-haircut-barbershop-barber-soul_627829-6363.jpg?_wi=1",
imageAlt: "luxurious barbershop interior dark theme",
},
]}
buttons={[
{
text: "Rezerviši termin",
href: "#contact",
},
{
text: "Naše usluge",
href: "#services",
},
]}
testimonials={[]}
buttons={[{ text: "Rezerviši termin", href: "#contact" }, { text: "Naše usluge", href: "#services" }]}
imageSrc="http://img.b2bpic.net/free-photo/close-up-washbasin_107420-94763.jpg?_wi=2"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/various-trimmers-dressing-table_107420-94767.jpg",
alt: "Barber tools",
},
{
src: "http://img.b2bpic.net/free-photo/hairdresser-cutting-man-s-hair-barber-shop_23-2149186474.jpg",
alt: "Barber at work",
},
{
src: "http://img.b2bpic.net/free-photo/professional-hairdresser-sitting-barber-chair-waiting-customer_613910-3902.jpg",
alt: "Barber chair",
},
{
src: "http://img.b2bpic.net/free-photo/young-man-barber-s-shop-getting-his-beard-trimmed_23-2149186494.jpg",
alt: "Beard trim",
},
{
src: "http://img.b2bpic.net/free-photo/vintage-salon-tools-jobs-career-concept_53876-127080.jpg",
alt: "Tools setup",
},
]}
avatarText="Pridružite se 2000+ zadovoljnih klijenata"
marqueeItems={[
{
type: "text",
text: "Moderan stil",
},
{
type: "text",
text: "Precizno šišanje",
},
{
type: "text",
text: "Premium njega",
},
{
type: "text",
text: "Tradicionalna metoda",
},
{
type: "text",
text: "Vrhunski proizvodi",
},
]}
/>
</div>
@@ -162,21 +57,9 @@ export default function LandingPage() {
useInvertedBackground={false}
title="Naša posvećenost"
metrics={[
{
label: "Zadovoljnih klijenata",
value: "2,500+",
icon: Users,
},
{
label: "Godina iskustva",
value: "12",
icon: Award,
},
{
label: "Premium usluga",
value: "15+",
icon: Scissors,
},
{ label: "Zadovoljnih klijenata", value: "2,500+", icon: Users },
{ label: "Godina iskustva", value: "12", icon: Award },
{ label: "Premium usluga", value: "15+", icon: Scissors },
]}
metricsAnimation="slide-up"
/>
@@ -188,45 +71,9 @@ export default function LandingPage() {
textboxLayout="default"
useInvertedBackground={false}
features={[
{
id: "1",
title: "Klasično šišanje",
subtitle: "Tradicionalna preciznost sa modernim detaljima.",
category: "Frizura",
value: "30€",
buttons: [
{
text: "Saznaj više",
href: "#",
},
],
},
{
id: "2",
title: "Uređivanje brade",
subtitle: "Dizajniranje i precizno oblikovanje brade.",
category: "Brada",
value: "20€",
buttons: [
{
text: "Saznaj više",
href: "#",
},
],
},
{
id: "3",
title: "Deluxe tretman",
subtitle: "Sveobuhvatni tretman za njegu lica i kose.",
category: "Tretmani",
value: "50€",
buttons: [
{
text: "Saznaj više",
href: "#",
},
],
},
{ id: "1", title: "Klasično šišanje", subtitle: "Tradicionalna preciznost sa modernim detaljima.", category: "Frizura", value: "30€" },
{ id: "2", title: "Uređivanje brade", subtitle: "Dizajniranje i precizno oblikovanje brade.", category: "Brada", value: "20€" },
{ id: "3", title: "Deluxe tretman", subtitle: "Sveobuhvatni tretman za njegu lica i kose.", category: "Tretmani", value: "50€" },
]}
title="Premium Usluge"
description="Individualni pristup za svakog klijenta."
@@ -238,46 +85,14 @@ export default function LandingPage() {
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
useInvertedBackground={true}
products={[
{
id: "w1",
name: "Fade cut",
price: "Moderna frizura",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-head-young-bearded-man-getting-haircut-barbershop-barber-soul_627829-6363.jpg?_wi=2",
},
{
id: "w2",
name: "Beard trim",
price: "Oblikovana brada",
imageSrc: "http://img.b2bpic.net/free-photo/bearded-male-dressed-fleece-shirt-talks-by-smart-phone-park_613910-3280.jpg",
},
{
id: "w3",
name: "Classic scissor",
price: "Šišanje makazama",
imageSrc: "http://img.b2bpic.net/free-photo/red_1385-786.jpg",
},
{
id: "w4",
name: "Executive cut",
price: "Poslovni look",
imageSrc: "http://img.b2bpic.net/free-photo/elegant-young-handsome-man-studio-fashion-portrait_1301-3984.jpg",
},
{
id: "w5",
name: "Sharp beard",
price: "Precizne linije",
imageSrc: "http://img.b2bpic.net/free-photo/man-hair-salon-looking-sideways_23-2148242781.jpg",
},
{
id: "w6",
name: "Modern taper",
price: "Kratki stil",
imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-before-after-rhinoplasty_23-2149947584.jpg",
},
{ id: "w1", name: "Fade cut", price: "Moderna frizura", imageSrc: "http://img.b2bpic.net/free-photo/close-up-head-young-bearded-man-getting-haircut-barbershop-barber-soul_627829-6363.jpg?_wi=2" },
{ id: "w2", name: "Beard trim", price: "Oblikovana brada", imageSrc: "http://img.b2bpic.net/free-photo/bearded-male-dressed-fleece-shirt-talks-by-smart-phone-park_613910-3280.jpg" },
{ id: "w3", name: "Classic scissor", price: "Šišanje makazama", imageSrc: "http://img.b2bpic.net/free-photo/red_1385-786.jpg" },
{ id: "w4", name: "Executive cut", price: "Poslovni look", imageSrc: "http://img.b2bpic.net/free-photo/elegant-young-handsome-man-studio-fashion-portrait_1301-3984.jpg" },
]}
title="Naši radovi"
title="Naša Galerija"
description="Pogledajte eleganciju u svakom rezu."
/>
</div>
@@ -287,62 +102,8 @@ export default function LandingPage() {
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "t1",
name: "Nikola B.",
role: "Dizajner",
company: "Creative",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-blond-bearded-male-dressed-black-leather-jacket_613910-11927.jpg",
},
{
id: "t2",
name: "Stefan G.",
role: "Poduzetnik",
company: "Tech",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/barber-shaves-bearded-man-vintage-atmosphere_1153-7903.jpg",
},
{
id: "t3",
name: "Ivan S.",
role: "Arhitekta",
company: "Studio",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-serious-middle-age-bearded-male-dressed-plaid-flannel-shirt-grey-background_613910-16272.jpg",
},
{
id: "t4",
name: "Dražen V.",
role: "Advokat",
company: "Law",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-sitting-chair_23-2149220530.jpg",
},
{
id: "t5",
name: "Petar M.",
role: "Direktor",
company: "Corpo",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/front-view-barber-shop-concept_23-2148506342.jpg",
},
]}
kpiItems={[
{
label: "Ocjena",
value: "4.9",
},
{
label: "Klijenata",
value: "2k+",
},
{
label: "Zadovoljstvo",
value: "100%",
},
]}
testimonials={[]}
kpiItems={[{ value: "4.9", label: "Ocjena" }, { value: "2k+", label: "Klijenata" }, { value: "100%", label: "Zadovoljstvo" }]}
title="Šta kažu klijenti"
description="Povjerenje gradimo kvalitetom."
/>
@@ -352,23 +113,7 @@ export default function LandingPage() {
<FaqDouble
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{
id: "q1",
title: "Kako zakazati termin?",
content: "Termin možete zakazati putem kontakt forme na dnu stranice ili pozivom.",
},
{
id: "q2",
title: "Koje su metode plaćanja?",
content: "Prihvatamo gotovinsko plaćanje i sve kartične sisteme.",
},
{
id: "q3",
title: "Koliko traje šišanje?",
content: "Prosječno šišanje traje oko 30 do 45 minuta zavisno od stila.",
},
]}
faqs={[]}
title="Često postavljana pitanja"
description="Saznajte više o našem procesu."
faqsAnimation="slide-up"
@@ -376,62 +121,27 @@ export default function LandingPage() {
</div>
<div id="contact" data-section="contact">
<ContactCenter
useInvertedBackground={false}
background={{
variant: "gradient-bars",
}}
tag="Kontakt"
title="Rezervacija termina"
description="Unesite detalje za vaš termin i javit ćemo vam se uskoro."
inputPlaceholder="Vaša email adresa"
buttonText="Rezerviši"
/>
<ContactSplitForm
useInvertedBackground={true}
title="Kontaktirajte nas"
description="Rezervišite termin ili nas posjetite na lokaciji: Glavna Ulica 123, Sarajevo."
inputs={[{ name: "name", type: "text", placeholder: "Ime i prezime", required: true }, { name: "email", type: "email", placeholder: "Email adresa", required: true }]}
textarea={{ name: "message", placeholder: "Vaša poruka", rows: 4 }}
buttonText="Pošalji"
/>
</div>
<div id="footer" data-section="footer">
<FooterSimple
<FooterBaseReveal
logoText="ELITE BARBER"
columns={[
{
title: "Navigacija",
items: [
{
label: "Početna",
href: "#hero",
},
{
label: "Usluge",
href: "#services",
},
{
label: "Kontakt",
href: "#contact",
},
],
},
{
title: "Social",
items: [
{
label: "Instagram",
href: "#",
},
{
label: "Facebook",
href: "#",
},
{
label: "Twitter",
href: "#",
},
],
},
{ title: "Navigacija", items: [{ label: "Početna", href: "#hero" }, { label: "Usluge", href: "#services" }, { label: "Kontakt", href: "#contact" }] },
{ title: "Socijalne mreže", items: [{ label: "Instagram", href: "#" }, { label: "Facebook", href: "#" }] },
]}
bottomLeftText="© 2024 ELITE BARBER. Sva prava pridržana."
bottomRightText="Lokacija: Glavna Ulica 123, Sarajevo"
copyrightText="© 2024 ELITE BARBER. Sva prava pridržana."
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}
}