import { Body, Container, Head, Heading, Html, Img, Link, Preview, Text, } from "@react-email/components"; import * as React from "react"; interface NotionMagicLinkEmailProps { loginCode?: string; } const baseUrl = process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : ""; export const NotionMagicLinkEmail = ({ loginCode, }: NotionMagicLinkEmailProps) => ( Log in with this magic link Login Click here to log in with this magic link Or, copy and paste this temporary login code: {loginCode} If you didn't try to login, you can safely ignore this email. Hint: You can set a permanent password in Settings & members → My account.

Notion.so , the all-in-one-workspace
for your notes, tasks, wikis, and databases. ); NotionMagicLinkEmail.PreviewProps = { loginCode: "sparo-ndigo-amurt-secan", } as NotionMagicLinkEmailProps; export default NotionMagicLinkEmail; const main = { backgroundColor: "#ffffff", }; const container = { paddingLeft: "12px", paddingRight: "12px", margin: "0 auto", }; const h1 = { color: "#333", fontFamily: "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif", fontSize: "24px", fontWeight: "bold", margin: "40px 0", padding: "0", }; const link = { color: "#2754C5", fontFamily: "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif", fontSize: "14px", textDecoration: "underline", }; const text = { color: "#333", fontFamily: "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif", fontSize: "14px", margin: "24px 0", }; const footer = { color: "#898989", fontFamily: "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif", fontSize: "12px", lineHeight: "22px", marginTop: "12px", marginBottom: "24px", }; const code = { display: "inline-block", padding: "16px 4.5%", width: "90.5%", backgroundColor: "#f4f4f4", borderRadius: "5px", border: "1px solid #eee", color: "#333", };