Merge branch 'rebrand-ui' of https://github.com/frappe/frappe into rebrand-ui
This commit is contained in:
commit
ebfc609bff
5 changed files with 53 additions and 63 deletions
|
|
@ -143,7 +143,9 @@ frappe.ui.form.Review = class Review {
|
|||
review_logs.forEach(log => {
|
||||
let review_pill = $(`
|
||||
<li class="review ${log.points < 0 ? 'criticism': 'appreciation'}">
|
||||
${log.points > 0 ? '+': ''}${log.points}
|
||||
<div>
|
||||
${Math.abs(log.points)}
|
||||
</div>
|
||||
</li>
|
||||
`);
|
||||
review_pill.insertBefore(this.add_review_button_wrapper);
|
||||
|
|
|
|||
|
|
@ -11,44 +11,22 @@ frappe.ui.form.Share = Class.extend({
|
|||
this.render_sidebar();
|
||||
},
|
||||
render_sidebar: function() {
|
||||
var me = this;
|
||||
this.parent.empty();
|
||||
const shared = this.shared || this.frm.get_docinfo().shared;
|
||||
const shared_users = shared.filter(Boolean).map(s => s.user);
|
||||
|
||||
var shared = this.shared || this.frm.get_docinfo().shared;
|
||||
shared = shared.filter(function(d) { return d });
|
||||
var users = [];
|
||||
for (var i=0, l=shared.length; i < l; i++) {
|
||||
var s = shared[i];
|
||||
|
||||
if (s.everyone) {
|
||||
users.push({
|
||||
icon: "octicon octicon-megaphone text-muted",
|
||||
avatar_class: "avatar-empty share-doc-btn shared-with-everyone",
|
||||
title: __("Shared with everyone")
|
||||
});
|
||||
} else {
|
||||
var user_info = frappe.user_info(s.user);
|
||||
users.push({
|
||||
image: user_info.image,
|
||||
fullname: user_info.fullname,
|
||||
abbr: user_info.abbr,
|
||||
color: user_info.color,
|
||||
title: __("Shared with {0}", [user_info.fullname])
|
||||
});
|
||||
}
|
||||
// REDESIGN-TODO: handle "shared with everyone"
|
||||
this.parent.append(frappe.avatar_group(shared_users, 5, null, 'left'));
|
||||
if (!this.frm.is_new()) {
|
||||
this.parent.append(`
|
||||
<div class="share-doc-btn cursor-pointer" title="${__('Share')}">
|
||||
${frappe.utils.icon('add')}
|
||||
</div>
|
||||
`);
|
||||
}
|
||||
|
||||
if (!me.frm.doc.__islocal) {
|
||||
users.push({
|
||||
icon: "octicon octicon-plus text-muted",
|
||||
avatar_class: "avatar-empty share-doc-btn",
|
||||
title: __("Share")
|
||||
});
|
||||
}
|
||||
|
||||
this.parent.append(frappe.render_template("users_in_sidebar", {"users": users}));
|
||||
this.parent.find(".avatar").on("click", function() {
|
||||
me.frm.share_doc();
|
||||
this.parent.find(".avatar").on("click", () => {
|
||||
this.frm.share_doc();
|
||||
});
|
||||
},
|
||||
show: function() {
|
||||
|
|
|
|||
|
|
@ -45,22 +45,21 @@ frappe.avatar = function (user, css_class, title, image_url = null) {
|
|||
}
|
||||
};
|
||||
|
||||
frappe.avatar_group = function(users, limit=4, css_class="avatar avatar-small") {
|
||||
frappe.avatar_group = function(users, limit=4, css_class="avatar avatar-small", align='right') {
|
||||
let extra_count = users.length - limit;
|
||||
let html = users.slice(0, limit).map((user) => frappe.avatar(user, css_class)).join('')
|
||||
let html = users.slice(0, limit).map((user) => frappe.avatar(user, css_class)).join('');
|
||||
if (extra_count > 0) {
|
||||
return `<div class="avatar-group small">
|
||||
html = `
|
||||
<span class="avatar avatar avatar-small">
|
||||
<div class="avatar-frame standard-image avatar-extra-count">
|
||||
+${extra_count}
|
||||
</div>
|
||||
</span>
|
||||
${html}
|
||||
</div>`;
|
||||
} else {
|
||||
return `<div class="avatar-group">${html}</div>`;
|
||||
`;
|
||||
}
|
||||
}
|
||||
return `<div class="avatar-group ${align}">${html}</div>`;
|
||||
};
|
||||
|
||||
frappe.ui.scroll = function(element, animate, additional_offset) {
|
||||
var header_offset = $(".navbar").height() + $(".page-head").height();
|
||||
|
|
|
|||
|
|
@ -84,7 +84,7 @@
|
|||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: var(--blue-50) !important;
|
||||
background-color: var(--blue-50);
|
||||
color: var(--blue-500);
|
||||
font-weight: normal;
|
||||
}
|
||||
|
|
@ -93,18 +93,30 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: row-reverse;
|
||||
&.right {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
&.left {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
position: relative;
|
||||
|
||||
.avatar-frame {
|
||||
border: 2px solid $white;
|
||||
border: 1px solid $white;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
.avatar-extra-count {
|
||||
font-size: var(--text-md);
|
||||
font-weight: 500;
|
||||
color: $white;
|
||||
background-color: var(--blue-500);
|
||||
}
|
||||
|
||||
.avatar+.avatar {
|
||||
margin-right: -0.3rem;
|
||||
|
|
|
|||
|
|
@ -424,20 +424,18 @@ body[data-route^="Module"] .main-menu {
|
|||
}
|
||||
|
||||
.form-reviews {
|
||||
// REDESIGN-TODO: Refactor
|
||||
.review {
|
||||
display: inline-block;
|
||||
display: inline-flex;
|
||||
font-weight: 500;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border-radius: 50%;
|
||||
margin-bottom: var(--margin-sm);
|
||||
margin-right: var(--margin-sm);
|
||||
vertical-align: middle;
|
||||
justify-content: center;
|
||||
font-size: var(--text-xs);
|
||||
height: 34px;
|
||||
width: 34px;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
padding: var(--padding-xs);
|
||||
padding-top: 8px;
|
||||
align-items: center;
|
||||
margin-bottom: var(--margin-xs);
|
||||
margin-right: var(--margin-xs);
|
||||
&.appreciation {
|
||||
background-color: var(--dark-green-100);
|
||||
color: var(--dark-green-600);
|
||||
|
|
@ -450,15 +448,16 @@ body[data-route^="Module"] .main-menu {
|
|||
li:last-child {
|
||||
display: inline-block;
|
||||
}
|
||||
.add-review-btn {
|
||||
height: 28px;
|
||||
width: 28px;
|
||||
border-radius: var(--border-radius);
|
||||
border: 1px dashed var(--gray-300);
|
||||
background: var(--gray-50);
|
||||
text-align: center;
|
||||
padding: 3px;
|
||||
}
|
||||
}
|
||||
|
||||
.add-review-btn, .share-doc-btn {
|
||||
height: 28px;
|
||||
width: 28px;
|
||||
border-radius: var(--border-radius);
|
||||
border: 1px dashed var(--gray-300);
|
||||
background: var(--gray-50);
|
||||
text-align: center;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
.review-popover {
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue