app/views/pending_action_mailer/confirm_action.ar.html.erb
<!DOCTYPE html>
<html lang="<%= @page.language_code %>">
<head>
<title><%= @subject %></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<style type="text/css">
body, table, td, a { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
table, td { mso-table-lspace: 0pt; mso-table-rspace: 0pt; }
img { -ms-interpolation-mode: bicubic; }
img { border: 0; height: auto; line-height: 100%; outline: none; text-decoration: none; }
table { border-collapse: collapse !important; }
body { height: 100% !important; margin: 0 !important; padding: 0 !important; width: 100% !important; }
a[x-apple-data-detectors] { color: inherit !important; text-decoration: none !important; font-size: inherit !important; font-family: inherit !important; font-weight: inherit !important; line-height: inherit !important; }
u + #body a { color: inherit; text-decoration: none; font-size: inherit; font-family: inherit; font-weight: inherit; line-height: inherit; }
#MessageViewBody a { color: inherit; text-decoration: none; font-size: inherit; font-family: inherit; font-weight: inherit; line-height: inherit; }
</style>
</head>
<body style="margin: 0 !important; padding: 0 !important;">
<!--[if (gte mso 9)|(IE)]>
<table cellspacing="0" cellpadding="0" border="0" width="720" align="center" role="presentation"><tr><td>
<![endif]-->
<div role="article" aria-label="An email from SumOfUs" lang="<%= @page.language_code %>" style="background-color: white; color: #2b2b2b; font-family: 'Avenir Next', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; font-size: 18px; font-weight: 400; line-height: 28px; margin: 0 auto; max-width: 720px; padding: 40px 20px 40px 20px;">
<header>
<a href="https://sumofus.org/">
<center>
<img src="https://s3.amazonaws.com/s3.sumofus.org/images/sou-horizontal-logo-1.png" role="presentation" width="170" height="auto" />
</center>
</a>
</header>
<br/>
<main>
<div style="background-color: #f1f1f1; border-radius: 4px; padding: 24px 48px;">
<!--[if (gte mso 9)|(IE)]>
<table cellspacing="0" cellpadding="0" border="0" width="720" align="center" role="presentation"><tr><td style="background-color: f1f1f1; padding: 24px 48px 24px 48px;">
<![endif]-->
<p>يرجى الضغط هنا لتثبيت توقيعك والتأكّد من ورود رسائلنا الإلكترونية إلى بريدك.</p>
<a href="<%= confirm_api_action_confirmations_url(token: @token, consented: true)%>" style="text-decoration: underline; margin-left:15px;margin-right:15px;display:block;border-bottom:10px;border:#000;padding-top:10px;padding-bottom:10px;padding-right:10px;padding-left:10px;font-family:Arial,sans-serif;font-size:20px;color:#ffffff;line-height:24px;text-align:center;background-color:#f8492e; border-radius:2px;width:220px;margin-left:auto;margin-right:auto;margin-bottom:0px;font-weight:600;text-decoration:none;">
تأكيد توقيعي
</a>
<p>
<center>
<a href="<%= confirm_api_action_confirmations_url(token: @token) %>" style="font-size: 14px; color: #333; display: block;">
أودّ التوقيع على هذه العريضة، لكنني لا أرغب في تلقّي رسائل SumOfUs الإلكترونية
</a>
</center>
</p>
<!--[if (gte mso 9)|(IE)]>
</td></tr></table>
<![endif]-->
</div>
</main>
</div>
<!--[if (gte mso 9)|(IE)]>
</td></tr></table>
<![endif]-->
</body>
</html>