fix(core/input): Added new text-alignment property in input fields #2181
Conversation
|
|
/gemini review |
There was a problem hiding this comment.
Code Review
This pull request introduces a new textAlignment property to the ix-date-input, ix-input, ix-number-input, and ix-time-input components, allowing for customization of text alignment. The changes are consistently applied across the core, Angular, React, and Vue packages, and are supported by new documentation and visual regression tests. My review includes a suggestion to simplify the implementation of the text alignment styling, which will also improve internationalization support by using modern CSS properties. Overall, this is a valuable enhancement.
| style={{ | ||
| textAlign: this.textAlignment === 'end' ? 'right' : 'left', | ||
| }} |
There was a problem hiding this comment.
The text-align CSS property supports start and end values directly. Using these values is better for internationalization as it respects the text direction (LTR/RTL). You can simplify the code by removing the ternary operator.
| style={{ | |
| textAlign: this.textAlignment === 'end' ? 'right' : 'left', | |
| }} | |
| style={{ | |
| textAlign: this.textAlignment, | |
| }} |
There was a problem hiding this comment.
Updated the code accordingly.
| style={{ | ||
| textAlign: props.textAlignment === 'end' ? 'right' : 'left', | ||
| }} |
There was a problem hiding this comment.
The text-align CSS property supports start and end values directly. Using these values is better for internationalization as it respects the text direction (LTR/RTL). You can simplify the code by removing the ternary operator.
| style={{ | |
| textAlign: props.textAlignment === 'end' ? 'right' : 'left', | |
| }} | |
| style={{ | |
| textAlign: props.textAlignment, | |
| }} |
There was a problem hiding this comment.
Updated the code accordingly.
| style={{ | ||
| textAlign: this.textAlignment === 'end' ? 'right' : 'left', | ||
| }} |
There was a problem hiding this comment.
The text-align CSS property supports start and end values directly. Using these values is better for internationalization as it respects the text direction (LTR/RTL). You can simplify the code by removing the ternary operator.
| style={{ | |
| textAlign: this.textAlignment === 'end' ? 'right' : 'left', | |
| }} | |
| style={{ | |
| textAlign: this.textAlignment, | |
| }} |
There was a problem hiding this comment.
Updated the code accordingly.
There was a problem hiding this comment.
I think it would make sense to all four configurations in combination with the text alignment here
There was a problem hiding this comment.
Should I add VRTs for other input configurations where text-alignment works, such as inputs with slots using text-alignment = start?
|
💡 What is the current behavior?
GitHub Issue Number: #
🆕 What is the new behavior?
🏁 Checklist
A pull request can only be merged if all of these conditions are met (where applicable):
pnpm test)pnpm lint)pnpm build, changes pushed)👨💻 Help & support