Skip to content
Snippets Groups Projects
Unverified Commit 8315e58c authored by Todd Dembrey's avatar Todd Dembrey Committed by GitHub
Browse files

Merge pull request #1043 from OpenTechFund/feature/979-reviews-sidebar

Feature/979 reviews sidebar
parents 3219231c 9a085dc2
No related branches found
No related tags found
No related merge requests found
......@@ -13,11 +13,11 @@
{% endif %}
{% for review_data in reviews_block.role_reviewed %}
{% include 'funds/includes/review_sidebar_item.html' with review=review_data.review reviewer=review_data.reviewer role=review_data.role %}
{% include 'funds/includes/review_sidebar_item.html' with review=review_data.review reviewer=review_data.reviewer role=review_data.role opinions=review_data.opinions %}
{% endfor %}
{% for review_data in reviews_block.staff_reviewed %}
{% include 'funds/includes/review_sidebar_item.html' with review=review_data.review reviewer=review_data.reviewer %}
{% include 'funds/includes/review_sidebar_item.html' with review=review_data.review reviewer=review_data.reviewer opinions=review_data.opinions %}
{% endfor %}
{% for review_data in reviews_block.role_not_reviewed %}
......@@ -31,16 +31,14 @@
{% if object.stage.has_external_review %}
{% if reviews_block.external_reviewed or reviews_block.external_not_reviewed %}
<hr class="reviews-sidebar__split">
{% for review_data in reviews_block.external_reviewed %}
{% include 'funds/includes/review_sidebar_item.html' with review=review_data.review reviewer=review_data.reviewer %}
{% include 'funds/includes/review_sidebar_item.html' with review=review_data.review reviewer=review_data.reviewer opinions=review_data.opinions %}
{% endfor %}
{% for review_data in reviews_block.external_not_reviewed %}
{% include 'funds/includes/review_sidebar_item.html' with reviewer=review_data.reviewer missing=True class="is-hidden" %}
{% include 'funds/includes/review_sidebar_item.html' with reviewer=review_data.reviewer missing=True class="is-hidden" %}
{% endfor %}
<li><a class="link link--bold link--underlined js-toggle-reviewers" href="#">All Assigned Advisors</a></li>
{% endif %}
{% endif %}
</ul>
\ No newline at end of file
</ul>
......@@ -31,12 +31,18 @@
</li>
{% for opinion in review.opinions.all %}
<li class="reviews-sidebar__item {{ class }}">
<div class="reviews-sidebar__name">
<span>{{ opinion.author }}</span>
{% if opinion.get_author_assignment %}{% image opinion.get_author_assignment.icon max-12x12 %}{% endif %}
</div>
<div></div>
<div>{{ opinion.get_opinion_display }}</div>
</li>
{% endfor %}
\ No newline at end of file
{% if forloop.first %}
<ul class="reviews-sidebar__decision">
{% endif %}
<li class="reviews-sidebar__item reviews-sidebar__item--decision">
<div class="reviews-sidebar__name">
<span>{{ opinion.author }}</span>
{% if opinion.role %}{% image opinion.role.icon max-12x12 %}{% endif %}
</div>
<div></div>
<div class="reviews-sidebar__outcome {{ opinion.get_opinion_display|lower }}">{{ opinion.get_opinion_display}}</div>
</li>
{% if forloop.last %}
</ul>
{% endif %}
{% endfor %}
......@@ -3,7 +3,7 @@
'use strict';
// get all the reviewers that are missing
const reviewers = Array.prototype.slice.call($('.js-reviews-sidebar').find('tr.hidden.no-response'));
const reviewers = Array.prototype.slice.call($('.js-reviews-sidebar').find('.is-hidden.no-response'));
$('.js-toggle-reviewers').click(function (e) {
e.preventDefault();
......@@ -24,7 +24,7 @@
// show/hide the reviewers
function toggleReviewers(reviewers) {
reviewers.forEach(reviewer => {
$(reviewer).toggleClass('hidden');
$(reviewer).toggleClass('is-hidden');
});
}
......
// also used within the React app in /components/ReviewBlock
.reviews-sidebar {
$root: &;
margin-bottom: 20px;
font-weight: $weight--bold;
tbody {
tr {
border: 0;
&__decision {
position: relative;
font-size: 14px;
border-top: 1px solid $color--mid-grey;
border-bottom: 1px solid $color--mid-grey;
margin-bottom: 20px;
padding-top: 10px;
}
&:hover {
box-shadow: none;
}
&__item {
display: flex;
justify-content: space-between;
margin-bottom: 20px;
@include media-query(tablet-portrait) {
border-bottom: 0;
}
@supports(display: grid) {
display: grid;
grid-template-columns: 50% 25% 25%;
grid-gap: 5px;
}
> th {
font-size: inherit;
font-weight: $weight--bold;
}
&--decision {
margin-bottom: 10px;
font-weight: $weight--semibold;
> td {
display: table-cell;
height: auto;
}
&:first-child {
th,
td,
td:last-child,
td:first-child {
padding: 10px;
}
#{$root}__outcome {
&::before,
&::after {
position: absolute;
top: -23px;
left: 5px;
}
&:only-child {
> td {
padding: 0;
&::after {
@include triangle(top, $color--white, 8px);
top: -21px;
}
&::before {
@include triangle(top, $color--mid-grey, 8px);
}
}
}
}
&.no-response {
color: $color--black-20;
}
&--header {
background-color: $color--light-grey;
padding: 10px;
align-items: center;
}
}
&__author {
span {
position: relative;
z-index: 1;
display: block;
overflow: hidden;
text-overflow: ellipsis;
background: $color--white;
&.is-hidden {
display: none;
}
&:hover {
span {
display: inline;
overflow: visible;
}
&.no-response {
color: $color--black-20;
}
}
......@@ -69,4 +72,39 @@
&__no-reviews {
color: $color--mid-grey;
}
&__name {
position: relative;
z-index: 1;
display: flex;
align-items: center;
overflow: hidden;
text-overflow: ellipsis;
background: $color--white;
&:hover {
display: inline-flex;
overflow: visible;
}
img {
margin-left: 7px;
}
}
&__outcome {
position: relative;
&.agree {
color: $color--green;
}
&.disagree {
color: $color--tomato;
}
}
&__split {
margin-bottom: 20px;
}
}
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment