Skip to content

Phone app: keep screens clear of the iPhone Duo cover screen rail - #267

Merged
danielehrhardt merged 1 commit into
mainfrom
fix/mobile-duo-rail-overlap
Oct 30, 2026
Merged

danielehrhardt merged 1 commit into
mainfrom
fix/mobile-duo-rail-overlap

Conversation

@danielehrhardt

Copy link
Copy Markdown
Contributor

On the iPhone Duo cover screen, iOS puts the status bar, the tab bar and the header buttons in a column on the right (84 pt right safe-area inset). Our screens ignored side insets, so the composer, cards and list rows ran under the rail.

  • usePageStyle() in lib/theme.ts: background plus left/right safe-area padding
  • Used as contentStyle in the root stack and in TabStack; (tabs) and the settings modal keep a plain background because their nested stacks already pad (no double inset)
  • No change on regular iPhones in portrait (side insets are 0); landscape now also keeps clear of the notch

Tested on the iPhone Duo simulator (iOS 27.1, cover display) against a sandbox core: Home, Chats, chat, New chat sheet, Settings, light and dark. JS only.

Before After After (dark)
Chat Settings

The cover screen puts the status bar, tab bar and header buttons in a
column on the right (84 pt safe-area inset). Screens ignored side insets,
so cards and the composer ran under the rail. Stack screens now pad by
the left/right safe-area insets; (tabs) and the settings modal skip it
because their nested stacks already pad.
@danielehrhardt
danielehrhardt merged commit 28ca5c3 into main Oct 30, 2026
8 checks passed
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

Successfully merging this pull request may close these issues.

1 participant