From 918980af662c21bea4c59ca462fea8dd52c07f7f Mon Sep 17 00:00:00 2001
From: Hadi Nategh <hnategh@gmail.com>
Date: Mon, 18 Jul 2022 16:32:57 +0200
Subject: [PATCH] Fix avatar's action buttons not being bound to hover
---
api/js/etemplate/Et2Avatar/Et2Avatar.ts | 12 +++++++++++-
1 file changed, 11 insertions(+), 1 deletion(-)
diff --git a/api/js/etemplate/Et2Avatar/Et2Avatar.ts b/api/js/etemplate/Et2Avatar/Et2Avatar.ts
index dadeff5f79..279f70c8cb 100644
--- a/api/js/etemplate/Et2Avatar/Et2Avatar.ts
+++ b/api/js/etemplate/Et2Avatar/Et2Avatar.ts
@@ -28,7 +28,15 @@ export class Et2Avatar extends Et2Widget(SlotMixin(SlAvatar)) implements et2_IDe
shoelace,
cropperStyles,
css`
-
+ :host::part(edit) {
+ visibility: hidden;
+ border-radius: 50%;
+ margin: -4px;
+ }
+
+ :host(:hover)::part(edit) {
+ visibility: visible;
+ }
`
];
}
@@ -203,8 +211,10 @@ export class Et2Avatar extends Et2Widget(SlotMixin(SlAvatar)) implements et2_IDe
let self = this;
let editBtn = document.createElement('sl-icon-button');
editBtn.setAttribute('name', 'pencil');
+ editBtn.setAttribute('part', 'edit');
let delBtn = document.createElement('sl-icon-button');
delBtn.setAttribute('name', 'trash');
+ delBtn.setAttribute('part', 'edit');
this._baseNode.append(editBtn);
this._baseNode.append(delBtn);