Files
whyrating/apps/web/src/modules/marketing/home/social-proof.tsx
Alejandro Gutiérrez e0bf1b534b feat: redesign landing page with report-inspired visuals and conversion optimization
Add tabbed report preview (score gauge, domains, issues, actions), annotated
review evidence cards with sentiment highlights, social proof bar, and visual
how-it-works mockups. Enhance hero with stat pills, testimonials with stars,
and banner with mini gauge. Remove redundant features section.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-22 16:01:49 +00:00

34 lines
1.0 KiB
TypeScript

import { getTranslation } from "@turbostarter/i18n/server";
const stats = [
{ key: "reports" },
{ key: "rating" },
{ key: "dimensions" },
] as const;
export const SocialProof = async () => {
const { t } = await getTranslation({ ns: "marketing" });
return (
<div className="border-y bg-muted/30 py-6 sm:py-8">
<div className="mx-auto flex max-w-5xl flex-col items-center justify-center gap-6 px-6 sm:flex-row sm:gap-12 md:gap-16">
{stats.map((stat) => {
const text = t(`socialProof.${stat.key}` as const);
const match = text.match(/^([\d.+]+)\s+(.+)$/);
const number = match?.[1] ?? text;
const label = match?.[2] ?? "";
return (
<div key={stat.key} className="flex flex-col items-center text-center">
<span className="text-2xl font-bold tracking-tight sm:text-3xl">
{number}
</span>
<span className="text-sm text-muted-foreground">{label}</span>
</div>
);
})}
</div>
</div>
);
};