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

Display all the assignments

Browse Source
This commit is contained in:
Jason Zimdars
2024-09-18 11:38:40 -05:00
parent 5dc3d57b42
commit 7a8bbc2d6d
2 changed files with 46 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/assets/stylesheets/avatars.css
+36
View File
@@ -14,3 +14,39 @@
grid-area: 1/1;
}
}
.avatar__group {
--avatar-size: 2.5ch;
block-size: 5ch;
display: grid;
gap: 1px;
grid-template-columns: 1fr 1fr;
grid-template-rows: min-content;
inline-size: 5ch;
place-content: center;
.avatar {
margin: auto;
}
&:where(:has(> :last-child:nth-child(2))) {
--avatar-size: 3.5ch;
> :first-child {
margin-block-end: 1.5ch;
margin-inline-end: -0.75ch;
}
> :last-child {
margin-block-start: 1.5ch;
margin-inline-start: -0.75ch;
}
}
&:where(:has(> :last-child:nth-child(3))) {
> :last-child {
margin-inline: 1.25ch -1.25ch;
}
}
}
app/views/bubbles/_assignments.html.erb
+10 -2
View File
@@ -1,8 +1,16 @@
<span class="bubble__bubble bubble__meta bubble__assignee <%= "bubble__assignee--new" if bubble.assignees.none? %>">
<%= form_with model: [bubble, Assignment.new], data: { controller: "form" } do |form| %>
<label class="btn btn--plain position-relative" style="--btn-icon-size: 2em;">
<label class="btn btn--plain position-relative fill-transparent" style="--btn-icon-size: 2em;">
<% if bubble.assignees.any? %>
<figure class="avatar fill-black txt-reversed flex-item-no-shrink"><strong><%= bubble.assignees.first.initials %></strong></figure>
<% if bubble.assignees.many? %>
<div class="avatar__group">
<% bubble.assignees.each do |assignee| %>
<figure class="avatar fill-black txt-reversed flex-item-no-shrink"><strong><%= assignee.initials %></strong></figure>
<% end %>
</div>
<% else %>
<figure class="avatar fill-black txt-reversed flex-item-no-shrink"><strong><%= bubble.assignees.first.initials %></strong></figure>
<% end %>
<% else %>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 17 17" fill="var(--bubble-color)"><path d="m11.5 10.3-.6-.2c-.2-.5-.3-1.1-.1-1.6 1.1-1.2 1.6-2.7 1.5-4.3 0-2.4-1.6-4.2-3.8-4.2S4.7 1.8 4.7 4.2c-.1 1.5.4 3.1 1.5 4.3.2.5.2 1.1-.1 1.6l-.6.2c-2.4.9-4.2 1.5-4.8 2.6-.4 1.2-.7 2.4-.7 3.6 0 .3.2.5.5.5h16c.3 0 .5-.2.5-.5 0-1.2-.3-2.4-.7-3.5-.6-1.1-2.4-1.8-4.8-2.7"/></svg>
<% end %>