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

Upgrading to Svelte 4 breaks password ion-inputs styling #95

Open
andonimichael opened this issue Jan 21, 2024 · 0 comments
Open

Upgrading to Svelte 4 breaks password ion-inputs styling #95

andonimichael opened this issue Jan 21, 2024 · 0 comments

Comments

@andonimichael
Copy link

When upgrading to Svelte 4 (both 4.0.0 and the newest release 4.2.9) all type="password" ion-inputs lose their styling. This seems to be due to adding the parameters to both the <ion-input> and underlying <input> tags, whereas previously they would only appear on the <input> tags. Removing the type="password" restores the underlying style and functionality.

Additionally, on mobile, this breaks the input keyboard, which gets stuck at the bottom of the screen.

Previous HTML:
Screenshot 2024-01-21 at 2 01 33 PM

After upgrading to Svelte 4:
Screenshot 2024-01-21 at 2 01 00 PM
Screenshot 2024-01-21 at 2 10 10 PM

Example code:

<ion-list>
    <ion-item>
        <ion-input
            name="password"
            type="password"
            label="Password:"
            label-placement="floating"
            autocomplete="current-password"
            autocapitalize="off"
            inputmode="text"
            spellcheck={false}
            clear-on-edit
            required
            />
    </ion-item>
</ion-list
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant