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(input): apply position to .cloned-input only for native themes #30337

Open
wants to merge 1 commit into
base: next
Choose a base branch
from

Conversation

OS-martacarlos
Copy link

Issue number: resolves internal


What is the current behavior?

Using the ionic theme, ion-input inside an ion-accordion , that require a scroll to focus, when clicked , it's text would shift

Screenshot 2025-04-04 at 12 32 22

After some troubleshooting, we identified this visual bug came from logic of addClone, which creates a clone of the input , in order for it to be focusable and working on iOS/Android (code here )

The cloned input has an additional class, cloned-input and, for the ionic theme, the @position mixin was causing the cloned input inset-inline-start to be 0, which meant it was not being placed exactly on top of the "OG" input

What is the new behavior?

There's no longer a visual bug on inputs inside accordions, when using the ionic theme

To fix it, we split the cloned-input class between the input.native and input.common scss files, where the @position mixin is only used in input.native

Does this introduce a breaking change?

  • Yes
  • No

Other information

  • Bug reproduction here
  • With this fix here

@OS-martacarlos OS-martacarlos added package: core @ionic/core package type: bug a confirmed bug report labels Apr 4, 2025
@OS-martacarlos OS-martacarlos self-assigned this Apr 4, 2025
@OS-martacarlos OS-martacarlos requested a review from a team as a code owner April 4, 2025 11:46
Copy link

vercel bot commented Apr 4, 2025

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
ionic-framework ✅ Ready (Inspect) Visit Preview 💬 Add feedback Apr 4, 2025 11:46am

Copy link
Contributor

@thetaPC thetaPC left a comment

Choose a reason for hiding this comment

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

LGTM

@thetaPC thetaPC removed the request for review from christian-bromann April 4, 2025 17:49
@thetaPC thetaPC changed the title fix(input): apply position to cloned-input only for native themes fix(input): apply position to .cloned-input only for native themes Apr 4, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
package: core @ionic/core package type: bug a confirmed bug report
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants