[MR Widget Eng] - Fix button wrapping when Widget title is too long.

Problem

When the summary computed prop is too long, the widget title causes the tertiaryButtons to wrap.

MR widget configuration

https://docs.gitlab.com/ee/development/new_fe_guide/modules/widget_extensions.html

Screen_Shot_2022-07-17_at_7.24.05_PM

Example of when it wraps

Screen_Shot_2022-07-12_at_8.58.25_PM

Example when the text is shorter but OK

Screen_Shot_2022-07-12_at_9.06.11_PM

Expected

The summary text does not cause the buttons to wrap.

Challenge

It's hard to handle all use cases because we use responsive CSS classes (media queries). The cutoff for when to wrap would be dependent on the length of the text in the tertiaryButtons and how many of those tertiaryButtons exist.

As well as how much text is in the summary. For that reason, media queries, and the responsive css classes used will handle most cases, and will wrap as needed for edge cases.

Possible Solution

Somehow shorten the text copy when the approval required message is rendered

Edited by -