Skip to content
This repository has been archived by the owner on Mar 27, 2023. It is now read-only.

fix(a11y): removing restriction for banner/app alerts to be one line #5233

Merged

Conversation

mathisscott
Copy link
Contributor

• removed height restrictions forcing banner alerts to be one line
• removed truncation on banner alerts from CSS
• it is recommended that apps NOT wrap the content inside a banner alert but sometimes that is not realistic
• given the current implementation of banner alerts it is recommended that paging through multiple alerts uses either opacity or visibility instead of display: none CSS styles so that content jumping can be avoided <= @Shijir for app-alert pagination demo!!!

Signed-off-by: Scott Mathis smathis@vmware.com

PR Checklist

Please check if your PR fulfills the following requirements:

  • Tests for the changes have been added (for bug fixes / features)
  • Docs have been added / updated (for bug fixes / features)
  • If applicable, have a visual design approval

PR Type

What kind of change does this PR introduce?

  • Bugfix
  • Feature
  • Code style update (formatting, local variables)
  • Refactoring (no functional changes, no api changes)
  • Build related changes
  • CI related changes
  • Documentation content changes
  • clarity.design website / infrastructure changes
  • Other... Please describe:

What is the current behavior?

Banner alerts are forced to remain one-line tall and truncate any content overflow

Issue Number: In a11y backlog

What is the new behavior?

Banner alert content wraps.

Screen Shot 2020-10-30 at 1 57 29 PM

Does this PR introduce a breaking change?

  • Yes
  • No

CC: @scroniser

• removed height restrictions forcing banner alerts to be one line
• removed truncation on banner alerts from CSS
• it is recommended that apps NOT wrap the content inside a banner alert but sometimes that is not realistic
• given the current implementation of banner alerts it is recommended that paging through multiple alerts uses either opacity or visibility instead of display: none CSS styles so that content jumping can be avoided.

Signed-off-by: Scott Mathis <smathis@vmware.com>
@mathisscott mathisscott merged commit 89f4d03 into vmware-archive:next Nov 3, 2020
@mathisscott mathisscott deleted the fix/a11yMakeBannerAlertsRap branch November 3, 2020 14:31
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants