fix: move email styles to <style> block and remove watermark image
Extracts repeated inline styles into <head> <style> to improve the text-to-HTML ratio flagged by mail checkers. Removes the decorative watermark <img> (opacity 0.07, barely visible) which was the only image element and triggered the "too many images" classification. Cleans up the now-unused ProvisioningProperties dependency from EmailConnectorService and PasswordResetNotificationService. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -5,32 +5,45 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<title>Reset your Cameleer password</title>
|
||||
<style>
|
||||
body { margin:0; padding:0; background:#f5f1eb; }
|
||||
.wrapper { font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; max-width:480px; margin:0 auto; background:#fff; border-radius:8px; overflow:hidden; border:1px solid #e8e0d4; }
|
||||
.header { background:#C6820E; padding:20px 24px; text-align:center; }
|
||||
.header span { font-size:22px; font-weight:700; color:#fff; letter-spacing:0.5px; }
|
||||
.content { padding:32px 24px 24px; }
|
||||
.title { color:#1a1a1a; font-size:16px; font-weight:600; margin:0 0 8px; }
|
||||
.subtitle { color:#444; font-size:14px; line-height:1.6; margin:0 0 24px; }
|
||||
.code-box { text-align:center; margin:0 0 24px; }
|
||||
.code-box div { display:inline-block; background:#FDF6EC; border:2px solid #C6820E; border-radius:8px; padding:16px 32px; }
|
||||
.code-box span { font-size:32px; font-weight:700; letter-spacing:8px; color:#C6820E; font-family:'Courier New',Courier,monospace; }
|
||||
.hint { color:#888; font-size:13px; line-height:1.5; margin:0 0 16px; }
|
||||
.detail { color:#888; font-size:13px; line-height:1.5; margin:0; }
|
||||
.footer { border-top:1px solid #e8e0d4; padding:16px 24px; text-align:center; }
|
||||
.footer p { margin:0; }
|
||||
.footer .contact { color:#999; font-size:12px; }
|
||||
.footer .tagline { color:#bbb; font-size:11px; margin-top:6px; }
|
||||
</style>
|
||||
</head>
|
||||
<body style="margin:0;padding:0;background:#f5f1eb;">
|
||||
<!--[if mso]><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td align="center"><![endif]-->
|
||||
<div style="font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;max-width:480px;margin:0 auto;background:#ffffff;border-radius:8px;overflow:hidden;border:1px solid #e8e0d4;">
|
||||
<div style="background:#C6820E;padding:20px 24px;text-align:center;">
|
||||
<span style="font-size:22px;font-weight:700;color:#ffffff;letter-spacing:0.5px;">Cameleer.io</span>
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<div class="header">
|
||||
<span>Cameleer.io</span>
|
||||
</div>
|
||||
<div style="padding:32px 24px 24px;position:relative;overflow:hidden;">
|
||||
<img src="{{watermarkUrl}}" style="position:absolute;top:-30px;right:-50px;width:320px;height:320px;opacity:0.07;pointer-events:none;border:0;outline:none;" alt="" />
|
||||
<div style="position:relative;">
|
||||
<p style="color:#1a1a1a;font-size:16px;font-weight:600;margin:0 0 8px;">Lost in the dunes?</p>
|
||||
<p style="color:#444;font-size:14px;line-height:1.6;margin:0 0 24px;">No worries — enter this code to reset your password and get back on the trail.</p>
|
||||
<div style="text-align:center;margin:0 0 24px;">
|
||||
<div style="display:inline-block;background:#FDF6EC;border:2px solid #C6820E;border-radius:8px;padding:16px 32px;">
|
||||
<span style="font-size:32px;font-weight:700;letter-spacing:8px;color:#C6820E;font-family:'Courier New',Courier,monospace;">{{code}}</span>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p class="title">Lost in the dunes?</p>
|
||||
<p class="subtitle">No worries — enter this code to reset your password and get back on the trail.</p>
|
||||
<div class="code-box">
|
||||
<div>
|
||||
<span>{{code}}</span>
|
||||
</div>
|
||||
<p style="color:#888;font-size:13px;line-height:1.5;margin:0 0 16px;">This code expires in 10 minutes. If you didn't request a password reset, you can safely ignore this email.</p>
|
||||
<p style="color:#888;font-size:13px;line-height:1.5;margin:0;">This password reset was requested for your Cameleer account. Cameleer is an observability platform for Apache Camel integrations providing real-time route tracing, message inspection, and performance monitoring. For security, this code can only be used once. If you continue to have trouble accessing your account, please contact your administrator for assistance.</p>
|
||||
</div>
|
||||
<p class="hint">This code expires in 10 minutes. If you didn't request a password reset, you can safely ignore this email.</p>
|
||||
<p class="detail">This password reset was requested for your Cameleer account. Cameleer is an observability platform for Apache Camel integrations providing real-time route tracing, message inspection, and performance monitoring. For security, this code can only be used once. If you continue to have trouble accessing your account, please contact your administrator for assistance.</p>
|
||||
</div>
|
||||
<div style="border-top:1px solid #e8e0d4;padding:16px 24px;text-align:center;">
|
||||
<p style="color:#999;font-size:12px;margin:0;">Questions? Contact your administrator</p>
|
||||
<p style="color:#bbb;font-size:11px;margin:6px 0 0;">Cameleer — Apache Camel observability</p>
|
||||
<div class="footer">
|
||||
<p class="contact">Questions? Contact your administrator</p>
|
||||
<p class="tagline">Cameleer — Apache Camel observability</p>
|
||||
</div>
|
||||
</div>
|
||||
<!--[if mso]></td></tr></table><![endif]-->
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user