google / google/site-kit-wp

Prevent CTA links from wrapping

Open Beginner friendly
#7,393 2 comments 0 reactions 0 assignees View on GitHub
Next Up P2 Type: Enhancement
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

Open the contributing 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

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.