[IllustratedMessage]: content is vertically stretched instead of centered

[kozubikmichal]

Bug Description

Since the new UI5 Web Components version 1.23.1 the IllustratedMessage component is not using the available space properly. In previous version (1.22.0) the content was centered and the illustration + text were right under each other.

In 1.23.1 there's a gap between the illustration and text depending on the size of the container. I believe this is not intentional, as it would require the host app to always take care of that, which is inconsistent with previous behavior

Affected Component

No response

Expected Behaviour

Content should be centered with no gap between the illustration and texts (same behavior as in prev version)

Isolated Example

https://stackblitz.com/edit/vitejs-vite-hht5hq?file=src/App.tsx

Steps to Reproduce

1. Open the attached sandbox (it's using React wrappers, but the issue is the same)
2. See the rendered output

Log Output, Stack Trace or Screenshots

Priority

None

UI5 Web Components Version

1.23.1

Browser

Chrome

Operating System

No response

Additional Context

No response

Organization

SAP

Declaration

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

[niyap]

Hello @kozubikmichal,

Thanks for sharing your findings!
Actually, the issue was already reported and fixed with the following PR: #8566
You can test it using UI5 Web Components version 1.24.0

Kind Regards,
Niya

[kozubikmichal]

Hi @niyap
thanks for the info, we'll give it a try!

Regards
Michal