Merge version_1 into main #1
335
src/app/page.tsx
335
src/app/page.tsx
@@ -19,242 +19,125 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="text-stagger"
|
||||
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">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Leadership",
|
||||
id: "#leadership",
|
||||
},
|
||||
{
|
||||
name: "Laws",
|
||||
id: "#laws",
|
||||
},
|
||||
{
|
||||
name: "Fines",
|
||||
id: "#fines",
|
||||
},
|
||||
{
|
||||
name: "Safety",
|
||||
id: "#safety",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
]}
|
||||
brandName="BS POLICIJA"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Leadership", id: "leadership" },
|
||||
{ name: "Laws", id: "laws" },
|
||||
{ name: "Fines", id: "fines" },
|
||||
{ name: "Safety", id: "safety" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="BS POLICIJA"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogo
|
||||
logoText="BS POLICIJA"
|
||||
description="Ensuring public safety through transparency, integrity, and dedicated community service. Protecting the rights and security of every citizen."
|
||||
buttons={[
|
||||
{
|
||||
text: "View Safety Info",
|
||||
href: "#safety",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-vector/golden-sheriff-star-badges-police-law-authority-justice-marshall-star_1284-46818.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogo
|
||||
logoText="BS POLICIJA"
|
||||
description="Ensuring public safety through transparency, integrity, and dedicated community service. Protecting the rights and security of every citizen."
|
||||
buttons={[{ text: "View Safety Info", href: "#safety" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-vector/golden-sheriff-star-badges-police-law-authority-justice-marshall-star_1284-46818.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="leadership" data-section="leadership">
|
||||
<TeamCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={true}
|
||||
members={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Marko Ivić",
|
||||
role: "Chief of Police",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-general-talking-phone_23-2149742905.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Ana Kovač",
|
||||
role: "Deputy Chief",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-general-uniform_23-2149742950.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Ivan Horvat",
|
||||
role: "Head of Operations",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-old-general-uniform_23-2149742921.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Elena Petrić",
|
||||
role: "Public Relations",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/confident-woman-looking-camera-while-standing-street-with-hands-crossed_231208-13361.jpg",
|
||||
},
|
||||
]}
|
||||
title="Department Leadership"
|
||||
description="Meet the senior officials dedicated to maintaining law, order, and public trust."
|
||||
/>
|
||||
</div>
|
||||
<div id="leadership" data-section="leadership">
|
||||
<TeamCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={true}
|
||||
members={[
|
||||
{ id: "1", name: "Marko Ivić", role: "Chief of Police", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-general-talking-phone_23-2149742905.jpg" },
|
||||
{ id: "2", name: "Ana Kovač", role: "Deputy Chief", imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-general-uniform_23-2149742950.jpg" },
|
||||
{ id: "3", name: "Ivan Horvat", role: "Head of Operations", imageSrc: "http://img.b2bpic.net/free-photo/front-view-old-general-uniform_23-2149742921.jpg" },
|
||||
{ id: "4", name: "Elena Petrić", role: "Public Relations", imageSrc: "http://img.b2bpic.net/free-photo/confident-woman-looking-camera-while-standing-street-with-hands-crossed_231208-13361.jpg" },
|
||||
]}
|
||||
title="Department Leadership"
|
||||
description="Meet the senior officials dedicated to maintaining law, order, and public trust."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="laws" data-section="laws">
|
||||
<TextAbout
|
||||
useInvertedBackground={false}
|
||||
title="Laws and Regulations"
|
||||
buttons={[
|
||||
{
|
||||
text: "Download Constitution PDF",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="laws" data-section="laws">
|
||||
<TextAbout
|
||||
useInvertedBackground={false}
|
||||
title="Laws and Regulations"
|
||||
buttons={[{ text: "Download Constitution PDF", href: "#" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="fines" data-section="fines">
|
||||
<PricingCardEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{
|
||||
id: "1",
|
||||
badge: "Minor",
|
||||
price: "$50 - $200",
|
||||
subtitle: "Minor Traffic Violations",
|
||||
features: [
|
||||
"Parking breach",
|
||||
"Speeding low",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Pay Fine",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
badge: "Major",
|
||||
price: "$500 - $2000",
|
||||
subtitle: "Major Traffic Violations",
|
||||
features: [
|
||||
"DUI violations",
|
||||
"Reckless driving",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Pay Fine",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
badge: "Severe",
|
||||
price: "Legal Action",
|
||||
subtitle: "Criminal Offenses",
|
||||
features: [
|
||||
"Public disturbance",
|
||||
"Property damage",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Case Details",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Monetary Fines Structure"
|
||||
description="Clear breakdown of administrative and criminal fines to promote compliance."
|
||||
/>
|
||||
</div>
|
||||
<div id="fines" data-section="fines">
|
||||
<PricingCardEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{ id: "1", badge: "Minor", price: "$50 - $200", subtitle: "Minor Traffic Violations", features: ["Parking breach", "Speeding low"], buttons: [{ text: "Pay Fine", href: "#" }] },
|
||||
{ id: "2", badge: "Major", price: "$500 - $2000", subtitle: "Major Traffic Violations", features: ["DUI violations", "Reckless driving"], buttons: [{ text: "Pay Fine", href: "#" }] },
|
||||
{ id: "3", badge: "Severe", price: "Legal Action", subtitle: "Criminal Offenses", features: ["Public disturbance", "Property damage"], buttons: [{ text: "Case Details", href: "#" }] },
|
||||
]}
|
||||
title="Monetary Fines Structure"
|
||||
description="Clear breakdown of administrative and criminal fines to promote compliance."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="safety" data-section="safety">
|
||||
<FeatureBorderGlow
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
icon: Shield,
|
||||
title: "Emergency Reporting",
|
||||
description: "How to report emergencies effectively.",
|
||||
},
|
||||
{
|
||||
icon: Lock,
|
||||
title: "Home Security",
|
||||
description: "Best practices for protecting property.",
|
||||
},
|
||||
{
|
||||
icon: AlertCircle,
|
||||
title: "Crime Prevention",
|
||||
description: "Staying vigilant in public spaces.",
|
||||
},
|
||||
]}
|
||||
title="Public Safety Information"
|
||||
description="Proactive measures to ensure safety for you and your family."
|
||||
/>
|
||||
</div>
|
||||
<div id="safety" data-section="safety">
|
||||
<FeatureBorderGlow
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ icon: Shield, title: "Emergency Reporting", description: "How to report emergencies effectively." },
|
||||
{ icon: Lock, title: "Home Security", description: "Best practices for protecting property." },
|
||||
{ icon: AlertCircle, title: "Crime Prevention", description: "Staying vigilant in public spaces." },
|
||||
]}
|
||||
title="Public Safety Information"
|
||||
description="Proactive measures to ensure safety for you and your family."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "How to get a police report?",
|
||||
content: "Visit our headquarters with ID.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Can I dispute a fine?",
|
||||
content: "File an appeal within 15 days.",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Where is the nearest station?",
|
||||
content: "Check our online station directory.",
|
||||
},
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Quick answers regarding legal rights and department services."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{ id: "1", title: "How to get a police report?", content: "Visit our headquarters with ID." },
|
||||
{ id: "2", title: "Can I dispute a fine?", content: "File an appeal within 15 days." },
|
||||
{ id: "3", title: "Where is the nearest station?", content: "Check our online station directory." },
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Quick answers regarding legal rights and department services."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "canvas-reveal",
|
||||
}}
|
||||
text="For non-emergency matters, our team is available 24/7 to assist. Transparency starts with communication."
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "canvas-reveal" }}
|
||||
text="For non-emergency matters, our team is available 24/7 to assist. Transparency starts with communication."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="BS POLICIJA"
|
||||
copyrightText="© 2025 | BS Policija | Legal Transparency"
|
||||
socialLinks={[
|
||||
{
|
||||
icon: Facebook,
|
||||
href: "#",
|
||||
ariaLabel: "Facebook",
|
||||
},
|
||||
{
|
||||
icon: Twitter,
|
||||
href: "#",
|
||||
ariaLabel: "Twitter",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="BS POLICIJA"
|
||||
copyrightText="© 2025 | BS Policija | Legal Transparency"
|
||||
socialLinks={[
|
||||
{ icon: Facebook, href: "#", ariaLabel: "Facebook" },
|
||||
{ icon: Twitter, href: "#", ariaLabel: "Twitter" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user