feat: add About and Donate pages
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
51
apps/web/src/app/[locale]/donate/page.tsx
Normal file
51
apps/web/src/app/[locale]/donate/page.tsx
Normal file
@@ -0,0 +1,51 @@
|
||||
import { useTranslations } from "next-intl";
|
||||
|
||||
export default function DonatePage() {
|
||||
const t = useTranslations("donate");
|
||||
|
||||
return (
|
||||
<div className="max-w-4xl mx-auto px-4 py-12">
|
||||
<h1 className="text-4xl font-bold mb-6">{t("title")}</h1>
|
||||
<p className="text-lg text-gray-400 mb-12">{t("description")}</p>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6 mb-16">
|
||||
<a
|
||||
href="https://patreon.com/projectafterlife"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="block bg-gray-900 rounded-lg p-8 border border-white/5 hover:border-orange-500/50 transition-colors text-center"
|
||||
>
|
||||
<h3 className="text-2xl font-bold mb-2 text-orange-400">Patreon</h3>
|
||||
<p className="text-gray-400 text-sm mb-4">Donaciones recurrentes mensuales</p>
|
||||
<span className="inline-block px-6 py-2 bg-orange-600 hover:bg-orange-700 text-white rounded-lg font-medium transition-colors">
|
||||
{t("patreon")}
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<a
|
||||
href="https://ko-fi.com/projectafterlife"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="block bg-gray-900 rounded-lg p-8 border border-white/5 hover:border-sky-500/50 transition-colors text-center"
|
||||
>
|
||||
<h3 className="text-2xl font-bold mb-2 text-sky-400">Ko-fi</h3>
|
||||
<p className="text-gray-400 text-sm mb-4">Donaciones puntuales</p>
|
||||
<span className="inline-block px-6 py-2 bg-sky-600 hover:bg-sky-700 text-white rounded-lg font-medium transition-colors">
|
||||
{t("kofi")}
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<section>
|
||||
<h2 className="text-2xl font-semibold mb-4">{t("transparency")}</h2>
|
||||
<div className="prose prose-invert max-w-none">
|
||||
<p>
|
||||
Cada donación se destina al mantenimiento de servidores, costes de hosting,
|
||||
y equipamiento para la grabación de los audiolibros narrativos. Publicamos
|
||||
un desglose mensual de gastos.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user