plbabin commented 2 years ago

Problem

When the variable preview is too long, it stays on the same line, making it impossible to read the fallback content

Fix

We remove the white-space:nowrap;and set a min-height. that way it can span on multiple line if needed. Not the prettiest render since it's an inline node within a paragraph, but we are shooting for usability here

Write to your heart's content, include:

[ ] A link to the Figma design in your story (list regularly updated here)
[ ] A link to the Story(ies) in the description
[ ] Is there a Jira ticket associated?
[ ] If useful, add screenshots or videos
[ ] If useful (and unclear), add a little explanation of why a certain path was taken
[ ] Instructions on how to test
[ ] Found any restrictions/limitations? Let us know!

Guidelines

Make sure the pull request:

[ ] Follows the established folder/file structure
[ ] Adds unit tests
[ ] If it is a refactor or change to an existing component, have you verified it won't break existing Cypress tests or have you updated them?
[ ] Did you verify some accessibility (a11y) basics?
[ ] Adds/updates stories. Guidelines
[ ] Adds/updates documentation (ie proptypes) Guidelines
[ ] Has it been tested in Help Scout's supported browsers?
[ ] Requests review from designer of the feature
[ ] Add label (bug? feature?)