Merge branch 'rebrand-ui' of https://github.com/frappe/frappe into rebrand-ui

This commit is contained in:
prssanna 2020-07-27 13:56:40 +05:30
commit ebfc609bff
5 changed files with 53 additions and 63 deletions

View file

@ -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);

View file

@ -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() {

View file

@ -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();

View file

@ -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;

View file

@ -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 {