Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[#2175] Fix rounded corners for mail-templates #1078

Merged
merged 1 commit into from
Mar 12, 2024
Merged

[#2175] Fix rounded corners for mail-templates #1078

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 5 additions & 5 deletions src/open_inwoner/conf/parts/case_document_notification.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,16 +26,16 @@ <h2>{{ type_description }}</h2>
</td>
</tr>

<!-- Table with different column-widths -->
<!-- Contains Table with different column-widths -->
<tr>
<td class="td-mail td-mail__bg-info td__padding-all" colspan="6">
<div class="td-mail__bg-white">
<td class="td-mail td-mail__bg-info cell--rounded-padding" colspan="6">
<div class="td-mail__bg-white mail-cell--rounded">
<table role="presentation" border="0" cellspacing="0" cellpadding="0" width="100%">
<tr>
<td width="35" class="td-mail td__padding-left align-center">
<td width="35" class="td-mail mail--transparent td__padding-left align-center">
<img src="/static/img/mail/info_info-blue.png" width="20" height="20" alt="" class="mail__icon">
</td>
<td class="td__padding-top td__padding-right td__padding-bottom align-center">
<td class="td-mail mail--transparent td__padding-top td__padding-right td__padding-bottom align-center">
<p class="text-color__info">Een of meer documenten zijn aan uw aanvraag toegevoegd.</p>
</td>
</tr>
Expand Down
14 changes: 7 additions & 7 deletions src/open_inwoner/conf/parts/case_status_notification.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,16 +26,16 @@ <h2>{{ type_description }}</h2>
</td>
</tr>

<!-- Table with different column-widths -->
<tr>
<td class="td-mail td-mail__bg-info td__padding-all" colspan="6">
<div class="td-mail__bg-white">
<table role="presentation" border="0" cellspacing="0" cellpadding="0" width="100%">
<!-- Contains Table with different column-widths -->
<tr class="mail--transparent">
<td class="td-mail td-mail__bg-info cell--rounded-padding" colspan="6">
<div class="td-mail__bg-white mail-cell--rounded">
<table role="presentation" border="0" cellspacing="0" cellpadding="0" width="100%" class="mail--transparent">
<tr>
<td width="35" class="td-mail td__padding-left align-center">
<td width="35" class="td-mail mail--transparent td__padding-left align-center">
<img src="/static/img/mail/info_info-blue.png" width="20" height="20" alt="" class="mail__icon">
</td>
<td class="td__padding-top td__padding-right td__padding-bottom align-center">
<td class="td-mail mail--transparent td__padding-top td__padding-right td__padding-bottom align-center">
<p class="text-color__info">De status is gewijzigd naar <span class="status_current"><strong><a href="{{ case_link }}" class="text-color__info">{{ status_description }}</a></strong></span>.</p>
</td>
</tr>
Expand Down
14 changes: 9 additions & 5 deletions src/open_inwoner/conf/parts/case_status_notification_action_required.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,15 +25,17 @@ <h2>{{ type_description }}</h2>
<p><span class="text-color__small-gray-900">Zaaknummer: </span><br/>{{ identification }}</p>
</td>
</tr>

<!-- Contains Table with different column-widths -->
<tr>
<td class="td-mail td-mail__bg-danger td__padding-all" colspan="6">
<div class="td-mail__bg-white">
<table role="presentation" border="0" cellspacing="0" cellpadding="0" width="100%">
<td class="td-mail td-mail__bg-danger cell--rounded-padding" colspan="6">
<div class="td-mail__bg-white mail-cell--rounded">
<table role="presentation" border="0" cellspacing="0" cellpadding="0" width="100%" class="mail--transparent">
<tr>
<td width="35" class="td-mail td__padding-left align-center">
<td width="35" class="td-mail mail--transparent td__padding-left align-center">
<img src="/static/img/mail/alarm_danger-orange.png" width="20" height="18" alt="" class="mail__icon">
</td>
<td class="td__padding-top td__padding-right td__padding-bottom align-center">
<td class="td-mail mail--transparent td__padding-top td__padding-right td__padding-bottom align-center">
<p class="text-color__danger"><strong>Wij hebben documenten van u nodig</strong><br>
Upload de documenten tot {{ end_date }}</p>
</td>
Expand All @@ -42,6 +44,8 @@ <h2>{{ type_description }}</h2>
</div>
</td>
</tr>
<!-- end of Table with differing column-widths -->

<tr>
<td class="td-mail td-mail__bg-danger td__padding-all" colspan="6">
<p>Log in om de documenten te uploaden.</p>
Expand Down
23 changes: 18 additions & 5 deletions src/open_inwoner/static/mailcss/email.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -109,10 +109,7 @@ td.align-center {

.td-mail__bg-white {
background-color: #ffffff;
border: 1px solid #ffffff;
border-radius: 6px;
color: #704000;
display: inline-block;
color: #4B4B4B;
font-family: Lato, Helvetica, Arial, sans-serif;
font-size: 16px;
line-height: 24px;
Expand All @@ -121,6 +118,18 @@ td.align-center {
-webkit-text-size-adjust: none;
}

.mail-cell--rounded {
border: 1px solid #ffffff;
border-radius: 3px;
display: inline-block;
margin: 3px;
padding: 3px;
}

.mail--transparent {
background-color: transparent;
}

.td__padding-top {
padding-top: 24px;
}
Expand All @@ -141,6 +150,10 @@ td.align-center {
padding: 20px 24px 20px 24px;
}

.cell--rounded-padding {
padding: 20px 30px 20px 20px;
}

.td__padding-zero {
padding: 0;
}
Expand All @@ -163,7 +176,7 @@ td.align-center {

.button--primary {
border: 1px solid;
border-radius: 6px;
border-radius: 3px;
color: #ffffff;
display: inline-block;
font-family: sans-serif;
Expand Down
4 changes: 2 additions & 2 deletions src/open_inwoner/templates/mail/_base.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -102,8 +102,8 @@
display: block;
}

.td__alignright {
text-align: left;
.td__alignright, .td__rightcell {
text-align: left !important;
}
}
</style>
Expand Down
Loading