extern/egroupware_official
1
0
Fork 0
mirror of https://github.com/EGroupware/egroupware.git synced 2025-01-18 11:58:24 +01:00
Code Issues Packages Projects Releases Wiki Activity

Fix some styling on select-email

Browse Source 
- Make +N tag right aligned & look like text, not tag
- Fix popup to open below but covering field
- give popup border & dropshadow
This commit is contained in:
nathan 2023-02-07 12:04:05 -07:00
parent 2a3a8a7371
commit 9cde6a7171
2 changed files with 39 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
api/js/etemplate/Et2Select/Et2Select.ts
View File

@ -148,7 +148,18 @@ export class Et2Select extends Et2WithSearchMixin(Et2WidgetWithSelect)
z-index: 1; z-index: 1;
background: var(--sl-input-background-color); background: var(--sl-input-background-color);
padding: var(--sl-input-spacing-small); padding: var(--sl-input-spacing-small);
padding-left: 0; padding-left: 2px;
box-shadow: var(--sl-shadow-large);
min-width: fit-content;
border-radius: var(--sl-border-radius-small);
border: 1px solid var(--sl-color-neutral-200);
max-height: 15em;
overflow-y: auto;
}
::part(display-label) {
margin: 0;
} }
` `
]; ];
@ -292,9 +303,10 @@ export class Et2Select extends Et2WithSearchMixin(Et2WidgetWithSelect)
*/ */
private _handleMouseEnter(e : MouseEvent) private _handleMouseEnter(e : MouseEvent)
{ {
if(this.maxTagsVisible == 1 && this.rows == 1 && this.multiple == true) if(this.maxTagsVisible == 1 && this.rows == 1 && this.multiple == true && this.value.length > 1)
{ {
e.stopPropagation(); e.stopPropagation();
let distance = (-1 * parseInt(getComputedStyle(this).height)) - 1;
// Show all tags // Show all tags
this.maxTagsVisible = 0; this.maxTagsVisible = 0;
@ -310,13 +322,17 @@ export class Et2Select extends Et2WithSearchMixin(Et2WidgetWithSelect)
{ {
let label = this.dropdown.querySelector(".select__label"); let label = this.dropdown.querySelector(".select__label");
let popup = document.createElement("sl-popup"); let popup = document.createElement("sl-popup");
popup.anchor = this;
popup.distance = distance;
popup.placement = "bottom";
popup.strategy = "fixed"; popup.strategy = "fixed";
popup.active = true; popup.active = true;
popup.sync = "width"; popup.sync = "width";
popup.classList.add("hover__popup"); popup.classList.add("hover__popup", "details", "hoist", "details__body");
label.parentNode.insertBefore(popup, label); label.parentNode.insertBefore(popup, label);
popup.appendChild(label); popup.appendChild(label);
label.style.width = "35ex"; label.style.width = getComputedStyle(this).width;
label.style.margin = 0;
}); });
} }
} }

19
mail/templates/default/app.css
View File

@ -1095,3 +1095,22 @@ et2-description#mail-index_mailPreview_subject {
margin-bottom: 0; margin-bottom: 0;
margin-top: 0.3em; margin-top: 0.3em;
} }
/* Make +N tag in email look like text, not tag */
et2-select-email::part(tags) {
width: 100%;
}
et2-select-email::part(tag) {
flex: 10 0 auto;
}
et2-select-email::part(tag__base) {
font-weight: bold;
border: none;
background: inherit;
}
et2-select-email::part(tag__content) {
margin-left: auto;
}