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

Merge branch 'main' into activity-score

Browse Source 
* main:
  Missed one
  Tighten up workflow panel
  Fix test
  Forget about the dividing line for now
  Add some structure to buckets index
  Adjust form
  Restore bucket settings link, adjust styles for filters
  No need for inline svg here anymore
This commit is contained in:
Jose Farias
2024-11-19 13:38:39 -06:00
parent 9ac136bace 4eaa414ebb
commit df746e5a64
9 changed files with 35 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/assets/images/menu-dots-horizontal.svg
+1
View File
@@ -0,0 +1 @@
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><circle cx="3.25" cy="12" r="3.25"/><circle cx="12" cy="12" r="3.25"/><circle cx="20.75" cy="12" r="3.25"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 173 B

app/helpers/workflows_helper.rb
+1 -1
View File
@@ -1,6 +1,6 @@
module WorkflowsHelper
def link_to_stage_picker(bubble, workflow)
link_to workflow.name, new_bucket_bubble_stage_picker_path(bubble.bucket, bubble, workflow_id: workflow), class: "filter__button"
link_to workflow.name, new_bucket_bubble_stage_picker_path(bubble.bucket, bubble, workflow_id: workflow), class: "btn full-width justify-start borderless workflow-stage"
end
def button_to_set_stage(bubble, stage)
app/models/filter/summarized.rb
+7 -7
View File
@@ -9,18 +9,18 @@ module Filter::Summarized
private
def index_summary
"<mark>#{indexed_by.humanize}</mark>"
indexed_by.humanize
end
def tag_summary
if tags.any?
"tagged <mark>#{tags.map(&:hashtag).to_choice_sentence}</mark>"
"tagged #{tags.map(&:hashtag).to_choice_sentence}"
end
end
def assignee_summary
if assignees.any?
"assigned to <mark>#{assignees.pluck(:name).to_choice_sentence}</mark>"
"assigned to #{assignees.pluck(:name).to_choice_sentence}"
elsif assignments.unassigned?
"assigned to no one"
end
@@ -28,21 +28,21 @@ module Filter::Summarized
def assigner_summary
if assigners.any?
"assigned by <mark>#{assigners.pluck(:name).to_choice_sentence}</mark>"
"assigned by #{assigners.pluck(:name).to_choice_sentence}"
end
end
def bucket_summary
if buckets.any?
"in <mark>#{buckets.pluck(:name).to_choice_sentence}</mark>"
"in #{buckets.pluck(:name).to_choice_sentence}"
else
"in <mark>all projects</mark>"
"in all projects"
end
end
def terms_summary
if terms.any?
"matching <mark>#{terms.map { |term| %Q("#{term}") }.to_sentence}</mark>"
"matching #{terms.map { |term| %Q("#{term}") }.to_sentence}"
end
end
end
app/views/bubbles/stage_pickers/new.html.erb
+6 -6
View File
@@ -1,14 +1,13 @@
<%= turbo_frame_tag dom_id(@bubble, :stage_picker) do %>
<% if @selected_workflow %>
<aside class="position-relative" style="--bubble-color: <%= @bubble.color %>"
<aside class="position-relative border pad border-radius" style="--bubble-color: <%= @bubble.color %>"
data-controller="dialog" data-action="keydown.esc->dialog#close click@document->dialog#closeOnClickOutside">
<div class="flex flex-column">
<button class="btn center" data-action="click->dialog#toggle" data-dialog-modal-value="true">
<div class="flex align-center justify-start gap-half">
<button class="btn txt-small" data-action="click->dialog#toggle" data-dialog-modal-value="true">
<%= image_tag "bolt.svg", aria: { hidden: true }, size: 24 %>
<span class="for-screen-reader">Choose a workflow</span>
</button>
<strong class="txt-large center"><%= @selected_workflow.name %></strong>
<hr class="separator--horizontal full-width" hidden />
<strong class="txt-large"><%= @selected_workflow.name %></strong>
</div>
<dialog class="workflow__popup panel fill-white shadow" data-dialog-target="dialog">
@@ -19,7 +18,8 @@
</menu>
</dialog>
<div class="workflow border pad border-radius margin-block-start-half">
<div class="workflow margin-block-start-half">
<hr class="separator--horizontal" aria-hidden="true" style="--border-color: var(--color-subtle)" />
<div class="flex flex-column gap-half">
<% @selected_workflow.stages.each do |stage| %>
<%= button_to_set_stage @bubble, stage %>
app/views/buckets/_bucket.html.erb
+8 -6
View File
@@ -1,13 +1,10 @@
<% cache bucket do %>
<li class="bucket flex flex-column txt-align-center max-width position-relative">
<%= link_to bubbles_path(bucket_ids: [ bucket ]), class: "windshield__container flex justify-center align-center position-relative" do %>
<%= link_to bubbles_path(bucket_ids: [ bucket ]), class: "border border-radius margin-block-end-half windshield__container flex justify-center align-center position-relative" do %>
<div class="windshield bucket__windshield flex flex-wrap gap justify-center align-end" style="view-transition-name: windshield_<%= bucket.id %>">
<% bucket.bubbles.ordered_by_activity.limit(10).each do |bubble| %>
<div class="bubble" style="--bubble-color: <%= bubble.color %>; <%= bubble_rotation(bubble) %> <%= bubble_size(bubble) %>">
<svg class="bubble__svg" style="fill: <%= bubble.color %>; stroke: <%= 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>
<span class="bubble__shape"></span>
</div>
<% end %>
</div>
@@ -15,7 +12,12 @@
<div class="flex align-center justify-center flex-column flex-wrap center gap-half">
<%= link_to bubbles_path(bucket_ids: [ bucket ]), class: "txt-ink flex flex-column" do %>
<strong class="txt-x-large">In <%= bucket.name %></strong>
<strong class="txt-x-large"><%= bucket.name %></strong>
<% end %>
<%= link_to edit_bucket_path(bucket), class: "btn txt-small" do %>
<%= image_tag "settings.svg", aria: { hidden: true }, size: 24 %>
<span class="for-screen-reader">Settings for <%= bucket.name %></span>
<% end %>
</div>
</li>
app/views/buckets/edit.html.erb
+2 -4
View File
@@ -7,8 +7,8 @@
<span class="for-screen-reader">Go back</span>
<% end %>
<%= form_with model: @bucket, class: "flex align-center gap-half", method: :delete do |form| %>
<%= form.button class: "btn btn--negative txt-small min-width", data: { turbo_confirm: "Are you sure you want to delete this?" } do %>
<%= form_with model: @bucket, class: "flex-item-justify-end", method: :delete do |form| %>
<%= form.button class: "btn btn--negative", data: { turbo_confirm: "Are you sure you want to delete this?" } do %>
<%= image_tag "minus.svg", aria: { hidden: true }, size: 24 %>
<span class="for-screen-reader">Delete <%= @bucket.name %></span>
<% end %>
@@ -18,8 +18,6 @@
<div class="panel shadow center" style="--panel-size: 55ch;">
<%= form_with model: @bucket, class: "flex flex-column gap txt-large", controller: "form" do |form| %>
<%= image_tag "bubbles.svg", aria: { hidden: "true" }, size: 150, class: "colorize--black center" %>
<div class="flex align-center gap">
<%= translation_button(:bucket_name) %>
app/views/buckets/index.html.erb
+5 -3
View File
@@ -14,7 +14,9 @@
</nav>
<% end %>
<menu class="buckets margin-none unpad align-center justify-center flex flex-wrap gap">
<%= render @filters %>
<div class="buckets margin-block-double unpad align-start justify-center flex flex-wrap gap">
<%= render @buckets, cached: true %>
</menu>
</div>
<div class="buckets margin-block-double unpad align-start justify-center flex flex-wrap gap">
<%= render @filters %>
</div>
app/views/filters/_filter.html.erb
+4 -7
View File
@@ -1,13 +1,10 @@
<% cache_if filter.cacheable?, filter do %>
<li class="bucket flex flex-column txt-align-center max-width position-relative">
<%= link_to bubbles_path(**filter.to_params), class: "windshield__container flex justify-center align-center position-relative" do %>
<%= link_to bubbles_path(**filter.to_params), class: "border border-radius margin-block-end-half windshield__container flex justify-center align-center position-relative" do %>
<div class="windshield bucket__windshield flex flex-wrap gap justify-center align-end" style="view-transition-name: windshield_<%= filter.id %>">
<% filter.bubbles.ordered_by_activity.limit(10).each do |bubble| %>
<div class="bubble" style="--bubble-color: <%= bubble.color %>; <%= bubble_rotation(bubble) %> <%= bubble_size(bubble) %>">
<svg class="bubble__svg" style="fill: <%= bubble.color %>; stroke: <%= 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>
<span class="bubble__shape"></span>
</div>
<% end %>
</div>
@@ -15,9 +12,9 @@
<div class="flex align-center justify-center flex-column flex-wrap center gap-half">
<%= link_to bubbles_path(**filter.to_params), class: "txt-ink flex flex-column" do %>
<strong class="txt-x-large"><%= filter.summary.html_safe %></strong>
<strong class="txt-large"><%= filter.summary %></strong>
<% end %>
<%= button_to filter_path(filter), method: :delete, class: "btn btn--negative", data: { turbo_confirm: "Are you sure you want to delete this filter?" } do %>
<%= button_to filter_path(filter), method: :delete, class: "btn txt-small btn--negative", data: { turbo_confirm: "Are you sure you want to delete this filter?" } do %>
<%= image_tag "minus.svg", aria: { hidden: true }, size: 24 %>
<span class="for-screen-reader">Delete</span>
<% end %>
test/models/filter_test.rb
+1 -1
View File
@@ -93,7 +93,7 @@ class FilterTest < ActiveSupport::TestCase
end
test "summary" do
assert_equal "<mark>Most discussed</mark>, tagged <mark>#Mobile</mark>, and assigned to <mark>JZ</mark> in <mark>all projects</mark>", filters(:jz_assignments).summary
assert_equal "Most discussed, tagged #Mobile, and assigned to JZ in all projects", filters(:jz_assignments).summary
end
test "plain summary" do