Files
fizzy/app/views/bubbles/show.html.erb
T
Jason Zimdars f09d8e3684 Fix overflows
2025-02-05 17:23:27 -06:00

100 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 "Projects", root_path %>
<%= link_to "Activity", events_path %>
</div>
<h1 class="txt-large txt-align-center min-width flex align-center gap-half">
<span class="overflow-ellipsis">
<%= link_to @bucket.name, bubbles_path(bucket_ids: [ @bucket ]) %>
</span>
<span class="flex-item-no-shrink">▸</span>
<strong class="overflow-ellipsis"><%= @page_title %></strong>
</h1>
</header>
</nav>
<% end %>
<aside class="flex align-start justify-end" 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">
<%= image_tag "picture-add.svg", aria: { hidden: true }, size: 24 %>
<span>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>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">
<%= image_tag "picture-double.svg", aria: { hidden: true }, size: 24 %>
<span>I've seen this</span>
</button>
<% end %>
<%= button_to bucket_bubble_path(@bubble.bucket, @bubble),
method: :delete,
class: "btn full-width justify-start borderless",
data: { turbo_confirm: "Are you sure you want to delete this bubble?" } do %>
<%= image_tag "trash.svg", aria: { hidden: true }, size: 24 %>
<span>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-start">
<%= turbo_frame_tag dom_id(@bubble, :stage_picker), src: new_bucket_bubble_stage_picker_path(@bubble.bucket, @bubble) %>
</div>
<%= render "notifications/tray" %>