espace-paie-odentas/tmp/send-preview.html
2025-10-12 17:05:46 +02:00

95 lines
No EOL
5.9 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>CDDU annulé</title>
<meta name="color-scheme" content="light dark">
<meta name="supported-color-schemes" content="light dark">
<style>
/* Minimal static CSS for emails. Dynamic colors and other dynamic values are applied inline to avoid static-linter issues. */
body { margin:0; padding:0; background:#F4F6FA; color:#0F172A; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; }
a { color:#0B5FFF; text-decoration:none; }
/* Container defaults (kept minimal) */
.wrapper { width:100%; padding:32px 0; background:#F4F6FA; }
.container { width:100%; max-width:520px; margin:0 auto; background:#FFFFFF; border-radius:14px; box-shadow: 0 6px 20px rgba(15,23,42,0.06); overflow:hidden; }
.logo { height:60px; display:block; }
.label { font-size:12px; color:#64748B; text-transform:uppercase; letter-spacing:0.03em; margin-bottom:6px; font-weight:500; }
.value { font-size:15px; color:#0F172A; font-weight:500; line-height:1.3; }
.muted { color:#94A3B8; }
@media (prefers-color-scheme: dark) {
body, .wrapper { background:#0B1220; color:#E5E7EB; }
}
@media (max-width: 480px) {
.row { display:block; gap:0; }
.col { margin-bottom:12px; }
.wrapper { padding:16px 0; }
}
</style>
</head>
<body>
<div style="display:none;max-height:0;overflow:hidden;opacity:0;">CDDU annulé · CDDU annulé pour Jean Dupont · Réf CDD-123</div>
<div class="wrapper" style="width:100%; padding:32px 0; background:#F4F6FA;">
<div class="container" style="width:100%; max-width:520px; margin:0 auto; background:#FFFFFF; border-radius:14px; box-shadow: 0 6px 20px rgba(15,23,42,0.06); overflow:hidden;">
<div class="brandbar" style="height:6px; display:block; width:100%; background:#efc543;"></div>
<div class="header" style="padding:28px 28px 10px 28px; text-align:left; background:#FFFFFF;">
<img class="logo" src="https://newstaging.odentas.fr/wp-content/uploads/2025/08/Odentas-Logo-Bleu-Fond-Transparent-4-1.png" alt="Odentas" style="height:60px; display:block;">
<div style="display:flex; align-items:baseline; margin:18px 0 16px 0;">
<div style="width:8px; height:8px; border-radius:50%; margin-right:12px; margin-top:8px; flex-shrink:0; background:#EF4444;"></div>
<h1 class="title" style="font-size:22px; line-height:1.3; margin:0; font-weight:700; color:#0F172A;">CDDU annulé</h1>
</div>
<p class="subtitle" style="font-size:15px; color:#334155; margin:0; line-height:1.4;">Votre contrat CDDU a été annulé.</p>
</div>
<div class="card" style="margin:0px 28px 0 28px; border-radius:12px; padding:20px; border:1px solid #E5E7EB; background:#F8FAFC;">
<h2 style="font-size:16px; margin:0 0 12px; font-weight:600; color:#0F172A;">Détails du contrat</h2>
<div style="margin-bottom:12px;">
<div style="margin-bottom:12px;">
<div class="label" style="font-size:12px; color:#64748B; text-transform:uppercase; letter-spacing:0.03em; margin-bottom:6px; font-weight:500;">Référence</div>
<div class="value" style="font-size:15px; color:#0F172A; font-weight:500; line-height:1.3;">CDD-123</div>
</div>
</div>
<div style="margin-bottom:12px;">
<div style="margin-bottom:12px;">
<div class="label" style="font-size:12px; color:#64748B; text-transform:uppercase; letter-spacing:0.03em; margin-bottom:6px; font-weight:500;">Salarié</div>
<div class="value" style="font-size:15px; color:#0F172A; font-weight:500; line-height:1.3;">Jean Dupont</div>
</div>
</div>
<div style="margin-bottom:12px;">
<div style="margin-bottom:12px;">
<div class="label" style="font-size:12px; color:#64748B; text-transform:uppercase; letter-spacing:0.03em; margin-bottom:6px; font-weight:500;">Poste</div>
<div class="value" style="font-size:15px; color:#0F172A; font-weight:500; line-height:1.3;">Développeur</div>
</div>
</div>
<div style="margin-bottom:12px;">
<div style="margin-bottom:12px;">
<div class="label" style="font-size:12px; color:#64748B; text-transform:uppercase; letter-spacing:0.03em; margin-bottom:6px; font-weight:500;">Date de début</div>
<div class="value" style="font-size:15px; color:#0F172A; font-weight:500; line-height:1.3;">2025-10-01</div>
</div>
</div>
</div>
<div class="cta-wrap" style="padding:24px 28px 6px 28px; text-align:center; background:#FFFFFF;">
<!--[if mso]>
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" arcsize="10%" fillcolor="#efc543" stroke="f" style="height:46px;v-text-anchor:middle;width:260px;">
<w:anchorlock/>
<center style="color:#000000;font-family:Segoe UI, Arial, sans-serif;font-size:16px;font-weight:700;">Accès à l&#x27;Espace Paie</center>
</v:roundrect>
<![endif]-->
<!--[if !mso]><!-- -->
<a class="btn" href="https://example.com/contrat/123" style="color:#000; display:inline-block; padding:16px 32px; border-radius:10px; font-weight:700; font-size:16px; text-decoration:none; border:none; box-shadow: 0 2px 4px rgba(0,0,0,0.1); background:#efc543;">Accès à l&#x27;Espace Paie</a>
<!--<![endif]-->
</div>
<p class="note" style="font-size:13px; color:#475569; padding:0 28px 26px 28px; line-height:1.5;">Pour votre sécurité, ne partagez jamais ce message.</p>
<div class="footer" style="font-size:12px; color:#64748B; text-align:center; padding:18px 28px 0 28px; line-height:1.4;">
<p>Vous recevez cet e-mail car vous êtes client de Odentas.<br><span class="muted" style="color:#94A3B8;">© 2021-2025 Odentas Media SAS</span></p>
</div>
</div>
</div>
<div style="display:none; font-size:0; line-height:0;">CDDU annulé CDDU annulé Réf CDD-123 pour Jean Dupont.</div>
</body>
</html>