52 lines
2.4 KiB
Plaintext
52 lines
2.4 KiB
Plaintext
<% content_for :header do %>
|
|
<nav>
|
|
<%= button_to session_path, method: :delete, class: "btn", form_class: "flex-item-justify-start" do %>
|
|
<%= image_tag "logout.svg", aria: { hidden: true }, size: 24 %>
|
|
<span class="for-screen-reader">Sign out</span>
|
|
<% end %>
|
|
|
|
<h1 class="txt-xx-large margin-none flex align-center gap-half">
|
|
Bubbled up
|
|
|
|
<% if @category %>
|
|
in <%= @category.title %>
|
|
|
|
<%= link_to splats_path, class: "btn txt-small" do %>
|
|
<%= image_tag "remove.svg", aria: { hidden: true }, size: 24 %>
|
|
<span class="for-screen-reader">Clear</span>
|
|
<% end %>
|
|
<% end %>
|
|
</h1>
|
|
|
|
<%= link_to new_splat_path, class: "btn btn--plain flex-item-justify-end" do %>
|
|
<%= image_tag "bubble-add.svg", aria: { hidden: true }, size: 24 %>
|
|
<span class="for-screen-reader">Create a new splat</span>
|
|
<% end %>
|
|
</nav>
|
|
<% end %>
|
|
|
|
<section class="windshield flex-inline flex-wrap gap-half justify-center align-end">
|
|
<%= render @splats.last(10) %>
|
|
</section>
|
|
|
|
<section class="splats-list unpad-inline center margin-block-start">
|
|
<ul class="unpad margin-none flex flex-column txt-align-start center">
|
|
<% @splats.each do | splat | %>
|
|
<li class="flex align-center gap margin-none">
|
|
<div class="splat" style="--splat-color: <%= splat.color %>; --splat-size: 2cqi; <%= splat_rotation(splat) %>">
|
|
<svg class="splat__svg" style="fill: <%= splat.color %>;" viewBox="0 0 990 990" xmlns="http://www.w3.org/2000/svg"><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>
|
|
</div>
|
|
<%= link_to splat, class: "splat__title-link flex align-center gap flex-item-grow" do %>
|
|
<strong><%= splat.title %></strong>
|
|
<% end %>
|
|
<small class="flex align-center gap flex-item-no-shrink">
|
|
<% splat.categories.each do |category| %>
|
|
<%= link_to "# #{ category.title }", splats_path(category_id: category.id), style: "color: #{ splat.color }" %>
|
|
<% end %>
|
|
<time class="txt-nowrap flex-item-justify-end"><%= splat.created_at.strftime("%b %d").html_safe %></time>
|
|
</small>
|
|
</li>
|
|
<% end %>
|
|
</ul>
|
|
</section>
|