fix: ios home screen app height

[jouni]

Fixes #5576

We can consider adding a feature to the PWA annotation later, if there are requests for that. For now, I assume this fix is enough for the majority of our users.

The bootstrap page update makes sure the app covers the entire viewport height on iOS when opened as a standalone/home screen app.

[cla-assistant]

All committers have signed the CLA.

[github-actions]

Test Results

 1 425 files  ±0   1 425 suites  ±0   1h 23m 55s ⏱️ + 1m 53s
10 035 tests ±0   9 967 ✅ ±0  68 💤 ±0  0 ❌ ±0 
10 507 runs  ±0  10 438 ✅ ±0  69 💤 ±0  0 ❌ ±0 

Results for commit 54c0087. ± Comparison against base commit 8ced9f7.

♻️ This comment has been updated with latest results.

[mstahv]

👍Looks very good! I'm assuming Jouni did the homework and tested with various versions/environments.

I'm currrently doing effectively same setting for "apple-mobile-web-app-status-bar-style" via weird JS hack as it is basically impossible to override on the server-side. Otherwise my app would simply look bad, now it's beatiful background photo can spread to the whole screen estate.

I don't remember if "lvh" height is in use in any of my apps, but I trust the expertise of Jouni here.

[jouni]

I'm assuming Jouni did the homework and tested with various versions/environments.

Well, you’re kinda right – I did that, but only after I opened the PR. Setting up a working Android emulator setup took a bit more effort, and I only now got to testing it. And apparently there is an issue. So hold on for a moment before merging.

Update: done.

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

[vaadin-bot]

Hi @jouni and @platosha, when i performed cherry-pick to this commit to 24.10, i have encountered the following issue. Can you take a look and pick it manually?
Error Message:
Error: Command failed: git cherry-pick 33e3565
error: could not apply 33e3565... fix: ios home screen app height (#24435)
hint: After resolving the conflicts, mark them with
hint: "git add/rm ", then run
hint: "git cherry-pick --continue".
hint: You can instead skip this commit with "git cherry-pick --skip".
hint: To abort and get back to the state before "git cherry-pick",
hint: run "git cherry-pick --abort".

[vaadin-bot]

Hi @jouni and @platosha, when i performed cherry-pick to this commit to 25.0, i have encountered the following issue. Can you take a look and pick it manually?
Error Message:
Error: Command failed: git cherry-pick 33e3565
error: could not apply 33e3565... fix: ios home screen app height (#24435)
hint: After resolving the conflicts, mark them with
hint: "git add/rm ", then run
hint: "git cherry-pick --continue".
hint: You can instead skip this commit with "git cherry-pick --skip".
hint: To abort and get back to the state before "git cherry-pick",
hint: run "git cherry-pick --abort".

[vaadin-bot]

Hi @jouni and @platosha, when i performed cherry-pick to this commit to 24.9, i have encountered the following issue. Can you take a look and pick it manually?
Error Message:
Error: Command failed: git cherry-pick 33e3565
error: could not apply 33e3565... fix: ios home screen app height (#24435)
hint: After resolving the conflicts, mark them with
hint: "git add/rm ", then run
hint: "git cherry-pick --continue".
hint: You can instead skip this commit with "git cherry-pick --skip".
hint: To abort and get back to the state before "git cherry-pick",
hint: run "git cherry-pick --abort".