Files
fizzy/app/views/bubbles/show.html.erb
T
2025-02-06 16:45:16 -06:00

98 lines
4.4 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<% @page_title = @bubble.title %>
<% content_for :header do %>
<% if @bubble.drafted? %>
<div class="flex align-center gap-half fill-selected justify-center border-block margin-block-end"
style="--border-color: var(--color-selected-dark); --border-style: dashed; view-transition-name: draft-banner;">
This is a draft, its only visible to you.
<%= render "bubbles/publish", bubble: @bubble %>
</div>
<% end %>
<nav class="align-start max-width">
<header class="flex flex-column center max-width">
<div class="flex align-center gap justify-center">
<%= link_to "Collections", root_path %>
<%= link_to "Activity", events_path %>
</div>
<h1 class="txt-large txt-align-center min-width flex align-center gap-half margin-block-end">
<span class="overflow-ellipsis">
<%= link_to @bucket.name, bubbles_path(bucket_ids: [ @bucket ]) %>
</span>
</h1>
</header>
</nav>
<% end %>
<aside class="flex align-start justify-start max-width" style="--bubble-color: <%= @bubble.color %>">
<div class="flex flex-column" style="row-gap: 3px;">
<%= render "bubbles/color", bubble: @bubble %>
<%= form_with model: @bubble, url: bucket_bubble_path(@bubble.bucket, @bubble), data: { controller: "form" } do |form| %>
<label class="btn full-width justify-start borderless">
<%= image_tag "calendar-add.svg", aria: { hidden: true }, size: 24 %>
<span>Date</span>
<%= form.date_field :due_on, class: "input input--hidden", data: { action: "change->form#submit click->form#showPicker" } %>
</label>
<% end %>
<%= render "bubbles/sidebar/assignment", bubble: @bubble, users: @bucket.users.active %>
<%= render "bubbles/sidebar/tag", bubble: @bubble, tags: Current.account.tags %>
<% if @bubble.image.attached? %>
<%= button_to bucket_bubble_image_path(@bubble.bucket, @bubble), method: :delete, class: "btn full-width justify-start borderless" do %>
<%= image_tag "picture-add.svg", aria: { hidden: true }, size: 24 %>
<span>Clear background image</span>
<% end %>
<% else %>
<%= form_with model: @bubble, url: bucket_bubble_path(@bubble.bucket, @bubble), data: { controller: "form" } do |form| %>
<label class="btn full-width justify-start borderless min-width">
<%= image_tag "picture-add.svg", aria: { hidden: true }, size: 24 %>
<span class="overflow-ellipsis">Background</span>
<%= form.file_field :image, class: "input",
accept: "image/png, image/jpeg, image/jpg, image/webp",
data: { action: "upload-preview#previewImage form#submit", upload_preview_target: "input" },
hidden: true %>
</label>
<% end %>
<% end %>
<%= button_to bucket_bubble_boosts_path(@bubble.bucket, @bubble), class: "btn full-width justify-start borderless", data: { turbo_frame: dom_id(@bubble, :boosts) } do %>
<%= image_tag "thumb-up.svg", aria: { hidden: true }, size: 24 %>
<span class="overflow-ellipsis">Boost</span>
<% end %>
<hr class="separator--horizontal full-width" style="--border-color: var(--color-subtle);" />
<% unless @bubble.drafted? %>
<%= render "bubbles/pop_toggle", bubble: @bubble %>
<button class="btn full-width justify-start borderless min-width">
<%= image_tag "picture-double.svg", aria: { hidden: true }, size: 24 %>
<span class="overflow-ellipsis">Ive seen this</span>
</button>
<% end %>
<%= button_to bucket_bubble_path(@bubble.bucket, @bubble),
method: :delete,
class: "btn full-width justify-start borderless min-width",
data: { turbo_confirm: "Are you sure you want to delete this bubble?" } do %>
<%= image_tag "trash.svg", aria: { hidden: true }, size: 24 %>
<span class="overflow-ellipsis">Delete</span>
<% end %>
</div>
</aside>
<div class="bubble__container" data-controller="beacon" data-beacon-url-value="<%= bucket_bubble_readings_url(@bubble.bucket, @bubble) %>">
<div class="bubble__perma flex justify-center center">
<%= render "bubbles/bubble", bubble: @bubble, editing: params[:editing] %>
</div>
<%= render "bubbles/messages", bubble: @bubble %>
</div>
<div class="flex align-start justify-end">
<%= turbo_frame_tag dom_id(@bubble, :stage_picker), src: new_bucket_bubble_stage_picker_path(@bubble.bucket, @bubble) %>
</div>
<%= render "notifications/tray" %>