diff --git a/api/js/etemplate/Et2Portlet/Et2Portlet.ts b/api/js/etemplate/Et2Portlet/Et2Portlet.ts
index 7f3aeffa51..16cb372d6f 100644
--- a/api/js/etemplate/Et2Portlet/Et2Portlet.ts
+++ b/api/js/etemplate/Et2Portlet/Et2Portlet.ts
@@ -92,11 +92,11 @@ export class Et2Portlet extends Et2Widget(SlCard)
 				user-select: none;
 			  }
 
-			  .portlet__header et2-button-icon {
+			  .portlet__header .portlet__settings-icon {
 				display: none;
 			  }
 
-			  .portlet__header:hover et2-button-icon {
+			  .portlet__header:hover .portlet__settings-icon {
 				display: initial;
 			  }
 
@@ -577,8 +577,9 @@ export class Et2Portlet extends Et2Widget(SlCard)
 
                 <header class="portlet__header">
                     <slot name="header" part="header" class="card__header">${this.headerTemplate()}</slot>
-                    <et2-button-icon id="settings" name="gear" label="Settings" noSubmit=true
-                                     @click="${() => this.edit_settings()}"></et2-button-icon>
+                    <sl-icon-button id="settings" name="gear" label="Settings" class="portlet__settings-icon"
+                                    @click="${() => this.edit_settings()}">
+                    </sl-icon-button>
                 </header>
                 <slot part="body" class="card__body">${this.bodyTemplate()}</slot>
                 <slot name="footer" part="footer" class="card__footer">${this.footerTemplate()}</slot>