[BUG] Drawer modal height changes when focus switches between input fields on mobile device

[KemalPajevic]

• I have written a good issue

Describe the bug

If you have a drawer modal with multiple input fields, switching between the fields changes the height of the drawer on a mobile device (tested on iOS and Android).

In an Capacitor iOS app, it seems to loose the additional height it needs to offset the keyboard.
In a web page opened in iOS Safari or Android Chrome the behavior seems more erratic (se the screen recording below).

Describe how to reproduce the bug

1. Add a component with multiple input fields.
2. Open a drawer with that component.
3. Switch focus between the input fields.
4. See that the drawer height changes.

A demo of the issue can be seen on this Stackblitz (open it in a mobile browser).

Which Kirby version was used?

9.7.2 and 10.0.0.

What was the expected behavior?

The height remains the same.

Add any screenshots

Capacitor app in iOS:

RPReplay_Final1731507653.mov

In a web page in iOS Safari:

ScreenRecording_12-03-2024.20-17-03_1.mov

Please complete the following information:

• OS: iOS, Android
• Browser: Safari, Chrome

---

Checklist:

The following tasks should be carried out in sequence in order to follow the process of contributing correctly.

Verification

To make sure the bug is not intended behaviour; it should be verified by a member of team Kirby before moving on to implementation.

• Make sure the NOT verified label has been removed by a member of team Kirby; do not proceed until this is done.

Implementation

The contributor who wants to implement this issue should:

• Make sure you have read: "Before you get coding".
• Signal to others you are working on the issue by assigning yourself.
• Create a branch from the develop branch following our branch naming convention.
• Create a test that reproduces the bug following guidelines in: "The good: Test".
• Write code to fix the bug

Review

Once the issue has been implemented and is ready for review:

• Do a self-review.
• Create a pull-request.