From a9b6be448ad8570b9fff30970eceef0fbfac3aeb Mon Sep 17 00:00:00 2001
From: milan <mk@egroupware.org>
Date: Wed, 30 Oct 2024 11:44:57 +0100
Subject: [PATCH] fix border around tab content  --regarding ticket #99621

---
 pixelegg/css/fancy.css  | 18 ++++++++++--------
 pixelegg/css/fancy.less | 14 +++++++++-----
 2 files changed, 19 insertions(+), 13 deletions(-)

diff --git a/pixelegg/css/fancy.css b/pixelegg/css/fancy.css
index 17cea190b8..2727b44997 100644
--- a/pixelegg/css/fancy.css
+++ b/pixelegg/css/fancy.css
@@ -7185,6 +7185,16 @@ img.et2_button_icon[src*="svg"]:hover {
   padding-top: var(--sl-spacing-large);
   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),
 :host 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 {
   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,
 :host et2-tabbox .et2_toolbar input.et2_textbox,
 .sl-theme-light et2-tabbox .et2_toolbar input.et2_textbox,
diff --git a/pixelegg/css/fancy.less b/pixelegg/css/fancy.less
index a87b002e2b..6b1fec220d 100644
--- a/pixelegg/css/fancy.less
+++ b/pixelegg/css/fancy.less
@@ -27,6 +27,15 @@
             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 {
             &::part(base) {
                 border: 1px solid;
@@ -46,11 +55,6 @@
         .tabLabel {
             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{
             border-radius: var(--sl-border-radius-pill);