Title overflows when the screen is too narrow
Closed this issue · 5 comments
When the title is too long and the screen is too narrow, the title overflows the header.
Just adding ellipsis is not enough, since a couple of toolbar icons eat the available space.
Some space can be reclaimed from the toolbar by implementing #42
However:
- The overflow only happens when the title breaks into three or more lines. If there are only two lines, there are no issues:
- In normal mode, adding ellipsis forces the title to fit in a single line, which would be a worse outcome for medium-sized titles
- In compact mode, only one line can fit, and adding ellipsis fixes the issue:
I'm still undecided on what would be the expected behavior in normal mode.
I think that the problem with normal mode is that the icon size for the logo is not the same size as the other icons. If the icon would be smaller (or the same size than the other ones), then having only one line with ellipsis would make sense.
Another thing is that splitting in two lines would end up in the same problem if the title is very long. The title should always be in one line with ellipsis, if another behavior is needed, you could add your own as a component and configure the title in the way it's needed.
if another behavior is needed, you could add your own as a component and configure the title in the way it's needed.
That feature is currently not implemented: the title is always a String and it cannot be replaced with a Div or another component because AppToolbar handles the wrapping. (It would be a good idea though, since it would enable breadcrumbs or other advanced use cases)
Oh, yes, I was thinking about leaving the title empty and then adding a custom component to represent the title, but now I remember that they go to the right (because they are meant for creating toolbar things).
Anyway, giving that it's something that it would be nice to have in the future, maybe we could just leave it with ellipsis for now, what do you think?
AbstractFcAppRouterLayout was removed in version 4.0.0 (#85). Now it's possible to add arbitrary components to the, title and they can be styled as needed.