<%= link_to event.notifiable_target,
class: "event event--#{ event.action } panel center center-block flex-inline align-start justify-start gap position-relative",
style: "--card-color: #{ card.color }; background-color: color-mix(in srgb, var(--card-color) 10%, var(--color-canvas));
color: color-mix(in srgb, var(--card-color) 40%, var(--color-ink));",
data: { related_element_target: "related",
related_element_group_value: card.id,
action: "mouseover->related-element#highlight mouseout->related-element#unhighlight" } do %>
<%= avatar_image_tag(event.creator) %>
<%= event_action_sentence(event) %>
<% if event_column(event) == 2 %>
<%= icon_tag event_action_icon(event) %>
<% end %>
<%= yield %>
<%= event.collection.name %>
<% end %>