Merge pull request #22626 from maharshivpatel/fix-workspace-style

fix: workspace style
This commit is contained in:
Maharshi Patel 2023-10-05 10:28:24 +05:30 committed by GitHub
commit d83b6758dd
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 20 additions and 48 deletions

View file

@ -59,8 +59,6 @@ export default class Shortcut extends Block {
$(this.wrapper).find(".widget").addClass("shortcut edit-mode");
this.add_settings_button();
this.add_new_block_button();
} else {
$(this.wrapper).append($(`<div class="divider"></div>`));
}
return this.wrapper;
}

View file

@ -98,14 +98,9 @@ export default class Widget {
let base = this.title || this.label || this.name;
let title = max_chars ? frappe.ellipsis(base, max_chars) : base;
if (this.icon) {
let icon = frappe.utils.icon(this.icon, "sm");
this.title_field[0].innerHTML = `${icon} <span class="ellipsis" title="${title}">${title}</span>`;
} else {
this.title_field[0].innerHTML = `<span class="ellipsis" title="${title}">${title}</span>`;
if (max_chars) {
this.title_field[0].setAttribute("title", this.title || this.label);
}
this.title_field[0].innerHTML = `<span class="ellipsis" title="${title}">${title}</span>`;
if (max_chars) {
this.title_field[0].setAttribute("title", this.title || this.label);
}
this.subtitle && this.subtitle_field.html(this.subtitle);
}

View file

@ -64,7 +64,7 @@ export default class LinksWidget extends Widget {
return `<span class="link-content ellipsis">${
item.label ? item.label : item.name
}</span>`;
} ${frappe.utils.icon("es-line-arrow-up-right", "xs", "", "", "ml-2")} </span>`;
};
this.link_list = this.links.map((item) => {
@ -86,7 +86,6 @@ export default class LinksWidget extends Widget {
} ${disabled_dependent(item)}" type="${item.type}" title="${
item.label ? item.label : item.name
}">
<span class="indicator-pill no-margin ${get_indicator_color(item)}"></span>
${get_link_for_item(item)}
</a>`);
});

View file

@ -133,8 +133,6 @@ export default class QuickListWidget extends Widget {
}
setup_quick_list_item(doc) {
const indicator = frappe.get_indicator(doc, this.document_type);
let $quick_list_item = $(`
<div class="quick-list-item">
<div class="ellipsis left">
@ -149,14 +147,6 @@ export default class QuickListWidget extends Widget {
</div>
`);
if (indicator) {
$(`
<div class="status indicator-pill ${indicator[1]} ellipsis">
${__(indicator[0])}
</div>
`).appendTo($quick_list_item);
}
$(`<div class="right-arrow">${frappe.utils.icon("right", "xs")}</div>`).appendTo(
$quick_list_item
);

View file

@ -90,13 +90,14 @@ export default class ShortcutWidget extends Widget {
};
this.action_area.empty();
$(frappe.utils.icon("es-line-arrow-up-right", "xs", "", "", "ml-2")).appendTo(
this.action_area
);
const label = get_label();
let color = this.color && count ? this.color.toLowerCase() : "gray";
$(
`<div class="indicator-pill no-indicator-dot ellipsis ${color}">${label}</div>`
).appendTo(this.action_area);
$(frappe.utils.icon("es-line-arrow-up-right", "xs", "", "", "ml-2")).appendTo(
this.action_area
);
}
}

View file

@ -133,7 +133,7 @@ body {
}
.widget-head {
@include flex(flex, space-between, center, null);
@include flex(flex, flex-start, center, null);
.widget-label {
min-width: 0px;
@ -347,9 +347,9 @@ body {
&.onboarding-widget-box {
margin-bottom: var(--margin-2xl);
padding: var(--padding-lg) !important;
background-color: var(--bg-color);
border: 1px solid var(--border-color);
border-bottom: 1px solid var(--border-color);
border-radius: 0;
&.edit-mode:hover {
background-color: var(--bg-color);
@ -373,6 +373,7 @@ body {
.widget-head {
display: flex;
justify-content: space-between;
.widget-label .widget-title {
@include get_textstyle("lg", "semibold");
@ -575,7 +576,6 @@ body {
}
padding: 10px;
border: 1px solid var(--border-color);
.link-item {
display: flex;
@ -588,19 +588,6 @@ body {
border-radius: var(--border-radius-md);
cursor: pointer;
.indicator-pill::before {
height: 4px;
width: 4px;
border-radius: var(--border-radius-lg);
}
&:hover {
background-color: var(--fg-hover-color);
.indicator-pill {
background-color: var(--fg-hover-color);
}
}
&:first-child {
margin-top: 12px;
@ -612,6 +599,9 @@ body {
.link-content {
flex: 1;
&:hover {
color: var(--gray-600);
}
}
.disabled-link {
@ -627,12 +617,6 @@ body {
left: 20%;
}
}
.indicator-pill {
margin-right: var(--margin-sm);
height: 20px;
padding: 3px 8px;
}
}
.widget-head .widget-label .widget-title {
@ -974,6 +958,7 @@ body {
}
.layout-main-section {
border: 1px solid var(--border-color);
padding: var(--padding-md);
margin-bottom: var(--margin-sm);
@ -1309,6 +1294,10 @@ body {
&.edit-mode {
padding: 7px 12px;
.widget-head {
justify-content: space-between;
}
&:hover {
box-shadow: var(--shadow-base);
background-color: var(--bg-color);