Improve wrapping of `.s-progress--label`

[dancormier]

.s-progress--labels that wrap don't affect the height of its' parent. This could be seen as a feature instead of a bug, but it results in some kinda ugly elements.

See also: #807 (review)

[ondrejkonec]

Hi @dancormier

I would like to take care of this. Do you think that you can contact Design team that can tell us how should the component behave if there is not enough space for it?

There is my suggestion:

This is not ideal, but at least it is not broken. Those who create pages with these elements should consider the content and shorten it as needed. But if by chance there is content where it can't be displayed well, at least it won't look like an error.

What do you think?

[dancormier]

Hi @ondrejkonec and thanks for the suggestion! This is a design issue so I'm not the one to make the call, but I'd love to change these elements to have flexible height instead of overflowing awkwardly or truncating the text. I believe that would be a more accessible solution since it would avoid loss of content.

At the moment, this is a lower-priority item for our design team so I can't promise we'll address it soon, but having this feedback is valuable!

[ondrejkonec]

Thanks for reply @dancormier and for more information.

That sounds reasonable! If you have design for this and if you feel that I can rebuild this component, please, feel free to write here and I will take care about implementation.