fix(ios): keep note editor controls above virtual keyboard

The CDK overlay container does not shrink with Capacitor's resize:'native'
mode on iOS, so position:fixed dialogs extend behind the virtual keyboard,
hiding the Save/Close buttons.

- Subtract --keyboard-height from the fullscreen markdown dialog height when
  the iOS keyboard is visible, keeping controls above the keyboard
- Enable the native iOS accessory bar so a "Done" button appears above the
  keyboard, giving users a clear dismiss affordance
This commit is contained in:
Johannes Millan 2026-04-15 15:57:01 +02:00
parent a098f74844
commit a4fe03272a
2 changed files with 10 additions and 0 deletions

View file

@ -469,6 +469,9 @@ export class GlobalThemeService {
* Adds/removes CSS classes when keyboard shows/hides.
*/
private _initIOSKeyboardHandling(): void {
// Show the native iOS accessory bar ("Done" button) above the keyboard
Keyboard.setAccessoryBarVisible({ isVisible: true });
Keyboard.addListener('keyboardWillShow', (info: KeyboardInfo) => {
Log.log('iOS keyboard will show', info);
this.document.body.classList.add(BodyClass.isKeyboardVisible);

View file

@ -18,6 +18,13 @@
padding-top: var(--mac-title-bar-padding);
}
// On iOS, the virtual keyboard overlaps position:fixed elements since the CDK
// overlay container does not shrink with Capacitor's resize:'native' mode.
// Subtract the keyboard height so Save/Close buttons stay above the keyboard.
:host-context(body.isNativeMobile.isKeyboardVisible) {
height: calc(100% - var(--keyboard-height, 0px));
}
.formatting-toolbar {
display: flex;
flex-wrap: nowrap;