Jeffrey Hardy
52 lines
2.3 KiB
Plaintext
52 lines
2.3 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 @tag %>
|
|
in <%= @tag.title %>
|
|
|
|
<%= link_to bubbles_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_bubble_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 bubble</span>
|
|
<% end %>
|
|
</nav>
|
|
<% end %>
|
|
|
|
<section class="windshield flex-inline flex-wrap gap-half justify-center align-end">
|
|
<%= render @bubbles.last(10) %>
|
|
</section>
|
|
|
|
<section class="bubbles-list unpad-inline center margin-block-start">
|
|
<ul class="unpad margin-none flex flex-column txt-align-start center">
|
|
<% @bubbles.each do | bubble | %>
|
|
<li class="flex align-center gap margin-none">
|
|
<div class="bubble" style="--bubble-color: <%= bubble.color %>; --bubble-size: 2cqi; <%= bubble_rotation(bubble) %>">
|
|
<svg class="bubble__svg" style="fill: <%= bubble.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 bubble, class: "bubble__title-link flex align-center gap flex-item-grow" do %>
|
|
<strong><%= bubble.title %></strong>
|
|
<% end %>
|
|
<small class="flex align-center gap flex-item-no-shrink">
|
|
<% bubble.tags.each do |tag| %>
|
|
<%= link_to "##{tag.title}", bubbles_path(tag_id: tag.id), style: "color: #{ bubble.color }" %>
|
|
<% end %>
|
|
<time class="txt-nowrap flex-item-justify-end"><%= bubble.created_at.strftime("%b %d").html_safe %></time>
|
|
</small>
|
|
</li>
|
|
<% end %>
|
|
</ul>
|
|
</section>
|