import { Body, Container, Head, Heading, Html, Img, Link, Preview, Text, } from 'react-email'; 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's Logo 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', };