feat(about): improve about page with real data and support section

- Replace example imprint data with real contact information
- Add support/donation section with SEPA, PayPal, and Steady options
- Add GEMA tariff tracking requirement note to privacy section
- Remove iframe embedding of Google Sheets, keep link only
- Remove empty lines from imprint section
- Add 'curated' to project description (DE/EN)
- Fix XML tag syntax for Google Sheets link
This commit is contained in:
Hördle Bot
2025-12-01 14:53:38 +01:00
parent 20910e5cbf
commit 68c074e9da
3 changed files with 138 additions and 25 deletions

View File

@@ -36,16 +36,20 @@ export default async function AboutPage({ params }: AboutPageProps) {
<h2 style={{ fontSize: "1.5rem", marginBottom: "0.5rem" }}>
{t("imprintTitle")}
</h2>
<p style={{ marginBottom: "0.25rem" }}>
<p style={{ marginBottom: "0.5rem" }}>
<strong>{t("imprintOperator")}</strong>
</p>
<p style={{ marginBottom: "0.25rem" }}>Max Mustermann</p>
<p style={{ marginBottom: "0.25rem" }}>Musterstraße 1</p>
<p style={{ marginBottom: "0.25rem" }}>12345 Musterstadt</p>
<p style={{ marginBottom: "0.5rem" }}>{t("imprintCountry")}</p>
<p style={{ marginBottom: "0.25rem" }}>
<p style={{ marginBottom: 0, lineHeight: "1.5" }}>
Markus Busche
<br />
Knorrstr. 16
<br />
24106 Kiel
<br />
{t("imprintCountry")}
<br />
{t("imprintEmailLabel")}{" "}
<a href="mailto:kontakt@example.com">kontakt@example.com</a>
<a href="mailto:markus@hoerdle.de">markus@hoerdle.de</a>
</p>
<p
style={{ marginTop: "0.5rem", fontSize: "0.9rem", color: "#6b7280" }}
@@ -94,20 +98,106 @@ export default async function AboutPage({ params }: AboutPageProps) {
>
{t("costsSheetPrivacyNote")}
</p>
</section>
<section style={{ marginBottom: "2rem" }}>
<h2 style={{ fontSize: "1.5rem", marginBottom: "0.5rem" }}>
{t("supportTitle")}
</h2>
<p style={{ marginBottom: "1rem" }}>{t("supportIntro")}</p>
<div
style={{
border: "1px solid #e5e7eb",
borderRadius: "0.5rem",
overflow: "hidden",
minHeight: "300px",
display: "flex",
flexDirection: "column",
gap: "1rem",
marginBottom: "1rem",
}}
>
<iframe
src={sheetUrl}
title="Hördle Kostenübersicht"
style={{ width: "100%", height: "400px", border: "0" }}
loading="lazy"
/>
<div
style={{
padding: "1rem",
border: "1px solid #e5e7eb",
borderRadius: "0.5rem",
backgroundColor: "#f9fafb",
}}
>
<h3
style={{
fontSize: "1.125rem",
fontWeight: "600",
marginBottom: "0.5rem",
}}
>
{t("supportSepaTitle")}
</h3>
<p style={{ marginBottom: "0.25rem" }}>
<strong>{t("supportSepaName")}</strong>
</p>
<p style={{ marginBottom: 0, fontFamily: "monospace" }}>
{t("supportSepaIban")}
</p>
</div>
<div
style={{
padding: "1rem",
border: "1px solid #e5e7eb",
borderRadius: "0.5rem",
backgroundColor: "#f9fafb",
}}
>
<h3
style={{
fontSize: "1.125rem",
fontWeight: "600",
marginBottom: "0.5rem",
}}
>
{t("supportPaypalTitle")}
</h3>
<p style={{ marginBottom: 0 }}>
<a
href="https://paypal.me/MBusche"
target="_blank"
rel="noopener noreferrer"
style={{ textDecoration: "underline" }}
>
{t("supportPaypalLink")}
</a>
</p>
</div>
<div
style={{
padding: "1rem",
border: "1px solid #e5e7eb",
borderRadius: "0.5rem",
backgroundColor: "#f9fafb",
}}
>
<h3
style={{
fontSize: "1.125rem",
fontWeight: "600",
marginBottom: "0.5rem",
}}
>
{t("supportSteadyTitle")}
</h3>
<p style={{ marginBottom: "0.5rem" }}>
{t("supportSteadyDescription")}
</p>
<p style={{ marginBottom: 0 }}>
<a
href="https://steady.page/de/hoerdle"
target="_blank"
rel="noopener noreferrer"
style={{ textDecoration: "underline" }}
>
https://steady.page/de/hoerdle
</a>
</p>
</div>
</div>
</section>
@@ -128,6 +218,9 @@ export default async function AboutPage({ params }: AboutPageProps) {
<p style={{ marginBottom: "0.5rem" }}>
{t("privacyPlausibleSelfHosted")}
</p>
<p style={{ marginBottom: "0.5rem" }}>
{t("privacyPlausibleGemaTariff")}
</p>
<ul
style={{
marginLeft: "1.25rem",