Summary
Move the top-of-screen titles on Home, Search, Dashboard, Calendar, and Settings to the iOS-native Large Title pattern — the title is rendered large at rest and collapses into a standard-height navigation bar as the user scrolls.
Motivation
- Large Titles are the default navigation chrome across Apple's first-party apps (Mail, Messages, Settings, Music, Photos).
- They signal the current screen clearly without a separate header component and reclaim vertical space at the top of long lists.
- Combined with Liquid Glass, the scroll-edge appearance (transparent at top → material when content scrolls behind) is the signature iOS look.
Proposal
Configure each top-level tab's stack screen with options similar to:
{
headerLargeTitle: true,
headerTransparent: true,
headerBlurEffect: "regular",
headerLargeTitleShadowVisible: false,
}
Apply to:
src/app/(tabs)/index/_layout.tsx
src/app/(tabs)/search/_layout.tsx
src/app/(tabs)/dashboard/_layout.tsx
src/app/(tabs)/calendar/_layout.tsx
src/app/(tabs)/settings/_layout.tsx
Settings sub-screens (techniques, tags, favorite-resorts, etc.) should keep compact titles since they are pushed screens.
Notes
- Search bars integrate cleanly with Large Titles via
headerSearchBarOptions — this could replace or complement the existing FilterBar search input.
- Content under the header must account for the collapsible height;
contentInsetAdjustmentBehavior: "automatic" handles this on iOS.
- Android falls back to standard-height headers automatically.
Acceptance criteria
- Home, Search, Dashboard, Calendar, and Settings top-level tabs use Large Title headers on iOS.
- Titles collapse and the header gains a material background as content scrolls under it.
- Content layout does not overlap the collapsible header (top inset respected).
- Android behavior is unchanged or improved (no regressions).
Summary
Move the top-of-screen titles on Home, Search, Dashboard, Calendar, and Settings to the iOS-native Large Title pattern — the title is rendered large at rest and collapses into a standard-height navigation bar as the user scrolls.
Motivation
Proposal
Configure each top-level tab's stack screen with options similar to:
Apply to:
src/app/(tabs)/index/_layout.tsxsrc/app/(tabs)/search/_layout.tsxsrc/app/(tabs)/dashboard/_layout.tsxsrc/app/(tabs)/calendar/_layout.tsxsrc/app/(tabs)/settings/_layout.tsxSettings sub-screens (techniques, tags, favorite-resorts, etc.) should keep compact titles since they are pushed screens.
Notes
headerSearchBarOptions— this could replace or complement the existingFilterBarsearch input.contentInsetAdjustmentBehavior: "automatic"handles this on iOS.Acceptance criteria