How should we handle buttons when they break out of their containers?
On mobile, we have a few occurences of large buttons breaking out of their container. This is due to a few factors:
- Exceedingly long CTA text
- Wide button padding
- Text-wrap is disabled
I propose we re-enable text-wrap to prevent broken layouts (because an ugly two-line rounded button is at the very least more functional than a button that goes off-page).
In addition, do we want to change the button padding for our size variants for mobile? I fear that it may add too much complexity to our styles but it remains an option.
And lastly, we should have text length limits for CTAs. It's frustrating when SEO requires us to be specific about CTAs, yet we need to remain brief for technical and visual reasons.
E.g. "View All Announcements" is long enough to break the mobile layout.
