Files
fizzy/app/views/bubbles/_bubble.html.erb
T
2024-09-04 14:54:11 -04:00

35 lines
1.8 KiB
Plaintext

<div class="bubble" style="view-transition-name: bubble-<%= bubble.id -%>; --bubble-color: <%= bubble.color %>; --bubble-rotate: <%= bubble_rotation(bubble) -%>deg; <%= bubble_size(bubble) %>">
<h1 class="bubble__title"><%= bubble.title %></h1>
<svg class="bubble__svg" viewBox="0 0 990 990" xmlns="http://www.w3.org/2000/svg" transform="rotate(<%= bubble_rotation(bubble) -%>)"><path d="m0 0h990v990h-990z" fill="none" stroke="none" /><path d="m391.65 879.47c-110.52-15.95-212.21-91.86-255.92-191.23-66.78-143.65-41.62-347.61 48.08-481.17 368.33-516.3 1252.97 520.2 451.03 660.78-44.07 8.84-88.98 13.49-133.01 15.68-36.69 2-73.37 1.91-109.99-4.03z"/></svg>
<%= link_to bubble, class: "bubble__link" do %>
<span class="for-screen-reader"><%= bubble.title %></span>
<% end %>
<% if bubble.image.attached? %>
<div class="bubble__image">
<%= image_tag bubble.image %>
</div>
<% end %>
<time class="bubble__bubble bubble__meta bubble__date"><%= bubble.created_at.strftime("%b <br> %d").html_safe %></time>
<% bubble.categories.each do | category | %>
<%= link_to "##{category.title}", bubbles_path(category_id: category.id), class: "bubble__bubble bubble__meta bubble__category" %>
<% end %>
<% if bubble.categories.count < 3 %>
<span class="bubble__bubble bubble__meta bubble__category">
<turbo-frame id="new_category">
<%= link_to "#", new_bubble_category_path(bubble), class: "bubble__category--new" %>
</turbo-frame>
</span>
<% end %>
<%= tag.div class: "bubble__bubble bubble__meta bubble__boosts",
data: { controller: "animation toggle-class", animation_play_class: "boosting", toggle_class_toggle_class: "boosting", action: "animationend->toggle-class#toggle" } do %>
<turbo-frame id="<%= dom_id(bubble, "boosts") %>" src="<%= bubble_boosts_path(bubble) %>" />
<% end %>
</div>