Add non-destructive dev seed on startup

2026-05-06 22:31:07 +02:00
parent 9f452fccac
commit b686e714ff
77 changed files with 10862 additions and 87 deletions
@@ -0,0 +1,155 @@
+import {
+  Body,
+  Button,
+  Container,
+  Head,
+  Heading,
+  Hr,
+  Html,
+  Preview,
+  Section,
+  Text,
+} from "@react-email/components";
+
+type InviteEmailProps = {
+  parentName: string;
+  kitaName: string;
+  inviteLink: string;
+};
+
+export function InviteEmail({
+  parentName,
+  kitaName,
+  inviteLink,
+}: InviteEmailProps) {
+  return (
+    <Html lang="de">
+      <Head />
+      <Preview>Aktiviere deinen Kita-Planer Account fuer {kitaName}</Preview>
+      <Body style={styles.body}>
+        <Container style={styles.container}>
+          <Section style={styles.header}>
+            <Text style={styles.brand}>Kita-Planer</Text>
+            <Heading style={styles.heading}>Willkommen bei {kitaName}</Heading>
+            <Text style={styles.lead}>
+              Hallo {parentName}, dein Eltern-Account wurde vorbereitet.
+            </Text>
+          </Section>
+
+          <Section style={styles.card}>
+            <Text style={styles.text}>
+              Ueber den folgenden Link kannst du dein Passwort setzen und deinen
+              Account aktivieren. Danach hast du Zugriff auf die Kita-Planung,
+              Termine und deine Familiendaten.
+            </Text>
+
+            <Button href={inviteLink} style={styles.button}>
+              Account aktivieren
+            </Button>
+
+            <Text style={styles.fallbackText}>
+              Falls der Button nicht funktioniert, kopiere diesen Link in deinen
+              Browser:
+            </Text>
+            <Text style={styles.linkText}>{inviteLink}</Text>
+          </Section>
+
+          <Hr style={styles.hr} />
+          <Text style={styles.footer}>
+            Diese Einladung wurde von deiner Kita erstellt. Wenn du sie nicht
+            erwartet hast, kannst du diese E-Mail ignorieren.
+          </Text>
+        </Container>
+      </Body>
+    </Html>
+  );
+}
+
+const styles = {
+  body: {
+    margin: 0,
+    backgroundColor: "#f6f7f2",
+    fontFamily:
+      '-apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
+    color: "#1f2a24",
+  },
+  container: {
+    width: "100%",
+    maxWidth: "600px",
+    margin: "0 auto",
+    padding: "32px 20px",
+  },
+  header: {
+    padding: "28px 28px 20px",
+    backgroundColor: "#1f3b2d",
+    borderRadius: "8px 8px 0 0",
+  },
+  brand: {
+    margin: "0 0 28px",
+    color: "#d8f2bd",
+    fontSize: "13px",
+    fontWeight: 700,
+    letterSpacing: "0.08em",
+    textTransform: "uppercase" as const,
+  },
+  heading: {
+    margin: "0 0 12px",
+    color: "#ffffff",
+    fontSize: "30px",
+    lineHeight: "1.18",
+    fontWeight: 800,
+  },
+  lead: {
+    margin: 0,
+    color: "#e7f3e6",
+    fontSize: "16px",
+    lineHeight: "1.55",
+  },
+  card: {
+    padding: "28px",
+    backgroundColor: "#ffffff",
+    borderRadius: "0 0 8px 8px",
+    border: "1px solid #e0e5dc",
+    borderTop: "0",
+  },
+  text: {
+    margin: "0 0 24px",
+    color: "#344139",
+    fontSize: "16px",
+    lineHeight: "1.65",
+  },
+  button: {
+    display: "inline-block",
+    padding: "14px 22px",
+    backgroundColor: "#f0b84b",
+    color: "#172119",
+    borderRadius: "6px",
+    fontSize: "15px",
+    fontWeight: 800,
+    textDecoration: "none",
+  },
+  fallbackText: {
+    margin: "28px 0 8px",
+    color: "#66736b",
+    fontSize: "13px",
+    lineHeight: "1.5",
+  },
+  linkText: {
+    margin: 0,
+    color: "#2f6b4f",
+    fontSize: "13px",
+    lineHeight: "1.5",
+    wordBreak: "break-all" as const,
+  },
+  hr: {
+    margin: "24px 0",
+    borderColor: "#dfe5d9",
+  },
+  footer: {
+    margin: 0,
+    color: "#7b857d",
+    fontSize: "12px",
+    lineHeight: "1.5",
+    textAlign: "center" as const,
+  },
+};