27 lines
1.5 KiB
HTML
27 lines
1.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Offline Traveler Converter</title>
|
|
<link rel="stylesheet" href="../shared.css">
|
|
<link rel="manifest" href="manifest.webmanifest">
|
|
</head>
|
|
<body>
|
|
<main class="shell">
|
|
<nav class="topline"><a href="../">All demos</a><a href="/demos.php">Website catalog</a></nav>
|
|
<section class="hero"><p class="kicker">Demo 05</p><h1>Offline Traveler Converter</h1><p>Timezone, currency, and GB/GiB conversion in an installable PWA shell.</p></section>
|
|
<section class="panel">
|
|
<div class="controls">
|
|
<label>Date and time <input id="traveler-time" type="datetime-local"></label>
|
|
<label>Target timezone <select id="traveler-zone"><option value="UTC">UTC</option><option value="America/Mexico_City">Mexico City</option><option value="America/New_York">New York</option><option value="Europe/London">London</option><option value="Europe/Madrid">Madrid</option><option value="Asia/Tokyo">Tokyo</option></select></label>
|
|
<label>USD amount <input id="traveler-amount" type="number" value="100" min="0" step="0.01"></label>
|
|
<label>GB amount <input id="traveler-gb" type="number" value="128" min="0" step="1"></label>
|
|
</div>
|
|
<div id="traveler-output" class="output"></div>
|
|
<p class="note">Currency rates are static demo values. The service worker caches the demo shell for offline use.</p>
|
|
</section>
|
|
</main>
|
|
<script src="traveler-tools.js"></script>
|
|
</body>
|
|
</html>
|