Aggregate notifications by card

app/views/layouts/mailer.html.erb

@@ -45,7 +45,7 @@
 
       .avatar__container {
         vertical-align: top;
-        width: 3.25em;
+        width: 3em;
       }
 
       .avatar {
@@ -53,32 +53,16 @@
         color: white;
         display: block;
         font-weight: 600;
-        height: 2.75em;
-        line-height: 2.75em;
+        height: 2.5em;
+        line-height: 2.5em;
         mso-line-height-rule: exactly;
         overflow: hidden;
         text-align: center;
-        width: 2.75em;
+        width: 2.5em;
       }
 
-      .btn {
-        background: #2d71e5;
-        border-color: #2d71e5;
-        border-radius: 3rem;
-        color: white !important;
-        font-weight: 500;
-        padding: 0.5em 1em;
-        text-decoration: none;
-        white-space: nowrap;
-      }
-
-      .event__details {
-        margin-bottom: 0.2em;
-        margin-top: 0.2em;
-      }
-
-      .event__title {
-        font-size: 1em;
+      .card__title {
+        font-size: 1.1em;
         font-weight: 900;
         margin-bottom: 0;
         margin-top: 0;
@@ -96,11 +80,12 @@
       }
 
       .notification__author {
+        font-size: 0.8em;
         opacity: 0.66;
-        margin-top: 0;
+        margin: 0;
       }
 
-      .notification__title {
+      .notification__board {
         font-size: 0.8em;
         font-weight: normal;
         margin-bottom: 0;
@@ -109,6 +94,19 @@
         text-transform: uppercase;
       }
 
+      .notification__details {
+        margin-bottom: 0;
+        margin-top: 0;
+      }
+
+      .notificaton__mention {
+        background-color: #f8e3ab;
+        border-radius: 0.7em 0.2em 0.7em 0.2em;
+        color: inherit;
+        display: inline-flex;
+        padding: 0.1em 0.3em;
+      }
+
       .margin-block-end-double {
         margin-bottom: 2em;
       }

app/views/mailers/notification/bundle_mailer/_header.html.erb

@@ -1 +0,0 @@
-<h2 class="notification__title">#<%= notification.card.id %> | <%= notification.card.board.name  %> | <%= notification.creator.name %></h2>

app/views/mailers/notification/bundle_mailer/_header.text.erb

@@ -1 +0,0 @@
-#<%= notification.card.id %> | <%= notification.card.board.name %> | <%= notification.creator.name %>

app/views/mailers/notification/bundle_mailer/_notification.html.erb

@@ -1,10 +1,4 @@
 <table class="notification">
-  <tr>
-    <td>&nbsp;</td>
-    <td>
-      <%= render "notification/bundle_mailer/header", notification: notification %>
-    </td>
-  </tr>
   <tr>
     <td class="avatar__container">
       <%= mail_avatar_tag(notification.creator) %>

app/views/mailers/notification/bundle_mailer/_notification.text.erb

@@ -1,5 +1,2 @@
-================================================================================
-
-<%= render "notification/bundle_mailer/header", notification: notification %>
 <%= render "notification/bundle_mailer/#{notification.source_type.underscore}/body", notification: notification %>
 

app/views/mailers/notification/bundle_mailer/event/_body.html.erb

@@ -1,9 +1,8 @@
 <% event = notification.source %>
 
-<h3 class="event__title">
-  <%= link_to event_notification_title(event), notification.source %>
-</h3>
-
-<p class="event__details">
+<p class="notification__author">
+  <%= notification.creator.familiar_name %>
+</p>
+<p class="notification__details">
   <%= event_notification_body(event) %>
 </p>

app/views/mailers/notification/bundle_mailer/event/_body.text.erb

@@ -1,7 +1,5 @@
 <% event = notification.source %>
 
-<%= event_notification_title(event) %>
-
+<%= notification.creator.name %>:
 <%= event_notification_body(event).squish %>
-
-<%= url_for notification %>
+<%= url_for notification %>

app/views/mailers/notification/bundle_mailer/mention/_body.html.erb

@@ -1,9 +1,8 @@
 <% mention = notification.source %>
 
-<h3 class="event__title">
-  <%= link_to "#{mention.mentioner.first_name} mentioned you", mention %>
-</h3>
-
-<p class="event__details">
+<strong class="notificaton__mention">
+  <%= "#{mention.mentioner.first_name} mentioned you:" %>
+</strong>
+<p class="notification__details">
   <%= mention.source.mentionable_content.truncate(250) %>
 </p>

app/views/mailers/notification/bundle_mailer/mention/_body.text.erb

@@ -1,7 +1,5 @@
 <% mention = notification.source %>
 
-<%= mention.mentioner.first_name %> mentioned you.
-
+<%= mention.mentioner.first_name %> mentioned you:
 <%= mention.source.mentionable_content.truncate(250) %>
-
-<%= url_for mention %>
+<%= url_for mention %>

app/views/mailers/notification/bundle_mailer/notification.html.erb

@@ -2,7 +2,13 @@
   <td>
     <h1 class="title">Everything since <%= @bundle.starts_at.strftime("%-l%P on %A, %B %-d") %></h1>
     <p class="subtitle margin-block-end-double">You have <%= link_to pluralize(@notifications.count, "new notification"), notifications_url %>.</p>
-    <%= render partial: "notification/bundle_mailer/notification", collection: @notifications, as: :notification %>
+
+    <% @notifications.group_by(&:card).each do |card, notifications| %>
+      <h2 class="notification__board"><%= card.board.name %></h2>
+      <%= link_to "##{ card.id } #{ card.title }", card, class: "card__title" %>
+      <%= render partial: "notification/bundle_mailer/notification", collection: notifications, as: :notification %>
+    <% end %>
+
     <p class="footer">Fizzy emails you about new notifications every few hours. <br>
       <%= link_to "Change how often you get these", notifications_settings_url %>
       or <%= link_to "unsubscribe from all email notifications", new_notifications_unsubscribe_url(access_token: @unsubscribe_token) %>.

app/views/mailers/notification/bundle_mailer/notification.text.erb

@@ -1,7 +1,17 @@
 Everything since <%= @bundle.starts_at.strftime("%-l%P on %A, %B %-d") %>
 You have <%= pluralize @notifications.count, "new notification" %>.
 
-<%= render partial: "notification/bundle_mailer/notification", collection: @notifications, as: :notification %>
+<% @notifications.group_by(&:card).each do |card, notifications| %>
+--------------------------------------------------------------------------------
+
+<%= card.board.name %>
+<%= "##{ card.id } #{ card.title }" %>
+
+--------------------------------------------------------------------------------
+
+<%= render partial: "notification/bundle_mailer/notification", collection: notifications, as: :notification %>
+<% end %>
+
 --------------------------------------------------------------------------------
 
 Fizzy emails you about new notifications every few hours.