bterkuile/fizzy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'main' into consolidate-cards

Browse Source 
* main:
  Show more of the summary before truncating
  Improve event summaries
  Add this for debugging empty event cards
  Some actions shouldn't be available to closed cards
  Nicer spacing when the large button isn't present
  Update `card-color` in a couple more places
  Don't show the engagement toggle on closed cards
  Show more of the summary before truncating
  Improve event summaries
  Remove shadows from notifications you can't see
  Add this for debugging empty event cards
  Some actions shouldn't be available to closed cards
  Nicer spacing when the large button isn't present
  Update `card-color` in a couple more places
  Don't show the engagement toggle on closed cards
This commit is contained in:
Andy Smith
2025-04-11 15:38:57 -05:00
parent d678ce1f60 384e159df9
commit 75a46356cc
9 changed files with 18 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/assets/stylesheets/events.css
+2
View File
@@ -118,6 +118,8 @@
}
.event__title {
--lines: 4;
font-size: 1.1em;
line-height: 1.2;
}
app/assets/stylesheets/trays.css
+4
View File
@@ -41,6 +41,10 @@
&:nth-child(5) { --position: 5; }
&:nth-child(6) { --position: 6; }
&:nth-child(n+7) .notification__content {
box-shadow: none !important;
}
.tray[open] & {
--offset: calc((100% + var(--block-space-half)) * (var(--position) * -1));
--scale: 1;
app/helpers/events_helper.rb
+4 -4
View File
@@ -71,7 +71,7 @@ module EventsHelper
"#{ event.creator == Current.user ? "You" : event.creator.name } assigned #{ event.assignees.pluck(:name).to_sentence } to <span style='color: var(--card-color)'>#{ card_title(event.card) }</span>".html_safe
end
when "unassigned"
"#{ event.creator == Current.user ? "You" : event.creator.name } unassigned #{ event.assignees.pluck(:name).to_sentence } from <span style='color: var(--card-color)'>#{ card_title(event.card) }</span>".html_safe
"#{ event.creator == Current.user ? "You" : event.creator.name } unassigned #{ event.assignees.include?(Current.user) ? "yourself" : event.assignees.pluck(:name).to_sentence } from <span style='color: var(--card-color)'>#{ card_title(event.card) }</span>".html_safe
when "boosted"
"#{ event.creator == Current.user ? "You" : event.creator.name } boosted <span style='color: var(--card-color)'>#{ card_title(event.card) }</span>".html_safe
when "commented"
@@ -81,9 +81,9 @@ module EventsHelper
when "closed"
"#{ event.creator == Current.user ? "You" : event.creator.name } closed <span style='color: var(--card-color)'>#{ card_title(event.card) }</span>".html_safe
when "staged"
"#{event.creator == Current.user ? "You" : event.creator.name} changed the stage to #{event.stage_name} on <span style='color: var(--card-color)'>#{ card_title(event.card) }</span>".html_safe
"#{event.creator == Current.user ? "You" : event.creator.name} moved <span style='color: var(--card-color)'>#{ card_title(event.card) }</span> to the #{event.stage_name} stage".html_safe
when "unstaged"
"#{event.creator == Current.user ? "You" : event.creator.name} removed <span style='color: var(--card-color)'>#{ card_title(event.card) }</span> from the #{event.stage_name} stage".html_safe
"#{event.creator == Current.user ? "You" : event.creator.name} moved <span style='color: var(--card-color)'>#{ card_title(event.card) }</span> out ofthe #{event.stage_name} stage".html_safe
when "due_date_added"
"#{event.creator == Current.user ? "You" : event.creator.name} set the date to #{event.particulars.dig('particulars', 'due_date').to_date.strftime('%B %-d')} on <span style='color: var(--card-color)'>#{ card_title(event.card) }</span>".html_safe
when "due_date_changed"
@@ -91,7 +91,7 @@ module EventsHelper
when "due_date_removed"
"#{event.creator == Current.user ? "You" : event.creator.name} removed the date on <span style='color: var(--card-color)'>#{ card_title(event.card) }</span>"
when "title_changed"
"#{event.creator == Current.user ? "You" : event.creator.name} renamed on <span style='color: var(--card-color)'>#{ card_title(event.card) }</span> (was: '#{event.particulars.dig('particulars', 'old_title')})'".html_safe
"#{event.creator == Current.user ? "You" : event.creator.name} renamed <span style='color: var(--card-color)'>#{ card_title(event.card) }</span> (was: '#{event.particulars.dig('particulars', 'old_title')})'".html_safe
end
end
app/views/cards/_closure_toggle.html.erb
+2 -2
View File
@@ -1,8 +1,8 @@
<div class="card-perma__cutout card-perma__cutout--bottom" style="--card-color: <%= @card.color %>">
<div class="card-perma__cutout card-perma__cutout--bottom" id="<%= dom_id(@card, :card_closure_toggle) %> style="--card-color: <%= @card.color %>">
<% if card.closed? %>
<span class="card-perma__closure-message">Completed by <%= card.closed_by.name %> on <%= local_datetime_tag(card.closed_at, style: :shortdate) %>.</span>
<%= button_to card_closure_path(card), method: :delete, class: "btn btn--plain borderless fill-transparent" do %>
<span>Un-do</span>
<span class="pad-inline-end">Un-do</span>
<% end %>
<% else %>
<details class="expander" data-controller="details" data-details-target="details" data-action="keydown.esc->details#close click@document->details#closeOnClickOutside">
app/views/cards/_image.html.erb
+1 -1
View File
@@ -3,7 +3,7 @@
<%= icon_tag "picture-remove" %>
<span class="for-screen-reader">Clear background image</span>
<% end %>
<% else %>
<% elsif !card.closed? %>
<%= form_with model: card, url: collection_card_path(card.collection, card), data: { controller: "form" } do |form| %>
<label class="btn">
<%= icon_tag "picture-add" %>
app/views/cards/display/common/_assignees.html.erb
+1 -1
View File
@@ -3,7 +3,7 @@
<%= avatar_tag assignee, class: "avatar" %>
<% end %>
<div class="position-relative" data-controller="dialog" data-action="keydown.esc->dialog#close click@document->dialog#closeOnClickOutside">
<div class="position-relative" data-controller="dialog" data-action="keydown.esc->dialog#close click@document->dialog#closeOnClickOutside" <%= "hidden" if card.closed? %>>
<button class="btn card__hide-on-index <%= card.creating? || card.drafted? ? "fill-highlight" : "fill-transparent" %>" data-action="click->dialog#open:stop">
<%= icon_tag "add" %>
<span class="for-screen-reader">Assign</span>
app/views/cards/display/perma/_tags.html.erb
+1 -1
View File
@@ -11,7 +11,7 @@
<% end %>
</div>
<div class="position-relative" data-controller="dialog" data-action="keydown.esc->dialog#close click@document->dialog#closeOnClickOutside">
<div class="position-relative" data-controller="dialog" data-action="keydown.esc->dialog#close click@document->dialog#closeOnClickOutside" <%= "hidden" if card.closed? %>>
<button class="tag-picker__button btn card__hide-on-index <%= card.creating? || card.drafted? ? "fill-highlight" : "fill-transparent" %>" data-action="click->dialog#open:stop">
<%= icon_tag "tag" %>
<span class="for-screen-reader">Add a tag</span>
app/views/cards/stagings/create.turbo_stream.erb
+2
View File
@@ -2,5 +2,7 @@
<%= render partial: "cards/stagings/stages", locals: { card: @card } %>
<% end %>
<%= turbo_stream.set_css_variable dom_id(@card, :card_closure_toggle), name: "--card-color", value: @card.color %>
<%= turbo_stream.set_css_variable dom_id(@card, :card_container), name: "--card-color", value: @card.color %>
<%= turbo_stream.set_css_variable dom_id(@card, :card_engagement_toggle), name: "--card-color", value: @card.color %>
<%= turbo_stream.set_css_variable dom_id(@card, :ticket), name: "--card-color", value: @card.color %>
app/views/events/_event.html.erb
+1 -1
View File
@@ -2,7 +2,7 @@
<% link = event.action == "commented" ? collection_card_path(card.collection, card, anchor: dom_id(event.comment)) : collection_card_path(card.collection, card) %>
<%= link_to link,
class: "event panel center center-block flex-inline align-start justify-start gap position-relative full-width",
class: "event event--#{ event.action } panel center center-block flex-inline align-start justify-start gap position-relative",
style: "--card-color: #{ card.color }; background-color: color-mix(in srgb, var(--card-color) 10%, var(--color-bg));
color: color-mix(in srgb, var(--card-color) 40%, var(--color-ink));",
data: { related_element_target: "related",