feat: add basic webui

2024-12-30 06:39:09 +08:00
parent 608a7fb9c6
commit a4c549e7c3
462 changed files with 35900 additions and 2491 deletions
--- a/packages/email/templates/contact.tsx
+++ b/packages/email/templates/contact.tsx
@@ -0,0 +1,56 @@
+import {
+  Body,
+  Container,
+  Head,
+  Hr,
+  Html,
+  Preview,
+  Section,
+  Tailwind,
+  Text,
+} from '@react-email/components';
+
+type ContactTemplateProps = {
+  readonly name: string;
+  readonly email: string;
+  readonly message: string;
+};
+
+export const ContactTemplate = ({
+  name,
+  email,
+  message,
+}: ContactTemplateProps) => (
+  <Tailwind>
+    <Html>
+      <Head />
+      <Preview>New email from {name}</Preview>
+      <Body className="bg-zinc-50 font-sans">
+        <Container className="mx-auto py-12">
+          <Section className="mt-8 rounded-md bg-zinc-200 p-px">
+            <Section className="rounded-[5px] bg-white p-8">
+              <Text className="mt-0 mb-4 font-semibold text-2xl text-zinc-950">
+                New email from {name}
+              </Text>
+              <Text className="m-0 text-zinc-500">
+                {name} ({email}) has sent you a message:
+              </Text>
+              <Hr className="my-4" />
+              <Text className="m-0 text-zinc-500">{message}</Text>
+            </Section>
+          </Section>
+        </Container>
+      </Body>
+    </Html>
+  </Tailwind>
+);
+
+const ExampleContactEmail = () => (
+  <ContactTemplate
+    name="Jane Smith"
+    email="jane@example.com"
+    message="Hello, how do I get started?"
+  />
+);
+
+export default ExampleContactEmail;