@financial-times/n-conversion-forms/components/app-banner.jsx

Containing jsx components and styles for forms included on Accounts and Acquisition apps (next-signup, next-profile, next-retention, etc).

import React from 'react';

export function AppBanner() {
	return (
		<div id="appBanner" className="ncf ncf__app-banner">
			<div className="ncf__app-banner-inner">
				<div className="ncf__app-banner-image">
					<img
						alt="FT app"
						src="https://images.ft.com/v3/image/raw/https%3A%2F%2Fft-next-assets-prod.s3-eu-west-1.amazonaws.com%2Fassets%2Fproduct%2Frepublishing-app-packshot-191107.png?source=n-conversion-forms"
					/>
				</div>
				<div className="ncf__app-banner-content">
					<div className="ncf__app-banner-header">Get our free App</div>
					Download the <span className="ncf__app-banner-strong">FT app</span> to
					access articles on the move.
				</div>
				<div className="ncf__app-banner-actions">
					<div className="ncf__app-banner-action ncf__app-banner-action--ios">
						<a
							href="https://itunes.apple.com/app/apple-store/id1200842933?pt=246269&ct=onsite-app-promotion&mt=8"
							target="_blank"
							role="link"
							rel="noreferrer"
						>
							<img
								src="https://www.ft.com/__assets/creatives/tour/apps/ios-download.svg"
								alt="Download from the iOS App store"
								height="35"
							/>
						</a>
					</div>
					<div className="ncf__app-banner-action ncf__app-banner-action--android">
						<a
							href="https://play.google.com/store/apps/details?id=com.ft.news&referrer=utm_source%3Donsite-app-promotion%26utm_campaign%3DOnsite%2520Messaging"
							target="_blank"
							role="link"
							rel="noreferrer"
						>
							<img
								src="https://images.ft.com/v3/image/raw/https%3A%2F%2Fwww.ft.com%2F__assets%2Fcreatives%2Ftour%2Fapps%2Fgoogle-play-badge-3x.png?source=n-conversion-forms"
								height="35"
								alt="Download on Google Play"
							/>
						</a>
					</div>
				</div>
			</div>
		</div>
	);
}