Merge version_1 into main #1
415
src/app/page.tsx
415
src/app/page.tsx
@@ -19,308 +19,139 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "History",
|
||||
id: "#history",
|
||||
},
|
||||
{
|
||||
name: "Future",
|
||||
id: "#future",
|
||||
},
|
||||
{
|
||||
name: "Culture",
|
||||
id: "#culture",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
]}
|
||||
brandName="Kosovo Journey"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{ name: "History", id: "#history" },
|
||||
{ name: "Future", id: "#future" },
|
||||
{ name: "Culture", id: "#culture" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="Kosovo Journey"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
logoText="Kosovo's Story"
|
||||
description="From a rich historical tapestry to a bright, modern future. Join us as we explore the path of our nation."
|
||||
buttons={[
|
||||
{
|
||||
text: "Discover History",
|
||||
href: "#history",
|
||||
},
|
||||
{
|
||||
text: "Vision 2030",
|
||||
href: "#future",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/view-famous-pink-tower-building-lyon_268835-4090.jpg"
|
||||
imageAlt="Kosovo Landscape"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{ variant: "plain" }}
|
||||
logoText="Kosovo's Story"
|
||||
description="From a rich historical tapestry to a bright, modern future. Join us as we explore the path of our nation."
|
||||
buttons={[
|
||||
{ text: "Discover History", href: "#history" },
|
||||
{ text: "Vision 2030", href: "#future" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/view-famous-pink-tower-building-lyon_268835-4090.jpg"
|
||||
imageAlt="Kosovo Landscape"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="Kosovo Today"
|
||||
metrics={[
|
||||
{
|
||||
icon: Users,
|
||||
label: "Population",
|
||||
value: "1.8M+",
|
||||
},
|
||||
{
|
||||
icon: TrendingUp,
|
||||
label: "GDP Growth",
|
||||
value: "4.2%",
|
||||
},
|
||||
{
|
||||
icon: GraduationCap,
|
||||
label: "Youth Literacy",
|
||||
value: "98%",
|
||||
},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="Kosovo Today"
|
||||
metrics={[
|
||||
{ icon: Users, label: "Population", value: "1.8M+" },
|
||||
{ icon: TrendingUp, label: "GDP Growth", value: "4.2%" },
|
||||
{ icon: GraduationCap, label: "Youth Literacy", value: "98%" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="history" data-section="history">
|
||||
<FeatureCardSix
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Cultural Foundations",
|
||||
description: "Centuries of influence have created a unique architectural and cultural identity.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/old-ancient-building-city_1268-14307.jpg",
|
||||
imageAlt: "Heritage Site",
|
||||
},
|
||||
{
|
||||
title: "Independence Journey",
|
||||
description: "A testament to the will of the people and the building of democratic institutions.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-shot-waterfalls-with-view-schonbrunn-palace-vienna-austria_181624-10561.jpg",
|
||||
imageAlt: "Modern Monuments",
|
||||
},
|
||||
{
|
||||
title: "Community Resilience",
|
||||
description: "Deep-rooted traditions and social bonds that have carried the nation forward.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/castle-gaibiel-valencian-community_1398-4481.jpg",
|
||||
imageAlt: "Historical Market",
|
||||
},
|
||||
]}
|
||||
title="Historical Milestones"
|
||||
description="Tracing the path of resilience, independence, and the forging of a unique cultural identity."
|
||||
/>
|
||||
</div>
|
||||
<div id="history" data-section="history">
|
||||
<FeatureCardSix
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ title: "Cultural Foundations", description: "Centuries of influence have created a unique architectural and cultural identity.", imageSrc: "http://img.b2bpic.net/free-photo/old-ancient-building-city_1268-14307.jpg", imageAlt: "Heritage Site" },
|
||||
{ title: "Independence Journey", description: "A testament to the will of the people and the building of democratic institutions.", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-shot-waterfalls-with-view-schonbrunn-palace-vienna-austria_181624-10561.jpg", imageAlt: "Modern Monuments" },
|
||||
{ title: "Community Resilience", description: "Deep-rooted traditions and social bonds that have carried the nation forward.", imageSrc: "http://img.b2bpic.net/free-photo/castle-gaibiel-valencian-community_1398-4481.jpg", imageAlt: "Historical Market" },
|
||||
]}
|
||||
title="Historical Milestones"
|
||||
description="Tracing the path of resilience, independence, and the forging of a unique cultural identity."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="future" data-section="future">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Digital Hubs",
|
||||
price: "Modern Infrastructure",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/inspiring-view-sunset-light_23-2148851747.jpg",
|
||||
imageAlt: "Digital Tech",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Green Energy",
|
||||
price: "Sustainability First",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-frankfurt-from-skyscraper-germany_1268-20935.jpg",
|
||||
imageAlt: "Green Energy",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Youth Education",
|
||||
price: "Global Standard",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/astral-wallpapers-composition-with-buildings_23-2149687893.jpg",
|
||||
imageAlt: "Modern Schooling",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Sustainable Cities",
|
||||
price: "Eco-friendly Living",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pink-smoke-background-with-young-adult_23-2149681375.jpg",
|
||||
imageAlt: "Urban Planning",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Cultural Tech",
|
||||
price: "Arts Integration",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/wind-turbines-trees-eco-energy-rapeseed-field-warm-sky_169016-68732.jpg",
|
||||
imageAlt: "Innovation Center",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Global Connectivity",
|
||||
price: "International Trade",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-architect-looking-building-plans_23-2148269410.jpg",
|
||||
imageAlt: "Global Trade",
|
||||
},
|
||||
]}
|
||||
title="The Path Forward"
|
||||
description="Focusing on tech innovation, green energy, and sustainable urban development."
|
||||
/>
|
||||
</div>
|
||||
<div id="future" data-section="future">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", name: "Digital Hubs", price: "Modern Infrastructure", imageSrc: "http://img.b2bpic.net/free-photo/inspiring-view-sunset-light_23-2148851747.jpg", imageAlt: "Digital Tech" },
|
||||
{ id: "p2", name: "Green Energy", price: "Sustainability First", imageSrc: "http://img.b2bpic.net/free-photo/view-frankfurt-from-skyscraper-germany_1268-20935.jpg", imageAlt: "Green Energy" },
|
||||
{ id: "p3", name: "Youth Education", price: "Global Standard", imageSrc: "http://img.b2bpic.net/free-photo/astral-wallpapers-composition-with-buildings_23-2149687893.jpg", imageAlt: "Modern Schooling" },
|
||||
]}
|
||||
title="The Path Forward"
|
||||
description="Focusing on tech innovation, green energy, and sustainable urban development."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="culture" data-section="culture">
|
||||
<MetricCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
icon: Music,
|
||||
title: "Arts Festivals",
|
||||
value: "15+",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
icon: Palette,
|
||||
title: "Creative Hubs",
|
||||
value: "20+",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
icon: Users,
|
||||
title: "Global Events",
|
||||
value: "50+",
|
||||
},
|
||||
]}
|
||||
title="Vibrant Culture"
|
||||
description="Celebrating the arts, festivals, and the spirit of the Kosovan people."
|
||||
/>
|
||||
</div>
|
||||
<div id="culture" data-section="culture">
|
||||
<MetricCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ id: "m1", icon: Music, title: "Arts Festivals", value: "15+" },
|
||||
{ id: "m2", icon: Palette, title: "Creative Hubs", value: "20+" },
|
||||
{ id: "m3", icon: Users, title: "Global Events", value: "50+" },
|
||||
]}
|
||||
title="Vibrant Culture"
|
||||
description="Celebrating the arts, festivals, and the spirit of the Kosovan people."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSix
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Arta Rexhepi",
|
||||
handle: "@arta_k",
|
||||
testimonial: "The energy in Pristina is unlike anywhere else. Innovation is in the air.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/experienced-florist-standing-with-arms-crossed_23-2148435667.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Blerim Gashi",
|
||||
handle: "@b_gashi",
|
||||
testimonial: "Our history inspires our progress. We are building something truly special.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiling-businessman-standing-front-desk_23-2148187160.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Elira Hoxha",
|
||||
handle: "@elira_h",
|
||||
testimonial: "Youth in Kosovo are leading change, blending our traditions with modern digital skills.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pleased-young-caucasian-girl-with-pixie-haircut-standing-with-closed-posture-profile-view-isolated-green-background-with-copy-space_141793-31827.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Driton Sadiku",
|
||||
handle: "@d_sadiku",
|
||||
testimonial: "Every day, I see our city become more sustainable and globally connected.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-outside_23-2149741913.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Vjosa Rama",
|
||||
handle: "@vjosa_r",
|
||||
testimonial: "The cultural scene is vibrant, resilient, and ready for the world stage.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pretty-student-girl-holding-books-looking-happy-smiling-camera-outdoor-stylish-girl-way-university_574295-4508.jpg",
|
||||
},
|
||||
]}
|
||||
title="Voices of the Nation"
|
||||
description="Stories from those shaping our country's tomorrow."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSix
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Arta Rexhepi", handle: "@arta_k", testimonial: "The energy in Pristina is unlike anywhere else. Innovation is in the air.", imageSrc: "http://img.b2bpic.net/free-photo/experienced-florist-standing-with-arms-crossed_23-2148435667.jpg" },
|
||||
{ id: "t2", name: "Blerim Gashi", handle: "@b_gashi", testimonial: "Our history inspires our progress. We are building something truly special.", imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiling-businessman-standing-front-desk_23-2148187160.jpg" },
|
||||
]}
|
||||
title="Voices of the Nation"
|
||||
description="Stories from those shaping our country's tomorrow."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Stay Connected"
|
||||
description="Want to learn more about our future initiatives or get involved with our cultural projects?"
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Email Address",
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "Your Inquiry",
|
||||
rows: 4,
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/square-front-modern-office-buildings_1359-869.jpg"
|
||||
imageAlt="Pristina Architecture"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Stay Connected"
|
||||
description="Want to learn more about our future initiatives or get involved with our cultural projects?"
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Email Address", required: true },
|
||||
]}
|
||||
textarea={{ name: "message", placeholder: "Your Inquiry", rows: 4 }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/square-front-modern-office-buildings_1359-869.jpg"
|
||||
imageAlt="Pristina Architecture"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
logoText="Kosovo Journey"
|
||||
columns={[
|
||||
{
|
||||
title: "Explore",
|
||||
items: [
|
||||
{
|
||||
label: "History",
|
||||
href: "#history",
|
||||
},
|
||||
{
|
||||
label: "Vision",
|
||||
href: "#future",
|
||||
},
|
||||
{
|
||||
label: "Culture",
|
||||
href: "#culture",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Use",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
logoText="Kosovo Journey"
|
||||
columns={[
|
||||
{ title: "Explore", items: [{ label: "History", href: "#history" }, { label: "Vision", href: "#future" }, { label: "Culture", href: "#culture" }] },
|
||||
{ title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Use", href: "#" }] },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user