fix: change the default text for newsletter email editor, and use iframe instead of div for preview
This commit is contained in:
parent
a177f423e2
commit
5048891b6e
2 changed files with 67 additions and 9 deletions
|
@ -109,6 +109,8 @@ const EmailEditor = () => {
|
|||
<Link href="/admin/email" className="text-blue-500 underline">
|
||||
Back
|
||||
</Link>
|
||||
“{"{unsubscribeId}"}” will be replaced with an
|
||||
unsubscription ID.
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Subject"
|
||||
|
@ -135,9 +137,9 @@ const EmailEditor = () => {
|
|||
<h2 className="text-2xl font-bold mb-4 text-secondary-foreground">
|
||||
Email Preview
|
||||
</h2>
|
||||
<div
|
||||
className="border rounded-md p-4"
|
||||
dangerouslySetInnerHTML={{ __html: previewContent }}
|
||||
<iframe
|
||||
className="border rounded-md w-full h-2/3"
|
||||
srcDoc={previewContent}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -263,9 +263,65 @@ export const emails = [
|
|||
}
|
||||
];
|
||||
|
||||
export const EXAMPLE_A1 = `
|
||||
<div>
|
||||
<h1>Test Email Preview</h1>
|
||||
<p>This is a simple email preview test.</p>
|
||||
export const EXAMPLE_A1 = `<!DOCTYPE html>
|
||||
<html lang="en-US">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width; initial-scale=1.0">
|
||||
<title>{{title}} - SVR.JS Blog Newsletter</title>
|
||||
<style>
|
||||
body {
|
||||
color: #000000;
|
||||
background-color: #dfffdf;
|
||||
margin: 1em 0;
|
||||
padding: 0;
|
||||
font-family: Poppins, FreeSans, Helvetica, Tahoma, Verdana, Arial, sans-serif;
|
||||
}
|
||||
|
||||
.logo {
|
||||
margin: 1em auto;
|
||||
display: block;
|
||||
width: 224px;
|
||||
}
|
||||
|
||||
.unsubscribe {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
main {
|
||||
width: 95%;
|
||||
max-width: 1280px;
|
||||
background-color: #ffffff;
|
||||
border: 1px #c0c0c0 solid;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 0.5em 1em;
|
||||
}
|
||||
|
||||
.content h1 {
|
||||
margin: 0.25em 0;
|
||||
}
|
||||
|
||||
.thumbnail {
|
||||
width: 100%;
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<img class="logo" src="https://svrjs.org/logo-wide.png">
|
||||
<main>
|
||||
<div class="content">
|
||||
<h1>Title</h1>
|
||||
</div>
|
||||
`;
|
||||
<img class="thumbnail" src="https://svrjs.org/blog-missing.png" alt="Thumbnail">
|
||||
<div class="content">
|
||||
Put contents of the newsletter email here.
|
||||
<p><a href="https://svrjs.org">Go to SVR.JS website</a></p>
|
||||
</div>
|
||||
</main>
|
||||
<p class="unsubscribe">You can unsubscribe from the newsletter <a href="https://svrjs.org/unsubscribe?id={unsubscribeId}">here</a>.</p>
|
||||
</body>
|
||||
</html>`;
|
||||
|
|
Loading…
Reference in a new issue