App Download Banner

A call-to-action banner promoting the Zostel mobile app with a feature checklist, App Store and Google Play buttons, and a QR code.

Preview

Download the Zostel App

Book hostels, manage trips, and explore destinations on the go.

  • Instant booking
  • Exclusive deals
  • Trip planning
  • 24/7 support

Usage

tsx
import { AppDownloadBanner } from "zostel-ui";

<AppDownloadBanner
  title="Download the Zostel App"
  description="Book hostels, manage trips, and connect with the community."
  features={[
    "Instant booking confirmation",
    "Exclusive app-only deals",
    "Real-time trip updates",
  ]}
  appStoreUrl="https://apps.apple.com/zostel"
  playStoreUrl="https://play.google.com/zostel"
  qrCodeUrl="/images/qr-code.png"
/>

Props

title
Type: string
Default: "Download the Zostel App"

Banner heading text

description
Type: string
Default: —

Supporting description text

features
Type: string[]
Default: —

Checklist of feature bullet points

appStoreUrl
Type: string
Default: —

App Store download link

playStoreUrl
Type: string
Default: —

Google Play download link

qrCodeUrl
Type: string
Default: —

QR code image URL
Previous Filter Bar Next Itinerary Timeline