mirror of
https://github.com/Dokploy/dokploy
synced 2025-06-26 18:27:59 +00:00
chore: update biome format
This commit is contained in:
Mauricio Siu
@@ -1,158 +1,158 @@
|
||||
import {
|
||||
Body,
|
||||
Container,
|
||||
Head,
|
||||
Heading,
|
||||
Html,
|
||||
Img,
|
||||
Link,
|
||||
Section,
|
||||
Text,
|
||||
Body,
|
||||
Container,
|
||||
Head,
|
||||
Heading,
|
||||
Html,
|
||||
Img,
|
||||
Link,
|
||||
Section,
|
||||
Text,
|
||||
} from "@react-email/components";
|
||||
import * as React from "react";
|
||||
|
||||
interface PlaidVerifyIdentityEmailProps {
|
||||
validationCode?: string;
|
||||
validationCode?: string;
|
||||
}
|
||||
|
||||
const baseUrl = process.env.VERCEL_URL
|
||||
? `https://${process.env.VERCEL_URL}`
|
||||
: "";
|
||||
? `https://${process.env.VERCEL_URL}`
|
||||
: "";
|
||||
|
||||
export const PlaidVerifyIdentityEmail = ({
|
||||
validationCode,
|
||||
validationCode,
|
||||
}: PlaidVerifyIdentityEmailProps) => (
|
||||
<Html>
|
||||
<Head />
|
||||
<Body style={main}>
|
||||
<Container style={container}>
|
||||
<Img
|
||||
src={`${baseUrl}/static/plaid-logo.png`}
|
||||
width="212"
|
||||
height="88"
|
||||
alt="Plaid"
|
||||
style={logo}
|
||||
/>
|
||||
<Text style={tertiary}>Verify Your Identity</Text>
|
||||
<Heading style={secondary}>
|
||||
Enter the following code to finish linking Venmo.
|
||||
</Heading>
|
||||
<Section style={codeContainer}>
|
||||
<Text style={code}>{validationCode}</Text>
|
||||
</Section>
|
||||
<Text style={paragraph}>Not expecting this email?</Text>
|
||||
<Text style={paragraph}>
|
||||
Contact{" "}
|
||||
<Link href="mailto:login@plaid.com" style={link}>
|
||||
login@plaid.com
|
||||
</Link>{" "}
|
||||
if you did not request this code.
|
||||
</Text>
|
||||
</Container>
|
||||
<Text style={footer}>Securely powered by Plaid.</Text>
|
||||
</Body>
|
||||
</Html>
|
||||
<Html>
|
||||
<Head />
|
||||
<Body style={main}>
|
||||
<Container style={container}>
|
||||
<Img
|
||||
src={`${baseUrl}/static/plaid-logo.png`}
|
||||
width="212"
|
||||
height="88"
|
||||
alt="Plaid"
|
||||
style={logo}
|
||||
/>
|
||||
<Text style={tertiary}>Verify Your Identity</Text>
|
||||
<Heading style={secondary}>
|
||||
Enter the following code to finish linking Venmo.
|
||||
</Heading>
|
||||
<Section style={codeContainer}>
|
||||
<Text style={code}>{validationCode}</Text>
|
||||
</Section>
|
||||
<Text style={paragraph}>Not expecting this email?</Text>
|
||||
<Text style={paragraph}>
|
||||
Contact{" "}
|
||||
<Link href="mailto:login@plaid.com" style={link}>
|
||||
login@plaid.com
|
||||
</Link>{" "}
|
||||
if you did not request this code.
|
||||
</Text>
|
||||
</Container>
|
||||
<Text style={footer}>Securely powered by Plaid.</Text>
|
||||
</Body>
|
||||
</Html>
|
||||
);
|
||||
|
||||
PlaidVerifyIdentityEmail.PreviewProps = {
|
||||
validationCode: "144833",
|
||||
validationCode: "144833",
|
||||
} as PlaidVerifyIdentityEmailProps;
|
||||
|
||||
export default PlaidVerifyIdentityEmail;
|
||||
|
||||
const main = {
|
||||
backgroundColor: "#ffffff",
|
||||
fontFamily: "HelveticaNeue,Helvetica,Arial,sans-serif",
|
||||
backgroundColor: "#ffffff",
|
||||
fontFamily: "HelveticaNeue,Helvetica,Arial,sans-serif",
|
||||
};
|
||||
|
||||
const container = {
|
||||
backgroundColor: "#ffffff",
|
||||
border: "1px solid #eee",
|
||||
borderRadius: "5px",
|
||||
boxShadow: "0 5px 10px rgba(20,50,70,.2)",
|
||||
marginTop: "20px",
|
||||
maxWidth: "360px",
|
||||
margin: "0 auto",
|
||||
padding: "68px 0 130px",
|
||||
backgroundColor: "#ffffff",
|
||||
border: "1px solid #eee",
|
||||
borderRadius: "5px",
|
||||
boxShadow: "0 5px 10px rgba(20,50,70,.2)",
|
||||
marginTop: "20px",
|
||||
maxWidth: "360px",
|
||||
margin: "0 auto",
|
||||
padding: "68px 0 130px",
|
||||
};
|
||||
|
||||
const logo = {
|
||||
margin: "0 auto",
|
||||
margin: "0 auto",
|
||||
};
|
||||
|
||||
const tertiary = {
|
||||
color: "#0a85ea",
|
||||
fontSize: "11px",
|
||||
fontWeight: 700,
|
||||
fontFamily: "HelveticaNeue,Helvetica,Arial,sans-serif",
|
||||
height: "16px",
|
||||
letterSpacing: "0",
|
||||
lineHeight: "16px",
|
||||
margin: "16px 8px 8px 8px",
|
||||
textTransform: "uppercase" as const,
|
||||
textAlign: "center" as const,
|
||||
color: "#0a85ea",
|
||||
fontSize: "11px",
|
||||
fontWeight: 700,
|
||||
fontFamily: "HelveticaNeue,Helvetica,Arial,sans-serif",
|
||||
height: "16px",
|
||||
letterSpacing: "0",
|
||||
lineHeight: "16px",
|
||||
margin: "16px 8px 8px 8px",
|
||||
textTransform: "uppercase" as const,
|
||||
textAlign: "center" as const,
|
||||
};
|
||||
|
||||
const secondary = {
|
||||
color: "#000",
|
||||
display: "inline-block",
|
||||
fontFamily: "HelveticaNeue-Medium,Helvetica,Arial,sans-serif",
|
||||
fontSize: "20px",
|
||||
fontWeight: 500,
|
||||
lineHeight: "24px",
|
||||
marginBottom: "0",
|
||||
marginTop: "0",
|
||||
textAlign: "center" as const,
|
||||
color: "#000",
|
||||
display: "inline-block",
|
||||
fontFamily: "HelveticaNeue-Medium,Helvetica,Arial,sans-serif",
|
||||
fontSize: "20px",
|
||||
fontWeight: 500,
|
||||
lineHeight: "24px",
|
||||
marginBottom: "0",
|
||||
marginTop: "0",
|
||||
textAlign: "center" as const,
|
||||
};
|
||||
|
||||
const codeContainer = {
|
||||
background: "rgba(0,0,0,.05)",
|
||||
borderRadius: "4px",
|
||||
margin: "16px auto 14px",
|
||||
verticalAlign: "middle",
|
||||
width: "280px",
|
||||
background: "rgba(0,0,0,.05)",
|
||||
borderRadius: "4px",
|
||||
margin: "16px auto 14px",
|
||||
verticalAlign: "middle",
|
||||
width: "280px",
|
||||
};
|
||||
|
||||
const code = {
|
||||
color: "#000",
|
||||
display: "inline-block",
|
||||
fontFamily: "HelveticaNeue-Bold",
|
||||
fontSize: "32px",
|
||||
fontWeight: 700,
|
||||
letterSpacing: "6px",
|
||||
lineHeight: "40px",
|
||||
paddingBottom: "8px",
|
||||
paddingTop: "8px",
|
||||
margin: "0 auto",
|
||||
width: "100%",
|
||||
textAlign: "center" as const,
|
||||
color: "#000",
|
||||
display: "inline-block",
|
||||
fontFamily: "HelveticaNeue-Bold",
|
||||
fontSize: "32px",
|
||||
fontWeight: 700,
|
||||
letterSpacing: "6px",
|
||||
lineHeight: "40px",
|
||||
paddingBottom: "8px",
|
||||
paddingTop: "8px",
|
||||
margin: "0 auto",
|
||||
width: "100%",
|
||||
textAlign: "center" as const,
|
||||
};
|
||||
|
||||
const paragraph = {
|
||||
color: "#444",
|
||||
fontSize: "15px",
|
||||
fontFamily: "HelveticaNeue,Helvetica,Arial,sans-serif",
|
||||
letterSpacing: "0",
|
||||
lineHeight: "23px",
|
||||
padding: "0 40px",
|
||||
margin: "0",
|
||||
textAlign: "center" as const,
|
||||
color: "#444",
|
||||
fontSize: "15px",
|
||||
fontFamily: "HelveticaNeue,Helvetica,Arial,sans-serif",
|
||||
letterSpacing: "0",
|
||||
lineHeight: "23px",
|
||||
padding: "0 40px",
|
||||
margin: "0",
|
||||
textAlign: "center" as const,
|
||||
};
|
||||
|
||||
const link = {
|
||||
color: "#444",
|
||||
textDecoration: "underline",
|
||||
color: "#444",
|
||||
textDecoration: "underline",
|
||||
};
|
||||
|
||||
const footer = {
|
||||
color: "#000",
|
||||
fontSize: "12px",
|
||||
fontWeight: 800,
|
||||
letterSpacing: "0",
|
||||
lineHeight: "23px",
|
||||
margin: "0",
|
||||
marginTop: "20px",
|
||||
fontFamily: "HelveticaNeue,Helvetica,Arial,sans-serif",
|
||||
textAlign: "center" as const,
|
||||
textTransform: "uppercase" as const,
|
||||
color: "#000",
|
||||
fontSize: "12px",
|
||||
fontWeight: 800,
|
||||
letterSpacing: "0",
|
||||
lineHeight: "23px",
|
||||
margin: "0",
|
||||
marginTop: "20px",
|
||||
fontFamily: "HelveticaNeue,Helvetica,Arial,sans-serif",
|
||||
textAlign: "center" as const,
|
||||
textTransform: "uppercase" as const,
|
||||
};
|
||||
|
||||
@@ -1,152 +1,152 @@
|
||||
import {
|
||||
Body,
|
||||
Button,
|
||||
Container,
|
||||
Head,
|
||||
Hr,
|
||||
Html,
|
||||
Img,
|
||||
Link,
|
||||
Preview,
|
||||
Section,
|
||||
Text,
|
||||
Body,
|
||||
Button,
|
||||
Container,
|
||||
Head,
|
||||
Hr,
|
||||
Html,
|
||||
Img,
|
||||
Link,
|
||||
Preview,
|
||||
Section,
|
||||
Text,
|
||||
} from "@react-email/components";
|
||||
import * as React from "react";
|
||||
|
||||
const baseUrl = process.env.VERCEL_URL
|
||||
? `https://${process.env.VERCEL_URL}`
|
||||
: "";
|
||||
? `https://${process.env.VERCEL_URL}`
|
||||
: "";
|
||||
|
||||
export const StripeWelcomeEmail = () => (
|
||||
<Html>
|
||||
<Head />
|
||||
<Preview>You're now ready to make live transactions with Stripe!</Preview>
|
||||
<Body style={main}>
|
||||
<Container style={container}>
|
||||
<Section style={box}>
|
||||
<Img
|
||||
src={`${baseUrl}/static/stripe-logo.png`}
|
||||
width="49"
|
||||
height="21"
|
||||
alt="Stripe"
|
||||
/>
|
||||
<Hr style={hr} />
|
||||
<Text style={paragraph}>
|
||||
Thanks for submitting your account information. You're now ready to
|
||||
make live transactions with Stripe!
|
||||
</Text>
|
||||
<Text style={paragraph}>
|
||||
You can view your payments and a variety of other information about
|
||||
your account right from your dashboard.
|
||||
</Text>
|
||||
<Button style={button} href="https://dashboard.stripe.com/login">
|
||||
View your Stripe Dashboard
|
||||
</Button>
|
||||
<Hr style={hr} />
|
||||
<Text style={paragraph}>
|
||||
If you haven't finished your integration, you might find our{" "}
|
||||
<Link style={anchor} href="https://stripe.com/docs">
|
||||
docs
|
||||
</Link>{" "}
|
||||
handy.
|
||||
</Text>
|
||||
<Text style={paragraph}>
|
||||
Once you're ready to start accepting payments, you'll just need to
|
||||
use your live{" "}
|
||||
<Link
|
||||
style={anchor}
|
||||
href="https://dashboard.stripe.com/login?redirect=%2Fapikeys"
|
||||
>
|
||||
API keys
|
||||
</Link>{" "}
|
||||
instead of your test API keys. Your account can simultaneously be
|
||||
used for both test and live requests, so you can continue testing
|
||||
while accepting live payments. Check out our{" "}
|
||||
<Link style={anchor} href="https://stripe.com/docs/dashboard">
|
||||
tutorial about account basics
|
||||
</Link>
|
||||
.
|
||||
</Text>
|
||||
<Text style={paragraph}>
|
||||
Finally, we've put together a{" "}
|
||||
<Link
|
||||
style={anchor}
|
||||
href="https://stripe.com/docs/checklist/website"
|
||||
>
|
||||
quick checklist
|
||||
</Link>{" "}
|
||||
to ensure your website conforms to card network standards.
|
||||
</Text>
|
||||
<Text style={paragraph}>
|
||||
We'll be here to help you with any step along the way. You can find
|
||||
answers to most questions and get in touch with us on our{" "}
|
||||
<Link style={anchor} href="https://support.stripe.com/">
|
||||
support site
|
||||
</Link>
|
||||
.
|
||||
</Text>
|
||||
<Text style={paragraph}>— The Stripe team</Text>
|
||||
<Hr style={hr} />
|
||||
<Text style={footer}>
|
||||
Stripe, 354 Oyster Point Blvd, South San Francisco, CA 94080
|
||||
</Text>
|
||||
</Section>
|
||||
</Container>
|
||||
</Body>
|
||||
</Html>
|
||||
<Html>
|
||||
<Head />
|
||||
<Preview>You're now ready to make live transactions with Stripe!</Preview>
|
||||
<Body style={main}>
|
||||
<Container style={container}>
|
||||
<Section style={box}>
|
||||
<Img
|
||||
src={`${baseUrl}/static/stripe-logo.png`}
|
||||
width="49"
|
||||
height="21"
|
||||
alt="Stripe"
|
||||
/>
|
||||
<Hr style={hr} />
|
||||
<Text style={paragraph}>
|
||||
Thanks for submitting your account information. You're now ready to
|
||||
make live transactions with Stripe!
|
||||
</Text>
|
||||
<Text style={paragraph}>
|
||||
You can view your payments and a variety of other information about
|
||||
your account right from your dashboard.
|
||||
</Text>
|
||||
<Button style={button} href="https://dashboard.stripe.com/login">
|
||||
View your Stripe Dashboard
|
||||
</Button>
|
||||
<Hr style={hr} />
|
||||
<Text style={paragraph}>
|
||||
If you haven't finished your integration, you might find our{" "}
|
||||
<Link style={anchor} href="https://stripe.com/docs">
|
||||
docs
|
||||
</Link>{" "}
|
||||
handy.
|
||||
</Text>
|
||||
<Text style={paragraph}>
|
||||
Once you're ready to start accepting payments, you'll just need to
|
||||
use your live{" "}
|
||||
<Link
|
||||
style={anchor}
|
||||
href="https://dashboard.stripe.com/login?redirect=%2Fapikeys"
|
||||
>
|
||||
API keys
|
||||
</Link>{" "}
|
||||
instead of your test API keys. Your account can simultaneously be
|
||||
used for both test and live requests, so you can continue testing
|
||||
while accepting live payments. Check out our{" "}
|
||||
<Link style={anchor} href="https://stripe.com/docs/dashboard">
|
||||
tutorial about account basics
|
||||
</Link>
|
||||
.
|
||||
</Text>
|
||||
<Text style={paragraph}>
|
||||
Finally, we've put together a{" "}
|
||||
<Link
|
||||
style={anchor}
|
||||
href="https://stripe.com/docs/checklist/website"
|
||||
>
|
||||
quick checklist
|
||||
</Link>{" "}
|
||||
to ensure your website conforms to card network standards.
|
||||
</Text>
|
||||
<Text style={paragraph}>
|
||||
We'll be here to help you with any step along the way. You can find
|
||||
answers to most questions and get in touch with us on our{" "}
|
||||
<Link style={anchor} href="https://support.stripe.com/">
|
||||
support site
|
||||
</Link>
|
||||
.
|
||||
</Text>
|
||||
<Text style={paragraph}>— The Stripe team</Text>
|
||||
<Hr style={hr} />
|
||||
<Text style={footer}>
|
||||
Stripe, 354 Oyster Point Blvd, South San Francisco, CA 94080
|
||||
</Text>
|
||||
</Section>
|
||||
</Container>
|
||||
</Body>
|
||||
</Html>
|
||||
);
|
||||
|
||||
export default StripeWelcomeEmail;
|
||||
|
||||
const main = {
|
||||
backgroundColor: "#f6f9fc",
|
||||
fontFamily:
|
||||
'-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif',
|
||||
backgroundColor: "#f6f9fc",
|
||||
fontFamily:
|
||||
'-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif',
|
||||
};
|
||||
|
||||
const container = {
|
||||
backgroundColor: "#ffffff",
|
||||
margin: "0 auto",
|
||||
padding: "20px 0 48px",
|
||||
marginBottom: "64px",
|
||||
backgroundColor: "#ffffff",
|
||||
margin: "0 auto",
|
||||
padding: "20px 0 48px",
|
||||
marginBottom: "64px",
|
||||
};
|
||||
|
||||
const box = {
|
||||
padding: "0 48px",
|
||||
padding: "0 48px",
|
||||
};
|
||||
|
||||
const hr = {
|
||||
borderColor: "#e6ebf1",
|
||||
margin: "20px 0",
|
||||
borderColor: "#e6ebf1",
|
||||
margin: "20px 0",
|
||||
};
|
||||
|
||||
const paragraph = {
|
||||
color: "#525f7f",
|
||||
color: "#525f7f",
|
||||
|
||||
fontSize: "16px",
|
||||
lineHeight: "24px",
|
||||
textAlign: "left" as const,
|
||||
fontSize: "16px",
|
||||
lineHeight: "24px",
|
||||
textAlign: "left" as const,
|
||||
};
|
||||
|
||||
const anchor = {
|
||||
color: "#556cd6",
|
||||
color: "#556cd6",
|
||||
};
|
||||
|
||||
const button = {
|
||||
backgroundColor: "#656ee8",
|
||||
borderRadius: "5px",
|
||||
color: "#fff",
|
||||
fontSize: "16px",
|
||||
fontWeight: "bold",
|
||||
textDecoration: "none",
|
||||
textAlign: "center" as const,
|
||||
display: "block",
|
||||
width: "100%",
|
||||
padding: "10px",
|
||||
backgroundColor: "#656ee8",
|
||||
borderRadius: "5px",
|
||||
color: "#fff",
|
||||
fontSize: "16px",
|
||||
fontWeight: "bold",
|
||||
textDecoration: "none",
|
||||
textAlign: "center" as const,
|
||||
display: "block",
|
||||
width: "100%",
|
||||
padding: "10px",
|
||||
};
|
||||
|
||||
const footer = {
|
||||
color: "#8898aa",
|
||||
fontSize: "12px",
|
||||
lineHeight: "16px",
|
||||
color: "#8898aa",
|
||||
fontSize: "12px",
|
||||
lineHeight: "16px",
|
||||
};
|
||||
|
||||
@@ -1,154 +1,154 @@
|
||||
import {
|
||||
Body,
|
||||
Button,
|
||||
Container,
|
||||
Column,
|
||||
Head,
|
||||
Heading,
|
||||
Hr,
|
||||
Html,
|
||||
Img,
|
||||
Link,
|
||||
Preview,
|
||||
Row,
|
||||
Section,
|
||||
Text,
|
||||
Tailwind,
|
||||
Body,
|
||||
Button,
|
||||
Column,
|
||||
Container,
|
||||
Head,
|
||||
Heading,
|
||||
Hr,
|
||||
Html,
|
||||
Img,
|
||||
Link,
|
||||
Preview,
|
||||
Row,
|
||||
Section,
|
||||
Tailwind,
|
||||
Text,
|
||||
} from "@react-email/components";
|
||||
import * as React from "react";
|
||||
|
||||
interface VercelInviteUserEmailProps {
|
||||
username?: string;
|
||||
userImage?: string;
|
||||
invitedByUsername?: string;
|
||||
invitedByEmail?: string;
|
||||
teamName?: string;
|
||||
teamImage?: string;
|
||||
inviteLink?: string;
|
||||
inviteFromIp?: string;
|
||||
inviteFromLocation?: string;
|
||||
username?: string;
|
||||
userImage?: string;
|
||||
invitedByUsername?: string;
|
||||
invitedByEmail?: string;
|
||||
teamName?: string;
|
||||
teamImage?: string;
|
||||
inviteLink?: string;
|
||||
inviteFromIp?: string;
|
||||
inviteFromLocation?: string;
|
||||
}
|
||||
|
||||
const baseUrl = process.env.VERCEL_URL
|
||||
? `https://${process.env.VERCEL_URL}`
|
||||
: "";
|
||||
? `https://${process.env.VERCEL_URL}`
|
||||
: "";
|
||||
|
||||
export const VercelInviteUserEmail = ({
|
||||
username,
|
||||
userImage,
|
||||
invitedByUsername,
|
||||
invitedByEmail,
|
||||
teamName,
|
||||
teamImage,
|
||||
inviteLink,
|
||||
inviteFromIp,
|
||||
inviteFromLocation,
|
||||
username,
|
||||
userImage,
|
||||
invitedByUsername,
|
||||
invitedByEmail,
|
||||
teamName,
|
||||
teamImage,
|
||||
inviteLink,
|
||||
inviteFromIp,
|
||||
inviteFromLocation,
|
||||
}: VercelInviteUserEmailProps) => {
|
||||
const previewText = `Join ${invitedByUsername} on Vercel`;
|
||||
const previewText = `Join ${invitedByUsername} on Vercel`;
|
||||
|
||||
return (
|
||||
<Html>
|
||||
<Head />
|
||||
<Preview>{previewText}</Preview>
|
||||
<Tailwind>
|
||||
<Body className="bg-white my-auto mx-auto font-sans px-2">
|
||||
<Container className="border border-solid border-[#eaeaea] rounded my-[40px] mx-auto p-[20px] max-w-[465px]">
|
||||
<Section className="mt-[32px]">
|
||||
<Img
|
||||
src={`${baseUrl}/static/vercel-logo.png`}
|
||||
width="40"
|
||||
height="37"
|
||||
alt="Vercel"
|
||||
className="my-0 mx-auto"
|
||||
/>
|
||||
</Section>
|
||||
<Heading className="text-black text-[24px] font-normal text-center p-0 my-[30px] mx-0">
|
||||
Join <strong>{teamName}</strong> on <strong>Vercel</strong>
|
||||
</Heading>
|
||||
<Text className="text-black text-[14px] leading-[24px]">
|
||||
Hello {username},
|
||||
</Text>
|
||||
<Text className="text-black text-[14px] leading-[24px]">
|
||||
<strong>{invitedByUsername}</strong> (
|
||||
<Link
|
||||
href={`mailto:${invitedByEmail}`}
|
||||
className="text-blue-600 no-underline"
|
||||
>
|
||||
{invitedByEmail}
|
||||
</Link>
|
||||
) has invited you to the <strong>{teamName}</strong> team on{" "}
|
||||
<strong>Vercel</strong>.
|
||||
</Text>
|
||||
<Section>
|
||||
<Row>
|
||||
<Column align="right">
|
||||
<Img
|
||||
className="rounded-full"
|
||||
src={userImage}
|
||||
width="64"
|
||||
height="64"
|
||||
/>
|
||||
</Column>
|
||||
<Column align="center">
|
||||
<Img
|
||||
src={`${baseUrl}/static/vercel-arrow.png`}
|
||||
width="12"
|
||||
height="9"
|
||||
alt="invited you to"
|
||||
/>
|
||||
</Column>
|
||||
<Column align="left">
|
||||
<Img
|
||||
className="rounded-full"
|
||||
src={teamImage}
|
||||
width="64"
|
||||
height="64"
|
||||
/>
|
||||
</Column>
|
||||
</Row>
|
||||
</Section>
|
||||
<Section className="text-center mt-[32px] mb-[32px]">
|
||||
<Button
|
||||
className="bg-[#000000] rounded text-white text-[12px] font-semibold no-underline text-center px-5 py-3"
|
||||
href={inviteLink}
|
||||
>
|
||||
Join the team
|
||||
</Button>
|
||||
</Section>
|
||||
<Text className="text-black text-[14px] leading-[24px]">
|
||||
or copy and paste this URL into your browser:{" "}
|
||||
<Link href={inviteLink} className="text-blue-600 no-underline">
|
||||
{inviteLink}
|
||||
</Link>
|
||||
</Text>
|
||||
<Hr className="border border-solid border-[#eaeaea] my-[26px] mx-0 w-full" />
|
||||
<Text className="text-[#666666] text-[12px] leading-[24px]">
|
||||
This invitation was intended for{" "}
|
||||
<span className="text-black">{username}</span>. This invite was
|
||||
sent from <span className="text-black">{inviteFromIp}</span>{" "}
|
||||
located in{" "}
|
||||
<span className="text-black">{inviteFromLocation}</span>. If you
|
||||
were not expecting this invitation, you can ignore this email. If
|
||||
you are concerned about your account's safety, please reply to
|
||||
this email to get in touch with us.
|
||||
</Text>
|
||||
</Container>
|
||||
</Body>
|
||||
</Tailwind>
|
||||
</Html>
|
||||
);
|
||||
return (
|
||||
<Html>
|
||||
<Head />
|
||||
<Preview>{previewText}</Preview>
|
||||
<Tailwind>
|
||||
<Body className="bg-white my-auto mx-auto font-sans px-2">
|
||||
<Container className="border border-solid border-[#eaeaea] rounded my-[40px] mx-auto p-[20px] max-w-[465px]">
|
||||
<Section className="mt-[32px]">
|
||||
<Img
|
||||
src={`${baseUrl}/static/vercel-logo.png`}
|
||||
width="40"
|
||||
height="37"
|
||||
alt="Vercel"
|
||||
className="my-0 mx-auto"
|
||||
/>
|
||||
</Section>
|
||||
<Heading className="text-black text-[24px] font-normal text-center p-0 my-[30px] mx-0">
|
||||
Join <strong>{teamName}</strong> on <strong>Vercel</strong>
|
||||
</Heading>
|
||||
<Text className="text-black text-[14px] leading-[24px]">
|
||||
Hello {username},
|
||||
</Text>
|
||||
<Text className="text-black text-[14px] leading-[24px]">
|
||||
<strong>{invitedByUsername}</strong> (
|
||||
<Link
|
||||
href={`mailto:${invitedByEmail}`}
|
||||
className="text-blue-600 no-underline"
|
||||
>
|
||||
{invitedByEmail}
|
||||
</Link>
|
||||
) has invited you to the <strong>{teamName}</strong> team on{" "}
|
||||
<strong>Vercel</strong>.
|
||||
</Text>
|
||||
<Section>
|
||||
<Row>
|
||||
<Column align="right">
|
||||
<Img
|
||||
className="rounded-full"
|
||||
src={userImage}
|
||||
width="64"
|
||||
height="64"
|
||||
/>
|
||||
</Column>
|
||||
<Column align="center">
|
||||
<Img
|
||||
src={`${baseUrl}/static/vercel-arrow.png`}
|
||||
width="12"
|
||||
height="9"
|
||||
alt="invited you to"
|
||||
/>
|
||||
</Column>
|
||||
<Column align="left">
|
||||
<Img
|
||||
className="rounded-full"
|
||||
src={teamImage}
|
||||
width="64"
|
||||
height="64"
|
||||
/>
|
||||
</Column>
|
||||
</Row>
|
||||
</Section>
|
||||
<Section className="text-center mt-[32px] mb-[32px]">
|
||||
<Button
|
||||
className="bg-[#000000] rounded text-white text-[12px] font-semibold no-underline text-center px-5 py-3"
|
||||
href={inviteLink}
|
||||
>
|
||||
Join the team
|
||||
</Button>
|
||||
</Section>
|
||||
<Text className="text-black text-[14px] leading-[24px]">
|
||||
or copy and paste this URL into your browser:{" "}
|
||||
<Link href={inviteLink} className="text-blue-600 no-underline">
|
||||
{inviteLink}
|
||||
</Link>
|
||||
</Text>
|
||||
<Hr className="border border-solid border-[#eaeaea] my-[26px] mx-0 w-full" />
|
||||
<Text className="text-[#666666] text-[12px] leading-[24px]">
|
||||
This invitation was intended for{" "}
|
||||
<span className="text-black">{username}</span>. This invite was
|
||||
sent from <span className="text-black">{inviteFromIp}</span>{" "}
|
||||
located in{" "}
|
||||
<span className="text-black">{inviteFromLocation}</span>. If you
|
||||
were not expecting this invitation, you can ignore this email. If
|
||||
you are concerned about your account's safety, please reply to
|
||||
this email to get in touch with us.
|
||||
</Text>
|
||||
</Container>
|
||||
</Body>
|
||||
</Tailwind>
|
||||
</Html>
|
||||
);
|
||||
};
|
||||
|
||||
VercelInviteUserEmail.PreviewProps = {
|
||||
username: "alanturing",
|
||||
userImage: `${baseUrl}/static/vercel-user.png`,
|
||||
invitedByUsername: "Alan",
|
||||
invitedByEmail: "alan.turing@example.com",
|
||||
teamName: "Enigma",
|
||||
teamImage: `${baseUrl}/static/vercel-team.png`,
|
||||
inviteLink: "https://vercel.com/teams/invite/foo",
|
||||
inviteFromIp: "204.13.186.218",
|
||||
inviteFromLocation: "São Paulo, Brazil",
|
||||
username: "alanturing",
|
||||
userImage: `${baseUrl}/static/vercel-user.png`,
|
||||
invitedByUsername: "Alan",
|
||||
invitedByEmail: "alan.turing@example.com",
|
||||
teamName: "Enigma",
|
||||
teamImage: `${baseUrl}/static/vercel-team.png`,
|
||||
inviteLink: "https://vercel.com/teams/invite/foo",
|
||||
inviteFromIp: "204.13.186.218",
|
||||
inviteFromLocation: "São Paulo, Brazil",
|
||||
} as VercelInviteUserEmailProps;
|
||||
|
||||
export default VercelInviteUserEmail;
|
||||
|
||||
@@ -21,7 +21,7 @@
|
||||
"db:truncate": "tsx -r dotenv/config ./server/db/reset.ts",
|
||||
"db:studio": "drizzle-kit studio --config ./server/db/drizzle.config.ts",
|
||||
"check": "biome check",
|
||||
"format": "biome format",
|
||||
"format": "biome format --write",
|
||||
"lint": "biome lint",
|
||||
"typecheck": "tsc",
|
||||
"db:seed": "tsx -r dotenv/config ./server/db/seed.ts",
|
||||
|
||||
Reference in New Issue
Block a user