Prevent CTA links from wrapping
- Dominant language
- JavaScript
- Stars
- 1.4k
- Forks
- 383
- Avg merge
- 4d 14h
- Merged PRs (30d)
- 77
Description
## Feature Description
While working on [the PR](https://github.com/google/site-kit-wp/pull/7379) for #6259, we [observed](https://github.com/google/site-kit-wp/pull/7379#discussion_r1282360589) that when the CTA links include an additional icon (or similar element) beside the text, the link wraps into multiple lines in smaller viewports. We should consider using something like `white-space: nowrap;` to prevent this if possible.
---------------
_Do not alter or remove anything below. The following sections will be managed by moderators only._
## Acceptance criteria
* All uses of the `assets/js/components/Link.js`, which include an icon, should implement `no-wrap` css so that the icon never wraps to a new line separate to the text for the link.
## Implementation Brief
*
### Test Coverage
*
## QA Brief
*
## Changelog entry
*
Contributor guide
Research direction
Start with assets/js/components/Link.js, then inspect each usage that includes an icon and the existing component test setup. Done means every such CTA link keeps its icon and text on one line at small viewports, with responsive checks covering the behavior.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css, javascript
- Domain
- frontend
- Issue type
- Feature
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 67/100