mirror of
https://github.com/Tria-plc/edr-platform.git
synced 2026-09-06 05:23:38 +00:00
29a7381335
Replace the icon-and-cards landing with a photographic hero that alternates between the Furi station and freight train photos, a single headline, and two compact glass cards that pin the background on hover. Below it: the corridor rail, one showcase mockup per portal (passenger trip search, freight live tracking), the existing stats and footer. - Add the official EDR logo as transparent green/white PNGs (lockup and mark), used in the header, footer and favicon - Switch to Plus Jakarta Sans and a palette keyed to the logo green - Split the page into components under src/components - Header links: Passenger, Freight, Publications
38 lines
1.3 KiB
TypeScript
38 lines
1.3 KiB
TypeScript
import { CountUp, Reveal } from "./motion";
|
|
|
|
const stats = [
|
|
{ value: 752, suffix: " km", label: "Addis Ababa to Djibouti, electrified standard gauge" },
|
|
{ value: 16, prefix: "~", suffix: " h", label: "Mojo Dry Port to Djibouti Port transit" },
|
|
{ value: 2, label: "Countries connected by one railway" },
|
|
{ text: "24/7", label: "Booking and tracking online" },
|
|
] as const;
|
|
|
|
export function Stats() {
|
|
return (
|
|
<section className="border-t border-edr-border bg-edr-surface py-16">
|
|
<div className="mx-auto max-w-6xl px-6">
|
|
<Reveal>
|
|
<dl className="grid grid-cols-2 gap-x-6 gap-y-10 lg:grid-cols-4">
|
|
{stats.map((stat) => (
|
|
<div key={stat.label}>
|
|
<dt className="text-3xl font-extrabold tracking-tight text-edr-ink md:text-4xl">
|
|
{"text" in stat ? (
|
|
stat.text
|
|
) : (
|
|
<CountUp
|
|
value={stat.value}
|
|
prefix={"prefix" in stat ? stat.prefix : ""}
|
|
suffix={"suffix" in stat ? stat.suffix : ""}
|
|
/>
|
|
)}
|
|
</dt>
|
|
<dd className="mt-2 text-sm leading-relaxed text-edr-muted">{stat.label}</dd>
|
|
</div>
|
|
))}
|
|
</dl>
|
|
</Reveal>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|