TheDude
/
openproject
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Apply hard table layout on notification row to be deal better with different clients

Browse Source
pull/9675/head
Henriette Darge 3 years ago
parent a6b2eeab45
commit 9d0db7c517
4 changed files with 107 additions and 78 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 8
      app/helpers/mail_notification_helper.rb
  2. 10
      app/views/digest_mailer/work_packages.html.erb
  3. 4
      app/views/mailer/_notification_mailer_header.html.erb
  4. 163
      app/views/mailer/_notification_row.html.erb

8
app/helpers/mail_notification_helper.rb
Unescape View File

@ -83,11 +83,11 @@ module MailNotificationHelper
default_options.merge(options).map { |k, v| "#{k}=#{v}" }.join(' ')
end
def placeholder_cell(number, is_horizontal = true)
style = if is_horizontal
"line-height:#{number}; max-width:0; min-width:0; height:#{number}; width:0; font-size:#{number}"
else
def placeholder_cell(number, is_vertical = false)
style = if is_vertical
"max-width:#{number}; min-width:#{number}; width:#{number}"
else
"line-height:#{number}; max-width:0; min-width:0; height:#{number}; width:0; font-size:#{number}"
end
content_tag('td', ' ', style: style).html_safe

10
app/views/digest_mailer/work_packages.html.erb
Unescape View File

@ -9,19 +9,19 @@
work_package: work_package,
notifications_by_work_package: notifications_by_work_package
} do %>
<table width="100%" border="0" cellpadding="0" cellspacing="0" style="font-size: 12px;">
<table <%= placeholder_table_styles %>>
<% notifications_by_work_package.each do | notification | %>
<% if notification.journal.notes.present? %>
<tr style="color: #878787; line-height: 20px; font-size: 14px;">
<td>
<tr>
<td style="color: #878787; line-height: 24px; font-size: 14px;">
<%= digest_comment_text(notification) %>
<%= digest_notification_timestamp_text(notification) %>
</td>
</tr>
<% end %>
<% notification.journal.details.each do |detail| %>
<tr style="color: #878787; line-height: 20px; font-size: 14px;">
<td>
<tr>
<td style="color: #878787; line-height: 24px; font-size: 14px;">
<%= notification.journal.render_detail(detail, only_path: false) %>
<%= digest_notification_timestamp_text(notification) %>
</td>

4
app/views/mailer/_notification_mailer_header.html.erb
Unescape View File

@ -3,7 +3,7 @@
<td>
<table <%= placeholder_table_styles %>>
<tr>
<%= placeholder_cell('12px', false) %>
<%= placeholder_cell('12px', true) %>
<td>
<table <%= placeholder_table_styles(style: "width:100%") %>>
<tr>
@ -40,7 +40,7 @@
</tr>
</table>
</td>
<%= placeholder_cell('16px', false) %>
<%= placeholder_cell('16px', true) %>
<td>
<table <%= placeholder_table_styles %>>
<tr>

163
app/views/mailer/_notification_row.html.erb
Unescape View File

@ -1,73 +1,102 @@
<table cellpadding="12px" width="100%" style="border: 1px solid #E0E0E0;
border-radius: 10px;">
<table <%= placeholder_table_styles(style: "width:100%;border-width:1px;border-color:#E0E0E0;border-style:solid;border-radius:10px") %>>
<tr>
<%= placeholder_cell('12px') %>
</tr>
<tr>
<td>
<a style="
text-decoration: none;
display: block;"
href="<%= notifications_path(work_package.id) %>"
target="_blank">
<table width="100%" border="0" cellpadding="0" cellspacing="0" style="margin-bottom: 9px; font-size: 14px;">
<tr>
<td>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td style="color: #333333;
background-color: #FFFFFF;
<%= status_colors(work_package.status) %>
white-space: nowrap;
padding: 2px 12px;
height: 18px;">
<%= work_package.status %>
</td>
</tr>
</table>
</td>
<td width="95%%" style="padding-left: 8px;
color: #878787;">
#<%= work_package.id %> - <%= work_package.project %>
<% unique_reasons = unique_reasons_of_notifications(notifications_by_work_package) %>
<%= ' - ' unless unique_reasons.length === 1 && unique_reasons.first.nil? %>
<% unique_reasons.each_with_index do |reason, index| %>
<%= I18n.t(
:"mail.digests.work_packages.reason.#{reason || :unknown}",
default: '') %><%= ', ' unless unique_reasons.size-1 == index %>
<% end %>
</td>
<td>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td style="background-color: #00A3FF;
color: white;
border-radius: 8px;
padding: 2px 8px;
font-size: 14px;
height: 18px;">
<%= notifications_by_work_package.length %>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table width="100%" border="0" cellpadding="0" cellspacing="0" style="margin-bottom: 9px; font-size: 16px; font-weight: bold;">
<tr>
<td style="color: <%= type_color(work_package.type, '#333333') %>;
white-space: nowrap;">
<%= work_package.type.to_s.upcase %>
</td>
<td width="100%" style="padding-left: 5px; color: #333333;">
<%= work_package.subject %>
</td>
</tr>
</table>
<%= yield %>
</a>
<table <%= placeholder_table_styles(style: 'width:100%;font-size:14px;') %>>
<tr>
<%= placeholder_cell('12px', true) %>
<td>
<table <%= placeholder_table_styles %>>
<tr>
<td>
<table <%= placeholder_table_styles %>>
<tr>
<td style="color: #333333;
background-color: #FFFFFF;
<%= status_colors(work_package.status) %>
white-space: nowrap;
padding: 2px 12px;
height: 18px;">
<%= work_package.status %>
</td>
</tr>
</table>
</td>
<%= placeholder_cell('8px', true) %>
<td width="100%" style="color: #878787;">
#<%= work_package.id %> - <%= work_package.project %>
<% unique_reasons = unique_reasons_of_notifications(notifications_by_work_package) %>
<%= ' - ' unless unique_reasons.length === 1 && unique_reasons.first.nil? %>
<% unique_reasons.each_with_index do |reason, index| %>
<%= I18n.t(
:"mail.digests.work_packages.reason.#{reason || :unknown}",
default: '') %><%= ', ' unless unique_reasons.size-1 == index %>
<% end %>
</td>
<td>
<table <%= placeholder_table_styles %>>
<tr>
<td style="background-color: #00A3FF;
color: white;
border-radius: 10px;
padding: 2px 8px;
font-size: 14px;
height: 18px;
line-height: 18px;">
<%= notifications_by_work_package.length %>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<%= placeholder_cell('12px', true) %>
</tr>
<tr>
<%= placeholder_cell('12px', true) %>
<%= placeholder_cell('12px') %>
<%= placeholder_cell('12px', true) %>
</tr>
<tr>
<%= placeholder_cell('12px', true) %>
<td>
<table <%= placeholder_table_styles(style: 'font-size:16px;font-weight:bold') %>>
<tr>
<td style="color: <%= type_color(work_package.type, '#333333') %>;white-space: nowrap;">
<%= work_package.type.to_s.upcase %>
</td>
<%= placeholder_cell('4px', true) %>
<td width="100%" style="color: #333333;">
<%= work_package.subject %>
</td>
</tr>
</table>
</td>
<%= placeholder_cell('12px', true) %>
</tr>
<tr>
<%= placeholder_cell('12px', true) %>
<%= placeholder_cell('12px') %>
<%= placeholder_cell('12px', true) %>
</tr>
<tr>
<%= placeholder_cell('12px', true) %>
<td><%= yield %></td>
<%= placeholder_cell('12px', true) %>
</tr>
</table>
</td>
</tr>
<tr>
<%= placeholder_cell('12px') %>
</tr>
</table>
<br/>
<table>
<tr>
<%= placeholder_cell('20px') %>
</tr>
</table>

Write Preview
Loading…
Cancel
Save