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
@@ -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",
|
||||
|
||||
@@ -156,25 +156,35 @@
|
||||
"title": "Über Hördle & Impressum",
|
||||
"intro": "Hördle ist ein nicht-kommerzielles, privat betriebenes Hobbyprojekt. Es gibt keine Werbeanzeigen, keine gesponserten Inhalte und keine versteckten Abo-Modelle.",
|
||||
"projectTitle": "Über dieses Projekt",
|
||||
"projectPrivateNote": "Hördle wird privat in der Freizeit entwickelt, betrieben und finanziert. Es besteht kein Anspruch auf permanente Verfügbarkeit oder Vollständigkeit.",
|
||||
"projectPrivateNote": "Hördle wird privat in der Freizeit entwickelt, betrieben, kuratiert und finanziert. Es besteht kein Anspruch auf permanente Verfügbarkeit oder Vollständigkeit.",
|
||||
"projectIdea": "Die Idee hinter Hördle ist, Musik spielerisch neu zu entdecken und Lieblingssongs wiederzuentdecken – inspiriert von Wordle, aber für Musikfans.",
|
||||
"imprintTitle": "Impressum (Beispieldaten)",
|
||||
"imprintTitle": "Impressum",
|
||||
"imprintOperator": "Verantwortlich für den Inhalt dieser Seite (Anbieter nach § 5 TMG):",
|
||||
"imprintCountry": "Deutschland",
|
||||
"imprintEmailLabel": "E-Mail:",
|
||||
"imprintDisclaimer": "Hinweis: Diese Angaben sind Beispieldaten und stellen keine rechtsverbindliche oder vollständige Rechtsberatung dar. Für eine rechtskonforme Fassung solltest du rechtlichen Rat einholen.",
|
||||
"imprintDisclaimer": "Hinweis: Diese Angaben entsprechen dem aktuellen Stand. Für rechtliche Fragen solltest du eine Fachperson konsultieren.",
|
||||
"costsTitle": "Laufende Kosten des Projekts",
|
||||
"costsIntro": "Auch wenn Hördle ein privates Projekt ist, entstehen für den Betrieb laufende Kosten, zum Beispiel:",
|
||||
"costsDomain": "Domains (z. B. hördle.de / hoerdle.de)",
|
||||
"costsServer": "Server / vServer für App und Tracking",
|
||||
"costsEmail": "E-Mail-Hosting",
|
||||
"costsLicenses": "ggf. Gebühren für Urheberrechte oder andere Lizenzen",
|
||||
"costsSheetLinkText": "Eine detaillierte, laufend gepflegte Übersicht über die aktuellen Kosten findest du in dieser {link}Google-Tabelle{linkEnd}.",
|
||||
"costsSheetLinkText": "Eine detaillierte, laufend gepflegte Übersicht über die aktuellen Kosten findest du in dieser <link>Google-Tabelle</link>.",
|
||||
"costsSheetPrivacyNote": "Beim Aufruf oder Einbetten der Google-Tabelle können Daten (z. B. deine IP-Adresse) an Google übermittelt werden. Wenn du das nicht möchtest, öffne die Tabelle nicht.",
|
||||
"supportTitle": "Hördle unterstützen",
|
||||
"supportIntro": "Hördle ist ein nicht-kommerzielles Projekt, das von laufenden Kosten finanziert werden muss. Wenn du das Projekt finanziell unterstützen möchtest, gibt es folgende Möglichkeiten:",
|
||||
"supportSepaTitle": "SEPA Banküberweisung (bevorzugt)",
|
||||
"supportSepaName": "Markus Busche",
|
||||
"supportSepaIban": "IBAN: DE28500310001071584000",
|
||||
"supportPaypalTitle": "PayPal Spende",
|
||||
"supportPaypalLink": "paypal.me/MBusche",
|
||||
"supportSteadyTitle": "Steady",
|
||||
"supportSteadyDescription": "Regelmäßige Unterstützung über Steady",
|
||||
"privacyTitle": "Datenschutz",
|
||||
"privacyIntro": "Der Schutz deiner Privatsphäre ist wichtig. Dieses Projekt versucht, so datensparsam wie möglich zu arbeiten.",
|
||||
"privacyPlausibleTitle": "Selbst gehostetes Plausible Analytics",
|
||||
"privacyPlausibleSelfHosted": "Für anonyme Nutzungsstatistiken wird Plausible Analytics auf einem selbst gehosteten Server verwendet. Es werden keine personalisierten Profile erstellt.",
|
||||
"privacyPlausibleGemaTariff": "Das Tracking ist erforderlich, um den passenden GEMA Tarif zu bestimmen.",
|
||||
"privacyPlausibleNoCookies": "Es werden keine Cookies für das Tracking gesetzt.",
|
||||
"privacyPlausibleNoTrackingAcrossSites": "Es findet kein Tracking über mehrere Webseiten oder Geräte hinweg statt.",
|
||||
"privacyPlausibleAggregated": "Auswertungen erfolgen ausschließlich in aggregierter Form (z. B. Seitenaufrufe, genutzte Browser).",
|
||||
|
||||
@@ -156,25 +156,35 @@
|
||||
"title": "About Hördle & Imprint",
|
||||
"intro": "Hördle is a non-commercial, privately run hobby project. There are no ads, no sponsored content and no hidden subscription models.",
|
||||
"projectTitle": "About this project",
|
||||
"projectPrivateNote": "Hördle is developed, operated and financed privately in the creator's spare time. There is no guarantee for permanent availability or completeness.",
|
||||
"projectPrivateNote": "Hördle is developed, operated, curated and financed privately in the creator's spare time. There is no guarantee for permanent availability or completeness.",
|
||||
"projectIdea": "The idea behind Hördle is to (re)discover music in a playful way – inspired by Wordle, but for music lovers.",
|
||||
"imprintTitle": "Imprint (example data)",
|
||||
"imprintTitle": "Imprint",
|
||||
"imprintOperator": "Responsible for the content of this site (provider under German law):",
|
||||
"imprintCountry": "Germany",
|
||||
"imprintEmailLabel": "Email:",
|
||||
"imprintDisclaimer": "Note: This information is example data only and does not constitute legal advice. For a legally compliant imprint you should consult a legal professional.",
|
||||
"imprintDisclaimer": "Note: This information is current as of the date indicated. For legal questions you should consult a legal professional.",
|
||||
"costsTitle": "Ongoing costs of the project",
|
||||
"costsIntro": "Even though Hördle is a private project, there are ongoing costs for running it, for example:",
|
||||
"costsDomain": "Domains (e.g. hördle.de / hoerdle.de)",
|
||||
"costsServer": "Servers / vServers for the app and tracking",
|
||||
"costsEmail": "Email hosting",
|
||||
"costsLicenses": "Possible fees for copyrights or other licenses",
|
||||
"costsSheetLinkText": "You can find a detailed, continuously updated overview of the current costs in this {link}Google Sheet{linkEnd}.",
|
||||
"costsSheetLinkText": "You can find a detailed, continuously updated overview of the current costs in this <link>Google Sheet</link>.",
|
||||
"costsSheetPrivacyNote": "When accessing or embedding the Google Sheet, data (e.g. your IP address) may be transmitted to Google. If you don't want that, please do not open the sheet.",
|
||||
"supportTitle": "Support Hördle",
|
||||
"supportIntro": "Hördle is a non-commercial project that needs to be financed by ongoing costs. If you would like to support the project financially, here are the options:",
|
||||
"supportSepaTitle": "SEPA Bank Transfer (preferred)",
|
||||
"supportSepaName": "Markus Busche",
|
||||
"supportSepaIban": "IBAN: DE28500310001071584000",
|
||||
"supportPaypalTitle": "PayPal Donation",
|
||||
"supportPaypalLink": "paypal.me/MBusche",
|
||||
"supportSteadyTitle": "Steady",
|
||||
"supportSteadyDescription": "Regular support via Steady",
|
||||
"privacyTitle": "Privacy",
|
||||
"privacyIntro": "Protecting your privacy matters. This project aims to collect as little data as possible.",
|
||||
"privacyPlausibleTitle": "Self-hosted Plausible Analytics",
|
||||
"privacyPlausibleSelfHosted": "For anonymous usage statistics, Plausible Analytics is used on a self-hosted server. No personal profiles are created.",
|
||||
"privacyPlausibleGemaTariff": "Tracking is required to determine the appropriate GEMA tariff.",
|
||||
"privacyPlausibleNoCookies": "No cookies are set for analytics purposes.",
|
||||
"privacyPlausibleNoTrackingAcrossSites": "There is no tracking across multiple websites or devices.",
|
||||
"privacyPlausibleAggregated": "Analytics are only performed in aggregated form (e.g. page views, browsers used).",
|
||||
|
||||
Reference in New Issue
Block a user