diff --git a/api/js/etemplate/Layout/Et2Tabs/Et2Tabs.ts b/api/js/etemplate/Layout/Et2Tabs/Et2Tabs.ts index 51de333ea0..b14b6834ec 100644 --- a/api/js/etemplate/Layout/Et2Tabs/Et2Tabs.ts +++ b/api/js/etemplate/Layout/Et2Tabs/Et2Tabs.ts @@ -402,7 +402,10 @@ export class Et2Tabs extends Et2InputWidget(SlTabGroup) implements et2_IResizeab }, this); // Set tab label - tab.flagDiv.appendChild(document.createTextNode(tab.label)); + const node = document.createElement("span") + node.appendChild(document.createTextNode(tab.label)); + node.classList.add("tabLabel") + tab.flagDiv.appendChild(node); if(tab.tabNode && tab.tabNode.children.length) { diff --git a/pixelegg/css/fancy.css b/pixelegg/css/fancy.css index c6cfb7321f..fbf1705cfa 100644 --- a/pixelegg/css/fancy.css +++ b/pixelegg/css/fancy.css @@ -7181,6 +7181,12 @@ img.et2_button_icon[src*="svg"]:hover { .sl-theme-dark et2-tabbox et2-tab[active]::part(base) { border-color: var(--sl-color-neutral-900); } +:root et2-tabbox .tabLabel, +:host et2-tabbox .tabLabel, +.sl-theme-light et2-tabbox .tabLabel, +.sl-theme-dark et2-tabbox .tabLabel { + max-height: 1em; +} :root et2-tabbox et2-tab-panel, :host et2-tabbox et2-tab-panel, .sl-theme-light et2-tabbox et2-tab-panel, diff --git a/pixelegg/css/fancy.less b/pixelegg/css/fancy.less index e6174f2121..1ec8182e06 100644 --- a/pixelegg/css/fancy.less +++ b/pixelegg/css/fancy.less @@ -16,7 +16,6 @@ et2-tabbox { --track-width: 0px; - &::part(tabs) { padding-bottom: var(--sl-spacing-x-small); padding-top: var(--sl-spacing-medium); @@ -29,6 +28,8 @@ border-color: var(--sl-color-neutral-300); border-radius: var(--sl-border-radius-pill); } + + } et2-tab[active] { @@ -36,7 +37,10 @@ border-color: var(--sl-color-neutral-900); } } - + + .tabLabel { + max-height: 1em; + } et2-tab-panel{ border: 1px solid var(--sl-color-neutral-300); border-radius: var(--sl-border-radius-medium);