Improve survey banner styles for longer text
What does this MR do and why?
The survey banner looks a little off when it has multiple lines of text in it. This MR cleans up a few things:
- Increases text line-height.
- Removes the tanuki icon. It's misaligned when text is long, and icons are intended to support the meaning of the alert banner (https://design.gitlab.com/components/alert#structure). The tanuki icon was leftover from a previous banner implementation.
- Sets a max-width on the text to improve readability on the homepage, where the banner goes full-width.
Screenshots, screen recordings, or links to review app
| Before | After |
|---|---|
 |
 |
Here's how it'd look if it was short:
| Before | After |
|---|---|
 |
 |
Homepage:
| Before | After |
|---|---|
 |
 |
How to set up and validate locally
Numbered steps to set up and validate the change are strongly suggested.
-
Configure a local GitLab Docs environment: https://gitlab.com/gitlab-org/gitlab-docs/-/blob/main/doc/setup.md. -
Take a look at the survey banner on an interior page, and on the homepage. It should be more legible than it is now.
Note: If you've dismissed the banner previously, you might need to clear your cookies to see it again. Banner state is saved for 30 days.
Merge request acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this merge request.
Edited by Sarah German