85 lines
4.5 KiB
PHP
85 lines
4.5 KiB
PHP
@props(['heading', 'preheader' => null, 'greeting' => null])
|
|
|
|
{{--
|
|
The one layout every CluPilot mail uses.
|
|
|
|
Tables and inline styles throughout, and not out of nostalgia: Outlook
|
|
renders with Word, which has no flexbox, no grid, and drops <style> blocks
|
|
in several configurations. Anything that has to survive there has to be an
|
|
attribute on the element it styles.
|
|
|
|
Colours come from resources/css/portal-tokens.css by hand, because a mail
|
|
cannot load a stylesheet. The button is --accent-active (#b8500a), never the
|
|
brand orange (#f97316): white on the brand orange is 2.9:1 and unreadable,
|
|
which is the single most common way this palette gets broken and the reason
|
|
the two tones have different names.
|
|
|
|
No image, no web font, no external asset of any kind. Half of all clients
|
|
block remote content by default, so a design that needs an image to make
|
|
sense is a design that is broken for half of its readers.
|
|
--}}
|
|
<div style="margin:0;padding:0;background-color:#f6f6f8;">
|
|
@if ($preheader)
|
|
{{-- The line shown next to the subject in the inbox list. Hidden in the body
|
|
itself, or it reads as a duplicate first sentence. --}}
|
|
<div style="display:none;font-size:1px;color:#f6f6f8;line-height:1px;max-height:0;max-width:0;opacity:0;overflow:hidden;">{{ $preheader }}</div>
|
|
@endif
|
|
|
|
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="background-color:#f6f6f8;border-collapse:collapse;">
|
|
<tr><td align="center" style="padding:32px 16px;">
|
|
|
|
<table role="presentation" width="600" cellpadding="0" cellspacing="0" border="0" style="width:600px;max-width:600px;border-collapse:collapse;font-family:'IBM Plex Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;">
|
|
|
|
<tr><td style="padding:0 0 20px 4px;">
|
|
<table role="presentation" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;">
|
|
<tr>
|
|
<td style="padding-right:10px;">
|
|
<table role="presentation" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;">
|
|
<tr><td width="26" height="26" style="width:26px;height:26px;background-color:#f97316;border-radius:7px;font-size:0;line-height:0;"> </td></tr>
|
|
</table>
|
|
</td>
|
|
<td style="font-size:17px;line-height:26px;color:#17171c;letter-spacing:-0.2px;">
|
|
<span style="font-weight:700;color:#17171c;">CluPilot</span>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</td></tr>
|
|
|
|
<tr><td style="background-color:#ffffff;border:1px solid #e9e9ee;border-radius:12px;">
|
|
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;">
|
|
|
|
<tr><td style="padding:40px 40px 0 40px;">
|
|
<h1 style="margin:0 0 14px 0;font-size:25px;line-height:32px;font-weight:700;color:#17171c;letter-spacing:-0.5px;">{{ $heading }}</h1>
|
|
@if ($greeting)
|
|
<p style="margin:0 0 8px 0;font-size:15px;line-height:24px;color:#43434e;">{{ $greeting }}</p>
|
|
@endif
|
|
</td></tr>
|
|
|
|
{{ $slot }}
|
|
|
|
</table>
|
|
</td></tr>
|
|
|
|
<tr><td align="center" style="padding:22px 16px 0 16px;text-align:center;">
|
|
<p style="margin:0 0 10px 0;font-size:12px;line-height:18px;color:#6e6e7a;text-align:center;">{{ __('mail.why_you_got_this') }}</p>
|
|
<p style="margin:0 0 6px 0;font-size:12px;line-height:18px;color:#6e6e7a;text-align:center;">
|
|
<a href="{{ route('legal.impressum') }}" style="color:#6e6e7a;text-decoration:underline;">{{ __('mail.imprint') }}</a>
|
|
·
|
|
<a href="{{ route('legal.datenschutz') }}" style="color:#6e6e7a;text-decoration:underline;">{{ __('mail.privacy') }}</a>
|
|
·
|
|
<a href="{{ route('legal.agb') }}" style="color:#6e6e7a;text-decoration:underline;">{{ __('mail.terms') }}</a>
|
|
</p>
|
|
<p style="margin:0 0 6px 0;font-size:12px;line-height:18px;color:#6e6e7a;text-align:center;">
|
|
{{ __('mail.domains_note', ['domains' => implode(' · ', array_keys(App\Support\OfficialDomains::registrable()))]) }}
|
|
<a href="{{ route('security') }}" style="color:#6e6e7a;text-decoration:underline;">{{ __('mail.domains_link') }}</a>
|
|
</p>
|
|
<p style="margin:0;font-size:12px;line-height:18px;color:#b4b4be;text-align:center;">{{ __('mail.sender_line') }}</p>
|
|
<p style="margin:10px 0 0 0;font-size:12px;line-height:18px;color:#b4b4be;text-align:center;">{{ __('mail.transactional_note') }}</p>
|
|
</td></tr>
|
|
|
|
</table>
|
|
|
|
</td></tr>
|
|
</table>
|
|
</div>
|