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-08 04:42:28 -05:00
parent def36bf3aa
commit b99fba1c5a
11 changed files with 255 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
app/components/Roadmap.tsx
View File

@@ -15,13 +15,13 @@ const days = [
export default function Roadmap() {
const { t } = useTranslation("roadmap");
return (
<section id="roadmap" className="bg-slate-50 py-20 sm:py-28">
<section id="roadmap" className="bg-slate-50 py-20 sm:py-28 dark:bg-slate-900">
<div className="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
<div className="text-center">
<h2 className="text-3xl font-bold tracking-tight sm:text-4xl">
<h2 className="text-3xl font-bold tracking-tight text-slate-900 dark:text-slate-100 sm:text-4xl">
{t("title")} <span className="gradient-text">{t("titleHighlight")}</span>
</h2>
<p className="mx-auto mt-4 max-w-2xl text-lg text-slate-600">
<p className="mx-auto mt-4 max-w-2xl text-lg text-slate-600 dark:text-slate-400">
{t("subtitle")}
</p>
</div>
@@ -31,7 +31,7 @@ export default function Roadmap() {
<Link
key={d.day}
href={`/day/${d.day}`}
className="card-hover group flex flex-col rounded-2xl border border-slate-100 bg-white p-5 shadow-sm transition-all hover:border-sky-200 hover:shadow-md"
className="card-hover group flex flex-col rounded-2xl border border-slate-100 bg-white p-5 shadow-sm transition-all hover:border-sky-200 hover:shadow-md dark:border-slate-800 dark:bg-slate-800 dark:hover:border-sky-700"
>
<div className="flex items-center gap-3">
<div
@@ -40,21 +40,21 @@ export default function Roadmap() {
DAY {d.day}
</div>
<span className="text-xl">{d.icon}</span>
<h3 className="text-base font-bold text-slate-900 group-hover:text-sky-600">
<h3 className="text-base font-bold text-slate-900 group-hover:text-sky-600 dark:text-slate-100 dark:group-hover:text-sky-400">
{t(`days.${d.day}.title`)}
</h3>
</div>
<p className="mt-3 flex-1 text-sm leading-relaxed text-slate-600">
<p className="mt-3 flex-1 text-sm leading-relaxed text-slate-600 dark:text-slate-400">
{t(`days.${d.day}.desc`)}
</p>
<span className="mt-3 inline-flex items-center text-sm font-medium text-sky-600">
<span className="mt-3 inline-flex items-center text-sm font-medium text-sky-600 dark:text-sky-400">
{t("viewDetails")}
</span>
</Link>
))}
<Link
href="/ebook"
className="card-hover group flex flex-col rounded-2xl border border-slate-100 bg-white p-5 shadow-sm transition-all hover:border-sky-200 hover:shadow-md"
className="card-hover group flex flex-col rounded-2xl border border-slate-100 bg-white p-5 shadow-sm transition-all hover:border-sky-200 hover:shadow-md dark:border-slate-800 dark:bg-slate-800 dark:hover:border-sky-700"
>
<div className="flex items-center gap-3">
<div className="flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-gradient-to-r from-sky-500 to-cyan-500 text-xs font-bold text-white">
@@ -73,19 +73,19 @@ export default function Roadmap() {
</Link>
</div>
<div className="mt-16 overflow-hidden rounded-2xl border border-amber-200 bg-gradient-to-r from-amber-50 to-orange-50 p-8 text-center sm:p-10">
<div className="mb-2 text-sm font-semibold text-amber-600">
<div className="mt-16 overflow-hidden rounded-2xl border border-amber-200 bg-gradient-to-r from-amber-50 to-orange-50 p-8 text-center dark:border-amber-800 dark:from-amber-900/30 dark:to-orange-900/30 sm:p-10">
<div className="mb-2 text-sm font-semibold text-amber-600 dark:text-amber-400">
{t("course.tag")}
</div>
<h3 className="text-2xl font-bold text-slate-900">
{t("course.title")}
</h3>
<p className="mx-auto mt-3 max-w-xl text-slate-600">
<p className="mx-auto mt-3 max-w-xl text-slate-600 dark:text-slate-400">
{t("course.desc")}
</p>
<Link
href="/course"
className="mt-6 inline-flex items-center gap-2 rounded-full bg-amber-500 px-8 py-3 font-semibold text-white transition-colors hover:bg-amber-600"
className="mt-6 inline-flex items-center gap-2 rounded-full bg-amber-500 px-8 py-3 font-semibold text-white transition-colors hover:bg-amber-600 dark:bg-amber-600 dark:hover:bg-amber-500"
>
{t("course.cta")}
</Link>