Improve favicon contrast and redesign email templates with logo
favicon.svg: - Light mode: replace near-black fill (#2d3748) with indigo brand color (#6366f1 fill, #4f46e5 stroke, #a5b4fc page lines) — distinctive and high-contrast without the dark/black appearance - Dark mode unchanged email.py: - Add _EMAIL_LOGO_SVG: inline SVG with white palette for rendering on the indigo header (white book, lavender lines, gold sparkle) - Add _email_html(title, body): shared template wrapper — gray outer background, white card with border-radius, indigo header with logo + app name, content area, footer notifications.py: - Import and use _email_html for all six email functions: security alert, password reset, password reset success, invitation, task reminder, test email - Clean up all inline HTML to match the new card layout and spacing Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -12,7 +12,7 @@ from fabledassistant.models.app_log import AppLog
|
||||
from fabledassistant.models.note import Note
|
||||
from fabledassistant.models.setting import Setting
|
||||
from fabledassistant.models.user import User
|
||||
from fabledassistant.services.email import is_smtp_configured, send_email
|
||||
from fabledassistant.services.email import _email_html, is_smtp_configured, send_email
|
||||
from fabledassistant.services.logging import log_audit
|
||||
|
||||
logger = logging.getLogger(__name__)
|
||||
@@ -69,100 +69,84 @@ async def notify_security_event(
|
||||
for k, v in details.items():
|
||||
if k == "ip_address":
|
||||
continue
|
||||
detail_rows += f'<tr><td style="padding: 6px 12px; color: #6b7280; font-size: 14px;">{k}</td><td style="padding: 6px 12px; color: #374151; font-size: 14px;">{v}</td></tr>'
|
||||
detail_rows += (
|
||||
f'<tr>'
|
||||
f'<td style="padding:6px 0;color:#6b7280;font-size:13px;width:120px;">{k}</td>'
|
||||
f'<td style="padding:6px 0;color:#111827;font-size:13px;">{v}</td>'
|
||||
f'</tr>'
|
||||
)
|
||||
|
||||
html = f"""
|
||||
<div style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; max-width: 480px; margin: 0 auto; padding: 24px;">
|
||||
<div style="background: #6366f1; color: #fff; padding: 16px 24px; border-radius: 8px 8px 0 0; text-align: center;">
|
||||
<h1 style="margin: 0; font-size: 20px;">Security Alert</h1>
|
||||
</div>
|
||||
<div style="background: #f9fafb; padding: 24px; border: 1px solid #e5e7eb; border-top: none; border-radius: 0 0 8px 8px;">
|
||||
<p style="margin: 0 0 16px; color: #374151; font-size: 16px; font-weight: 600;">{label}</p>
|
||||
<table style="width: 100%; border-collapse: collapse;">
|
||||
<tr><td style="padding: 6px 12px; color: #6b7280; font-size: 14px;">Time</td><td style="padding: 6px 12px; color: #374151; font-size: 14px;">{timestamp}</td></tr>
|
||||
<tr><td style="padding: 6px 12px; color: #6b7280; font-size: 14px;">IP Address</td><td style="padding: 6px 12px; color: #374151; font-size: 14px;">{ip}</td></tr>
|
||||
{detail_rows}
|
||||
</table>
|
||||
<p style="margin: 16px 0 0; color: #9ca3af; font-size: 12px;">If this wasn't you, change your password immediately.</p>
|
||||
</div>
|
||||
</div>
|
||||
body = f"""
|
||||
<p style="margin:0 0 16px;color:#111827;font-size:15px;font-weight:600;">{label}</p>
|
||||
<table style="width:100%;border-collapse:collapse;background:#f9fafb;border:1px solid #e5e7eb;border-radius:6px;">
|
||||
<tr>
|
||||
<td style="padding:8px 12px;color:#6b7280;font-size:13px;width:120px;border-bottom:1px solid #e5e7eb;">Time</td>
|
||||
<td style="padding:8px 12px;color:#111827;font-size:13px;border-bottom:1px solid #e5e7eb;">{timestamp}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding:8px 12px;color:#6b7280;font-size:13px;width:120px;{';border-bottom:1px solid #e5e7eb' if detail_rows else ''}">IP Address</td>
|
||||
<td style="padding:8px 12px;color:#111827;font-size:13px;{';border-bottom:1px solid #e5e7eb' if detail_rows else ''}">{ip}</td>
|
||||
</tr>
|
||||
{detail_rows}
|
||||
</table>
|
||||
<p style="margin:16px 0 0;color:#9ca3af;font-size:12px;">If this wasn't you, change your password immediately.</p>
|
||||
"""
|
||||
await send_email(email, f"Fabled Assistant - {label}", html)
|
||||
await send_email(email, f"Fabled Assistant - {label}", _email_html("Security Alert", body))
|
||||
except Exception:
|
||||
logger.exception("Failed to send security notification for user %d", user_id)
|
||||
|
||||
|
||||
async def send_password_reset_email(email: str, reset_url: str) -> None:
|
||||
"""Send a password reset email with a link to reset the user's password."""
|
||||
html = f"""
|
||||
<div style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; max-width: 480px; margin: 0 auto; padding: 24px;">
|
||||
<div style="background: #6366f1; color: #fff; padding: 16px 24px; border-radius: 8px 8px 0 0; text-align: center;">
|
||||
<h1 style="margin: 0; font-size: 20px;">Password Reset</h1>
|
||||
body = f"""
|
||||
<p style="margin:0 0 16px;color:#374151;font-size:15px;">
|
||||
We received a request to reset your password. Click the button below to choose a new password.
|
||||
</p>
|
||||
<div style="text-align:center;margin:24px 0;">
|
||||
<a href="{reset_url}" style="display:inline-block;background:#6366f1;color:#ffffff;padding:12px 32px;border-radius:6px;text-decoration:none;font-weight:600;font-size:15px;">
|
||||
Reset Password
|
||||
</a>
|
||||
</div>
|
||||
<div style="background: #f9fafb; padding: 24px; border: 1px solid #e5e7eb; border-top: none; border-radius: 0 0 8px 8px;">
|
||||
<p style="margin: 0 0 16px; color: #374151; font-size: 15px;">
|
||||
We received a request to reset your password. Click the button below to choose a new password:
|
||||
</p>
|
||||
<div style="text-align: center; margin: 24px 0;">
|
||||
<a href="{reset_url}" style="display: inline-block; background: #6366f1; color: #fff; padding: 12px 32px; border-radius: 6px; text-decoration: none; font-weight: 600; font-size: 15px;">
|
||||
Reset Password
|
||||
</a>
|
||||
</div>
|
||||
<p style="margin: 0 0 8px; color: #6b7280; font-size: 13px;">This link expires in 1 hour.</p>
|
||||
<p style="margin: 0; color: #6b7280; font-size: 13px;">If you didn't request this, you can safely ignore this email.</p>
|
||||
<hr style="border: none; border-top: 1px solid #e5e7eb; margin: 16px 0;" />
|
||||
<p style="margin: 0; color: #9ca3af; font-size: 12px;">If the button doesn't work, copy and paste this link into your browser:</p>
|
||||
<p style="margin: 4px 0 0; color: #9ca3af; font-size: 12px; word-break: break-all;">{reset_url}</p>
|
||||
</div>
|
||||
</div>
|
||||
<p style="margin:0 0 6px;color:#6b7280;font-size:13px;">This link expires in 1 hour.</p>
|
||||
<p style="margin:0 0 16px;color:#6b7280;font-size:13px;">If you didn't request this, you can safely ignore this email.</p>
|
||||
<hr style="border:none;border-top:1px solid #e5e7eb;margin:16px 0;">
|
||||
<p style="margin:0;color:#9ca3af;font-size:12px;">If the button doesn't work, copy and paste this link:</p>
|
||||
<p style="margin:4px 0 0;color:#9ca3af;font-size:12px;word-break:break-all;">{reset_url}</p>
|
||||
"""
|
||||
await send_email(email, "Fabled Assistant - Password Reset", html)
|
||||
await send_email(email, "Fabled Assistant - Password Reset", _email_html("Password Reset", body))
|
||||
|
||||
|
||||
async def send_password_reset_success_email(email: str) -> None:
|
||||
"""Send a notification that the password was successfully reset."""
|
||||
timestamp = datetime.now(timezone.utc).strftime("%Y-%m-%d %H:%M:%S UTC")
|
||||
html = f"""
|
||||
<div style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; max-width: 480px; margin: 0 auto; padding: 24px;">
|
||||
<div style="background: #6366f1; color: #fff; padding: 16px 24px; border-radius: 8px 8px 0 0; text-align: center;">
|
||||
<h1 style="margin: 0; font-size: 20px;">Password Changed</h1>
|
||||
</div>
|
||||
<div style="background: #f9fafb; padding: 24px; border: 1px solid #e5e7eb; border-top: none; border-radius: 0 0 8px 8px;">
|
||||
<p style="margin: 0 0 16px; color: #374151; font-size: 15px;">
|
||||
Your password was successfully reset at {timestamp}.
|
||||
</p>
|
||||
<p style="margin: 0; color: #6b7280; font-size: 13px;">If you didn't make this change, please contact your administrator immediately.</p>
|
||||
</div>
|
||||
</div>
|
||||
body = f"""
|
||||
<p style="margin:0 0 12px;color:#374151;font-size:15px;">
|
||||
Your password was successfully changed at <strong>{timestamp}</strong>.
|
||||
</p>
|
||||
<p style="margin:0;color:#6b7280;font-size:13px;">If you didn't make this change, please contact your administrator immediately.</p>
|
||||
"""
|
||||
await send_email(email, "Fabled Assistant - Password Changed", html)
|
||||
await send_email(email, "Fabled Assistant - Password Changed", _email_html("Password Changed", body))
|
||||
|
||||
|
||||
async def send_invitation_email(email: str, invite_url: str, invited_by_username: str) -> None:
|
||||
"""Send a branded invitation email with a registration link."""
|
||||
html = f"""
|
||||
<div style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; max-width: 480px; margin: 0 auto; padding: 24px;">
|
||||
<div style="background: #6366f1; color: #fff; padding: 16px 24px; border-radius: 8px 8px 0 0; text-align: center;">
|
||||
<h1 style="margin: 0; font-size: 20px;">You're Invited!</h1>
|
||||
body = f"""
|
||||
<p style="margin:0 0 16px;color:#374151;font-size:15px;">
|
||||
<strong>{invited_by_username}</strong> has invited you to join Fabled Assistant.
|
||||
Click the button below to create your account.
|
||||
</p>
|
||||
<div style="text-align:center;margin:24px 0;">
|
||||
<a href="{invite_url}" style="display:inline-block;background:#6366f1;color:#ffffff;padding:12px 32px;border-radius:6px;text-decoration:none;font-weight:600;font-size:15px;">
|
||||
Accept Invitation
|
||||
</a>
|
||||
</div>
|
||||
<div style="background: #f9fafb; padding: 24px; border: 1px solid #e5e7eb; border-top: none; border-radius: 0 0 8px 8px;">
|
||||
<p style="margin: 0 0 16px; color: #374151; font-size: 15px;">
|
||||
<strong>{invited_by_username}</strong> has invited you to join Fabled Assistant. Click the button below to create your account:
|
||||
</p>
|
||||
<div style="text-align: center; margin: 24px 0;">
|
||||
<a href="{invite_url}" style="display: inline-block; background: #6366f1; color: #fff; padding: 12px 32px; border-radius: 6px; text-decoration: none; font-weight: 600; font-size: 15px;">
|
||||
Accept Invitation
|
||||
</a>
|
||||
</div>
|
||||
<p style="margin: 0 0 8px; color: #6b7280; font-size: 13px;">This invitation expires in 7 days.</p>
|
||||
<p style="margin: 0; color: #6b7280; font-size: 13px;">If you weren't expecting this invitation, you can safely ignore this email.</p>
|
||||
<hr style="border: none; border-top: 1px solid #e5e7eb; margin: 16px 0;" />
|
||||
<p style="margin: 0; color: #9ca3af; font-size: 12px;">If the button doesn't work, copy and paste this link into your browser:</p>
|
||||
<p style="margin: 4px 0 0; color: #9ca3af; font-size: 12px; word-break: break-all;">{invite_url}</p>
|
||||
</div>
|
||||
</div>
|
||||
<p style="margin:0 0 6px;color:#6b7280;font-size:13px;">This invitation expires in 7 days.</p>
|
||||
<p style="margin:0 0 16px;color:#6b7280;font-size:13px;">If you weren't expecting this, you can safely ignore this email.</p>
|
||||
<hr style="border:none;border-top:1px solid #e5e7eb;margin:16px 0;">
|
||||
<p style="margin:0;color:#9ca3af;font-size:12px;">If the button doesn't work, copy and paste this link:</p>
|
||||
<p style="margin:4px 0 0;color:#9ca3af;font-size:12px;word-break:break-all;">{invite_url}</p>
|
||||
"""
|
||||
await send_email(email, "Fabled Assistant - You're Invited!", html)
|
||||
await send_email(email, "Fabled Assistant - You're Invited!", _email_html("You're Invited!", body))
|
||||
|
||||
|
||||
async def check_due_tasks() -> None:
|
||||
@@ -221,34 +205,27 @@ async def check_due_tasks() -> None:
|
||||
overdue = task.due_date < today if task.due_date else False
|
||||
date_color = "#ef4444" if overdue else "#374151"
|
||||
date_label = f'<span style="color: {date_color};">{task.due_date.isoformat()}</span>' if task.due_date else ""
|
||||
overdue_badge = ' <span style="color: #ef4444; font-weight: 600; font-size: 12px;">(overdue)</span>' if overdue else ""
|
||||
task_rows += f"""
|
||||
<tr>
|
||||
<td style="padding: 8px 12px; border-bottom: 1px solid #e5e7eb; color: #374151; font-size: 14px;">{task.title}</td>
|
||||
<td style="padding: 8px 12px; border-bottom: 1px solid #e5e7eb; font-size: 14px;">{date_label}{overdue_badge}</td>
|
||||
<td style="padding: 8px 12px; border-bottom: 1px solid #e5e7eb; color: #6b7280; font-size: 14px;">{task.status}</td>
|
||||
</tr>
|
||||
"""
|
||||
overdue_badge = ' <span style="color:#ef4444;font-weight:600;font-size:11px;">(overdue)</span>' if overdue else ""
|
||||
task_rows += (
|
||||
f'<tr>'
|
||||
f'<td style="padding:8px 12px;border-bottom:1px solid #e5e7eb;color:#111827;font-size:14px;">{task.title}</td>'
|
||||
f'<td style="padding:8px 12px;border-bottom:1px solid #e5e7eb;font-size:14px;">{date_label}{overdue_badge}</td>'
|
||||
f'<td style="padding:8px 12px;border-bottom:1px solid #e5e7eb;color:#6b7280;font-size:13px;">{task.status}</td>'
|
||||
f'</tr>'
|
||||
)
|
||||
|
||||
html = f"""
|
||||
<div style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; max-width: 560px; margin: 0 auto; padding: 24px;">
|
||||
<div style="background: #6366f1; color: #fff; padding: 16px 24px; border-radius: 8px 8px 0 0; text-align: center;">
|
||||
<h1 style="margin: 0; font-size: 20px;">Task Reminders</h1>
|
||||
</div>
|
||||
<div style="background: #f9fafb; padding: 24px; border: 1px solid #e5e7eb; border-top: none; border-radius: 0 0 8px 8px;">
|
||||
<p style="margin: 0 0 16px; color: #374151;">You have {len(user_tasks)} task(s) due:</p>
|
||||
<table style="width: 100%; border-collapse: collapse;">
|
||||
<tr style="background: #f3f4f6;">
|
||||
<th style="padding: 8px 12px; text-align: left; font-size: 13px; color: #6b7280;">Task</th>
|
||||
<th style="padding: 8px 12px; text-align: left; font-size: 13px; color: #6b7280;">Due</th>
|
||||
<th style="padding: 8px 12px; text-align: left; font-size: 13px; color: #6b7280;">Status</th>
|
||||
</tr>
|
||||
{task_rows}
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
body = f"""
|
||||
<p style="margin:0 0 16px;color:#374151;font-size:15px;">You have <strong>{len(user_tasks)}</strong> task(s) due:</p>
|
||||
<table style="width:100%;border-collapse:collapse;border:1px solid #e5e7eb;border-radius:6px;overflow:hidden;">
|
||||
<tr style="background:#f9fafb;">
|
||||
<th style="padding:8px 12px;text-align:left;font-size:12px;color:#6b7280;font-weight:600;text-transform:uppercase;letter-spacing:0.05em;border-bottom:1px solid #e5e7eb;">Task</th>
|
||||
<th style="padding:8px 12px;text-align:left;font-size:12px;color:#6b7280;font-weight:600;text-transform:uppercase;letter-spacing:0.05em;border-bottom:1px solid #e5e7eb;">Due</th>
|
||||
<th style="padding:8px 12px;text-align:left;font-size:12px;color:#6b7280;font-weight:600;text-transform:uppercase;letter-spacing:0.05em;border-bottom:1px solid #e5e7eb;">Status</th>
|
||||
</tr>
|
||||
{task_rows}
|
||||
</table>
|
||||
"""
|
||||
await send_email(email, f"Fabled Assistant - {len(user_tasks)} Task(s) Due", html)
|
||||
await send_email(email, f"Fabled Assistant - {len(user_tasks)} Task(s) Due", _email_html("Task Reminders", body))
|
||||
await log_audit(
|
||||
"task_reminder",
|
||||
user_id=user_id,
|
||||
|
||||
Reference in New Issue
Block a user