Merge pull request #22536 from maharshivpatel/fix-espresso

fix: espresso issues shared in #22508.
This commit is contained in:
Maharshi Patel 2023-09-29 10:30:00 +05:30 committed by GitHub
commit bc97d91e3f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
24 changed files with 118 additions and 78 deletions

View file

@ -29,7 +29,8 @@ context("Attach Control", () => {
//Clicking on "Link" button to attach a file using the "Link" button
cy.findByRole("button", { name: "Link" }).click();
cy.findByPlaceholderText("Attach a web link").type(
"https://wallpaperplay.com/walls/full/8/2/b/72402.jpg"
"https://wallpaperplay.com/walls/full/8/2/b/72402.jpg",
{ force: true }
);
//Clicking on the Upload button to upload the file

View file

@ -81,7 +81,7 @@ context("Sidebar", () => {
// test "Show All" button
cy.get(".attachment-row").should("have.length", 10);
cy.get(".show-all-btn").click();
cy.get(".show-all-btn").click({ force: true });
cy.get(".attachment-row").should("have.length", 12);
});
});
@ -120,7 +120,7 @@ context("Sidebar", () => {
).click();
//To check if filter is applied
cy.click_filter_button().should("contain", "1 filter");
cy.click_filter_button().get(".filter-label").should("contain", "1");
cy.get(".fieldname-select-area > .awesomplete > .form-control").should(
"have.value",
"Assigned To"

View file

@ -522,6 +522,13 @@
<path fill="var(--icon-stroke)" fill-rule="evenodd" d="M7.004 2.4a1 1 0 0 1 1.99 0l.033.33.316.099a4.501 4.501 0 0 1 3.156 4.296V11.5h.5a.5.5 0 1 1 0 1h-10a.5.5 0 0 1 0-1h.5V7.125a4.5 4.5 0 0 1 3.156-4.296l.316-.099.033-.33ZM5.549 13.5h-2.55a1.5 1.5 0 0 1-.5-2.915v-3.46a5.5 5.5 0 0 1 3.57-5.152 2 2 0 0 1 3.86 0 5.501 5.501 0 0 1 3.57 5.152v3.46a1.5 1.5 0 0 1-.5 2.915h-2.55a2.5 2.5 0 0 1-4.9 0Zm1.035 0a1.5 1.5 0 0 0 2.83 0h-2.83Z" class="Union" clip-rule="evenodd"/>
</g>
</symbol>
<!-- TODO replace with espresso icon when new icon is available -->
<symbol id="es-line-notifications-unseen" fill="none" viewBox="0 0 16 16">
<g class="es-line-notifications-unseen">
<path fill="var(--icon-stroke)" fill-rule="evenodd" clip-rule="evenodd" d="M8 1.5C7.4814 1.5 7.05449 1.89515 7.00486 2.40045L6.97248 2.73008L6.65633 2.82883C6.42002 2.90265 6.19204 2.99545 5.97416 3.10549C4.5053 3.84736 3.49982 5.3692 3.49982 7.125V11.5H2.99982C2.72384 11.5 2.5 11.7238 2.5 11.9999C2.5 12.2761 2.72391 12.5 3 12.5H12.9998C13.276 12.5 13.4998 12.2761 13.4998 12C13.4998 11.7239 13.276 11.5 12.9998 11.5H12.4998V7.125C12.4998 7.06944 12.4988 7.01412 12.4968 6.95905C12.8476 6.90058 13.1778 6.78124 13.4762 6.61225C13.4918 6.78107 13.4998 6.9521 13.4998 7.125V10.5854C14.0824 10.7913 14.4998 11.3469 14.4998 12C14.4998 12.8284 13.8282 13.5 12.9998 13.5H10.45C10.2184 14.6411 9.20948 15.5 8 15.5C6.79052 15.5 5.78164 14.6411 5.55001 13.5H3C2.17152 13.5 1.5 12.8283 1.5 11.9999C1.5 11.3469 1.9173 10.7913 2.49982 10.5854V7.125C2.49982 4.97742 3.73079 3.11823 5.52334 2.21288C5.70033 2.12349 5.88284 2.04336 6.07022 1.97315C6.30157 1.12403 7.07767 0.5 8 0.5C8.88147 0.5 9.62937 1.06996 9.89585 1.86165C9.62482 2.12838 9.40425 2.44624 9.2498 2.79961L9.0275 2.73016L8.99515 2.40053C8.94555 1.89519 8.51862 1.5 8 1.5ZM8 14.5C7.34689 14.5 6.79127 14.0826 6.58535 13.5H9.41465C9.20873 14.0826 8.65311 14.5 8 14.5Z"/>
<path fill="var(--green-700)" d="M14 4C14 5.10457 13.1046 6 12 6C10.8954 6 10 5.10457 10 4C10 2.89543 10.8954 2 12 2C13.1046 2 14 2.89543 14 4Z" fill="#278F5E"/>
</g>
</symbol>
<symbol id="es-line-reports" fill="none" viewBox="0 0 16 16">
<g class="es-line-reports">
<path fill="var(--icon-stroke)" fill-rule="evenodd" d="M6 3.5A1.5 1.5 0 0 1 7.5 2h1A1.5 1.5 0 0 1 10 3.5v10a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-10ZM7.5 3a.5.5 0 0 0-.5.5V13h2V3.5a.5.5 0 0 0-.5-.5h-1ZM11 6.5A1.5 1.5 0 0 1 12.5 5h1A1.5 1.5 0 0 1 15 6.5v7a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-7Zm1.5-.5a.5.5 0 0 0-.5.5V13h2V6.5a.5.5 0 0 0-.5-.5h-1Zm-10 2A1.5 1.5 0 0 0 1 9.5v4a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 .5-.5v-4A1.5 1.5 0 0 0 3.5 8h-1ZM2 9.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5V13H2V9.5Z" class="Union" clip-rule="evenodd"/>
@ -989,6 +996,12 @@
<path fill="var(--icon-stroke)" fill-rule="evenodd" d="M8 12a7.5 7.5 0 0 1-6.635-4A7.5 7.5 0 0 1 8 4a7.499 7.499 0 0 1 6.635 4A7.499 7.499 0 0 1 8 12Zm0-9a8.502 8.502 0 0 1 7.748 5A8.502 8.502 0 0 1 8 13 8.502 8.502 0 0 1 .25 8 8.502 8.502 0 0 1 8 3Zm1.5 5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0Zm1 0a2.5 2.5 0 1 1-5 0 2.5 2.5 0 0 1 5 0Z" class="Union" clip-rule="evenodd"/>
</g>
</symbol>
<!-- TODO replace with espresso icon when new icon is available -->
<symbol id="es-line-hide" fill="none" viewBox="0 0 16 16">
<g class="es-line-hide">
<path fill="var(--icon-stroke)" fill-rule="evenodd" clip-rule="evenodd" d="M3.07279 1.00088L2.86463 0.70945C2.70413 0.484744 2.39185 0.432698 2.16714 0.593203C1.94244 0.753707 1.89039 1.06598 2.0509 1.29069L3.98896 4.00397C2.34466 4.8856 1.02406 6.29245 0.251465 8.0002C1.58548 10.9487 4.55301 13.0001 7.99967 13.0001C8.76345 13.0001 9.50369 12.8993 10.2079 12.7104L12.0509 15.2907C12.2114 15.5154 12.5237 15.5674 12.7484 15.4069C12.9358 15.2731 13.0031 15.0337 12.9272 14.8276L3.13537 1.11902C3.10871 1.08169 3.08791 1.04194 3.07279 1.00088ZM12.0992 11.9479C13.7023 11.0637 14.9893 9.67688 15.748 7.99995C14.414 5.0515 11.4464 3.00007 7.99978 3.00007C7.27344 3.00007 6.56837 3.09118 5.89539 3.26259L6.52562 4.1449C7.00232 4.04989 7.49526 4.00007 7.99978 4.00007C10.8763 4.00007 13.3765 5.6195 14.6349 7.99997C13.9318 9.3301 12.841 10.4226 11.5134 11.1278L12.0992 11.9479ZM10.1685 9.24493C10.3794 8.87838 10.5 8.45331 10.5 8.00007C10.5 6.61936 9.3807 5.50007 7.99999 5.50007C7.83782 5.50007 7.67926 5.51551 7.52569 5.54501L8.21925 6.51598C8.94374 6.6221 9.49999 7.24613 9.49999 8.00007C9.49999 8.09365 9.49142 8.18523 9.47502 8.27407L10.1685 9.24493ZM1.36453 8.00018C2.08344 6.64021 3.20762 5.52861 4.57573 4.82545L5.8877 6.66222C5.64217 7.04907 5.49999 7.50797 5.49999 8.00007C5.49999 9.38079 6.61927 10.5001 7.99999 10.5001C8.19988 10.5001 8.39429 10.4766 8.58062 10.4323L9.58115 11.833C9.07124 11.9425 8.54215 12.0001 7.99967 12.0001C5.12317 12.0001 2.62299 10.3807 1.36453 8.00018ZM6.49999 8.00007C6.49999 7.8602 6.51913 7.7248 6.55494 7.59635L7.91297 9.49759C7.12504 9.45252 6.49999 8.79929 6.49999 8.00007Z"/>
</g>
</symbol>
<symbol id="es-line-upload" fill="none" viewBox="0 0 16 16">
<g class="es-line-upload">
<path fill="var(--icon-stroke)" fill-rule="evenodd" d="M2.5 1a.5.5 0 0 0 0 1h11a.5.5 0 0 0 0-1h-11Zm5.146 3.146a.5.5 0 0 1 .708 0l5 5a.5.5 0 0 1-.708.708L8.5 5.707V14.5a.5.5 0 0 1-1 0V5.707L3.354 9.854a.5.5 0 0 1-.708-.708l5-5Z" class="Union" clip-rule="evenodd"/>

Before

Width:  |  Height:  |  Size: 194 KiB

After

Width:  |  Height:  |  Size: 198 KiB

View file

@ -45,7 +45,7 @@
<li class="flex flex-wrap">
<span class="assignments"></span>
<button class="add-assignment-btn data-pill btn">
<svg class="es-icon mr-2 icon-sm"><use href="#es-line-customer"></use></svg>
<svg class="es-icon mr-2 icon-sm"><use href="#es-line-add-people"></use></svg>
<span class="ellipsis">{%= __("Add Assignee") %}</span>
</button>
</li>
@ -56,21 +56,22 @@
<li class="explore-full-btn hidden">
<button class="data-pill btn">
<svg class="es-icon mr-2 icon-sm">
<use href="#es-line-folder-alt"></use>
</svg>
<span class="pill-label ellipsis">
{%= __("Explore Files") %}
</span>
<svg class="es-icon icon-sm">
<use href="#es-line-folder-alt"></use>
</svg>
</button>
</li>
<li class="show-all-btn hidden">
<button class="show-all-btn hidden">
<svg class="es-icon icon-sm">
<use href="#es-line-preview"></use>
</svg>
<a href="" class="pill-label ellipsis">
{%= __("Show All") %}
</a>
</li>
</button>
</li>
<li class="attachments-actions">
<button class="data-pill btn add-attachment-btn">
@ -106,7 +107,7 @@
</ul>
<ul class="list-unstyled sidebar-menu form-shared">
<li class="sidebar-label">
{%= __("Shared With") %}
{%= __("Share") %}
</li>
<li class="flex flex-wrap">
<span class="shares"></span>

View file

@ -60,8 +60,8 @@
{% if (doc._url) { %}
<a class="action-btn" href="{{ doc._url }}" title="{{ __("Open Communication") }}">
<svg class="icon icon-sm">
<use href="#icon-link-url" class="like-icon"></use>
<svg class="es-icon icon-sm">
<use href="#es-line-link"></use>
</svg>
</a>
{% } %}

View file

@ -128,9 +128,7 @@ frappe.ui.FilterGroup = class {
update_filter_button() {
const filters_applied = this.filters.length > 0;
const button_label = filters_applied
? this.filters.length > 1
? __("{0} filters", [this.filters.length])
: __("{0} filter", [this.filters.length])
? __("Filters <span class='filter-label'>{0}</span>", [this.filters.length])
: __("Filter");
this.filter_button
@ -140,6 +138,10 @@ frappe.ui.FilterGroup = class {
this.filter_button.find(".filter-icon").toggleClass("active", filters_applied);
this.filter_button.find(".button-label").html(button_label);
this.filter_button.attr(
"title",
`${this.filters.length} Filter${this.filters.length > 1 ? "s" : ""} Applied`
);
}
set_filter_events() {

View file

@ -229,7 +229,7 @@ frappe.ui.GroupBy = class {
$(`<div class="group-by-selector">
<button class="btn btn-default btn-sm group-by-button ellipsis">
<span class="group-by-icon">
${frappe.utils.icon("es-line-group")}
${frappe.utils.icon("es-line-folder-alt")}
</span>
<span class="button-label hidden-xs">
${__("Add Group")}
@ -408,7 +408,9 @@ frappe.ui.GroupBy = class {
update_group_by_button() {
const group_by_applied = Boolean(this.group_by_field);
const button_label = group_by_applied
? __("Group By {0}", [this.get_group_by_field_label()])
? __("Grouped by <span style='font-weight:600;'>{0}</b>", [
this.get_group_by_field_label(),
])
: __("Add Group");
this.group_by_button
@ -418,7 +420,10 @@ frappe.ui.GroupBy = class {
this.group_by_button.find(".group-by-icon").toggleClass("active", group_by_applied);
this.group_by_button.find(".button-label").html(button_label);
this.group_by_button.attr("title", button_label);
this.group_by_button.attr(
"title",
`Results are Grouped by ${this.get_group_by_field_label()}`
);
}
get_group_by_field_label() {

View file

@ -37,7 +37,7 @@
<svg class="es-icon icon-sm" style="stroke:none;"><use href="#es-line-notifications"></use></svg>
</span>
<span class="notifications-unseen">
<svg class="es-icon icon-sm"><use href="#icon-notification-with-indicator"></use></svg>
<svg class="es-icon icon-sm"><use href="#es-line-notifications-unseen"></use></svg>
</span>
</a>
<div class="dropdown-menu notifications-list dropdown-menu-right" role="menu">

View file

@ -116,8 +116,8 @@ frappe.views.Workspace = class Workspace {
>
<span class="sidebar-item-icon" item-icon=${item.icon || "folder-normal"}>
${
item.icon
? frappe.utils.icon(item.icon, "md")
item.public
? frappe.utils.icon(item.icon || "folder-normal", "md")
: `<span class="indicator ${item.indicator_color}"></span>`
}
</span>
@ -536,7 +536,7 @@ frappe.views.Workspace = class Workspace {
});
frappe.utils.add_custom_button(
frappe.utils.icon("duplicate", "sm"),
frappe.utils.icon("es-line-duplicate", "sm"),
() => this.duplicate_page(item),
"duplicate-page",
__("Duplicate Workspace"),
@ -545,7 +545,7 @@ frappe.views.Workspace = class Workspace {
);
} else if (item.is_hidden) {
frappe.utils.add_custom_button(
frappe.utils.icon("unhide", "sm"),
frappe.utils.icon("es-line-preview", "sm"),
(e) => this.unhide_workspace(item, e),
"unhide-workspace-btn",
__("Unhide Workspace"),
@ -795,19 +795,19 @@ frappe.views.Workspace = class Workspace {
{
label: __("Edit"),
title: __("Edit Workspace"),
icon: frappe.utils.icon("edit", "sm"),
icon: frappe.utils.icon("es-line-edit", "sm"),
action: () => this.edit_page(item),
},
{
label: __("Duplicate"),
title: __("Duplicate Workspace"),
icon: frappe.utils.icon("duplicate", "sm"),
icon: frappe.utils.icon("es-line-duplicate", "sm"),
action: () => this.duplicate_page(item),
},
{
label: __("Hide"),
title: __("Hide Workspace"),
icon: frappe.utils.icon("hide", "sm"),
icon: frappe.utils.icon("es-line-hide", "sm"),
action: (e) => this.hide_workspace(item, e),
},
];

View file

@ -63,6 +63,14 @@ select.form-control {
.link-field {
width: 100%;
}
.tb-selected-value {
display: inline-block;
height: auto;
box-shadow: none;
background-color: var(--bg-color);
border: 1px solid var(--border-color);
}
}
.table-multiselect.form-control input {
@ -374,14 +382,6 @@ textarea.form-control {
margin-bottom: var(--margin-xs);
}
.tb-selected-value {
display: inline-block;
margin-right: var(--margin-xs);
margin-bottom: var(--margin-xs);
box-shadow: none;
border: 1px solid var(--dark-border-color);
}
.barcode-scanner {
position: relative;

View file

@ -27,6 +27,7 @@
.search {
// TODO: Align with table grid without overwriting padding if possible
padding: 4px 7px 4px 7px !important;
border-bottom: 1px solid var(--table-border-color);
}
}

View file

@ -113,11 +113,14 @@
.ql-toolbar.ql-snow {
border-top-left-radius: var(--border-radius);
border-top-right-radius: var(--border-radius);
background-color: var(--gray-200);
background-color: var(--gray-50);
border-bottom: 1px solid var(--border-color);
padding: 0;
padding-top: 4px;
.ql-picker-label::before {
color: var(--text-color);
}
}
[data-theme="dark"] {
.ql-toolbar.ql-snow {

View file

@ -7,6 +7,7 @@ $check-icon-dark: url("data:image/svg+xml, <svg viewBox='0 0 8 7' fill='none' xm
--gray-800: #232323;
// Type Colors
--text-neutral: var(--gray-50);
--text-dark: var(--gray-900);
--text-muted: var(--gray-400);
--text-light: var(--gray-300);
@ -104,7 +105,7 @@ $check-icon-dark: url("data:image/svg+xml, <svg viewBox='0 0 8 7' fill='none' xm
--highlight-color: var(--gray-700);
--yellow-highlight-color: var(--yellow-700);
--btn-group-border-color: var(--gray-800);
--btn-group-border-color: var(--gray-700);
--placeholder-color: var(--gray-700);
@ -161,7 +162,7 @@ $check-icon-dark: url("data:image/svg+xml, <svg viewBox='0 0 8 7' fill='none' xm
.frappe-card {
.btn-default {
background-color: var(--bg-color);
background-color: var(--control-bg);
&:hover {
background-color: var(--fg-hover-color);

View file

@ -663,7 +663,7 @@ body {
}
.card-actions {
margin-top: -15px;
margin-top: -6px;
}
}
@ -676,7 +676,7 @@ body {
}
.widget-content {
@include flex(flex, space-between, null, null);
@include flex(flex, space-between, null, column);
padding-top: var(--padding-md);
.number {
@ -697,7 +697,7 @@ body {
.percentage-stat-area {
font-size: $font-size-sm;
margin-left: var(--margin-xs);
margin-top: var(--margin-sm);
.indicator-pill-round {
height: 18px;

View file

@ -241,14 +241,8 @@ h2 {
.btn-group {
.btn {
box-shadow: none;
outline: 1px solid var(--btn-group-border-color);
&:not(:first-child) {
margin-left: 1px;
}
&:focus {
outline: 2px solid var(--dark-border-color);
&:nth-child(2) {
border-left: 1px solid var(--btn-group-border-color);
}
}
}

View file

@ -92,7 +92,7 @@
min-width: 80%;
}
.level-right {
flex: 1.5;
flex: 1;
overflow: visible;
}
@ -207,11 +207,17 @@ $level-margin-right: 8px;
.list-paging-area, .footnote-area {
border-top: 1px solid var(--border-color);
.btn-group .btn-paging.btn-info {
background-color: var(--bg-color);
border-color: var(--gray-600);
color: var(--text-color);
font-weight: var(--weight-medium);
.btn-group {
border: 1px solid var(--border-color);
border-radius: var(--border-radius);
.btn-paging.btn-info {
&:not(:first-child) {
border-left: 1px solid var(--border-color);
}
background-color: var(--bg-color);
color: var(--text-color);
font-weight: var(--weight-medium);
}
}
.btn-paging {
background-color: var(--gray-50);
@ -402,10 +408,18 @@ input.list-check-all {
.filter-selector .btn-group {
margin: var(--margin-xs);
.filter-label {
display: inline-block;
font-weight: 600;
color: var(--text-color);
background-color: var(--control-bg);
min-width: 21px;
border-radius: 22px;
}
}
.filter-button.btn-primary-light {
outline: 1px solid var(--gray-800);
z-index: 1;
}

View file

@ -163,8 +163,10 @@
&::before {
content: '';
display: inline-block;
@include size(4px, 4px);
@include size(6px, 6px);
min-width: 6px;
margin-top: 16px;
margin-left: 2px;
border-radius: 10px;
}

View file

@ -101,18 +101,9 @@
.group-by-button {
margin: 5px;
}
.group-by-button.btn-primary-light {
color: var(--text-on-blue);
outline: 1px solid var(--bg-dark-blue);
}
.group-by-icon.active {
use {
stroke: var(--text-on-blue);
}
--icon-stroke: var(--primary);
}
.comparison-message {
margin-left: var(--margin-sm);
@include get_textstyle("base", "regular");

View file

@ -112,14 +112,12 @@ body[data-route^="Module"] .main-menu {
.sidebar-image-section {
width: min(100%, 170px);
cursor: pointer;
border: 1px solid var(--border-color);
border-radius: var(--border-radius-lg);
.sidebar-image {
height: auto;
max-height: 170px;
object-fit: cover;
border-radius: var(--border-radius-lg);
}
.standard-image {
@ -134,6 +132,8 @@ body[data-route^="Module"] .main-menu {
.sidebar-image,
.sidebar-standard-image {
transition: opacity 0.3s;
border-radius: var(--border-radius-lg);
border: 1px solid var(--border-color);
}
.sidebar-image-wrapper:hover {
@ -397,9 +397,8 @@ body[data-route^="Module"] .main-menu {
display: inline-flex;
}
.attachments-actions {
.attachments-actions, .explore-full-btn > .data-pill.btn {
display: flex;
gap: 5px;
max-width: 100%;
}
@ -409,8 +408,19 @@ body[data-route^="Module"] .main-menu {
}
.show-all-btn {
margin-top: var(--margin-md);
text-align: center;
width: 100%;
border: 1px solid var(--border-color);
border-radius: var(--border-radius);
background-color: var(--bg-color);
text-align: start;
padding-left: 8px;
margin-bottom: var(--margin-sm);
a.pill-label.ellipsis {
&:hover {
text-decoration: none;
}
}
}
.form-assignments, .form-shared {
.assignments, .shares {

View file

@ -94,7 +94,7 @@ $threshold: 34;
padding: var(--padding-sm);
margin-left: var(--margin-md);
&.frappe-card {
color: var(--gray-900);
color: var(--text-neutral);
background-color: var(--bg-color);
box-shadow: none;
border: 1px solid var(--border-color);
@ -105,7 +105,7 @@ $threshold: 34;
margin: 0 var(--margin-sm);
}
.ql-editor.read-mode{
.content{
padding-left: 42px;
.mention{
background-color: transparent;

View file

@ -4,5 +4,5 @@
--dropdown-padding: 4px 8px;
--grid-padding: 10px 8px;
--disabled-input-padding: 3px 8px;
--number-card-padding: 12px 8px;
--number-card-padding: 8px 8px 8px 12px;
}

View file

@ -44,7 +44,7 @@
// font color
--heading-color: var(--gray-900);
--text-black: var(--gray-900);
--text-neutral: var(--gray-900);
--text-color: var(--gray-800);
--text-muted: var(--gray-700);
--text-light: var(--gray-600);

View file

@ -32,6 +32,7 @@ body {
max-width: 400px;
margin: 0 auto;
border-radius: var(--border-radius-md);
border: 1px solid var(--border-color);
form {
max-width: 320px;

View file

@ -8,6 +8,7 @@
margin: 70px auto;
border-radius: var(--border-radius-md);
background-color: var(--fg-color);
border: 1px solid var(--border-color);
}
.for-reset-password {