Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(Textfield): Disable word-wrapping inside prefix and suffix #2177

Merged
merged 1 commit into from
Jul 22, 2024

Conversation

ErlingHauan
Copy link
Contributor

@ErlingHauan ErlingHauan commented Jul 17, 2024

Description

We encountered an issue in Altinn Studio when we added prefix and suffix to the Textfield component. When a text inside a prefix/suffix contains a hyphen, a line break is created and the container overflows vertically.

The issue can be solved by adding white-space: nowrap to the prefix and suffix classes.

Screenshots

This is from testing in local Storybook.

Before:
prefix-before

After:
prefix-after

@ErlingHauan ErlingHauan changed the title fix: disabled word-wrapping inside prefix and suffix in the Textfield… fix: disable word-wrapping inside prefix and suffix in the Textfield component Jul 17, 2024
@ErlingHauan ErlingHauan marked this pull request as ready for review July 17, 2024 11:45
@mimarz mimarz changed the title fix: disable word-wrapping inside prefix and suffix in the Textfield component fix(Textfield): Disable word-wrapping inside prefix and suffix Jul 22, 2024
Copy link
Collaborator

@mimarz mimarz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good catch!

Although we don't recommend having to long prefix/suffixes, it should always stay on the same line nonetheless :)

Since you are on vacation I fixed the title for you, as we use coventional commit scope for affected component(s).

Due to big changes in upcoming major version, this fix will not be released until v1.0.0.

@mimarz mimarz merged commit 85df76c into digdir:next Jul 22, 2024
1 of 7 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants