141 lines
6.1 KiB
TypeScript
141 lines
6.1 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
|
import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
|
|
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
|
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
|
|
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
|
import { Award, Eye, Users } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-shift"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="pill"
|
|
contentWidth="smallMedium"
|
|
sizing="mediumSizeLargeTitles"
|
|
background="circleGradient"
|
|
cardStyle="soft-shadow"
|
|
primaryButtonStyle="radial-glow"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="light"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
navItems={[
|
|
{ name: "Home", id: "/" },
|
|
{ name: "Gallery", id: "/gallery" },
|
|
{ name: "Biography", id: "/about" },
|
|
{ name: "Contact", id: "/contact" },
|
|
{ name: "About", id: "/about" },
|
|
]}
|
|
brandName="ELARA"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitKpi
|
|
background={{ variant: "radial-gradient" }}
|
|
imagePosition="right"
|
|
title="Ethereal Visions"
|
|
description="Redefining the boundaries of contemporary digital artistry through a minimalist lens."
|
|
kpis={[
|
|
{ value: "15+", label: "Exhibitions" },
|
|
{ value: "200+", label: "Works" },
|
|
{ value: "10", label: "Years Active" },
|
|
]}
|
|
enableKpiAnimation={true}
|
|
imageSrc="http://img.b2bpic.net/free-photo/portrait-young-woman-black-sweater-standing-posing_114579-81860.jpg"
|
|
mediaAnimation="slide-up"
|
|
avatars={[
|
|
{ src: "http://img.b2bpic.net/free-photo/medium-shot-priest-with-puple-light_23-2149300865.jpg", alt: "Artist portrait 1" },
|
|
{ src: "http://img.b2bpic.net/free-photo/portrait-charismatic-sensual-male-black-sweater-creative-personality_613910-11122.jpg", alt: "Artist portrait 2" },
|
|
{ src: "http://img.b2bpic.net/free-photo/oman-eye-bondage-lying-floor_23-2147695046.jpg", alt: "Artist portrait 3" },
|
|
{ src: "http://img.b2bpic.net/free-photo/medium-shot-boy-posing-studio_23-2149596276.jpg", alt: "Artist portrait 4" },
|
|
{ src: "http://img.b2bpic.net/free-photo/serious-young-lady-designer-sitting-office-night_171337-15592.jpg", alt: "Artist portrait 5" },
|
|
]}
|
|
marqueeItems={[
|
|
{ type: "text", text: "Minimalism" },
|
|
{ type: "text", text: "Innovation" },
|
|
{ type: "text", text: "Ethereal" },
|
|
{ type: "text", text: "Contemporary" },
|
|
{ type: "text", text: "Curated" },
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="featured" data-section="featured">
|
|
<FeatureCardTwentySeven
|
|
animationType="blur-reveal"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{ id: "f1", title: "Obscura I", descriptions: ["Mixed media installation exploring shadows."], imageSrc: "http://img.b2bpic.net/free-photo/back-view-woman-arranging-clothes_23-2148372134.jpg" },
|
|
{ id: "f2", title: "Golden Hour", descriptions: ["Digital exploration of light refraction."], imageSrc: "http://img.b2bpic.net/free-photo/shot-corridor-with-white-walls-wooden-floor-with-some-ceramic-jars-lanzarote-spain_181624-27939.jpg" },
|
|
{ id: "f3", title: "Silence", descriptions: ["Minimalist sculpture series."], imageSrc: "http://img.b2bpic.net/free-photo/abstract-art-background-wallpaper-textured-acrylic-paint-with-mixed-colors_53876-134358.jpg" },
|
|
]}
|
|
title="Selected Works"
|
|
description="A curated collection of recent explorations in texture and light."
|
|
/>
|
|
</div>
|
|
|
|
<div id="metric" data-section="metric">
|
|
<MetricCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="uniform-all-items-equal"
|
|
useInvertedBackground={false}
|
|
title="Impact"
|
|
description="Measuring the resonance of digital art."
|
|
metrics={[
|
|
{ id: "m1", value: "1M+", title: "Impressions", description: "Across digital platforms.", icon: Eye },
|
|
{ id: "m2", value: "50", title: "Collaborations", description: "Global creative partners.", icon: Users },
|
|
{ id: "m3", value: "4", title: "Awards", description: "International recognition.", icon: Award },
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="socialProof" data-section="socialProof">
|
|
<SocialProofOne
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
title="Collaborators"
|
|
description="Proudly working alongside visionary institutions."
|
|
names={[
|
|
"Art Basel", "MoMA", "Digital Arts Council", "Gallery X", "Tech Creative Lab"]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitText
|
|
useInvertedBackground={false}
|
|
sideTitle="Common Inquiries"
|
|
sideDescription="Everything you need to know about commissioning or licensing."
|
|
faqsAnimation="blur-reveal"
|
|
faqs={[
|
|
{ id: "q1", title: "How to commission?", content: "Reach out via email to discuss your vision." },
|
|
{ id: "q2", title: "Shipping process?", content: "Secure handling for all fine art pieces." },
|
|
{ id: "q3", title: "Licensing works?", content: "Inquire regarding usage rights for commercial projects." },
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseCard
|
|
logoText="ELARA"
|
|
columns={[
|
|
{ title: "Studio", items: [{ label: "Gallery", href: "/gallery" }, { label: "Biography", href: "/about" }] },
|
|
{ title: "Connect", items: [{ label: "Contact", href: "/contact" }, { label: "Instagram", href: "#" }] },
|
|
]}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |