franksignorini/unlayer-itinerary-kit

Aurora Itinerary Kit is a template for a travel booking confirmation, built as an entry for a challenge run by Unlayer, a tool for designing emails and web pages. The idea is that a single set of React components can produce three different outputs from the same data: a confirmation email that works across email apps, a live web page version of the itinerary, and a print ready PDF version, all showing the same trip details laid out consistently. What makes this template stand out is that it separates the visual brand from the actual template code. Someone reusing this kit only needs to edit two files: one describing the brand, such as colors, fonts, and logos, and one describing the booking details, such as flight times and passenger names. The rest of the template does not need to change. To prove this works, the project ships with two different visual styles built from the exact same underlying components, showing that only the surface look changes while the layout logic stays the same. Running the build command produces ready to use files: the email as HTML, the web page as HTML, the printable document as both HTML and a real PDF, a plain text version of the email for email clients that need it, and a JSON file that can be loaded directly into Unlayer's visual design editor so a non-technical person could tweak it further. The template also includes three custom visual elements built specifically for this project: a scannable style barcode strip, a dashed flight path map with a plane icon, and a perforated ticket edge effect, each one designed to render correctly across email, web, and print formats. While building this, the author found and reported a bug in Unlayer's own rendering library, which has since been fixed for other users. This project is aimed at developers who build travel or booking related products and want a working example of sending the same visual design across email, web, and PDF from one codebase, rather than maintaining three separate templates by hand.