Shuffle/supabase/templates/confirmation.html
cschlaefke 59a47c5a5d feat(auth): configure Supabase Auth and add de/en mail templates
Adds AUTH-CFG settings, confirmation/recovery templates and
docs/auth-konfiguration.md (KTO-01 criteria 1, 3, 4, 7, 8, 11).

Refs #1

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
2026-11-02 23:23:06 +01:00

50 lines
3.5 KiB
HTML

<!DOCTYPE html>
{{- /*
AUTH-CFG-17: Bestätigungs-Mail (KTO-01 Kriterium 1, 11).
Sprache aus user_metadata.locale ("de"), sonst Englisch. Keine externen Ressourcen, keine Bilder.
Der Link führt auf die App-Seite /auth/confirm; erst der Klick dort löst die Prüfung aus (Spec E3).
Das Token (TokenHash) wird bewusst nicht als Klartext angezeigt, nur der Link.
*/ -}}
{{ if and .Data (eq (index .Data "locale") "de") }}
<html lang="de">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bestätige deine E-Mail-Adresse für Shuffle</title>
</head>
<body style="margin:0;padding:24px;background-color:#f4f4f5;font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.5;color:#1a1a1a;">
<div style="max-width:560px;margin:0 auto;padding:24px;background-color:#ffffff;">
<h1 style="margin:0 0 16px 0;font-size:22px;line-height:1.3;color:#1a1a1a;">Bestätige deine E-Mail-Adresse</h1>
<p style="margin:0 0 16px 0;">Willkommen bei Shuffle! Bitte bestätige deine E-Mail-Adresse, damit dein Konto genutzt werden kann.</p>
<p style="margin:0 0 24px 0;">
<a href="{{ .SiteURL }}/auth/confirm?token_hash={{ .TokenHash }}&amp;type=email" style="display:inline-block;padding:14px 24px;background-color:#1d4ed8;color:#ffffff;font-weight:bold;text-decoration:none;border-radius:6px;">E-Mail-Adresse bestätigen</a>
</p>
<p style="margin:0 0 8px 0;">Der Link ist 1 Stunde gültig und kann nur einmal verwendet werden.</p>
<p style="margin:0 0 16px 0;">Falls der Knopf nicht funktioniert, kopiere diese Adresse in die Adresszeile deines Browsers:</p>
<p style="margin:0 0 24px 0;word-break:break-all;"><a href="{{ .SiteURL }}/auth/confirm?token_hash={{ .TokenHash }}&amp;type=email" style="color:#1d4ed8;">{{ .SiteURL }}/auth/confirm?token_hash={{ .TokenHash }}&amp;type=email</a></p>
<p style="margin:0;color:#4b5563;">Wenn du das nicht warst, ignoriere diese E-Mail. Es wird dann nichts geändert.</p>
</div>
</body>
</html>
{{ else }}
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Confirm your email address for Shuffle</title>
</head>
<body style="margin:0;padding:24px;background-color:#f4f4f5;font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.5;color:#1a1a1a;">
<div style="max-width:560px;margin:0 auto;padding:24px;background-color:#ffffff;">
<h1 style="margin:0 0 16px 0;font-size:22px;line-height:1.3;color:#1a1a1a;">Confirm your email address</h1>
<p style="margin:0 0 16px 0;">Welcome to Shuffle! Please confirm your email address so you can use your account.</p>
<p style="margin:0 0 24px 0;">
<a href="{{ .SiteURL }}/auth/confirm?token_hash={{ .TokenHash }}&amp;type=email" style="display:inline-block;padding:14px 24px;background-color:#1d4ed8;color:#ffffff;font-weight:bold;text-decoration:none;border-radius:6px;">Confirm email address</a>
</p>
<p style="margin:0 0 8px 0;">The link is valid for 1 hour and can only be used once.</p>
<p style="margin:0 0 16px 0;">If the button does not work, copy this address into your browser's address bar:</p>
<p style="margin:0 0 24px 0;word-break:break-all;"><a href="{{ .SiteURL }}/auth/confirm?token_hash={{ .TokenHash }}&amp;type=email" style="color:#1d4ed8;">{{ .SiteURL }}/auth/confirm?token_hash={{ .TokenHash }}&amp;type=email</a></p>
<p style="margin:0;color:#4b5563;">If this wasn't you, you can ignore this email. Nothing will be changed.</p>
</div>
</body>
</html>
{{ end }}