fix(ObjectPage): use UI5WC tabbar shadow

Author: Lukas742

packages/main/src/components/ObjectPage/ObjectPage.module.css

@@ -105,21 +105,15 @@
   z-index: 4;
 }
 
+.tabContainerSpacer {
+  height: 3px;
+  background: var(--sapObjectHeader_Background);
+}
+
 .tabContainer {
   position: sticky;
   z-index: 3;
   background: var(--sapObjectHeader_Background);
-  padding-block-start: 3px;
-  &::after {
-    content: '';
-    pointer-events: none;
-    position: absolute;
-    height: 1px;
-    inset-block-end: -1px;
-    inset-inline-start: 0;
-    width: 100%;
-    box-shadow: var(--sapContent_HeaderShadow);
-  }
 }
 
 .tabContainerComponent {
@@ -130,7 +124,6 @@
   &::part(tabstrip) {
     padding: 0;
     padding-inline: var(--_ui5wcr_ObjectPage_tab_bar_inline_padding);
-    box-shadow: none;
   }
 }
 

packages/main/src/components/ObjectPage/index.tsx

@@ -726,6 +726,8 @@ const ObjectPage = forwardRef<ObjectPageDomRef, ObjectPagePropTypes>((props, ref
                   : `${topHeaderHeight}px`,
             }}
           >
+            {/* Spacer required to prevent overlapping of tabbar btns and expand/pin btns*/}
+            <div aria-hidden="true" className={classNames.tabContainerSpacer} />
             <TabContainer
               collapsed
               onTabSelect={handleTabSelect}