Bug Description

The current implementation of the Shell Bar Web Component imposes a fixed width limit of 60 pixels for custom logos. When a customer provides a logo that exceeds this width, the image is proportionally scaled down to fit within the 60px bounding box. This results in logos appearing smaller than intended, potentially impacting brand visibility and design consistency.

Actual Behavior:
Logos wider than 60px are automatically scaled down, leading to reduced visual prominence.

Impact:
Affects branding for customers with wider logos.

Suggested Fix:
Remove the 60px width constraint to allow dynamic sizing based on the logo's natural dimensions.

Affected Component

Shell Bar

Expected Behaviour

Expected Behavior:
The component should allow for flexible logo dimensions or provide configuration options to accommodate wider logos without forced downscaling. The limitation of maximum of 60px shall be removed. The maximum height of 32px shall remain.

Isolated Example

https://sap.github.io/ui5-webcomponents/play/#eyJpbmRleC5odG1sIjp7Im5hbWUiOiJpbmRleC5odG1sIiwiY29udGVudCI6IjwhLS0gcGxheWdyb3VuZC1mb2xkIC0tPlxuPCFET0NUWVBFIGh0bWw-XG48aHRtbCBsYW5nPVwiZW5cIj5cblxuXG5cbjxoZWFkPlxuICAgIFxuICAgIDxzdHlsZT5cbiAgICAgICo6bm90KDpkZWZpbmVkKSB7XG4gICAgICAgIGRpc3BsYXk6IG5vbmU7XG4gICAgICB9XG5cbiAgICBodG1sIHtcbiAgICAgIGZvcmNlZC1jb2xvci1hZGp1c3Q6IG5vbmU7XG4gICAgfVxuICAgIDwvc3R5bGU-XG5cbiAgICBcbiAgICA8c3R5bGU-XG4gICAgICAqOm5vdCg6ZGVmaW5lZCkge1xuICAgICAgICBkaXNwbGF5OiBub25lO1xuICAgICAgfVxuXG4gICAgaHRtbCB7XG4gICAgICBmb3JjZWQtY29sb3ItYWRqdXN0OiBub25lO1xuICAgIH1cbiAgICA8L3N0eWxlPlxuXG4gICAgPG1ldGEgY2hhcnNldD1cIlVURi04XCI-XG4gICAgPG1ldGEgbmFtZT1cInZpZXdwb3J0XCIgY29udGVudD1cIndpZHRoPWRldmljZS13aWR0aCwgaW5pdGlhbC1zY2FsZT0xLjBcIj5cbiAgICA8dGl0bGU-U2FtcGxlPC90aXRsZT5cbjwvaGVhZD5cblxuPGJvZHkgc3R5bGU9XCJiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1zYXBCYWNrZ3JvdW5kQ29sb3IpXCI-XG4gICAgPCEtLSBwbGF5Z3JvdW5kLWZvbGQtZW5kIC0tPlxuXG4gICAgICAgIDx1aTUtc2hlbGxiYXIgcHJpbWFyeS10aXRsZT1cIlByb2R1Y3QgSWRlbnRpZmllclwiIG5vdGlmaWNhdGlvbnMtY291bnQ9XCI3MlwiIHNob3ctbm90aWZpY2F0aW9ucz5cbiAgICAgICAgICAgIDx1aTUtYnV0dG9uIGljb249XCJtZW51MlwiIHNsb3Q9XCJzdGFydEJ1dHRvblwiPjwvdWk1LWJ1dHRvbj5cbiAgICAgICAgICAgIDxpbWcgc2xvdD1cImxvZ29cIiBzcmM9XCJodHRwczovL3VwbG9hZC53aWtpbWVkaWEub3JnL3dpa2lwZWRpYS9jb21tb25zLzIvMjAvQXJ0aXN0X0dyb3d0aF9XaWRlX0xvZ28ucG5nXCJcIiAvPlxuXG4gICAgICAgICAgICA8dWk1LXNoZWxsYmFyLXNlYXJjaCBzbG90PVwic2VhcmNoRmllbGRcIiBzaG93LWNsZWFyLWljb24gcGxhY2Vob2xkZXI9XCJTZWFyY2ggQXBwcywgUHJvZHVjdHNcIj48L3VpNS1zaGVsbGJhci1zZWFyY2g-XG5cbiAgICAgICAgICAgIDx1aTUtc2hlbGxiYXItaXRlbSBpY29uPVwic3lzLWhlbHBcIiB0ZXh0PVwiSGVscFwiPjwvdWk1LXNoZWxsYmFyLWl0ZW0-XG4gICAgICAgICAgICA8dWk1LWF2YXRhciBzbG90PVwicHJvZmlsZVwiPlxuICAgICAgICAgICAgICAgIDxpbWcgc3JjPVwiaHR0cHM6Ly9zYXAuZ2l0aHViLmlvL3VpNS13ZWJjb21wb25lbnRzL2ltYWdlcy9hdmF0YXJzL21hbl9hdmF0YXJfMy5wbmdcIi8-XG4gICAgICAgICAgICA8L3VpNS1hdmF0YXI-XG4gICAgICAgIDwvdWk1LXNoZWxsYmFyPlxuXG4gICAgPCEtLSBwbGF5Z3JvdW5kLWZvbGQgLS0-XG4gICAgPHNjcmlwdCB0eXBlPVwibW9kdWxlXCIgc3JjPVwibWFpbi5qc1wiPjwvc2NyaXB0PlxuPC9ib2R5PlxuXG48L2h0bWw-XG48IS0tIHBsYXlncm91bmQtZm9sZC1lbmQgLS0-In0sIm1haW4uanMiOnsibmFtZSI6Im1haW4uanMiLCJjb250ZW50IjoiLyogcGxheWdyb3VuZC1oaWRlICovXG5pbXBvcnQgXCIuL3BsYXlncm91bmQtc3VwcG9ydC5qc1wiO1xuLyogcGxheWdyb3VuZC1oaWRlLWVuZCAqL1xuaW1wb3J0IFwiQHVpNS93ZWJjb21wb25lbnRzL2Rpc3QvQXZhdGFyLmpzXCI7XG5pbXBvcnQgXCJAdWk1L3dlYmNvbXBvbmVudHMvZGlzdC9CdXR0b24uanNcIjtcblxuaW1wb3J0IFwiQHVpNS93ZWJjb21wb25lbnRzLWZpb3JpL2Rpc3QvU2hlbGxCYXIuanNcIjtcbmltcG9ydCBcIkB1aTUvd2ViY29tcG9uZW50cy1maW9yaS9kaXN0L1NoZWxsQmFySXRlbS5qc1wiO1xuaW1wb3J0IFwiQHVpNS93ZWJjb21wb25lbnRzLWZpb3JpL2Rpc3QvU2hlbGxCYXJTZWFyY2guanNcIjtcblxuaW1wb3J0IFwiQHVpNS93ZWJjb21wb25lbnRzLWljb25zL2Rpc3QvbWVudTIuanNcIjtcbmltcG9ydCBcIkB1aTUvd2ViY29tcG9uZW50cy1pY29ucy9kaXN0L3N5cy1oZWxwLmpzXCI7XG5pbXBvcnQgXCJAdWk1L3dlYmNvbXBvbmVudHMtaWNvbnMvZGlzdC9jdXN0b21lci5qc1wiOyJ9fQ

Steps to Reproduce

Integrate a custom logo wider than 60px into the Shell Bar Web Component.
Observe how the logo is resized to fit within the 60px width constraint.

Log Output, Stack Trace or Screenshots

Priority

High

UI5 Web Components Version

2.0

Browser

Chrome

Operating System

No response

Additional Context

No response

Organization

SAP

Declaration

• I’m not disclosing any internal or sensitive information.