Issue Summary

On the “Header” section, the text gets cut off when users try to access the page with text spacing styles turned on.

Steps to Reproduce

1. Try to access the page content with text spacing styles turned on.
2. Observe that the placeholder text gets cut off.

Screenshot

Actual Results

When low-vision users access the page with text spacing styles turned on, the following issues were found

The Placeholder text “Search for code, commits or repositories” in the input field is getting cut off.

As a result, low-vision user users will miss out on this content/essential information if it is not available.

Expected Results

Ensure that there is no loss of content when text spacing is increased.

Review the CSS for the positioning and size of the relevant element. Content container dimensions should be declared in relative units so they can stretch and scale along with increases in text spacing.

Define the text and container sizes using percent (%), em and rem units. In addition, use relative units for defining CSS line-height, letter-spacing and so on properties and ensure that user's text spacing styles are not overridden.

Workaround

Currently, there is no known workaround for this behaviour. A workaround will be added here when available.

Environment

MacBook Pro (16-inch, 2019)
macOs Ventura 13.5.1
Chrome - Version 113.0.5672.63 (Official Build) (x86_64)
Firefox- Version 92.0 (64-bit)
Safari- Version 16.4 (18615.1.26.110.1)
JAWS- Version 2022
NVDA- Version 2021.2
Voiceover - Version Latest