diff --git a/packages/main/src/components/ObjectPage/ObjectPage.module.css b/packages/main/src/components/ObjectPage/ObjectPage.module.css index 5e7411f6390..90308e807e5 100644 --- a/packages/main/src/components/ObjectPage/ObjectPage.module.css +++ b/packages/main/src/components/ObjectPage/ObjectPage.module.css @@ -60,6 +60,8 @@ margin-block-end: 0.25rem; background-color: var(--sapObjectHeader_Background); display: grid; +} +.hasAvatar { grid-auto-columns: min-content calc(100% - 5rem - 2rem); [data-component-name='ObjectPageHeaderContent'] { diff --git a/packages/main/src/components/ObjectPage/index.tsx b/packages/main/src/components/ObjectPage/index.tsx index a73f12ff081..f21bffa3617 100644 --- a/packages/main/src/components/ObjectPage/index.tsx +++ b/packages/main/src/components/ObjectPage/index.tsx @@ -295,6 +295,7 @@ const ObjectPage = forwardRef((props, ref) Company Logo @@ -302,10 +303,11 @@ const ObjectPage = forwardRef((props, ref) } else { return cloneElement(image, { size: AvatarSize.L, - className: clsx(classNames.headerImage, image.props?.className) + className: clsx(classNames.headerImage, image.props?.className), + 'data-component-name': 'ObjectPageHeaderImage' } as AvatarPropTypes); } - }, [image, classNames.headerImage, classNames.image, imageShapeCircle]); + }, [image, imageShapeCircle]); const scrollToSectionById = (id?: string, isSubSection = false) => { const section = objectPageRef.current?.querySelector( @@ -643,7 +645,10 @@ const ObjectPage = forwardRef((props, ref) headerPinned: headerPinned || scrolledHeaderExpanded, ref: componentRefHeaderContent, children: ( -
+
{avatar} {(headerContent.props.children || titleInHeader) && (
@@ -719,7 +724,6 @@ const ObjectPage = forwardRef((props, ref) } isScrolling.current = setTimeout(() => { - console.log('end scroll'); isProgrammaticallyScrolled.current = false; }, 300);