Merge version_2 into main #2
310
src/app/page.tsx
310
src/app/page.tsx
@@ -2,17 +2,16 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
||||
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
|
||||
import FooterCard from '@/components/sections/footer/FooterCard';
|
||||
import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';
|
||||
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
||||
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
||||
import { Award, Building2, Calendar } from "lucide-react";
|
||||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||||
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
||||
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
||||
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
||||
import { Award, Building2, Calendar, HardHat, ShieldCheck, CheckCircle } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -26,291 +25,112 @@ export default function LandingPage() {
|
||||
cardStyle="gradient-mesh"
|
||||
primaryButtonStyle="radial-glow"
|
||||
secondaryButtonStyle="layered"
|
||||
headingFontWeight="light"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Početna",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "O nama",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Usluge",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Kontakt",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Početna", id: "hero" },
|
||||
{ name: "O nama", id: "about" },
|
||||
{ name: "Usluge", id: "features" },
|
||||
{ name: "Kontakt", id: "contact" },
|
||||
]}
|
||||
brandName="Hamza Gradnja d.o.o."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlayTestimonial
|
||||
title="Hamza Gradnja d.o.o. – Gradimo vašu budućnost"
|
||||
description="Profesionalne usluge gradnje, renovacije i adaptacije objekata s naglaskom na kvalitetu, sigurnost i poštivanje rokova."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Marko Ivić",
|
||||
handle: "@klijent",
|
||||
testimonial: "Izuzetno profesionalna ekipa, radovi završeni prije roka. Preporuka svima!",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/indoor-shot-happy-gorgeous-woman-with-relaxed-smile-spending-nice-time-cafe_273609-9043.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
name: "Ana Marković",
|
||||
handle: "@klijent",
|
||||
testimonial: "Kvaliteta izvedbe je vrhunska, komunikacija jednostavna i jasna.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-black-man-standing-wall_181624-23159.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
name: "Ivan Horvat",
|
||||
handle: "@klijent",
|
||||
testimonial: "Pouzdan partner u gradnji, sve ispoštovano prema dogovoru.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-joyful-beautiful-africanamerican-woman-laughing-looking-happy-standing-yello_1258-130860.jpg",
|
||||
},
|
||||
{
|
||||
name: "Jelena Stanić",
|
||||
handle: "@klijent",
|
||||
testimonial: "Brzi, efikasni i vrlo pedantni. Odlična suradnja.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stuido-portrait-happy-cheerful-young-businessman_273609-12506.jpg",
|
||||
},
|
||||
{
|
||||
name: "Petar Bilić",
|
||||
handle: "@klijent",
|
||||
testimonial: "Sve pohvale za Hamza Gradnju, vrhunski su odradili adaptaciju stana.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-cafe_273609-12690.jpg",
|
||||
},
|
||||
<HeroBillboardCarousel
|
||||
title="Hamza Gradnja d.o.o. – Vrhunska gradnja i adaptacija"
|
||||
description="Vaš pouzdan partner za sve vrste građevinskih radova. Spajamo tradiciju, znanje i suvremene tehnologije za dugotrajne rezultate."
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/round-saw-hands-builder-work-laying-paving-slabs_1150-10080.jpg?_wi=1", imageAlt: "Građevinski radovi" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/low-angle-shot-big-blue-metal-bridge-sunny-day_181624-2755.jpg?_wi=1", imageAlt: "Infrastrukturni projekt" }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/round-saw-hands-builder-work-laying-paving-slabs_1150-10080.jpg?_wi=1"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/round-saw-hands-builder-work-laying-paving-slabs_1150-10080.jpg",
|
||||
alt: "Klijent Marko Ivić",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/low-angle-shot-big-blue-metal-bridge-sunny-day_181624-2755.jpg",
|
||||
alt: "Klijent Ana Marković",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/indoor-shot-happy-gorgeous-woman-with-relaxed-smile-spending-nice-time-cafe_273609-9043.jpg",
|
||||
alt: "Klijent Ivan Horvat",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/smiling-black-man-standing-wall_181624-23159.jpg",
|
||||
alt: "Klijent Jelena Stanić",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/closeup-joyful-beautiful-africanamerican-woman-laughing-looking-happy-standing-yello_1258-130860.jpg",
|
||||
alt: "Klijent Petar Bilić",
|
||||
},
|
||||
]}
|
||||
avatarText="Pridružite se 200+ zadovoljnih klijenata"
|
||||
buttons={[{ text: "Zatražite ponudu", href: "#contact" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
tag="O nama"
|
||||
title="Tradicija i kvaliteta u svakom detalju"
|
||||
description="Hamza Gradnja d.o.o. je tvrtka s dugogodišnjim iskustvom u niskogradnji i visokogradnji."
|
||||
subdescription="Naša misija je osigurati trajnost i estetiku kroz suvremene tehnike građenja i korištenje certificiranih materijala."
|
||||
icon={Building2}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/low-angle-shot-big-blue-metal-bridge-sunny-day_181624-2755.jpg?_wi=1"
|
||||
mediaAnimation="slide-up"
|
||||
<MetricSplitMediaAbout
|
||||
title="Iskustvo koje gradi povjerenje"
|
||||
description="Hamza Gradnja d.o.o. donosi višegodišnju stručnost u niskogradnji i visokogradnji. Svaki projekt tretiramo s istom pažnjom prema detaljima."
|
||||
metrics={[{ value: "15+", title: "Godina rada" }, { value: "200+", title: "Projekata" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/stuido-portrait-happy-cheerful-young-businessman_273609-12506.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardSixteen
|
||||
<FeatureCardOne
|
||||
title="Zašto izabrati nas?"
|
||||
description="Naše usluge pokrivaju sve faze gradnje uz maksimalnu transparentnost."
|
||||
features={[
|
||||
{ title: "Stručnost", description: "Tim visoko kvalificiranih majstora.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-of-construction-worker-with-hard-hat_23-2148756314.jpg" },
|
||||
{ title: "Kvalitetni materijali", description: "Koristimo samo provjerene materijale.", imageSrc: "http://img.b2bpic.net/free-photo/bricks-construction-site_1150-3889.jpg" },
|
||||
{ title: "Poštivanje rokova", description: "Vrijeme je dragocjeno, zato ga poštujemo.", imageSrc: "http://img.b2bpic.net/free-photo/clock-on-construction-site_1150-4829.jpg" }
|
||||
]}
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
negativeCard={{
|
||||
items: [
|
||||
"Skriveni troškovi",
|
||||
"Nedostatak transparentnosti",
|
||||
"Kašnjenje s rokovima",
|
||||
],
|
||||
}}
|
||||
positiveCard={{
|
||||
items: [
|
||||
"Detaljna predračunska vrijednost",
|
||||
"Transparentan proces",
|
||||
"Striktno poštivanje rokova",
|
||||
],
|
||||
}}
|
||||
title="Naša filozofija"
|
||||
description="Zašto odabrati nas kao partnera u vašem sljedećem projektu?"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
animationType="scale-rotate"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
<MetricCardThree
|
||||
title="Naš učinak u brojkama"
|
||||
metrics={[
|
||||
{
|
||||
id: "1",
|
||||
value: "200+",
|
||||
title: "Završenih objekata",
|
||||
description: "Uspješno izvedeni projekti diljem regije.",
|
||||
icon: Building2,
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
value: "15",
|
||||
title: "Godina iskustva",
|
||||
description: "Dugogodišnja prisutnost na tržištu.",
|
||||
icon: Calendar,
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
value: "100%",
|
||||
title: "Zadovoljnih klijenata",
|
||||
description: "Fokusirani smo na dugoročno povjerenje.",
|
||||
icon: Award,
|
||||
},
|
||||
{ id: "m1", icon: Building2, title: "Objekata", value: "200+" },
|
||||
{ id: "m2", icon: ShieldCheck, title: "Sigurnost", value: "100%" },
|
||||
{ id: "m3", icon: HardHat, title: "Majstora", value: "50+" }
|
||||
]}
|
||||
title="Naši rezultati"
|
||||
description="Kvaliteta koja govori za sebe kroz brojke naših uspjeha."
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials-section" data-section="testimonials-section">
|
||||
<TestimonialCardTen
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
<TestimonialCardTwo
|
||||
title="Klijenti o nama"
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
title: "Izvrsno!",
|
||||
quote: "Profesionalan pristup od samog početka.",
|
||||
name: "Marko I.",
|
||||
role: "Investitor",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-jogging-rainy-city_23-2147618039.jpg",
|
||||
imageAlt: "Man jogging in rainy city",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
title: "Profesionalci",
|
||||
quote: "Sve je odrađeno točno po projektu.",
|
||||
name: "Ana M.",
|
||||
role: "Vlasnica kuće",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/round-saw-hands-builder-work-laying-paving-slabs_1150-10080.jpg?_wi=2",
|
||||
imageAlt: "Man jogging in rainy city",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
title: "Jako zadovoljan",
|
||||
quote: "Odlična komunikacija i poštivanje dogovorenog.",
|
||||
name: "Ivan H.",
|
||||
role: "Poduzetnik",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/low-angle-shot-big-blue-metal-bridge-sunny-day_181624-2755.jpg?_wi=2",
|
||||
imageAlt: "Man jogging in rainy city",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
title: "Preporuka",
|
||||
quote: "Brzo, precizno i uredno.",
|
||||
name: "Jelena S.",
|
||||
role: "Klijent",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/indoor-shot-happy-gorgeous-woman-with-relaxed-smile-spending-nice-time-cafe_273609-9043.jpg?_wi=2",
|
||||
imageAlt: "Man jogging in rainy city",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
title: "Vrhunska usluga",
|
||||
quote: "Iznimna kvaliteta radova.",
|
||||
name: "Petar B.",
|
||||
role: "Investitor",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-black-man-standing-wall_181624-23159.jpg?_wi=2",
|
||||
imageAlt: "Man jogging in rainy city",
|
||||
},
|
||||
{ id: "t1", name: "Marko I.", role: "Investitor", testimonial: "Hamza Gradnja je ispunila sva očekivanja. Sve pohvale!", icon: CheckCircle },
|
||||
{ id: "t2", name: "Ana M.", role: "Arhitekt", testimonial: "Izuzetno precizni i pedantni u radu.", icon: CheckCircle },
|
||||
]}
|
||||
title="Što klijenti kažu o nama"
|
||||
description="Povjerenje naših klijenata je naša najveća nagrada."
|
||||
animationType="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
<FaqDouble
|
||||
title="Česta pitanja"
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Radite li na području cijele Hrvatske?",
|
||||
content: "Da, naše usluge su dostupne klijentima diljem cijele države.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Dajete li jamstvo na radove?",
|
||||
content: "Svi naši radovi su popraćeni odgovarajućim jamstvima i atestima.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Kako dobiti ponudu?",
|
||||
content: "Pošaljite nam upit putem kontakt obrasca ili nas nazovite.",
|
||||
},
|
||||
{ id: "f1", title: "Radite li procjene troškova?", content: "Da, izrađujemo detaljne predračune besplatno." },
|
||||
{ id: "f2", title: "Koje je područje rada?", content: "Radimo na cijelom području Hrvatske." }
|
||||
]}
|
||||
sideTitle="Česta pitanja"
|
||||
faqsAnimation="blur-reveal"
|
||||
sideDescription="Imate nedoumica? Ovdje potražite odgovore na najčešća pitanja o našim uslugama."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="social" data-section="social">
|
||||
<SocialProofOne
|
||||
faqsAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"Partner 1",
|
||||
"Partner 2",
|
||||
"Partner 3",
|
||||
"Partner 4",
|
||||
"Partner 5",
|
||||
"Partner 6",
|
||||
"Partner 7",
|
||||
]}
|
||||
title="Naši pouzdani partneri"
|
||||
description="Suradnja s vodećim dobavljačima i inženjerskim uredima."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Kontakt"
|
||||
title="Započnimo suradnju"
|
||||
description="Imate li projekt u planu? Kontaktirajte nas za neobvezujuću ponudu."
|
||||
<ContactCTA
|
||||
tag="Kontaktirajte nas"
|
||||
title="Spremni za novi projekt?"
|
||||
description="Javite nam se s povjerenjem za sve vrste upita o gradnji."
|
||||
buttons={[{ text: "Pošaljite upit", href: "mailto:info@hamza-gradnja.hr" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
<FooterLogoEmphasis
|
||||
logoText="Hamza Gradnja d.o.o."
|
||||
copyrightText="© 2025 Hamza Gradnja d.o.o."
|
||||
columns={[
|
||||
{ items: [{ label: "O nama", href: "#about" }, { label: "Usluge", href: "#features" }] },
|
||||
{ items: [{ label: "Kontakt", href: "#contact" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user