fix border around tab content

--regarding ticket #99621
This commit is contained in:
milan 2024-10-30 11:44:57 +01:00
parent db3c858669
commit a9b6be448a
2 changed files with 19 additions and 13 deletions

View File

@ -7185,6 +7185,16 @@ img.et2_button_icon[src*="svg"]:hover {
padding-top: var(--sl-spacing-large); padding-top: var(--sl-spacing-large);
gap: var(--sl-spacing-medium); gap: var(--sl-spacing-medium);
} }
:root et2-tabbox::part(body),
:host et2-tabbox::part(body),
.sl-theme-light et2-tabbox::part(body),
.sl-theme-dark et2-tabbox::part(body) {
border: 1px solid var(--sl-color-neutral-300);
border-radius: var(--sl-border-radius-medium);
border-bottom-right-radius: 0;
border-top-right-radius: 0;
padding: var(--sl-spacing-medium);
}
:root et2-tabbox et2-tab::part(base), :root et2-tabbox et2-tab::part(base),
:host et2-tabbox et2-tab::part(base), :host et2-tabbox et2-tab::part(base),
.sl-theme-light et2-tabbox et2-tab::part(base), .sl-theme-light et2-tabbox et2-tab::part(base),
@ -7205,14 +7215,6 @@ img.et2_button_icon[src*="svg"]:hover {
.sl-theme-dark et2-tabbox .tabLabel { .sl-theme-dark et2-tabbox .tabLabel {
max-height: 1.1em; max-height: 1.1em;
} }
:root et2-tabbox et2-tab-panel,
:host et2-tabbox et2-tab-panel,
.sl-theme-light et2-tabbox et2-tab-panel,
.sl-theme-dark et2-tabbox et2-tab-panel {
border: 1px solid var(--sl-color-neutral-300);
border-radius: var(--sl-border-radius-medium);
padding: var(--sl-spacing-medium);
}
:root et2-tabbox .et2_toolbar input.et2_textbox, :root et2-tabbox .et2_toolbar input.et2_textbox,
:host et2-tabbox .et2_toolbar input.et2_textbox, :host et2-tabbox .et2_toolbar input.et2_textbox,
.sl-theme-light et2-tabbox .et2_toolbar input.et2_textbox, .sl-theme-light et2-tabbox .et2_toolbar input.et2_textbox,

View File

@ -27,6 +27,15 @@
gap: var(--sl-spacing-medium); gap: var(--sl-spacing-medium);
} }
// left rounded box around the tab content to visually group it
&::part(body){
border: 1px solid var(--sl-color-neutral-300);
border-radius: var(--sl-border-radius-medium);
border-bottom-right-radius: 0;
border-top-right-radius: 0;
padding: var(--sl-spacing-medium);
}
et2-tab { et2-tab {
&::part(base) { &::part(base) {
border: 1px solid; border: 1px solid;
@ -46,11 +55,6 @@
.tabLabel { .tabLabel {
max-height: 1.1em; max-height: 1.1em;
} }
et2-tab-panel{
border: 1px solid var(--sl-color-neutral-300);
border-radius: var(--sl-border-radius-medium);
padding: var(--sl-spacing-medium);
}
.et2_toolbar input.et2_textbox, .nextmatch_header_row input.et2_textbox{ .et2_toolbar input.et2_textbox, .nextmatch_header_row input.et2_textbox{
border-radius: var(--sl-border-radius-pill); border-radius: var(--sl-border-radius-pill);