bug: Ionic 5 ion-picker-column position internationalization when dir="rtl" #21205
Labels
Comments
liamdebeasi
added
package: core
liamdebeasi
added
type: bug
2 tasks
thetaPC
added a commit
that referenced
this issue
May 19, 2023
Issue number: resolves #21205 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> `picker-column` keeps using LTR display when using RTL. LTR: `Column 1 Column 2` RTL: `Column 1 Column 2` ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> `picker-column` correctly displays for RTL. LTR: `Column 1 Column 2` RTL: `Column 2 Column 1` ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> This PR is already being tested through the `picker -> basic` and `picker -> value` screenshots. Due to those tests, a new test is not needed to verify the fix. The current fix is only changing the `picker` and `picker-column`. The `datetime` and `datetime-button` do not change, leaving the format up to the users. It wouldn't change the functionality that was provided through PR #17018. --------- Co-authored-by: ionitron <[email protected]>
|
Thanks for the issue! This has been resolved via PR #27460 and will be available in an upcoming release of Ionic. |
brandyscarney
pushed a commit
that referenced
this issue
May 22, 2023
Issue number: resolves #21205 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> `picker-column` keeps using LTR display when using RTL. LTR: `Column 1 Column 2` RTL: `Column 1 Column 2` ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> `picker-column` correctly displays for RTL. LTR: `Column 1 Column 2` RTL: `Column 2 Column 1` ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> This PR is already being tested through the `picker -> basic` and `picker -> value` screenshots. Due to those tests, a new test is not needed to verify the fix. The current fix is only changing the `picker` and `picker-column`. The `datetime` and `datetime-button` do not change, leaving the format up to the users. It wouldn't change the functionality that was provided through PR #17018. --------- Co-authored-by: ionitron <[email protected]>
|
Fix is available in v7.0.8! |
|
Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out. |
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Bug Report
Ionic version: 5
Current behavior:
ion-picker-column days' component is expicitly set to float on the right (start for ltr languages)
and years' on the left (end of ltr languages)
Expected behavior:
when document's dir="rtl" days' columns should be on the right/start and years' on the left/end
Steps to reproduce:
go to https://ionicframework.com/docs/api/picker
set the example's iframe's document's html-element's dir attribute to
rtlRelated code:
ion-picker-column is absolutely positioned with class names that use "right" and "left" that use
justify-content: flex-end;andjustify-content: flex-start;respectively.Other information:
Ionic info:
not sure exactly, certainly 5+, it's the ionic docs site's https://ionicframework.com/docs/api/picker you can know that.
The text was updated successfully, but these errors were encountered: