mobilizon/lib/web/templates/email/participation/event_card.html.heex

<%= if @event.picture do %>
  <!-- event image -->
  <%= render("participation/card/_picture.html", event: @event) %>
  <!-- event image end -->
<% end %>
<%= render("participation/card/_title.html", event: @event) %>
<%= render("participation/card/_metadata.html", event: @event, timezone: @timezone, locale: @locale, action: @action) %>
<%= case @action do %>
  <% "participation" -> %>
  <div class="event__content_attend" style="vertical-align: middle; margin: 0; padding: 0; border: 0;">
    <table class="button btn-attend event__content_position" style="border-spacing: 0; border-collapse: collapse; vertical-align: baseline; text-align: left; width: auto; margin: 0; padding: 0; border: 0;">
      <tbody style="vertical-align: baseline; margin: 0; padding: 0; border: 0;">
        <tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
          <td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 20px 0 0; border: 0;" valign="baseline" align="left">
            <table style="border-spacing: 0; border-collapse: collapse; vertical-align: baseline; text-align: left; margin: 0; padding: 0; border: 0;">
              <tbody style="vertical-align: baseline; margin: 0; padding: 0; border: 0;">
                <tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
                  <td style="word-wrap: break-word; border-collapse: collapse; color: rgb(255,255,255); font-family: Helvetica,Arial,sans-serif; font-weight: 500; line-height: 1.3; font-size: 16px; border-radius: 4px; margin: 0; padding: 0px; border: none;" valign="middle" bgcolor="3C376E" align="center">
                    <a href={Routes.page_url(Mobilizon.Web.Endpoint, :event, @event.uuid)} style="color: rgb(255,255,255); font-family: Helvetica,Arial,sans-serif; text-align: left; line-height: 14px; text-decoration: none; vertical-align: baseline; font-size: 20px; display: inline-block; border: 1px solid #3C376E; border-radius: 15px; white-space: nowrap; margin: 0; padding: 15px 25px; border: none;" target="_blank">
                      <%= gettext("Manage your participation") %>
                    </a>
                  </td>
                </tr>
              </tbody>
            </table>
          </td>
        </tr>
      </tbody>
    </table>
  </div>
  <% "event" -> %>
  <div class="event__content_attend" style="vertical-align: middle; margin: 0; padding: 0; border: 0;">
    <table class="button btn-attend event__content_position" style="border-spacing: 0; border-collapse: collapse; vertical-align: baseline; text-align: left; width: auto; margin: 0; padding: 0; border: 0;">
      <tbody style="vertical-align: baseline; margin: 0; padding: 0; border: 0;">
        <tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
          <td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 20px 0 0; border: 0;" valign="baseline" align="left">
            <table style="border-spacing: 0; border-collapse: collapse; vertical-align: baseline; text-align: left; margin: 0; padding: 0; border: 0;">
              <tbody style="vertical-align: baseline; margin: 0; padding: 0; border: 0;">
                <tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
                  <td style="word-wrap: break-word; border-collapse: collapse; color: rgb(255,255,255); font-family: Helvetica,Arial,sans-serif; font-weight: 500; line-height: 1.3; font-size: 16px; border-radius: 4px; margin: 0; padding: 0px; border: none;" valign="middle" bgcolor="3C376E" align="center">
                    <a href={Routes.page_url(Mobilizon.Web.Endpoint, :event, @event.uuid)} style="color: rgb(255,255,255); font-family: Helvetica,Arial,sans-serif; text-align: left; line-height: 14px; text-decoration: none; vertical-align: baseline; font-size: 20px; display: inline-block; border: 1px solid #3C376E; border-radius: 15px; white-space: nowrap; margin: 0; padding: 15px 25px; border: none;" target="_blank">
                      <%= gettext("Participate") %>
                    </a>
                  </td>
                </tr>
              </tbody>
            </table>
          </td>
        </tr>
      </tbody>
    </table>
  </div>
  <% nil -> %>
<% end %>
<%= if @event.description && @action != nil do %>
  <div class="event-working" style="vertical-align: baseline; margin: 0 0 0 10px; padding: 7.5px 0 15px; border: 0;">
    <p style="color: rgb(46,62,72); font-family: Helvetica,Arial,sans-serif; font-weight: 700; line-height: 1.5; font-size: 16px; vertical-align: baseline; margin: 0; padding: 0 0 7.5px; border: 0;" align="left">
      <%= gettext("Details") %>
    </p>
    <p class="event-working__detail" style="color: rgb(87,100,108); font-family: Helvetica,Arial,sans-serif; font-weight: 300; line-height: 1.5; font-size: 16px; vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
      <%= process_description(@event.description) %>
    </p>
    <%= if String.length(@event.description) > 200 do %>
      <p style="color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
        <a href={Routes.page_url(Mobilizon.Web.Endpoint, :event, @event.uuid)} style="color: rgb(254,56,89); font-family: Helvetica,Arial,sans-serif; font-weight: 400; text-align: left; line-height: 1.5; text-decoration: none; vertical-align: baseline; font-size: 16px; margin: 0; padding: 0; border: 0;" target="_blank">
          <%= gettext("Read more") %>
        </a>
      </p>
    <% end %>
  </div>
<% end %>