holm/egroupware
1
1
Fork 0
forked from extern/egroupware
Code Issues Pull Requests 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;
}
/* Set size for icon */
::slotted(img.imageOnly) {
padding-right: 0px !important;
width: 16px !important;
}
::slotted([slot="icon"][src]) {
width: 20px;
padding-right: 4px;
}
::slotted([slot="icon"][src='']) {
display: none;
@ -201,10 +206,10 @@ export class Et2Button extends Et2InputWidget(SlotMixin(LionButton))
}
this._iconNode.src = this._image;
if (!this._label) this._iconNode.classList.add('imageOnly');
return html`
<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>
</div> `;
}