fix(mobile): keep QuickAdd dialogs above the on-screen keyboard

[chhoumann]

Summary

On a phone the on-screen keyboard covered the lower part of QuickAdd dialogs (#2132): the date prompt's Ok, the multi-select's Cancel and Done, and in the macro builder the field being typed in, under the pinned footer. Obsidian keeps a modal centered on the whole screen and lays the keyboard over it.

• .is-phone .modal-container.quickAddModal ends at the keyboard (bottom: var(--keyboard-height)) and redefines --dialog-max-height with core's phone formula minus the keyboard, so a dialog sits in the space above it. A top padding of min(--keyboard-height, top inset) keeps it under the status bar only while the keyboard is up.
• The pinned footer (one-page form, builders) no longer pads itself by the keyboard height, which Obsidian puts into --safe-area-inset-bottom while the keyboard is up.
• A text or date prompt's action row is sticky at the bottom of its scroll area, so Ok stays visible when the prompt is taller than that space.
• Obsidian's own keyboard scroll measures the document selection, which for an <input> is not the field. Once the keyboard is up (keyboardDidShow), QuickAdd scrolls the focused field in a QuickAdd dialog back into view.

With the keyboard down every dialog and button is where it was: measured on the phone, the modal and button rects of the text prompt, date prompt, multi-select and one-page form are identical to dd59057.

An earlier try that padded each dialog by the keyboard height also kept the buttons visible, but the dialog then stretched down to the keyboard and the tall date prompt scrolled its input out of view, so it was dropped.

Before / after (iPhone, iOS 18.7, Obsidian 1.14.3)

Before	After
Multi-select: Cancel/Done at y 642-686 under a keyboard starting at 592

(The "after" screenshots are from the same CSS and listener injected into the 2.30 candidate on the phone; the built PR was then deployed to the phone and measured with the real keyboard: date input 150-194 and Ok 559-595, multi-select Done 501-545, one-page last field 496-540 above Submit, macro script field 491-535 with the footer starting at 535, keyboard top at 611.)

Testing

• tests/e2e/phone-keyboard.test.ts (desktop Obsidian, phone classes, --keyboard-height: 345px): the date prompt's field and Ok, the multi-select's Done, and the macro builder's script field after keyboardDidShow are above the keyboard. All three fail on master; with only the CSS (no listener) the macro test fails on its last assertion.
• pnpm run test: 6607 passed, 33 skipped.
• pnpm run build-with-lint: clean.

Release impact

Phone only. No settings or data change. The issue is older than 2.30 (2.29.0 behaves the same).

Fixes #2132

Summary by CodeRabbit

• Bug Fixes
  • On phones, QuickAdd modals now stay visible above the on-screen keyboard, with focused fields and key actions kept in view.
• Tests
  • Added coverage for keyboard behavior in date prompts, multi-select prompts, and the macro builder.

Note

Fix QuickAdd mobile dialogs being hidden by the on-screen keyboard

Keeps QuickAdd modal inputs and action buttons visible when the mobile keyboard opens.

• Adds keepFocusedFieldInView, which listens for the keyboard-shown event and scrolls the focused field inside a QuickAdd modal into view; wired up in main.ts during plugin load.
• Reworks phone modal layout in styles.css: modal containers are capped to the viewport above the keyboard, footers subtract keyboard height from their padding, prompt action controls are sticky while content scrolls, and the searchable multi-select dialog honors the phone height cap.
• Adds E2E tests in phone-keyboard.test.ts covering date prompts, multi-selects, and the macro builder under a simulated phone keyboard.
• Behavioral Change: phone footer padding and modal sizing now depend on the --keyboard-height custom property; modals reposition above the keyboard instead of sitting under it.

^{Macroscope summarized 678494a.}

[chatgpt-codex-connector]

Codex Review Summary

This comment shows the latest Codex review activity on this pull request.

Review	Status	Commit	Review trigger
📝 Code Review	✅ Completed 2026-10-02T07:55:00.899674Z	a68896a	PR opened

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review" or "@codex security review".

Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings.

[coderabbitai]

Navigate logical layers of code changes, visualize relationships, and explore their blast radius.

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Advanced

Run ID: 8d544d03-a90e-4490-87aa-285232b3bf11

📥 Commits

Reviewing files that changed from the base of the PR and between a68896a and 678494a.

📒 Files selected for processing (2)

• src/styles.css
• tests/e2e/phone-keyboard.test.ts

Included review availability: This review used your included allowance. Your plan provides up to 8 included reviews per hour; 4 remain after this review.

---

📝 Walkthrough

Walkthrough

Phone QuickAdd modals adjust their layout when the on-screen keyboard is open. A keyboard event also scrolls the focused field into view when it is inside a QuickAdd modal.

Changes

Phone keyboard visibility

Layer / File(s)	Summary
Modal layout and prompt actions src/styles.css, tests/e2e/phone-keyboard.test.ts	Phone modal positioning, footer padding, and sticky prompt actions account for the keyboard. The searchable multi-select modal also respects --dialog-max-height. End-to-end tests check that date prompt controls and the multi-select Done button remain above a simulated keyboard.
Focused field scrolling src/gui/keepFocusedFieldInView.ts, src/main.ts, tests/e2e/phone-keyboard.test.ts	Startup registers a listener that scrolls the active HTML element into view after keyboardDidShow when the element is inside a QuickAdd modal. An end-to-end test checks the macro-builder script field.

Priority: ➖ Normal

Estimated code review effort: 2 (Simple) | ~10 minutes

Change: Bug fix · Severity of issue fixed: Medium

Merge Risk: ⚪ Minimal · up to 67849

The phone keyboard changes have no confirmed merge-blocking issue. Desktop dialog sizing remains unverified.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly and concisely describes the primary change: keeping mobile QuickAdd dialogs above the on-screen keyboard.
Linked Issues check	✅ Passed	Issue #2132 requires phone dialogs to stay above the keyboard, keep actions visible, and keep the focused field in view. The CSS bounds phone modals above --keyboard-height, keeps prompt actions vis…
Out of Scope Changes check	✅ Passed	The changes stay within issue #2132. The helper, mobile CSS, and end-to-end tests directly implement or verify keyboard positioning, visible actions, and focused-field visibility. No unrelated product…
Docstring Coverage	✅ Passed	Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 1 functions across 3 files. (1 skipped: 1 …

✨ Finishing Touches

📝 Generate docstrings

• Commit to this branch
• Create a new PR

🧪 Generate unit tests (beta)

• Commit to this branch
• Create a new PR

• Autopilot · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Autopilot is currently an internal CodeRabbit preview.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{A rabbit taps the keys below,
The modal shifts above the glow.
The date and Done stay in sight,
A focused field scrolls up just right.
The keyboard rests; the checks all pass,
Then hops away through meadow grass.}

_{Comment @coderabbitai help to get the list of available commands.}

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: a68896a57e

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".