300 lines
17 KiB
TypeScript
300 lines
17 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import FaqBase from '@/components/sections/faq/FaqBase';
|
|
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
|
|
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
|
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
|
|
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
|
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
|
import TeamCardEleven from '@/components/sections/team/TeamCardEleven';
|
|
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
|
import { Building, Shield, Star } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="hover-magnetic"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="soft"
|
|
contentWidth="mediumLarge"
|
|
sizing="largeSizeMediumTitles"
|
|
background="noiseDiagonalGradient"
|
|
cardStyle="layered-gradient"
|
|
primaryButtonStyle="shadow"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="extrabold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
navItems={[
|
|
{
|
|
name: "Home", id: "#home"},
|
|
{
|
|
name: "About", id: "#about"},
|
|
{
|
|
name: "Services", id: "#services"},
|
|
{
|
|
name: "Projects", id: "#projects"},
|
|
{
|
|
name: "Achievements", id: "#achievements"},
|
|
{
|
|
name: "Team", id: "#team"},
|
|
{
|
|
name: "Testimonials", id: "#testimonials"},
|
|
{
|
|
name: "FAQ", id: "#faq"},
|
|
{
|
|
name: "Contact", id: "#contact"},
|
|
]}
|
|
brandName="Damir Construction"
|
|
/>
|
|
</div>
|
|
|
|
<div id="home" data-section="home">
|
|
<HeroSplitDualMedia
|
|
background={{
|
|
variant: "plain"}}
|
|
title="Building Dreams, Brick by Brick"
|
|
description="Damir Construction specializes in high-quality residential and commercial builds. Your vision, our expertise, crafted to perfection."
|
|
tag="Excellence in Construction"
|
|
tagAnimation="slide-up"
|
|
buttonAnimation="slide-up"
|
|
mediaItems={[
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/low-angle-building-construction_23-2148230387.jpg", imageAlt: "modern construction site sunny day"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/image-engineering-objects-workplace-top-view-construction-concept-engineering-tools-vintage-tone-retro-filter-effect-soft-focus-selective-focus_1418-711.jpg", imageAlt: "architectural blueprint house plan"}
|
|
]}
|
|
mediaAnimation="opacity"
|
|
rating={5}
|
|
ratingText="5-star client satisfaction"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<MetricSplitMediaAbout
|
|
useInvertedBackground={true}
|
|
title="Your Trusted Partner in Construction"
|
|
description="With years of experience, Damir Construction delivers unparalleled craftsmanship and reliable service. We prioritize quality, safety, and client satisfaction in every project."
|
|
metrics={[
|
|
{
|
|
value: "15+", title: "Years in Business"},
|
|
{
|
|
value: "200+", title: "Projects Completed"},
|
|
{
|
|
value: "99%", title: "Client Satisfaction"},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/business-people-meeting-plan_23-2148825870.jpg"
|
|
imageAlt="construction managers planning meeting"
|
|
mediaAnimation="blur-reveal"
|
|
metricsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<FeatureCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={false}
|
|
carouselMode="buttons"
|
|
features={[
|
|
{
|
|
title: "Residential Construction", description: "Crafting bespoke homes that reflect your unique style and needs, built with lasting quality and attention to detail.", imageSrc: "http://img.b2bpic.net/free-photo/stone-modern-building-with-windows_23-2148252726.jpg", imageAlt: "modern family home exterior design"},
|
|
{
|
|
title: "Commercial Projects", description: "Developing robust and functional spaces for businesses, ensuring efficiency, scalability, and aesthetic appeal.", imageSrc: "http://img.b2bpic.net/free-photo/building_1127-3559.jpg", imageAlt: "commercial office building facade"},
|
|
{
|
|
title: "Renovations & Remodels", description: "Transforming existing spaces with innovative designs and superior craftsmanship to enhance usability and value.", imageSrc: "http://img.b2bpic.net/free-photo/black-white-scene-showcasing-life-construction-workers-site_23-2151431561.jpg", imageAlt: "home interior renovation modern kitchen"},
|
|
]}
|
|
title="Our Comprehensive Construction Services"
|
|
description="From initial design to final touches, we offer a full spectrum of construction services tailored to your needs."
|
|
/>
|
|
</div>
|
|
|
|
<div id="projects" data-section="projects">
|
|
<ProductCardFour
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={true}
|
|
carouselMode="buttons"
|
|
uniformGridCustomHeightClasses="min-h-95 2xl:min-h-105"
|
|
products={[
|
|
{
|
|
id: "p1", name: "Luxury Residence", price: "Private Quote", variant: "Residential", imageSrc: "http://img.b2bpic.net/free-photo/outdoor-swimming-pool-with-umbrella-chair-lounge-around-there-leisure-travel_74190-7877.jpg", imageAlt: "completed modern family home exterior"},
|
|
{
|
|
id: "p2", name: "Downtown Office Tower", price: "Private Quote", variant: "Commercial", imageSrc: "http://img.b2bpic.net/free-photo/modern-skyscrapers-business-district_23-2148836789.jpg", imageAlt: "finished commercial office building exterior"},
|
|
{
|
|
id: "p3", name: "Modern Retail Space", price: "Private Quote", variant: "Commercial", imageSrc: "http://img.b2bpic.net/free-photo/casual-woman-reflecting-laptop-screen_23-2148372111.jpg", imageAlt: "modern retail store interior design"},
|
|
{
|
|
id: "p4", name: "Riverside Apartment Complex", price: "Private Quote", variant: "Multi-Family", imageSrc: "http://img.b2bpic.net/free-photo/window-pattern-textures-background_1203-2648.jpg", imageAlt: "residential apartment complex modern facade"},
|
|
{
|
|
id: "p5", name: "Fine Dining Restaurant", price: "Private Quote", variant: "Hospitality", imageSrc: "http://img.b2bpic.net/free-photo/modern-cafe-street-istanbul-turkey_628469-67.jpg", imageAlt: "stylish restaurant interior design"},
|
|
{
|
|
id: "p6", name: "Industrial Logistics Hub", price: "Private Quote", variant: "Industrial", imageSrc: "http://img.b2bpic.net/free-photo/industry-landscape-barcelona_1398-3935.jpg", imageAlt: "modern industrial building exterior"},
|
|
]}
|
|
title="Showcase of Our Signature Projects"
|
|
description="Explore a selection of our recently completed residential and commercial projects, built with precision and passion."
|
|
/>
|
|
</div>
|
|
|
|
<div id="achievements" data-section="achievements">
|
|
<MetricCardOne
|
|
animationType="scale-rotate"
|
|
textboxLayout="default"
|
|
gridVariant="uniform-all-items-equal"
|
|
useInvertedBackground={false}
|
|
carouselMode="buttons"
|
|
metrics={[
|
|
{
|
|
id: "m1", value: "15+", title: "Years of Experience", description: "Building a legacy of quality since 2009.", icon: Building,
|
|
},
|
|
{
|
|
id: "m2", value: "200+", title: "Projects Successfully Delivered", description: "From small renovations to large commercial complexes.", icon: Building,
|
|
},
|
|
{
|
|
id: "m3", value: "99%", title: "Client Satisfaction Rate", description: "Our commitment to excellence shines through every testimonial.", icon: Star,
|
|
},
|
|
{
|
|
id: "m4", value: "0", title: "Lost-Time Incidents", description: "A pristine safety record is our top priority on every site.", icon: Shield,
|
|
},
|
|
]}
|
|
title="Our Track Record of Success"
|
|
description="Quantifiable achievements that demonstrate our commitment to excellence and client satisfaction."
|
|
/>
|
|
</div>
|
|
|
|
<div id="team" data-section="team">
|
|
<TeamCardEleven
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
groups={[
|
|
{
|
|
id: "g1", groupTitle: "Leadership & Project Managers", members: [
|
|
{
|
|
id: "t1", title: "Damir Hasanbegovic", subtitle: "CEO & Founder", detail: "Over 20 years of experience in construction and civil engineering. Leads with a vision for quality and innovation.", imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-with-safety-vest-crossed-arms_23-2148269352.jpg", imageAlt: "male construction project manager smiling"},
|
|
{
|
|
id: "t2", title: "Elena Petrova", subtitle: "Head Architect", detail: "Specializes in sustainable design and modern architectural solutions. Ensures aesthetic and functional excellence.", imageSrc: "http://img.b2bpic.net/free-photo/african-american-lady-pointing-plan-table_23-2148039883.jpg", imageAlt: "female architect smiling with blueprints"},
|
|
{
|
|
id: "t3", title: "Mark Johnson", subtitle: "Senior Project Manager", detail: "Manages complex projects from conception to completion, ensuring timely delivery and budget adherence.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-posing-with-helmet_23-2148921381.jpg", imageAlt: "male site foreman with hard hat serious"},
|
|
]
|
|
},
|
|
]}
|
|
title="Meet Our Expert Team"
|
|
description="Our dedicated professionals are the backbone of Damir Construction, bringing expertise and passion to every project."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
carouselMode="buttons"
|
|
uniformGridCustomHeightClasses="min-h-none"
|
|
testimonials={[
|
|
{
|
|
id: "test1", name: "Sarah Johnson", role: "Homeowner, Residential Project", testimonial: "Damir Construction built our dream home with incredible precision and care. The team was professional, transparent, and delivered beyond our expectations. Highly recommended!", imageSrc: "http://img.b2bpic.net/free-photo/building-construction-workers-site_23-2149124256.jpg", imageAlt: "satisfied client smiling review"},
|
|
{
|
|
id: "test2", name: "Michael Chen", role: "CEO, Tech Solutions Inc.", testimonial: "Our new office space is a testament to Damir Construction's expertise. They understood our commercial needs perfectly and created a modern, functional environment on schedule.", imageSrc: "http://img.b2bpic.net/free-photo/two-smiling-business-partners-looking-building-outdoors_1262-12586.jpg", imageAlt: "business owner satisfied construction"},
|
|
{
|
|
id: "test3", name: "Emily Rodriguez", role: "Property Developer", testimonial: "Working with Damir Construction on our latest development was a seamless experience. Their project management and quality control are unmatched in the industry.", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-clipboard-pawns_23-2149382435.jpg", imageAlt: "woman smiling professional setting"},
|
|
{
|
|
id: "test4", name: "David Kim", role: "Restaurant Owner", testimonial: "The renovation of our restaurant was handled flawlessly. Damir Construction delivered a stunning interior that truly elevated our brand and customer experience.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-painting-home_23-2148943634.jpg", imageAlt: "man smiling casual setting"},
|
|
{
|
|
id: "test5", name: "Jessica Lee", role: "Small Business Owner", testimonial: "As a small business, budget and timeline were crucial. Damir Construction not only met both but exceeded our expectations with the quality of their work.", imageSrc: "http://img.b2bpic.net/free-photo/excited-asian-manager-showing-blonde-secretary-documents-indoor-portrait-fair-haired-female-student-sitting-with-laptop-talking-with-chinese-friend-glasses_197531-3806.jpg", imageAlt: "young entrepreneur satisfied construction"},
|
|
]}
|
|
title="What Our Clients Say"
|
|
description="Hear directly from satisfied clients who have experienced the Damir Construction difference."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqBase
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
faqs={[
|
|
{
|
|
id: "q1", title: "What types of projects does Damir Construction handle?", content: "We specialize in both residential and commercial construction projects, including new builds, renovations, remodels, and bespoke design-build services."},
|
|
{
|
|
id: "q2", title: "How do I get a quote for my project?", content: "You can request a quote by filling out our contact form or calling us directly. We'll schedule a consultation to discuss your project details and provide a comprehensive estimate."},
|
|
{
|
|
id: "q3", title: "Are you licensed and insured?", content: "Yes, Damir Construction is fully licensed, bonded, and insured, providing peace of mind and protection for all our projects and clients."},
|
|
{
|
|
id: "q4", title: "What is your approach to project management?", content: "We utilize a hands-on approach with dedicated project managers who oversee every phase, ensuring clear communication, adherence to timelines, and strict quality control standards."},
|
|
]}
|
|
title="Frequently Asked Questions"
|
|
description="Find answers to common questions about our construction process, services, and company policies."
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "plain"}}
|
|
tag="Get in Touch"
|
|
title="Start Your Next Project With Us"
|
|
description="Ready to discuss your vision? Contact us today for a consultation or to learn more about our services."
|
|
tagAnimation="none"
|
|
imageSrc="http://img.b2bpic.net/free-photo/engineer-helmet-vest-civil-worker-smart-young-cute-brunette-girl-with-paper-rolls_140725-167642.jpg"
|
|
imageAlt="modern construction office interior"
|
|
mediaAnimation="opacity"
|
|
mediaPosition="right"
|
|
inputPlaceholder="Your Email Address"
|
|
buttonText="Send Message"
|
|
termsText="By sending a message, you agree to our Terms and Conditions and Privacy Policy."
|
|
onSubmit={(email) => console.log(email)}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseCard
|
|
logoText="Damir Construction"
|
|
columns={[
|
|
{
|
|
title: "Services", items: [
|
|
{
|
|
label: "Residential", href: "#services"},
|
|
{
|
|
label: "Commercial", href: "#services"},
|
|
{
|
|
label: "Renovations", href: "#services"},
|
|
],
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{
|
|
label: "About Us", href: "#about"},
|
|
{
|
|
label: "Our Team", href: "#team"},
|
|
{
|
|
label: "Projects", href: "#projects"},
|
|
],
|
|
},
|
|
{
|
|
title: "Connect", items: [
|
|
{
|
|
label: "Contact Us", href: "#contact"},
|
|
{
|
|
label: "FAQ", href: "#faq"},
|
|
{
|
|
label: "Facebook", href: "https://facebook.com"},
|
|
],
|
|
},
|
|
]}
|
|
copyrightText="© 2024 Damir Construction. All rights reserved."
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |