Skip to content

Commit 878ca57

Browse files
committed
update, better link, fixes
1 parent d9cd6ed commit 878ca57

10 files changed

Lines changed: 155 additions & 102 deletions

File tree

hypha/apply/funds/templates/funds/includes/review_sidebar.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -36,16 +36,16 @@
3636
{% include 'funds/includes/review_sidebar_item.html' with reviewer=reviewer hidden=True %}
3737

3838
{% if forloop.last %}
39-
<li>
40-
<a
39+
<li class="list-row">
40+
<button
4141
role="button"
42-
class="mt-2 text-sm font-semibold link"
42+
class="text-sm font-semibold link link-muted"
4343
@click.prevent="showHiddenReviewers = !showHiddenReviewers"
4444
href="#"
4545
>
4646
<span x-show="!showHiddenReviewers">{% trans "Show more..." %}</span>
4747
<span x-cloak x-show="showHiddenReviewers">{% trans "Show less..." %}</span>
48-
</a>
48+
</button>
4949
</li>
5050
{% endif %}
5151
{% else %}

hypha/apply/funds/templates/funds/includes/review_sidebar_item.html

Lines changed: 77 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -4,75 +4,90 @@
44
class="reviews-sidebar__item list-row {% if not reviewer.review %}text-base-content/80 {% endif %}"
55
{% if hidden and not reviewer.review %}x-cloak x-show="showHiddenReviewers" x-transition.opacity{% endif %}
66
>
7-
{% if not reviewer.review or reviewer.review.is_draft %}
8-
<div class="reviews-sidebar__name">
9-
<span>
10-
{% if HIDE_STAFF_IDENTITY and not request.user.is_org_faculty and not request.user == reviewer.reviewer %}
11-
{% trans "Reviewer" %}
12-
{% else %}
13-
{{ reviewer }}
14-
{% endif %}
15-
</span>
16-
{% if reviewer.role and reviewer.role.icon %}{% image reviewer.role.icon max-12x12 %}{% endif %}
17-
</div>
18-
<div>-</div>
19-
<div>-</div>
20-
{% else %}
21-
{% if request.user == reviewer.reviewer or request.user.is_reviewer and reviewer.review.reviewer_visibility or request.user.is_community_reviewer and reviewer.review.reviewer_visibility or request.user.is_apply_staff %}
22-
<div>
23-
<a href="{% url 'apply:submissions:reviews:review' submission_pk=reviewer.submission.id pk=reviewer.review.id %}">
24-
<div class="reviews-sidebar__name">
25-
<span>
26-
{% if HIDE_STAFF_IDENTITY and not request.user.is_org_faculty and not request.user == reviewer.reviewer %}
27-
{% trans "Reviewer" %}
28-
{% else %}
29-
{{ reviewer }}
30-
{% endif %}
31-
</span>
32-
{% if reviewer.role %}{% image reviewer.role.icon max-12x12 %}{% endif %}
33-
</div>
34-
</a>
35-
<relative-time datetime="{{ reviewer.review.created_at|date:'c' }}" class="text-xs">
36-
{{ reviewer.review.created_at|date:'SHORT_DATETIME_FORMAT' }}
37-
</relative-time>
38-
</div>
39-
{% else %}
40-
<div class="reviews-sidebar__name">
7+
<div class="grid grid-cols-6 col-span-2 w-full">
8+
{% if not reviewer.review or reviewer.review.is_draft %}
9+
<div class="col-span-4 reviews-sidebar__name">
4110
<span>
4211
{% if HIDE_STAFF_IDENTITY and not request.user.is_org_faculty and not request.user == reviewer.reviewer %}
4312
{% trans "Reviewer" %}
4413
{% else %}
4514
{{ reviewer }}
4615
{% endif %}
4716
</span>
48-
{% if reviewer.role %}{% image reviewer.role.icon max-12x12 %}{% endif %}
17+
{% if reviewer.role and reviewer.role.icon %}{% image reviewer.role.icon max-12x12 %}{% endif %}
4918
</div>
19+
<div>-</div>
20+
<div>-</div>
21+
{% else %}
22+
{% if request.user == reviewer.reviewer or request.user.is_reviewer and reviewer.review.reviewer_visibility or request.user.is_community_reviewer and reviewer.review.reviewer_visibility or request.user.is_apply_staff %}
23+
<div class="col-span-4">
24+
<a href="{% url 'apply:submissions:reviews:review' submission_pk=reviewer.submission.id pk=reviewer.review.id %}">
25+
<div class="reviews-sidebar__name">
26+
<span>
27+
{% if HIDE_STAFF_IDENTITY and not request.user.is_org_faculty and not request.user == reviewer.reviewer %}
28+
{% trans "Reviewer" %}
29+
{% else %}
30+
{{ reviewer }}
31+
{% endif %}
32+
</span>
33+
{% if reviewer.role %}{% image reviewer.role.icon max-12x12 %}{% endif %}
34+
</div>
35+
</a>
36+
<relative-time datetime="{{ reviewer.review.created_at|date:'c' }}" class="text-xs">
37+
{{ reviewer.review.created_at|date:'SHORT_DATETIME_FORMAT' }}
38+
</relative-time>
39+
</div>
40+
{% else %}
41+
<div class="col-span-4 reviews-sidebar__name">
42+
<span>
43+
{% if HIDE_STAFF_IDENTITY and not request.user.is_org_faculty and not request.user == reviewer.reviewer %}
44+
{% trans "Reviewer" %}
45+
{% else %}
46+
{{ reviewer }}
47+
{% endif %}
48+
</span>
49+
{% if reviewer.role %}{% image reviewer.role.icon max-12x12 %}{% endif %}
50+
</div>
51+
{% endif %}
52+
{% with reviewer.review.get_recommendation_display as recommendation and reviewer.review.get_score_display as score %}
53+
<div class="{{ recommendation|slugify }}">{{ recommendation }}</div>
54+
<div class="{{ recommendation|slugify }}">{{ score }}</div>
55+
{% endwith %}
5056
{% endif %}
51-
{% with reviewer.review.get_recommendation_display as recommendation and reviewer.review.get_score_display as score %}
52-
<div class="{{ recommendation|slugify }}">{{ recommendation }}</div>
53-
<div class="{{ recommendation|slugify }}">{{ score }}</div>
54-
{% endwith %}
55-
{% endif %}
56-
</li>
57+
</div>
5758

58-
{% for opinion in reviewer.review.opinions.all %}
59-
{% if forloop.first %}
60-
<ul class="reviews-sidebar__decision">
61-
{% endif %}
62-
<li class="reviews-sidebar__item reviews-sidebar__item--decision">
63-
<div class="reviews-sidebar__name">
64-
<span>{{ opinion.author }}</span>
65-
{% with role=opinion.author.role %}
66-
{% if role %}{% image role.icon max-12x12 %}{% endif %}
67-
{% endwith %}
68-
</div>
69-
<div></div>
70-
<div class="reviews-sidebar__outcome {{ opinion.get_opinion_display|slugify }}">{{ opinion.get_opinion_display}}</div>
71-
<div class="text-center"><a href="{% url 'apply:submissions:reviews:delete_opinion' submission_pk=opinion.review.submission.id pk=opinion.id %}">
72-
{% heroicon_outline "trash" aria_hidden="true" size=14 class="inline align-middle stroke-red-800" %}</a>
73-
</div>
74-
</li>
75-
{% if forloop.last %}
76-
</ul>
77-
{% endif %}
78-
{% endfor %}
59+
{% for opinion in reviewer.review.opinions.all %}
60+
{% if forloop.first %}
61+
<div class="list-col-wrap">
62+
<ul class="steps steps-vertical">
63+
{% endif %}
64+
<!-- <ul class="steps steps-vertical">
65+
<li class="step step-primary">Register</li>
66+
<li class="step step-primary">Choose plan</li>
67+
<li class="step">Purchase</li>
68+
<li class="step">Receive Product</li>
69+
</ul> -->
70+
71+
<li class="step">
72+
<div class="flex gap-2">
73+
<span>
74+
{{ opinion.author }}
75+
{% with role=opinion.author.role %}
76+
{% if role %}{% image role.icon max-12x12 %}{% endif %}
77+
{% endwith %}
78+
</span>
79+
<div class="reviews-sidebar__outcome {{ opinion.get_opinion_display|slugify }}">
80+
{{ opinion.get_opinion_display }}
81+
</div>
82+
<div class="text-center">
83+
<a href="{% url 'apply:submissions:reviews:delete_opinion' submission_pk=opinion.review.submission.id pk=opinion.id %}">
84+
{% heroicon_outline "trash" aria_hidden="true" size=14 class="inline align-middle stroke-red-800" %}</a>
85+
</div>
86+
</div>
87+
</li>
88+
{% if forloop.last %}
89+
</ul>
90+
</div>
91+
{% endif %}
92+
{% endfor %}
93+
</li>

hypha/apply/funds/templates/funds/includes/submission-list-row.html

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@
7979
hx-target="#main"
8080
hx-push-url="true"
8181
hx-swap="outerHTML transition:true"
82-
class="hover:underline text-inherit"
82+
class="link link-muted text-inherit"
8383
>{{ s.user }}</a>{% endif %} • {{ s.stage }} •
8484

8585

@@ -92,7 +92,7 @@
9292
hx-target="#main"
9393
hx-push-url="true"
9494
hx-swap="outerHTML transition:true"
95-
class="hover:underline text-inherit"
95+
class="link link-muted text-inherit"
9696
>{{ s.round }}</a>
9797

9898
{% if 'fund' not in SUBMISSIONS_TABLE_EXCLUDED_FIELDS %}
@@ -102,7 +102,7 @@
102102
hx-target="#main"
103103
hx-push-url="true"
104104
hx-swap="outerHTML transition:true"
105-
class="hover:underline text-inherit"
105+
class="link link-muted text-inherit"
106106
>{{ s.page }}</a>)
107107
{% endif %}
108108
{% else %}
@@ -114,14 +114,14 @@
114114
hx-target="#main"
115115
hx-push-url="true"
116116
hx-swap="outerHTML transition:true"
117-
class="hover:underline text-inherit"
117+
class="link link-muted text-inherit"
118118
>
119119
{{ s.page }}</a>
120120
{% endif %}
121121
{% endif %}
122122

123123
{% if s.project %}
124-
<a href="{% url "funds:submissions:project" s.id %}" class="hover:underline text-inherit">{% trans "Project" %}</a>
124+
<a href="{% url "funds:submissions:project" s.id %}" class="link link-muted text-inherit">{% trans "Project" %}</a>
125125
{% endif %}
126126
</p>
127127
</div>
@@ -145,7 +145,7 @@
145145
hx-target="#main"
146146
hx-push-url="true"
147147
hx-swap="outerHTML transition:true"
148-
class="hover:underline text-inherit"
148+
class="link link-muted text-inherit"
149149
>
150150
{{ s.lead }}
151151
</a>

hypha/apply/funds/templates/funds/includes/submission-table-row.html

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@
5050
submitted <relative-time datetime="{{ s.submit_time|date:"c" }}">{{ s.submit_time|date:"SHORT_DATE_FORMAT" }}</relative-time>
5151
• {{ s.stage }}
5252
{% if s.project %}
53-
<a href="{% url "funds:submissions:project" s.id %}" class="hover:underline text-inherit">{% trans "Project" %}</a>
53+
<a href="{% url "funds:submissions:project" s.id %}" class="link link-muted text-inherit">{% trans "Project" %}</a>
5454
{% endif %}
5555
</div>
5656
</td>
@@ -74,7 +74,7 @@
7474
hx-target="#main"
7575
hx-push-url="true"
7676
hx-swap="outerHTML transition:true"
77-
class="hover:underline text-inherit"
77+
class="link link-muted text-inherit"
7878
>
7979
{{ s.user }}
8080
</a>
@@ -94,7 +94,7 @@
9494
hx-target="#main"
9595
hx-push-url="true"
9696
hx-swap="outerHTML transition:true"
97-
class="hover:underline text-inherit"
97+
class="link link-muted text-inherit"
9898
>{{ s.round }}</a>
9999
{% if 'fund' not in SUBMISSIONS_TABLE_EXCLUDED_FIELDS %}
100100
<span class="text-xs text-fg-muted"> / {{ s.page }}</span>
@@ -106,7 +106,7 @@
106106
hx-target="#main"
107107
hx-push-url="true"
108108
hx-swap="outerHTML transition:true"
109-
class="hover:underline text-inherit"
109+
class="link link-muted text-inherit"
110110
>
111111
{{ s.page }}
112112
</a>
@@ -122,7 +122,7 @@
122122
hx-target="#main"
123123
hx-push-url="true"
124124
hx-swap="outerHTML transition:true"
125-
class="hover:underline text-inherit"
125+
class="link link-muted text-inherit"
126126
>{{ s.lead }}</a>
127127
</td>
128128
{% endif %}

hypha/apply/funds/templates/funds/rounds.html

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@
1111
subtitle="{% trans 'Explore current and past rounds' %}"
1212
/>
1313
</c-hero>
14-
</c-hero>
1514
{% endblock %}
1615

1716

hypha/apply/projects/templates/application_projects/invoice_detail.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -105,7 +105,7 @@ <h2 class="card-title">{% trans "Supporting Documents" %}</h2>
105105
data-testid="sidebar-primary-actions"
106106
>
107107
{% include "application_projects/partials/invoice_detail_actions.html" %}
108-
</c-->
108+
</section>
109109
</aside>
110110
</div>
111111
{% endblock %}

hypha/apply/projects/templates/application_projects/partials/invoice_status.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818
{% heroicon_outline "exclamation-circle" stroke_width=2 size=22 class="inline stroke-red-500" aria_hidden=true %}
1919
<a
2020
href="{{ latest_activity_comment.get_absolute_url }}"
21-
class="font-bold"
21+
class="link"
2222
>{% trans "View comment" %}</a>
2323
{% endif %}
2424
</p>
Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
.link {
2+
--link-color: color-mix(in oklab, var(--color-base-content) 80%, #0000);
3+
@apply inline-block font-medium;
4+
color: var(--link-color);
5+
&:hover {
6+
color: color-mix(in oklab, var(--link-color) 80%, #000);
7+
}
8+
&:focus {
9+
@apply outline-none;
10+
}
11+
&:focus-visible {
12+
outline: 2px solid currentColor;
13+
outline-offset: 2px;
14+
}
15+
&.disabled,
16+
&[disabled],
17+
&:disabled {
18+
@apply pointer-events-none opacity-50;
19+
}
20+
}
21+
22+
.link:where(.link-muted) {
23+
@apply no-underline text-fg-muted [@media(hover:hover)]:hover:text-primary transition-colors;
24+
}
25+
26+
.link:where(.link-animated) {
27+
@apply relative no-underline before:pointer-events-none before:absolute before:start-0 before:bottom-0 before:h-px before:w-full before:bg-current before:transition-transform before:duration-300 before:ease-in-out before:content-[''];
28+
}
29+
30+
.link:where(.link-animated)::before {
31+
transform-origin: 100% 50%;
32+
transform: scale3d(0, 1, 1);
33+
}
34+
35+
.link:where(.link-animated):hover::before {
36+
transform-origin: 0% 50%;
37+
transform: scale3d(1, 1, 1);
38+
}
39+
40+
.link-expand-x {
41+
text-decoration-line: none;
42+
43+
&::after {
44+
content: "";
45+
display: block;
46+
margin-top: 0.25rem;
47+
width: 100%;
48+
border-bottom: solid var(--link-expand-border-width, 4px)
49+
var(--color-primary);
50+
transform: scaleX(0);
51+
transition: transform 250ms ease-in-out;
52+
}
53+
54+
&:hover::after,
55+
&.link-active::after {
56+
transform: scaleX(1);
57+
}
58+
}

hypha/static_src/tailwind/main.css

Lines changed: 2 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,11 @@
55
@import "./components/choices.css" layer(components);
66
@import "./components/daterangepicker.css" layer(components);
77
@import "./components/django-file-field.css" layer(components);
8+
@import "./components/link.css" layer(components);
89
@import "./components/nprogress";
910

1011
@plugin '@tailwindcss/typography';
11-
@plugin 'daisyui' {
12+
@plugin "daisyui" {
1213
}
1314

1415
@theme {
@@ -102,26 +103,6 @@
102103
@apply gap-3;
103104
}
104105

105-
@utility link-expand-x {
106-
text-decoration-line: none;
107-
108-
&::after {
109-
content: "";
110-
display: block;
111-
margin-top: 0.25rem;
112-
width: 100%;
113-
border-bottom: solid var(--link-expand-border-width, 4px)
114-
var(--color-primary);
115-
transform: scaleX(0);
116-
transition: transform 250ms ease-in-out;
117-
}
118-
119-
&:hover::after,
120-
&.link-active::after {
121-
transform: scaleX(1);
122-
}
123-
}
124-
125106
.separator-dot:not(:last-child)::after {
126107
@apply text-fg-muted mx-1;
127108
content: "\00B7"; /* Unicode for middle dot */

0 commit comments

Comments
 (0)