247 lines
12 KiB
TypeScript
247 lines
12 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
|
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
|
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
|
|
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
|
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
|
|
import MetricCardTen from '@/components/sections/metrics/MetricCardTen';
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import TextAbout from '@/components/sections/about/TextAbout';
|
|
import { Briefcase, Heart, Home, Sparkles, Speaker, User } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="hover-bubble"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="pill"
|
|
contentWidth="mediumSmall"
|
|
sizing="mediumLargeSizeLargeTitles"
|
|
background="grid"
|
|
cardStyle="inset"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="medium"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{
|
|
name: "O Mnie", id: "about",
|
|
},
|
|
{
|
|
name: "Usługi", id: "services",
|
|
},
|
|
{
|
|
name: "Statystyki", id: "metrics",
|
|
},
|
|
{
|
|
name: "FAQ", id: "faq",
|
|
},
|
|
{
|
|
name: "Kontakt", id: "contact",
|
|
},
|
|
]}
|
|
brandName="DJ Sebastian"
|
|
bottomLeftText="Twój DJ na każdą okazję"
|
|
bottomRightText="kontakt@djsebastian.pl"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardTestimonial
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "sparkles-gradient"}}
|
|
title="DJ Sebastian: Rozkręćmy Twoją Imprezę!"
|
|
description="Profesjonalna oprawa muzyczna na każde wydarzenie: wesele, 18-stka, impreza firmowa czy prywatka. Gwarantuję niezapomnianą zabawę i taneczny parkiet!"
|
|
testimonials={[
|
|
{
|
|
name: "Anna i Piotr Kowalscy", handle: "@AniaPiotr", testimonial: "DJ Sebastian sprawił, że nasze wesele było po prostu magiczne! Muzyka idealnie dobrana, wszyscy goście bawili się świetnie do białego rana. Polecamy z całego serca!", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/happy-smiling-couple-giving-five-winners-team-isolated-white-studio_285396-4957.jpg", imageAlt: "Szczęśliwa para młoda na weselu"},
|
|
{
|
|
name: "Magda Zając", handle: "@MagdaZ", testimonial: "Moja 18-stka była hitem! Sebastian puścił wszystkie moje ulubione kawałki i stworzył niesamowitą atmosferę. Najlepszy DJ pod słońcem!", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-friends-having-fun-party_23-2150188387.jpg", imageAlt: "Dziewczyna tańcząca na 18-stce"},
|
|
{
|
|
name: "Kamil Nowak", handle: "@KamilN", testimonial: "Impreza firmowa wypadła fenomenalnie, a to w dużej mierze dzięki DJ-owi Sebastianowi. Profesjonalne podejście i wyczucie do publiki.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/latin-amateurs-dancing-salsa_23-2151245269.jpg", imageAlt: "Grupa znajomych bawiąca się na imprezie"},
|
|
]}
|
|
tag="Twój DJ na Eventy!"
|
|
tagIcon={Speaker}
|
|
buttons={[
|
|
{
|
|
text: "Sprawdź dostępność", href: "#contact"},
|
|
{
|
|
text: "Moje usługi", href: "#services"},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/male-dj-party-charge-music-entertainment_23-2149658371.jpg"
|
|
imageAlt="Profesjonalny DJ setup na scenie z efektami świetlnymi"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextAbout
|
|
useInvertedBackground={false}
|
|
tag="Poznaj DJ-a Sebastiana"
|
|
tagIcon={User}
|
|
title="Pasja do Muzyki, Profesjonalizm na Scenie"
|
|
buttons={[
|
|
{
|
|
text: "Skontaktuj się!", href: "#contact"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<FeatureCardTwentyFive
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
title: "DJ na Wesele", description: "Stworzę niezapomnianą atmosferę na Waszym weselu, od klasycznych hitów po nowoczesne brzmienia. Indywidualne podejście do każdej Pary Młodej.", icon: Heart,
|
|
mediaItems: [
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-dj-club_23-2149119678.jpg", alt: "Para młoda tańcząca na weselu"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-dj-club_23-2149119678.jpg", alt: "Para młoda tańcząca na weselu"},
|
|
],
|
|
},
|
|
{
|
|
title: "DJ na 18-stkę", description: "Najnowsze hity, energetyczne sety i idealnie dobrana playlista, która rozgrzeje parkiet na każdej osiemnastce. Gwarantowana super zabawa!", icon: Sparkles,
|
|
mediaItems: [
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/nightlife-people-having-fun-bars-clubs_23-2149088566.jpg", alt: "Młodzież tańcząca na osiemnastce"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/nightlife-people-having-fun-bars-clubs_23-2149088566.jpg", alt: "Młodzież tańcząca na osiemnastce"},
|
|
],
|
|
},
|
|
{
|
|
title: "Imprezy Firmowe", description: "Profesjonalna oprawa muzyczna eventów firmowych, bankietów i spotkań integracyjnych. Muzyka dopasowana do charakteru wydarzenia i preferencji uczestników.", icon: Briefcase,
|
|
mediaItems: [
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/people-doing-voguing-dance-moves-indoors_23-2151099057.jpg", alt: "Ludzie bawiący się na imprezie firmowej"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/people-doing-voguing-dance-moves-indoors_23-2151099057.jpg", alt: "Ludzie bawiący się na imprezie firmowej"},
|
|
],
|
|
},
|
|
{
|
|
title: "Małe Imprezy i Prywatki", description: "Niezależnie od rozmiaru, każda impreza zasługuje na świetną muzykę. Zadbaj o niezapomniane brzmienie na swoim urodzinach, rocznicy czy spotkaniu ze znajomymi.", icon: Home,
|
|
mediaItems: [
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/middle-age-friends-night-having-dinner_23-2149190926.jpg", alt: "Ludzie bawiący się na prywatce"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/middle-age-friends-night-having-dinner_23-2149190926.jpg", alt: "Ludzie bawiący się na prywatce"},
|
|
],
|
|
},
|
|
]}
|
|
title="Moje Usługi DJ-skie"
|
|
description="Zapewniam kompleksową oprawę muzyczną na każdą okazję. Sprawdź, jak mogę rozkręcić Twoje wydarzenie!"
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardTen
|
|
animationType="slide-up"
|
|
useInvertedBackground={false}
|
|
textboxLayout="default"
|
|
metrics={[
|
|
{
|
|
id: "experience", title: "Lata doświadczenia", subtitle: "w branży muzycznej", category: "kariera", value: "10+"},
|
|
{
|
|
id: "events", title: "Zrealizowane wydarzenia", subtitle: "od małych po duże", category: "sukcesy", value: "500+"},
|
|
{
|
|
id: "satisfiedClients", title: "Zadowoleni klienci", subtitle: "i roztańczeni goście", category: "zadowolenie", value: "99%"},
|
|
]}
|
|
title="Liczby Mówią Same Za Siebie"
|
|
description="Moje doświadczenie i zaangażowanie gwarantują udaną imprezę."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqDouble
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{
|
|
id: "1", title: "Jakie są koszty wynajęcia DJ-a?", content: "Cena zależy od wielu czynników, takich jak data, czas trwania imprezy, lokalizacja oraz specyficzne wymagania dotyczące sprzętu czy dodatkowych atrakcji. Proszę o kontakt w celu uzyskania indywidualnej wyceny."},
|
|
{
|
|
id: "2", title: "Czy mogę stworzyć własną playlistę?", content: "Oczywiście! Jestem otwarty na Wasze sugestie i zawsze staram się dopasować muzykę do gustu i oczekiwań klienta. W trakcie imprezy również przyjmuję życzenia muzyczne od gości."},
|
|
{
|
|
id: "3", title: "Jaki sprzęt posiadasz?", content: "Dysponuję profesjonalnym sprzętem nagłośnieniowym i oświetleniowym najwyższej klasy, co gwarantuje doskonałą jakość dźwięku i niezapomniane efekty wizualne."},
|
|
{
|
|
id: "4", title: "Czy dojeżdżasz do klientów na terenie całej Polski?", content: "Tak, świadczę usługi na terenie całej Polski. Koszty dojazdu są ustalane indywidualnie i wliczane w wycenę."},
|
|
{
|
|
id: "5", title: "Ile czasu potrzebujesz na rozłożenie sprzętu?", content: "Standardowo potrzebuję około 1-2 godzin na przygotowanie stanowiska DJ-a oraz nagłośnienia i oświetlenia. Czas ten może się różnić w zależności od wielkości imprezy i złożoności setupu."},
|
|
{
|
|
id: "6", title: "Czy prowadzisz zabawy weselne?", content: "Tak, oferuję prowadzenie różnego rodzaju zabaw i animacji, które urozmaicą Wasze wesele i zaangażują gości. Wszystko jest ustalane z Wami indywidualnie, aby idealnie pasowało do koncepcji imprezy."},
|
|
]}
|
|
title="Najczęściej Zadawane Pytania"
|
|
description="Tutaj znajdziesz odpowiedzi na najczęściej zadawane pytania dotyczące moich usług."
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
useInvertedBackground={false}
|
|
title="Skontaktuj Się Ze Mną!"
|
|
description="Gotowy, by rozkręcić Twoją imprezę? Wypełnij formularz, a ja odezwę się jak najszybciej, by omówić szczegóły."
|
|
inputs={[
|
|
{
|
|
name: "Imię", type: "text", placeholder: "Twoje imię", required: true,
|
|
},
|
|
{
|
|
name: "Email", type: "email", placeholder: "Twój adres e-mail", required: true,
|
|
},
|
|
{
|
|
name: "Telefon", type: "tel", placeholder: "Twój numer telefonu (opcjonalnie)", required: false,
|
|
},
|
|
]}
|
|
textarea={{
|
|
name: "Wiadomość", placeholder: "Opisz swoje wydarzenie i datę", rows: 4,
|
|
required: true,
|
|
}}
|
|
imageSrc="http://img.b2bpic.net/free-photo/young-man-funny-expression_1194-3012.jpg"
|
|
imageAlt="Portret DJ-a Sebastiana z mikrofonem"
|
|
mediaAnimation="slide-up"
|
|
buttonText="Wyślij Wiadomość"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoEmphasis
|
|
columns={[
|
|
{
|
|
items: [
|
|
{
|
|
label: "O Mnie", href: "#about"},
|
|
{
|
|
label: "Usługi", href: "#services"},
|
|
{
|
|
label: "FAQ", href: "#faq"},
|
|
],
|
|
},
|
|
{
|
|
items: [
|
|
{
|
|
label: "Kontakt", href: "#contact"},
|
|
{
|
|
label: "Polityka Prywatności", href: "#"},
|
|
{
|
|
label: "Regulamin", href: "#"},
|
|
],
|
|
},
|
|
]}
|
|
logoText="DJ Sebastian"
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|