fix: style email with inline styles
This commit is contained in:
parent
a47d05dcda
commit
df8db1171a
1 changed files with 10 additions and 72 deletions
|
@ -33,66 +33,6 @@ export async function sendEmail(
|
|||
} as any);
|
||||
|
||||
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({
|
||||
from: meta.email!,
|
||||
to: to,
|
||||
|
@ -103,25 +43,23 @@ export async function sendEmail(
|
|||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>${subject}</title>
|
||||
${style}
|
||||
</head>
|
||||
<body>
|
||||
${style}
|
||||
<main>
|
||||
<header>
|
||||
<img src="${meta.logoImageUrl || meta.iconUrl || iconUrl}" height="100"/>
|
||||
<h1>${meta.name}</h1>
|
||||
<body style="background: #191724; padding: 16px; margin: 0; font-family: sans-serif; font-size: 14px;">
|
||||
<main style="max-width: 500px; margin: 0 auto; background: #1f1d2e; color: #e0def4;">
|
||||
<header style="padding: 32px; background: #31748f; display: flex;">
|
||||
<img src="${meta.logoImageUrl || meta.iconUrl || iconUrl}" style="max-width: 128px; max-height: 72px; vertical-align: bottom; margin-right: 16px;"/>
|
||||
<h1 style="margin: 0 0 1em 0;">${meta.name}</h1>
|
||||
</header>
|
||||
<article>
|
||||
<article style="padding: 32px;">
|
||||
<h1>${subject}</h1>
|
||||
<div>${html}</div>
|
||||
</article>
|
||||
<footer>
|
||||
<a href="${emailSettingUrl}">${"Email setting"}</a>
|
||||
<footer style="padding: 32px; border-top: solid 1px #26233a;">
|
||||
<a href="${emailSettingUrl}" style="color: #31748f !important;">${"Email setting"}</a>
|
||||
</footer>
|
||||
</main>
|
||||
<nav>
|
||||
<a href="${config.url}">${config.host}</a>
|
||||
<nav style="box-sizing: border-box; max-width: 500px; margin: 16px auto 0 auto; padding: 0 32px;">
|
||||
<a href="${config.url}" style="color: #6e6a86 !important;">${config.host}</a>
|
||||
</nav>
|
||||
</body>
|
||||
</html>`,
|
||||
|
|
Loading…
Reference in a new issue