Files
ladill-transfer/resources/views/mail/notifications/layout.blade.php
T
isaaccladandCursor c396c97ce2
Deploy Ladill Transfer / deploy (push) Successful in 36s
Fix transfer share links and redesign recipient download email.
Use transfer.ladill.com share URLs in notifications and APIs, add the email
logo, and show file details with a prominent download button.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-06-08 15:56:06 +00:00

407 lines
12 KiB
PHP

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>{{ $subject ?? 'Ladill Notification' }}</title>
<!--[if mso]>
<noscript>
<xml>
<o:OfficeDocumentSettings>
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml>
</noscript>
<![endif]-->
<style>
body {
margin: 0;
padding: 0;
width: 100%;
background-color: #f8fafc;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.email-wrapper {
width: 100%;
background-color: #f8fafc;
padding: 48px 0;
}
.email-container {
max-width: 600px;
margin: 0 auto;
background-color: #ffffff;
border-radius: 16px;
overflow: hidden;
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
}
.email-header {
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
padding: 32px 40px;
text-align: center;
}
.email-logo {
max-height: 36px;
width: auto;
}
.email-icon-header {
background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
padding: 48px 40px;
text-align: center;
}
.email-icon {
width: 64px;
height: 64px;
background-color: rgba(255, 255, 255, 0.15);
border-radius: 16px;
display: inline-flex;
align-items: center;
justify-content: center;
margin-bottom: 16px;
}
.email-icon svg {
width: 32px;
height: 32px;
color: #ffffff;
}
.email-header-title {
color: #ffffff;
font-size: 24px;
font-weight: 700;
margin: 0;
letter-spacing: -0.025em;
}
.email-header-subtitle {
color: rgba(255, 255, 255, 0.8);
font-size: 14px;
margin: 8px 0 0 0;
}
.email-body {
padding: 40px;
}
.email-title {
font-size: 24px;
font-weight: 700;
color: #0f172a;
margin: 0 0 16px 0;
line-height: 1.3;
letter-spacing: -0.025em;
}
.email-text {
font-size: 16px;
line-height: 1.7;
color: #475569;
margin: 0 0 16px 0;
}
.email-text-sm {
font-size: 14px;
line-height: 1.6;
color: #64748b;
margin: 0 0 12px 0;
}
.email-button {
display: inline-block;
background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
color: #ffffff !important;
text-decoration: none;
padding: 14px 32px;
border-radius: 10px;
font-size: 14px;
font-weight: 600;
margin: 24px 0;
box-shadow: 0 4px 14px 0 rgba(79, 70, 229, 0.4);
}
.email-button-secondary {
display: inline-block;
background-color: #f1f5f9;
color: #0f172a !important;
text-decoration: none;
padding: 12px 24px;
border-radius: 8px;
font-size: 14px;
font-weight: 600;
margin: 8px 4px;
}
.email-divider {
height: 1px;
background: linear-gradient(90deg, transparent, #e2e8f0, transparent);
margin: 32px 0;
}
.email-details {
background-color: #f8fafc;
border-radius: 12px;
padding: 24px;
margin: 24px 0;
border: 1px solid #e2e8f0;
}
.email-details-title {
font-size: 12px;
font-weight: 600;
color: #64748b;
text-transform: uppercase;
letter-spacing: 0.05em;
margin: 0 0 16px 0;
}
.email-details-row {
padding: 12px 0;
border-bottom: 1px solid #e2e8f0;
}
.email-details-row:last-child {
border-bottom: none;
padding-bottom: 0;
}
.email-details-row:first-of-type {
padding-top: 0;
}
.email-details-label {
font-size: 13px;
color: #64748b;
margin: 0 0 4px 0;
}
.email-details-value {
font-size: 15px;
font-weight: 600;
color: #0f172a;
margin: 0;
word-break: break-all;
}
.email-card {
background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
border-radius: 12px;
padding: 24px;
margin: 24px 0;
border: 1px solid #e2e8f0;
}
.email-card-icon {
width: 48px;
height: 48px;
background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
border-radius: 12px;
display: inline-flex;
align-items: center;
justify-content: center;
margin-bottom: 16px;
}
.email-card-icon svg {
width: 24px;
height: 24px;
color: #ffffff;
}
.email-footer {
background-color: #0f172a;
padding: 40px;
text-align: center;
}
.email-footer-text {
font-size: 13px;
color: #94a3b8;
margin: 0 0 8px 0;
line-height: 1.6;
}
.email-footer-link {
color: #a5b4fc;
text-decoration: none;
}
.email-footer-link:hover {
text-decoration: underline;
}
.email-footer-links {
margin: 20px 0;
}
.email-footer-links a {
color: #94a3b8;
text-decoration: none;
font-size: 13px;
margin: 0 12px;
}
.email-footer-links a:hover {
color: #ffffff;
}
.highlight-box {
background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
border-radius: 12px;
padding: 28px;
margin: 24px 0;
text-align: center;
}
.highlight-box-text {
color: #ffffff;
font-size: 20px;
font-weight: 700;
margin: 0;
letter-spacing: -0.025em;
}
.highlight-box-subtext {
color: rgba(255, 255, 255, 0.85);
font-size: 14px;
margin: 8px 0 0 0;
}
.highlight-box-success {
background: linear-gradient(135deg, #059669 0%, #10b981 100%);
}
.highlight-box-warning {
background: linear-gradient(135deg, #d97706 0%, #f59e0b 100%);
}
.highlight-box-info {
background: linear-gradient(135deg, #0284c7 0%, #0ea5e9 100%);
}
.status-badge {
display: inline-block;
padding: 6px 14px;
border-radius: 20px;
font-size: 12px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.status-success {
background-color: #dcfce7;
color: #166534;
}
.status-warning {
background-color: #fef3c7;
color: #92400e;
}
.status-info {
background-color: #dbeafe;
color: #1e40af;
}
.status-error {
background-color: #fee2e2;
color: #991b1b;
}
.checklist-item {
display: flex;
align-items: flex-start;
padding: 12px 0;
border-bottom: 1px solid #e2e8f0;
}
.checklist-item:last-child {
border-bottom: none;
}
.checklist-icon {
width: 24px;
height: 24px;
background-color: #dcfce7;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin-right: 12px;
flex-shrink: 0;
}
.checklist-icon svg {
width: 14px;
height: 14px;
color: #166534;
}
.checklist-content {
flex: 1;
}
.checklist-title {
font-size: 14px;
font-weight: 600;
color: #0f172a;
margin: 0 0 2px 0;
}
.checklist-desc {
font-size: 13px;
color: #64748b;
margin: 0;
}
.code-block {
background-color: #1e293b;
border-radius: 8px;
padding: 16px 20px;
margin: 16px 0;
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
font-size: 14px;
color: #e2e8f0;
word-break: break-all;
}
.amount-large {
font-size: 36px;
font-weight: 700;
color: #0f172a;
letter-spacing: -0.025em;
}
.amount-currency {
font-size: 18px;
color: #64748b;
font-weight: 500;
}
@media only screen and (max-width: 620px) {
.email-wrapper {
padding: 24px 16px;
}
.email-container {
border-radius: 12px;
}
.email-header,
.email-icon-header {
padding: 24px;
}
.email-body,
.email-footer {
padding: 28px 24px;
}
.email-title {
font-size: 20px;
}
.email-header-title {
font-size: 20px;
}
.amount-large {
font-size: 28px;
}
}
</style>
</head>
<body>
<div class="email-wrapper">
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
<tr>
<td align="center">
<div class="email-container">
{{-- Header with Logo --}}
<div class="email-header">
@hasSection('email-header')
@yield('email-header')
@else
<img src="{{ config('app.url') }}/images/logo/ladill-logo-white.png" alt="Ladill" class="email-logo">
@endif
</div>
@hasSection('icon-header')
@yield('icon-header')
@endif
{{-- Email Body --}}
<div class="email-body">
@yield('content')
</div>
{{-- Footer --}}
<div class="email-footer">
<p class="email-footer-text">
You're receiving this email because you have an account with Ladill.
</p>
<div class="email-footer-links">
<a href="{{ config('app.url') }}/dashboard">Dashboard</a>
<a href="{{ config('app.url') }}/support">Support</a>
<a href="{{ config('app.url') }}">ladill.com</a>
</div>
<p class="email-footer-text" style="margin-top: 20px; color: #64748b;">
&copy; 2026 Ladill Technologies. All rights reserved.
</p>
</div>
</div>
</td>
</tr>
</table>
</div>
</body>
</html>