extern/egroupware
1
0
Fork 1
mirror of https://github.com/EGroupware/egroupware.git synced 2025-02-10 15:30:25 +01:00
Code Issues Packages Projects Releases Wiki Activity

Get the right size icon for imageOnly buttons and add right padding for buttons with icon+label

Browse Source
This commit is contained in:
Hadi Nategh 2022-01-20 16:36:51 +01:00
parent 4853cefa0c
commit 6fd23b631f
1 changed files with 7 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
api/js/etemplate/Et2Button/Et2Button.ts
View File

@ -68,8 +68,13 @@ export class Et2Button extends Et2InputWidget(SlotMixin(LionButton))
display: none; display: none;
} }
/* Set size for icon */ /* Set size for icon */
::slotted(img.imageOnly) {
padding-right: 0px !important;
width: 16px !important;
}
::slotted([slot="icon"][src]) { ::slotted([slot="icon"][src]) {
width: 20px; width: 20px;
padding-right: 4px;
} }
::slotted([slot="icon"][src='']) { ::slotted([slot="icon"][src='']) {
display: none; display: none;
@ -201,10 +206,10 @@ export class Et2Button extends Et2InputWidget(SlotMixin(LionButton))
} }
this._iconNode.src = this._image; this._iconNode.src = this._image;
if (!this._label) this._iconNode.classList.add('imageOnly');
return html` return html`
<div class="button-content et2_button ${this._label?'':'imageOnly'}" id="${this._buttonId}"> <div class="button-content et2_button ${this._label?'':'imageOnly'}" id="${this._buttonId}">
<slot name="icon"></slot> <slot name="icon" class="${this._label?'':'imageOnly'}"></slot>
<slot name="label">${this._label}</slot> <slot name="label">${this._label}</slot>
</div> `; </div> `;
} }