86 lines
4.6 KiB
TypeScript
86 lines
4.6 KiB
TypeScript
import Image from "next/image";
|
|
import Link from "next/link";
|
|
import { Background } from "../../../components/background";
|
|
import { SiteFooter } from "../../../components/site-footer";
|
|
import { SiteHeader } from "../../../components/site-header";
|
|
import { PageSchema } from "../../../components/page-schema";
|
|
import { siteInfo } from "../../../data/site";
|
|
|
|
export const metadata = {
|
|
title: "Cash Flow Management - LedgerOne",
|
|
description: "Visualize your income and expenses in real-time. Forecast future cash flow and make smarter business decisions.",
|
|
keywords: siteInfo.keywords
|
|
};
|
|
|
|
export default function CashFlowPage() {
|
|
const schema = [
|
|
{
|
|
"@context": "https://schema.org",
|
|
"@type": "WebPage",
|
|
name: "Cash Flow Management",
|
|
description: "Visualize your income and expenses in real-time.",
|
|
url: `${siteInfo.url}/features/cash-flow`
|
|
}
|
|
];
|
|
|
|
return (
|
|
<div className="page-soft-bg min-h-screen font-sans text-foreground flex flex-col relative overflow-hidden">
|
|
<Background />
|
|
<SiteHeader />
|
|
<main className="relative z-10 flex-1 pt-24 pb-16">
|
|
<div className="max-w-7xl mx-auto px-6 lg:px-8">
|
|
<div className="grid lg:grid-cols-2 gap-12 items-center">
|
|
<div className="animate-slide-up">
|
|
<div className="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-secondary/50 border border-border text-xs font-medium text-muted-foreground mb-6">
|
|
Cash Flow
|
|
</div>
|
|
<h1 className="text-4xl font-bold tracking-tight text-foreground sm:text-5xl mb-6 leading-tight">
|
|
Know exactly where your {" "}
|
|
<span className="heading-hero-accent">money is going.</span>
|
|
</h1>
|
|
<p className="text-lg text-muted-foreground mb-8">
|
|
Stop guessing. LedgerOne gives you a crystal-clear view of your income versus expenses across all your accounts. Spot trends, identify leaks, and plan for the future.
|
|
</p>
|
|
<ul className="space-y-4 mb-10">
|
|
{[
|
|
"Real-time income vs expense tracking",
|
|
"Automatic categorization of transactions",
|
|
"Interactive bar and line charts",
|
|
"Forecast future cash positions"
|
|
].map((item) => (
|
|
<li key={item} className="flex items-center gap-3">
|
|
<div className="h-6 w-6 rounded-full bg-primary/20 flex items-center justify-center text-primary">
|
|
<svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M5 13l4 4L19 7"></path></svg>
|
|
</div>
|
|
<span className="text-foreground font-medium">{item}</span>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
<Link href="/register" className="btn-primary">
|
|
Start tracking cash flow
|
|
</Link>
|
|
</div>
|
|
<div className="relative animate-fade-in delay-200">
|
|
<div className="absolute -inset-4 bg-gradient-to-r from-primary/20 to-emerald-400/20 rounded-3xl blur-xl opacity-50"></div>
|
|
<div className="relative rounded-2xl border border-border bg-background/50 backdrop-blur-xl shadow-2xl overflow-hidden p-2">
|
|
<Image
|
|
src="/images/feature-cashflow.png"
|
|
alt="Cash flow visualization"
|
|
width={800}
|
|
height={600}
|
|
className="w-full h-auto rounded-xl"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<div className="relative z-10">
|
|
<SiteFooter />
|
|
</div>
|
|
<PageSchema schema={schema} />
|
|
</div>
|
|
);
|
|
}
|