Install banner

Compact full-width strip pinned just below the environment banner. Encourages authenticated Portal users to install the app on desktop or mobile. Shown by default; hidden when the app is already running in display-mode: standalone or the user has dismissed in the last 7 days (localStorage). Publishes its height to --install-banner-h so the composed --banners-h var on :root resolves to env + install, keeping sidebar / sticky filter headers / modal padding correctly offset.

Prompt mode (default, Chromium)

Default state on Chromium browsers. The Install button calls .prompt() on the cached beforeinstallprompt event if available, or flips the banner to instructions mode if not.

Install Koala for faster access on your home screen.

Instructions mode (Chromium fallback)

Engagement heuristic not yet met — no programmatic prompt available. Clicking Install in prompt mode swaps to this copy pointing at the URL-bar install icon. Auto-flips back to prompt mode if beforeinstallprompt fires later.

Look for the install icon in your browser's address bar.

iOS Safari mode

iOS Safari doesn't fire beforeinstallprompt, so we detect it via user-agent + touch capability and switch the copy to manual Add-to-Home-Screen instructions. The Install button is hidden — there's no programmatic install on iOS.

Tap the share button then "Add to Home Screen" to install Koala.

Usage

Included automatically in _Layout.cshtml at the top of <body> so it spans both the conveyancer / partner sidebar layout AND the client area without duplication. Gated on authenticated user only.

<partial name="_InstallBanner" />

The web manifest at /site.webmanifest and the service worker at /sw.js are the install prerequisites. Both are Portal-only — Legal / Tech / Design ship neither.