natty
/
calckey
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: style email with inline styles

This commit is contained in:
ThatOneCalculator 2023-04-26 20:21:30 -07:00
parent a47d05dcda
commit df8db1171a
No known key found for this signature in database
GPG Key ID: 8703CACD01000000
1 changed files with 10 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
packages/backend/src/services/send-email.ts
View File

@ -33,66 +33,6 @@ export async function sendEmail(
} as any); } as any);
try { try {
// TODO: htmlサニタイズ
const style = `
<style>
html {
background: #191724;
}
body {
padding: 16px;
margin: 0;
font-family: sans-serif;
font-size: 14px;
}
a {
text-decoration: none;
color: #31748f;
}
a:hover {
text-decoration: underline;
}
main {
max-width: 500px;
margin: 0 auto;
background: #1f1d2e;
color: #e0def4;
}
main > header {
padding: 32px;
background: #31748f;
display: flex;
}
main > header > img {
max-width: 128px;
max-height: 72px;
vertical-align: bottom;
margin-right: 16px;
}
main > article {
padding: 32px;
}
main > article > h1 {
margin: 0 0 1em 0;
}
main > footer {
padding: 32px;
border-top: solid 1px #26233a;
}
nav {
box-sizing: border-box;
max-width: 500px;
margin: 16px auto 0 auto;
padding: 0 32px;
}
nav > a {
color: #6e6a86;
}
</style>`
const info = await transporter.sendMail({ const info = await transporter.sendMail({
from: meta.email!, from: meta.email!,
to: to, to: to,
@ -103,25 +43,23 @@ export async function sendEmail(
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>${subject}</title> <title>${subject}</title>
${style}
</head> </head>
<body> <body style="background: #191724; padding: 16px; margin: 0; font-family: sans-serif; font-size: 14px;">
${style} <main style="max-width: 500px; margin: 0 auto; background: #1f1d2e; color: #e0def4;">
<main> <header style="padding: 32px; background: #31748f; display: flex;">
<header> <img src="${meta.logoImageUrl || meta.iconUrl || iconUrl}" style="max-width: 128px; max-height: 72px; vertical-align: bottom; margin-right: 16px;"/>
<img src="${meta.logoImageUrl || meta.iconUrl || iconUrl}" height="100"/> <h1 style="margin: 0 0 1em 0;">${meta.name}</h1>
<h1>${meta.name}</h1>
</header> </header>
<article> <article style="padding: 32px;">
<h1>${subject}</h1> <h1>${subject}</h1>
<div>${html}</div> <div>${html}</div>
</article> </article>
<footer> <footer style="padding: 32px; border-top: solid 1px #26233a;">
<a href="${emailSettingUrl}">${"Email setting"}</a> <a href="${emailSettingUrl}" style="color: #31748f !important;">${"Email setting"}</a>
</footer> </footer>
</main> </main>
<nav> <nav style="box-sizing: border-box; max-width: 500px; margin: 16px auto 0 auto; padding: 0 32px;">
<a href="${config.url}">${config.host}</a> <a href="${config.url}" style="color: #6e6a86 !important;">${config.host}</a>
</nav> </nav>
</body> </body>
</html>`, </html>`,