Merge version_2 into main
Merge version_2 into main
This commit was merged in pull request #1.
This commit is contained in:
36
src/app/loan-balances/page.tsx
Normal file
36
src/app/loan-balances/page.tsx
Normal file
@@ -0,0 +1,36 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
|
||||
|
||||
export default function LoanBalancesPage() {
|
||||
return (
|
||||
<ThemeProvider>
|
||||
<ReactLenis root>
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Loan Balances", id: "/loan-balances" },
|
||||
{ name: "Products", id: "products" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
{ name: "FAQ", id: "faq" },
|
||||
]}
|
||||
brandName="BodaFund Sacco"
|
||||
/>
|
||||
<div className="pt-32 pb-20 px-6 max-w-7xl mx-auto">
|
||||
<MetricCardFourteen
|
||||
title="Your Loan Overview"
|
||||
tag="Active Loan"
|
||||
metrics={[
|
||||
{ id: "bal", value: "$850", description: "Current Outstanding Balance" },
|
||||
{ id: "repay", value: "$50", description: "Monthly Repayment" },
|
||||
{ id: "due", value: "15th", description: "Next Due Date" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
289
src/app/page.tsx
289
src/app/page.tsx
@@ -32,22 +32,11 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Products",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "pricing",
|
||||
},
|
||||
{
|
||||
name: "FAQ",
|
||||
id: "faq",
|
||||
},
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Loan Balances", id: "/loan-balances" },
|
||||
{ name: "Products", id: "products" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
{ name: "FAQ", id: "faq" },
|
||||
]}
|
||||
brandName="BodaFund Sacco"
|
||||
/>
|
||||
@@ -56,35 +45,13 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
variant: "radial-gradient"}}
|
||||
title="Empowering Riders Through Financial Freedom"
|
||||
description="The trusted Sacco and lending partner for Boda Boda professionals. Grow your savings and own your bike today."
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-looking-smartphone-while-sitting-her-motorcycle_23-2148685250.jpg",
|
||||
imageAlt: "Boda digital finance",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/two-businessmen-congratulating-each-other-successful-job-giving-highfive-focus-is-young-businessman_637285-208.jpg",
|
||||
imageAlt: "Financial growth",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-taking-bike-ride-it-city_23-2149375681.jpg",
|
||||
imageAlt: "Community meeting",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/receive-smartphone-with-coin-money-credit-card-online-shopping-success-payment-concept-orange-background-3d-rendering_56104-1397.jpg",
|
||||
imageAlt: "Finance tech",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/businessman-checking-stock-market-online_53876-14787.jpg",
|
||||
imageAlt: "App interface",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/people-working-tech-brand-together_23-2150966118.jpg",
|
||||
imageAlt: "Modern office",
|
||||
},
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-looking-smartphone-while-sitting-her-motorcycle_23-2148685250.jpg", imageAlt: "Boda digital finance" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/two-businessmen-congratulating-each-other-successful-job-giving-highfive-focus-is-young-businessman_637285-208.jpg", imageAlt: "Financial growth" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/young-woman-taking-bike-ride-it-city_23-2149375681.jpg", imageAlt: "Community meeting" },
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
@@ -95,21 +62,9 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
title="Our Impact in Numbers"
|
||||
metrics={[
|
||||
{
|
||||
icon: Users,
|
||||
label: "Active Riders",
|
||||
value: "5,000+",
|
||||
},
|
||||
{
|
||||
icon: TrendingUp,
|
||||
label: "Loans Disbursed",
|
||||
value: "$1.2M",
|
||||
},
|
||||
{
|
||||
icon: ShieldCheck,
|
||||
label: "Members Insured",
|
||||
value: "98%",
|
||||
},
|
||||
{ icon: Users, label: "Active Riders", value: "5,000+" },
|
||||
{ icon: TrendingUp, label: "Loans Disbursed", value: "$1.2M" },
|
||||
{ icon: ShieldCheck, label: "Members Insured", value: "98%" },
|
||||
]}
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
@@ -120,20 +75,8 @@ export default function LandingPage() {
|
||||
animationType="depth-3d"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
negativeCard={{
|
||||
items: [
|
||||
"No hidden processing fees",
|
||||
"No high-interest daily debt",
|
||||
"No predatory repossession",
|
||||
],
|
||||
}}
|
||||
positiveCard={{
|
||||
items: [
|
||||
"Fair interest rates",
|
||||
"Flexible repayment terms",
|
||||
"Boda ownership programs",
|
||||
],
|
||||
}}
|
||||
negativeCard={{ items: ["No hidden processing fees", "No high-interest daily debt", "No predatory repossession"] }}
|
||||
positiveCard={{ items: ["Fair interest rates", "Flexible repayment terms", "Boda ownership programs"] }}
|
||||
title="Why Choose BodaFund"
|
||||
description="We prioritize rider ownership and fair terms over predatory practices."
|
||||
/>
|
||||
@@ -145,44 +88,7 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Motorcycle Loan",
|
||||
price: "From $500",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-talking-cellphone-bicycle-workshop_23-2147892359.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Service Savings Fund",
|
||||
price: "Flexible",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-business-concept-office-accessories-wooden-table-office-supplies-study-work-concept-toning_1220-1515.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Education Loan",
|
||||
price: "Custom",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/colleagues-doing-team-work-project_23-2149361580.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Medical Insurance",
|
||||
price: "$10/mo",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pretty-doctor-showing-blank-id-card-business-card-smiling_171337-4285.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Fuel Subsidy Card",
|
||||
price: "$5/mo",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-metallic-wine-barrels-winery_1268-15698.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Housing Fund",
|
||||
price: "Invest",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/couple-using-electric-scooter-transportation_23-2149399847.jpg",
|
||||
},
|
||||
]}
|
||||
products={[]}
|
||||
title="Our Financial Products"
|
||||
description="Explore tailored solutions for Boda Boda business owners."
|
||||
/>
|
||||
@@ -193,56 +99,7 @@ export default function LandingPage() {
|
||||
animationType="scale-rotate"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "tier1",
|
||||
name: "Junior Saver",
|
||||
price: "$10/mo",
|
||||
buttons: [
|
||||
{
|
||||
text: "Join Now",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
features: [
|
||||
"Basic savings",
|
||||
"Rider network",
|
||||
"Weekly updates",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "tier2",
|
||||
name: "Pro Rider",
|
||||
price: "$30/mo",
|
||||
buttons: [
|
||||
{
|
||||
text: "Join Now",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
features: [
|
||||
"Advanced savings",
|
||||
"Low interest loans",
|
||||
"Insurance access",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "tier3",
|
||||
name: "Fleet Owner",
|
||||
price: "$100/mo",
|
||||
buttons: [
|
||||
{
|
||||
text: "Join Now",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
features: [
|
||||
"Premium account",
|
||||
"Fleet management",
|
||||
"Top priority",
|
||||
],
|
||||
},
|
||||
]}
|
||||
plans={[]}
|
||||
title="Sacco Membership Tiers"
|
||||
description="Choose your contribution level and unlock premium benefits."
|
||||
/>
|
||||
@@ -252,48 +109,7 @@ export default function LandingPage() {
|
||||
<TestimonialCardTen
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
title: "Boda Owner",
|
||||
quote: "Finally I own my bike without those insane daily payments.",
|
||||
name: "James Otieno",
|
||||
role: "Full-time Rider",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-motorcycle-helmet_23-2151574388.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
title: "Sacco Member",
|
||||
quote: "The savings program has helped me put my kids through school.",
|
||||
name: "Sarah Kanyiri",
|
||||
role: "Business Owner",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-smoking-pipe_1154-103.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
title: "Boda Owner",
|
||||
quote: "Fast, fair, and transparent. Highly recommend for any rider.",
|
||||
name: "Paul Muriuki",
|
||||
role: "Boda Rider",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-middle-age-biker-sports-jacket-holds-motorcycle-helmet-grey-background_613910-12160.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
title: "Sacco Member",
|
||||
quote: "Professional team that actually cares about my daily business.",
|
||||
name: "Alice Wanjiru",
|
||||
role: "Daily Trader",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/baseball-supporters-watching-their-team-win-game-mobile-phone_53876-137736.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
title: "Boda Owner",
|
||||
quote: "Best financial decision I have made in my 5 years riding.",
|
||||
name: "David Kamau",
|
||||
role: "Senior Rider",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-blonde-woman-black-jacket_176474-101946.jpg",
|
||||
},
|
||||
]}
|
||||
testimonials={[]}
|
||||
title="Rider Success Stories"
|
||||
description="Hear from thousands of members who changed their lives with BodaFund."
|
||||
/>
|
||||
@@ -303,28 +119,7 @@ export default function LandingPage() {
|
||||
<FaqDouble
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "How do I qualify for a loan?",
|
||||
content: "You need to be an active Sacco member for at least 3 months.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Can I save daily?",
|
||||
content: "Yes, we encourage daily contributions via M-Pesa.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Is my money safe?",
|
||||
content: "We are fully licensed and insured by the Central Financial Authority.",
|
||||
},
|
||||
{
|
||||
id: "q4",
|
||||
title: "What happens if I miss a payment?",
|
||||
content: "Contact us immediately so we can adjust your plan.",
|
||||
},
|
||||
]}
|
||||
faqs={[]}
|
||||
title="Need Help? Read This."
|
||||
description="Common questions regarding loans and savings."
|
||||
faqsAnimation="slide-up"
|
||||
@@ -334,59 +129,19 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
text="Ready to own your bike and grow your savings today? Contact our support team."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Support",
|
||||
href: "tel:+254700000000",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Contact Support", href: "tel:+254700000000" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "#products",
|
||||
},
|
||||
{
|
||||
label: "Join Sacco",
|
||||
href: "#pricing",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#faq",
|
||||
},
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
columns={[]}
|
||||
logoText="BodaFund Sacco"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
65
src/app/statements/page.tsx
Normal file
65
src/app/statements/page.tsx
Normal file
@@ -0,0 +1,65 @@
|
||||
"use client";
|
||||
|
||||
import { useState } from "react";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
|
||||
export default function SaccoStatementsPage() {
|
||||
const [history] = useState([
|
||||
{ id: "1", date: "2023-10-01", type: "Contribution", amount: "$50.00" },
|
||||
{ id: "2", date: "2023-09-15", type: "Loan Payment", amount: "$120.00" },
|
||||
{ id: "3", date: "2023-09-01", type: "Contribution", amount: "$50.00" },
|
||||
]);
|
||||
|
||||
return (
|
||||
<ThemeProvider>
|
||||
<ReactLenis root>
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Statements", id: "/statements" }
|
||||
]}
|
||||
brandName="BodaFund Sacco"
|
||||
/>
|
||||
<main className="container mx-auto py-20 px-6">
|
||||
<h1 className="text-4xl font-bold mb-8">Account Statements</h1>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 mb-12">
|
||||
<div className="p-6 rounded-2xl border bg-card">
|
||||
<h2 className="text-xl font-semibold mb-4">Generate Statement</h2>
|
||||
<button className="px-6 py-3 rounded-full bg-primary text-white font-medium hover:opacity-90">
|
||||
Generate Latest Statement
|
||||
</button>
|
||||
</div>
|
||||
<div className="p-6 rounded-2xl border bg-card">
|
||||
<h2 className="text-xl font-semibold mb-4">Download Options</h2>
|
||||
<div className="flex gap-4">
|
||||
<button className="px-6 py-3 rounded-full border border-primary text-primary hover:bg-primary hover:text-white">PDF Format</button>
|
||||
<button className="px-6 py-3 rounded-full border border-primary text-primary hover:bg-primary hover:text-white">CSV Format</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="p-6 rounded-2xl border bg-card">
|
||||
<h2 className="text-xl font-semibold mb-6">Statement History</h2>
|
||||
<div className="space-y-4">
|
||||
{history.map((item) => (
|
||||
<div key={item.id} className="flex justify-between items-center p-4 border-b last:border-0">
|
||||
<div>
|
||||
<p className="font-medium">{item.type}</p>
|
||||
<p className="text-sm text-muted-foreground">{item.date}</p>
|
||||
</div>
|
||||
<p className="font-bold">{item.amount}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<FooterLogoEmphasis
|
||||
logoText="BodaFund Sacco"
|
||||
columns={[]}
|
||||
/>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user