|
3 | 3 | <div class="card card-border bg-base-100 shadow-xs"> |
4 | 4 | <div class="card-body"> |
5 | 5 | <details {% if user.is_applicant or not co_applicants %} open {% endif %} class="group"> |
6 | | - <summary class="flex gap-4 justify-between items-center list-none"> |
| 6 | + <summary class="flex gap-4 justify-between items-center mb-2 list-none"> |
7 | 7 | <h2 class="card-title"> |
8 | | - {% trans "Co-applicants" %} <span class="text-base font-medium">({{ co_applicants.count }})</span> |
| 8 | + {% trans "Co-applicants" %} <span class="text-xs text-fg-muted">({{ co_applicants.count }})</span> |
9 | 9 | {% heroicon_solid "chevron-down" size="16" class="w-4 h-4 transition-transform rotate-90 group-open:rotate-0" %} |
10 | 10 | </h2> |
11 | 11 | <button |
12 | | - class="btn btn-sm btn-ghost" |
13 | | - {% if object.co_applicant_invites.count >= invite_max_limit %}disabled{% endif %} |
| 12 | + role="button" |
| 13 | + class="btn btn-sm btn-soft btn-secondary" |
14 | 14 | hx-get="{% url 'apply:submissions:invite_co_applicant' pk=object.id %}" |
15 | 15 | hx-target="#htmx-modal" |
16 | | - {% if object.co_applicant_invites.count >= invite_max_limit %}disabled title='{% trans "Max limit reached" %}'{% endif %} |
17 | | - role="button" |
18 | | - aria-label="{% trans "Invite co-applicant" %}" |
| 16 | + {% if object.co_applicant_invites.count >= invite_max_limit %} |
| 17 | + disabled |
| 18 | + title='{% trans "Max limit reached" %}' |
| 19 | + {% else %} |
| 20 | + title='{% trans "Invite co-applicant" %}' |
| 21 | + aria-label="{% trans "Invite co-applicant" %}" |
| 22 | + {% endif %} |
19 | 23 | > |
20 | | - {% heroicon_micro "plus" stroke_width=5 aria_hidden=true %} |
21 | 24 | {% trans "Invite" %} |
22 | 25 | </button> |
23 | 26 | </summary> |
24 | 27 |
|
25 | | - {% if co_applicants %} |
26 | | - <div class="flex flex-col gap-2 justify-between"> |
27 | | - {% for invite in co_applicants %} |
28 | | - <div> |
29 | | - <a |
30 | | - class="font-bold line-clamp-2 group/coapplicant" |
31 | | - href="{% url 'apply:submissions:edit_co_applicant' invite_pk=invite.id %}" |
32 | | - hx-get="{% url 'apply:submissions:edit_co_applicant' invite_pk=invite.id %}" |
33 | | - hx-target="#htmx-modal" |
34 | | - > |
35 | | - <div class="flex justify-between"> |
36 | | - {% if invite.status == "accepted" %} |
37 | | - {{ invite.co_applicant.user }} |
38 | | - {% else %} |
39 | | - {{ invite.invited_user_email }} |
40 | | - {% endif %} |
| 28 | + <div class="list"> |
| 29 | + {% for invite in co_applicants %} |
| 30 | + <div class="list-row list-row-card"> |
| 31 | + <div class="min-w-0 list-col-grow"> |
| 32 | + <div class="font-medium truncate"> |
| 33 | + {% if invite.status == "accepted" %} |
| 34 | + {{ invite.co_applicant.user }} |
| 35 | + {% else %} |
| 36 | + {{ invite.invited_user_email }} |
| 37 | + {% endif %} |
| 38 | + </div> |
41 | 39 |
|
42 | | - {% heroicon_solid "pencil" class="hidden align-middle me-1 group-hover/coapplicant:inline" width=16 height=16 stroke_width=2 aria_hidden=true %} |
43 | | - </div> |
44 | | - </a> |
45 | | - {% if invite.status == "accepted" %} |
46 | | - <div class="text-xs text-fg-muted" >{{ invite.co_applicant.get_role_display }}</div> |
47 | | - {% else %} |
48 | | - <div class="text-xs text-fg-muted" >{{ invite.get_status_display }}</div> |
49 | | - {% endif %} |
| 40 | + <div class="label"> |
| 41 | + {% if invite.status != "accepted" %} |
| 42 | + {{ invite.get_role_display }} |
| 43 | + · |
| 44 | + {{ invite.get_status_display }} |
| 45 | + {% else %} |
| 46 | + {{ invite.co_applicant.get_role_display }} |
| 47 | + {% endif %} |
| 48 | + </div> |
50 | 49 | </div> |
51 | 50 |
|
52 | | - {% endfor %} |
53 | | - </div> |
54 | | - {% else %} |
55 | | - <div> |
56 | | - {% trans "No co-applicants yet." %} |
57 | | - </div> |
58 | | - {% endif %} |
| 51 | + <a |
| 52 | + href="{% url 'apply:submissions:edit_co_applicant' invite_pk=invite.id %}" |
| 53 | + hx-get="{% url 'apply:submissions:edit_co_applicant' invite_pk=invite.id %}" |
| 54 | + hx-target="#htmx-modal" |
| 55 | + > |
| 56 | + <div class="btn btn-sm btn-square btn-ghost"> |
| 57 | + {% heroicon_mini "pencil-square" stroke_width=2 aria_hidden=true %} |
| 58 | + </div> |
| 59 | + </a> |
| 60 | + </div> |
| 61 | + {% empty %} |
| 62 | + <div class="list-row list-row-card"> |
| 63 | + {% trans "No co-applicants yet." %} |
| 64 | + </div> |
| 65 | + {% endfor %} |
| 66 | + </div> |
59 | 67 | </details> |
60 | 68 | </div> |
61 | 69 | </div> |
0 commit comments