Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix(ios): scroll assist sizes input correctly (#27253)
Issue number: resolves #27249 --------- <!-- Please refer to our contributing documentation for any questions on submitting a pull request, or let us know here if you need any help: https://ionicframework.com/docs/building/contributing --> <!-- Some docs updates need to be made in the `ionic-docs` repo, in a separate PR. See https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#modifying-documentation for details. --> <!-- 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. --> The cloned input/textarea for scroll assist is not sized correctly. For legacy inputs, this causes the clone to be off by ~1px because it does not have the correct height. For modern inputs, this causes the same bug as the legacy inputs plus cloned inputs overlap any floating/stacked labels. This was not a concern for legacy inputs because those inputs did not contain the label element where modern inputs do. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Sets `bottom: 0` for cloned inputs so they have the correct height - Sets `position: relative` on the `.native-wrapper` so the cloned input does not flow outside of the parent container. **Before** | Modern Input | Legacy Input | | - | - | | <video src="https://user-images.githubusercontent.com/2721089/233385644-3c15f98e-2646-41e1-b206-34c505791bde.MP4"></video> | <video src="https://user-images.githubusercontent.com/2721089/233385681-8d682222-44b4-4cdc-b0de-96ed3fd38792.MP4"></video> | (Note: The legacy input bug is subtle -- the input only shifts by ~1px) **After** | Modern Input | Legacy Input | | - | - | | <video src="https://user-images.githubusercontent.com/2721089/233385911-243dea95-39b4-4d81-bfe9-26e52382a702.mp4"></video> | <video src="https://user-images.githubusercontent.com/2721089/233386237-2c9eede3-ca91-429b-8a35-15428529a883.mp4"></video> | ## 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. -->
- Loading branch information