Merge branch 'rebrand-ui' of https://github.com/frappe/frappe into rebrand-ui
This commit is contained in:
commit
9bab8e9546
10 changed files with 86 additions and 32 deletions
|
|
@ -40,22 +40,36 @@ class BaseTimeline {
|
|||
this.timeline_items_wrapper.empty();
|
||||
this.timeline_items = [];
|
||||
this.doc_info = this.frm && this.frm.get_docinfo() || {};
|
||||
this.prepare_timeline_contents();
|
||||
|
||||
this.timeline_items.sort((item1, item2) => new Date(item1.creation) - new Date(item2.creation));
|
||||
this.timeline_items.forEach(this.add_timeline_item.bind(this));
|
||||
let response = this.prepare_timeline_contents();
|
||||
if (response instanceof Promise) {
|
||||
response.then(() => {
|
||||
this.timeline_items.sort((item1, item2) => new Date(item1.creation) - new Date(item2.creation));
|
||||
this.timeline_items.forEach(this.add_timeline_item.bind(this));
|
||||
});
|
||||
} else {
|
||||
this.timeline_items.sort((item1, item2) => new Date(item1.creation) - new Date(item2.creation));
|
||||
this.timeline_items.forEach(this.add_timeline_item.bind(this));
|
||||
}
|
||||
}
|
||||
|
||||
prepare_timeline_contents() {
|
||||
//
|
||||
}
|
||||
|
||||
add_timeline_item(item) {
|
||||
add_timeline_item(item, append_at_the_end=false) {
|
||||
let timeline_item = this.get_timeline_item(item);
|
||||
this.timeline_items_wrapper.prepend(timeline_item);
|
||||
if (append_at_the_end) {
|
||||
this.timeline_items_wrapper.append(timeline_item);
|
||||
} else {
|
||||
this.timeline_items_wrapper.prepend(timeline_item);
|
||||
}
|
||||
return timeline_item;
|
||||
}
|
||||
|
||||
add_timeline_items(items, append_at_the_end=false) {
|
||||
items.forEach((item) => this.add_timeline_item(item, append_at_the_end));
|
||||
}
|
||||
|
||||
get_timeline_item(item) {
|
||||
// item can have content*, creation*,
|
||||
// timeline_badge, icon, icon_size,
|
||||
|
|
|
|||
|
|
@ -211,10 +211,10 @@ frappe.ui.form.Toolbar = Class.extend({
|
|||
if (!this.frm.is_new() && !issingle) {
|
||||
this.page.add_action_icon("left", function() {
|
||||
me.frm.navigate_records(1);
|
||||
}, 'prev-doc');
|
||||
}, 'prev-doc', __("Previous Document"));
|
||||
this.page.add_action_icon("right", function() {
|
||||
me.frm.navigate_records(0);
|
||||
}, 'next-doc');
|
||||
}, 'next-doc', __("Next Document"));
|
||||
}
|
||||
|
||||
// Print
|
||||
|
|
@ -227,7 +227,7 @@ frappe.ui.form.Toolbar = Class.extend({
|
|||
}, true);
|
||||
this.print_icon = this.page.add_action_icon("printer", function() {
|
||||
me.frm.print_doc();
|
||||
});
|
||||
},'', __("Print"));
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -44,13 +44,17 @@ frappe.ui.Notifications = class Notifications {
|
|||
e.stopImmediatePropagation();
|
||||
this.dropdown.dropdown('hide');
|
||||
frappe.set_route('Form', 'Notification Settings', frappe.session.user);
|
||||
}).appendTo(this.header_actions);
|
||||
}).appendTo(this.header_actions)
|
||||
.attr('title', __("Notification Settings"))
|
||||
.tooltip();
|
||||
|
||||
$(`<span class="mark-all-read pull-right" data-action="mark_all_as_read">
|
||||
${frappe.utils.icon('mark-as-read')}
|
||||
</span>`)
|
||||
.on('click', (e) => this.mark_all_as_read(e))
|
||||
.appendTo(this.header_actions);
|
||||
.appendTo(this.header_actions)
|
||||
.attr('title', __("Mark all as read"))
|
||||
.tooltip();
|
||||
|
||||
this.categories = [
|
||||
{
|
||||
|
|
@ -193,6 +197,7 @@ class BaseNotificaitonsView {
|
|||
class NotificationsView extends BaseNotificaitonsView {
|
||||
make() {
|
||||
this.notifications_icon = this.parent.find('.notifications-icon');
|
||||
this.notifications_icon.attr("title", __('Notifications')).tooltip();
|
||||
|
||||
this.setup_notification_listeners();
|
||||
this.get_notifications_list(this.max_length).then(list => {
|
||||
|
|
@ -277,23 +282,23 @@ class NotificationsView extends BaseNotificaitonsView {
|
|||
${user_avatar}
|
||||
${message_html}
|
||||
</div>
|
||||
<div class="mark-as-read">
|
||||
<div class="mark-as-read" title="${__("Mark as Read")}">
|
||||
</div>
|
||||
</a>`);
|
||||
|
||||
item_html.find('.mark-as-read').on('click', (e) => {
|
||||
e.preventDefault();
|
||||
e.stopImmediatePropagation();
|
||||
if (!field.read) {
|
||||
if (!field.read) {
|
||||
let mark_btn = item_html.find(".mark-as-read")
|
||||
mark_btn.tooltip();
|
||||
mark_btn.on('click', (e) => {
|
||||
e.preventDefault();
|
||||
e.stopImmediatePropagation();
|
||||
this.mark_as_read(field.name, item_html);
|
||||
}
|
||||
});
|
||||
|
||||
item_html.on('click', (e) => {
|
||||
if (!field.read) {
|
||||
});
|
||||
|
||||
item_html.on('click', (e) => {
|
||||
this.mark_as_read(field.name, item_html);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
return item_html;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -144,6 +144,7 @@ frappe.ui.Page = Class.extend({
|
|||
|
||||
// keyboard shortcuts
|
||||
let menu_btn = this.menu_btn_group.find('button');
|
||||
menu_btn.attr("title", __("Menu")).tooltip();
|
||||
frappe.ui.keys
|
||||
.get_shortcut_group(this.page_actions[0])
|
||||
.add(menu_btn, menu_btn.find('.menu-btn-group-label'));
|
||||
|
|
@ -157,6 +158,7 @@ frappe.ui.Page = Class.extend({
|
|||
setup_sidebar_toggle() {
|
||||
let sidebar_toggle = $('.page-head').find('.sidebar-toggle-btn');
|
||||
let sidebar_wrapper = this.wrapper.find('.layout-side-section');
|
||||
sidebar_toggle.attr("title", __("Toggle Sidebar")).tooltip();
|
||||
if (sidebar_wrapper.length) {
|
||||
sidebar_toggle.click(() => sidebar_wrapper.toggle());
|
||||
} else {
|
||||
|
|
@ -168,12 +170,18 @@ frappe.ui.Page = Class.extend({
|
|||
this.clear_indicator().removeClass("hide").html(`<span>${label}</span>`).addClass(color);
|
||||
},
|
||||
|
||||
add_action_icon: function(icon, click, css_class='') {
|
||||
return $(`
|
||||
add_action_icon: function(icon, click, css_class='', tooltip_label) {
|
||||
const button = $(`
|
||||
<button class="text-muted btn btn-default ${css_class} icon-btn">
|
||||
${frappe.utils.icon(icon)}
|
||||
</button>
|
||||
`).appendTo(this.icon_group.removeClass("hide")).click(click);
|
||||
`)
|
||||
|
||||
button.appendTo(this.icon_group.removeClass("hide"));
|
||||
button.click(click);
|
||||
button.attr("title", __(tooltip_label || frappe.unscrub(icon))).tooltip();
|
||||
|
||||
return button
|
||||
},
|
||||
|
||||
clear_indicator: function() {
|
||||
|
|
|
|||
|
|
@ -648,7 +648,7 @@ frappe.views.QueryReport = class QueryReport extends frappe.views.BaseList {
|
|||
|
||||
render_summary(data) {
|
||||
data.forEach((summary) => {
|
||||
frappe.widget.utils.build_summary_item(summary).appendTo(this.$summary);
|
||||
frappe.utils.build_summary_item(summary).appendTo(this.$summary);
|
||||
})
|
||||
|
||||
this.$summary.show();
|
||||
|
|
|
|||
|
|
@ -83,7 +83,7 @@ export default class ChartWidget extends Widget {
|
|||
}
|
||||
|
||||
this.summary.forEach(summary => {
|
||||
frappe.widget.utils.build_summary_item(summary).appendTo(this.$summary);
|
||||
frappe.utils.build_summary_item(summary).appendTo(this.$summary);
|
||||
});
|
||||
this.summary.length && this.$summary.show();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -165,14 +165,18 @@
|
|||
--popover-bg: white;
|
||||
|
||||
// Background Text Color Pairs
|
||||
--bg-blue: var(--blue-50);
|
||||
--bg-blue: var(--blue-100);
|
||||
--bg-light-blue: var(--blue-50);
|
||||
--bg-green: var(--dark-green-50);
|
||||
--bg-yellow: var(--yellow-50);
|
||||
--bg-orange: var(--orange-50);
|
||||
--bg-red: var(--red-50);
|
||||
--bg-gray: var(--gray-200);
|
||||
--bg-light-gray: var(--gray-100);
|
||||
--bg-purple: var(--purple-100);
|
||||
|
||||
--text-on-blue: var(--blue-600);
|
||||
--text-on-light-blue: var(--blue-500);
|
||||
--text-on-blue: var(--blue-600);
|
||||
--text-on-green: var(--dark-green-500);
|
||||
--text-on-yellow: var(--yellow-500);
|
||||
|
|
@ -180,6 +184,7 @@
|
|||
--text-on-red: var(--red-500);
|
||||
--text-on-gray: var(--gray-600);
|
||||
--text-on-light-gray: var(--gray-800);
|
||||
--text-on-purple: var(--purple-500);
|
||||
|
||||
// Other Colors
|
||||
--sidebar-select-color: var(--gray-200);
|
||||
|
|
|
|||
|
|
@ -34,21 +34,25 @@
|
|||
--popover-bg: var(--bg-color);
|
||||
|
||||
// Background Text Color Pairs
|
||||
--bg-blue: var(--blue-500);
|
||||
--bg-blue: var(--blue-600);
|
||||
--bg-light-blue: var(--blue-400);
|
||||
--bg-green: var(--dark-green-500);
|
||||
--bg-yellow: var(--yellow-500);
|
||||
--bg-orange: var(--orange-500);
|
||||
--bg-red: var(--red-500);
|
||||
--bg-gray: var(--gray-600);
|
||||
--bg-light-gray: var(--gray-700);
|
||||
--bg-purple: var(--purple-600);
|
||||
|
||||
--text-on-blue: var(--blue-50);
|
||||
--text-on-light-blue: var(--blue-100);
|
||||
--text-on-green: var(--dark-green-50);
|
||||
--text-on-yellow: var(--yellow-50);
|
||||
--text-on-orange: var(--orange-100);
|
||||
--text-on-red: var(--red-50);
|
||||
--text-on-gray: var(--gray-300);
|
||||
--text-on-light-gray: var(--gray-100);
|
||||
--text-on-purple: var(--purple-100);
|
||||
|
||||
--sidebar-select-color: var(--gray-800);
|
||||
|
||||
|
|
|
|||
|
|
@ -117,7 +117,7 @@
|
|||
.indicator-pill.gray,
|
||||
.indicator-pill-right.gray,
|
||||
.indicator-pill-round.gray {
|
||||
@include indicator-pill-color('gray');
|
||||
@include indicator-pill-color('light-gray');
|
||||
}
|
||||
|
||||
.indicator.red {
|
||||
|
|
@ -130,6 +130,24 @@
|
|||
@include indicator-pill-color('red');
|
||||
}
|
||||
|
||||
.indicator-pill.darkgrey,
|
||||
.indicator-pill-right.darkgrey,
|
||||
.indicator-pill-round.darkgrey {
|
||||
@include indicator-pill-color('gray');
|
||||
}
|
||||
|
||||
.indicator-pill.purple,
|
||||
.indicator-pill-right.purple,
|
||||
.indicator-pill-round.purple {
|
||||
@include indicator-pill-color('purple');
|
||||
}
|
||||
|
||||
.indicator-pill.lightblue,
|
||||
.indicator-pill-right.lightblue,
|
||||
.indicator-pill-round.lightblue {
|
||||
@include indicator-pill-color('light-blue');
|
||||
}
|
||||
|
||||
.indicator.blink {
|
||||
animation: blink 1s linear infinite;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
:root {
|
||||
--kanban-column-bg: var(--gray-200);
|
||||
--kanban-column-bg: var(--gray-100);
|
||||
--kanban-card-bg: var(--card-bg);
|
||||
--kanban-card-hover-bg: var(--card-bg);
|
||||
--kanban-new-card-bg: var(--gray-200);
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue