eric/gitlab-instance-0a899031_digital
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

's'

Browse Source
This commit is contained in:
eric
2026-03-12 02:23:10 -05:00
parent f653dccd6d
commit 421f979e10
21 changed files with 709 additions and 264 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
app/components/Hero.tsx
View File

@@ -4,13 +4,6 @@ import { useTranslation } from "@/i18n/navigation";
export default function Hero() {
const { t } = useTranslation("hero");
const stats = [
{ value: "200+", labelKey: "resources" as const },
{ value: "7 天", labelKey: "path" as const },
{ value: "50+", labelKey: "tools" as const },
{ value: "30+", labelKey: "destinations" as const },
{ value: "100%", labelKey: "free" as const },
];
return (
<section className="relative overflow-hidden pt-24 pb-16 sm:pt-32 sm:pb-20">
<div className="pointer-events-none absolute inset-0 bg-gradient-to-b from-sky-50/80 via-white to-white dark:from-slate-900 dark:via-slate-900 dark:to-slate-950" />
@@ -53,43 +46,6 @@ export default function Hero() {
</a>
</div>
</div>
{/* Stats marquee */}
<div className="marquee-container mt-16 overflow-hidden">
<div className="flex animate-scroll w-max gap-6">
{[...stats, ...stats].map((s, i) => (
<div
key={i}
className="flex shrink-0 items-center gap-3 rounded-2xl border border-slate-100 bg-white/80 px-6 py-4 shadow-sm backdrop-blur-sm dark:border-slate-700 dark:bg-slate-800/80"
>
<span className="text-2xl font-bold text-sky-600 sm:text-3xl">
{s.value}
</span>
<span className="text-sm font-medium text-slate-500 dark:text-slate-400">
{t(`stats.${s.labelKey}`)}
</span>
</div>
))}
</div>
</div>
<div className="marquee-container mt-4 overflow-hidden">
<div className="flex animate-scroll-reverse w-max gap-6">
{[...stats, ...stats].map((s, i) => (
<div
key={i}
className="flex shrink-0 items-center gap-3 rounded-2xl border border-slate-100 bg-white/80 px-6 py-4 shadow-sm backdrop-blur-sm dark:border-slate-700 dark:bg-slate-800/80"
>
<span className="text-2xl font-bold text-amber-500 sm:text-3xl">
{s.value}
</span>
<span className="text-sm font-medium text-slate-500 dark:text-slate-400">
{t(`stats.${s.labelKey}`)}
</span>
</div>
))}
</div>
</div>
</div>
</section>
);