Logo-size is scaled down in Logo Title component

I am using the customcomponent Logo Title to display the customer logo beside the app-title.

I first specified the header and helperTitle together and the logo is displayed beside. Now, I want to keep the logo as large as it is now, and just drop the helperTitle. But unfortunately when I drop the corresponding property in the app, the logo is automatically scaled down.

Is there a way to prevent this without increasing the container size?

Hello Christoph,

the CC always uses the full height of the titles, either just in your case “Hello World” or plus the subtitle, for the logo size. The background from a design point of view is that the logo and the title should visually form a unit and end on an imaginary line. A workaround would be to fill the subtitle with a space, in which case your container will also be larger. Or place the Logo with an HTML Element.

I hope this helped at least to understand the why it behaves like this.

1 Like

Hi Kyra,
thanks for your fast response and your explanation :slight_smile:
Indeed your suggestion to use an empty space as helperTitle looks really good. I previously tried an empty string, which resulted in a downscaling xD

Just to add some information regarding “tried an empty string”: This is related to the “falsyness” (Falsy - MDN Web Docs Glossary: Definitions of Web-related terms | MDN) in JavaScript (I found the same behavior for empty ‘labels’ in table columns once; credits to @max.toball for the initial explanation).

If you add an empty string for a property in the app.json then it will often* be interpreted as “nothing was configured, continue”. While when using an empty space the property will be “true” and it is used in subsequent operations :slight_smile:

* depending on how the check is actually implemented

1 Like