feat(sponsor): show Stripe wordmark above the one-time/monthly toggle

Adds a subtle "payments processed by Stripe" indicator (official
wordmark SVG from Simple Icons, muted/low-opacity) above the
contribution-type selector on the Unterstützen page, so visitors know
which payment provider handles the transaction before choosing an
option.
This commit is contained in:
2026-08-16 13:57:27 +02:00
parent 824927cb77
commit 9c55e18d4e
3 changed files with 14 additions and 0 deletions
+1
View File
@@ -137,6 +137,7 @@
"Sponsor": {
"title": "PawFeed unterstützen",
"subtitle": "PawFeed wird komplett privat finanziert — ganz ohne Investoren, aus eigener Tasche. Server-Hardware, Software-Lizenzen und weitere Tools verursachen laufende Kosten. Mit deinem freiwilligen Beitrag hilfst du, die Plattform am Laufen zu halten — als Dankeschön bekommst du das Sponsor-Badge auf deinem Profil und bei jedem Beitrag.",
"poweredByStripe": "Zahlungsabwicklung über",
"oneTime": "Einmalig",
"monthly": "Monatlich",
"customAmountLabel": "Betrag in Euro",
+1
View File
@@ -137,6 +137,7 @@
"Sponsor": {
"title": "Support PawFeed",
"subtitle": "PawFeed is entirely privately financed — no investors, out of pocket. Server hardware, software licenses, and other tools mean ongoing costs. Your voluntary contribution helps keep the platform running — as a thank-you, you get the Sponsor badge on your profile and on every post.",
"poweredByStripe": "Payments processed by",
"oneTime": "One-time",
"monthly": "Monthly",
"customAmountLabel": "Amount in Euro",
+12
View File
@@ -97,6 +97,18 @@ export default function SponsorPage() {
)}
<div className="rounded-2xl border border-border bg-card p-6">
<div className="mb-4 flex items-center justify-center gap-1.5 text-muted-foreground/40">
<span className="text-xs">{t("poweredByStripe")}</span>
<svg
viewBox="0 0 24 24"
className="h-4 w-4"
fill="currentColor"
aria-hidden="true"
>
<path d="M13.976 9.15c-2.172-.806-3.356-1.426-3.356-2.409 0-.831.683-1.305 1.901-1.305 2.227 0 4.515.858 6.09 1.631l.89-5.494C18.252.975 15.697 0 12.165 0 9.667 0 7.589.654 6.104 1.872 4.56 3.147 3.757 4.992 3.757 7.218c0 4.039 2.467 5.76 6.476 7.219 2.585.92 3.445 1.574 3.445 2.583 0 .98-.84 1.545-2.354 1.545-1.875 0-4.965-.921-6.99-2.109l-.9 5.555C5.175 22.99 8.385 24 11.714 24c2.641 0 4.843-.624 6.328-1.813 1.664-1.305 2.525-3.236 2.525-5.732 0-4.128-2.524-5.851-6.594-7.305h.003z" />
</svg>
</div>
<div className="mb-5 flex gap-2">
{(["ONE_TIME", "SUBSCRIPTION"] as const).map((option) => (
<button