fix: Sidebar - Review wrapping

This commit is contained in:
Suraj Shetty 2020-12-02 14:51:30 +05:30
parent f827c8587d
commit 97301445e3
3 changed files with 19 additions and 20 deletions

View file

@ -9,7 +9,7 @@ frappe.ui.form.Review = class Review {
this.frm = frm;
this.points = frappe.boot.points;
this.reviews = this.parent.find('.reviews');
this.add_review_button();
this.setup_add_review_button();
this.update_reviewers();
}
update_points() {
@ -20,8 +20,8 @@ frappe.ui.form.Review = class Review {
this.points = data;
});
}
add_review_button() {
const review_button = this.parent.find('.add-review-btn');
setup_add_review_button() {
const review_button = this.reviews.find('.add-review-btn');
if (!this.points.review_points) {
review_button.click(false);
@ -129,16 +129,16 @@ frappe.ui.form.Review = class Review {
const review_logs = this.frm.get_docinfo().energy_point_logs
.filter(log => ['Appreciation', 'Criticism'].includes(log.type));
this.reviews.empty();
this.reviews.find('.review').remove();
review_logs.forEach(log => {
let review_pill = $(`
<li class="review ${log.points < 0 ? 'criticism' : 'appreciation'}">
<div class="review ${log.points < 0 ? 'criticism' : 'appreciation'}">
<div>
${Math.abs(log.points)}
</div>
</li>
</div>
`);
this.reviews.append(review_pill);
this.reviews.prepend(review_pill);
this.setup_detail_popover(review_pill, log);
});
}

View file

@ -89,9 +89,8 @@
<svg class="icon icon-sm"><use href="#icon-review"></use></svg>
{%= __("Reviews") %}
</li>
<li class="reviews"></li>
<li class="add-review-btn">
<button class="text-muted btn btn-default icon-btn">
<li class="reviews">
<button class="add-review-btn text-muted btn btn-default icon-btn">
<svg class="icon icon-sm"><use href="#icon-add"></use></svg>
</button>
</li>
@ -101,15 +100,10 @@
<svg class="icon icon-sm"><use href="#icon-share"></use></svg>
{%= __("Shared With") %}
</li>
<li class="shares"></li>
<li class="share-doc-btn">
<button class="data-pill btn">
<span class="pill-label ellipsis">
{%= __("Share") %}
</span>
<svg class="icon icon-sm">
<use href="#icon-add"></use>
</svg>
<li class="flex flex-wrap">
<span class="shares"></span>
<button class="share-doc-btn text-muted btn btn-default icon-btn">
<svg class="icon icon-sm"><use href="#icon-add"></use></svg>
</button>
</li>
</ul>

View file

@ -397,11 +397,16 @@ body[data-route^="Module"] .main-menu {
max-width: 100%;
}
.reviews, .form-tag-row {
.form-tag-row {
margin-right: var(--margin-xs);
display: inline-flex;
}
.reviews {
display: flex;
flex-wrap: wrap;
}
button.data-pill {
.icon {
margin-left: var(--margin-xs);