fix: add background color to TextareaField label #3079
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
lemagnetic
requested review from
eduardoformiga and
gabpaladino
and removed request for
a team
|
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. |
- Adjust padding and positioning variables for better alignment - Fix label position on focus and filled states - Add width calculation to prevent label overflow
lucasfp13
approved these changes
Oct 28, 2025
Contributor
lucasfp13
left a comment
lucasfp13
left a comment
There was a problem hiding this comment.
Nice, creating testing stories too 🚀
Just a reminder to resolve the conflicts 🎗️
lariciamota
reviewed
Oct 29, 2025
Contributor
lariciamota
left a comment
lariciamota
left a comment
There was a problem hiding this comment.
suggestion: the disabled state gets weird with the white background, what do you think about changing the label's bkg color also when the textarea is disabled?
Contributor
Author
Thanks for the feedback! |
lariciamota
approved these changes
Oct 30, 2025
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What's the purpose of this pull request?
This PR fixes a visual bug in the TextareaField component where long text would appear underneath the floating label during scroll, making it difficult to read. The issue was identified during the review of PR #2705.
Additionally, comprehensive Storybook documentation was added to showcase all TextareaField variations and use cases.
Gravacao.de.Tela.2025-10-23.as.19.17.16.mov
How it works?
Bug Fix:
--fs-textarea-field-label-background-colorCSS variable topackages/ui/src/components/molecules/TextareaField/styles.scssHow to test it?
Test the scroll bug fix:
From the project root:
pnpm --filter "@faststore/storybook" devOr navigate to the storybook package:
cd packages/storybook pnpm devThen:
References