All tags/Countdown

A launch countdown

Three units of the time left, counting down every second in the browser with the live option - the server writes the same words first.

1 The data countdown/launch.php php

<?php

  // The launch: twelve days, five hours and a half from now - from half a minute ahead, so
  // the minutes come out round while the page renders.

  $launch = padNow ()->modify ( '+12 days 5 hours 30 minutes 30 seconds' )->format ( 'Y-m-d H:i:s' );

?>

2 The template countdown/launch.pad pad

<section style="text-align:center;padding:28px 36px;border-radius:16px;background:linear-gradient(135deg,#2a78d6,#7c5cff);color:#fff;max-width:30em">
  <p style="margin:0;font-size:13px;letter-spacing:.12em;text-transform:uppercase;opacity:.85">Version 3.0 launches in</p>
  <p style="margin:10px 0 12px;font-size:30px;font-weight:700;font-variant-numeric:tabular-nums">{countdown $launch, units=3, live, past='We are live!'}</p>
  <p style="margin:0;font-size:14px;opacity:.85">{$launch | date('l j F, H:i')}</p>
</section>

3 The result rendered on the server

Version 3.0 launches in

12 days, 5 hours, 30 minutes

Tuesday 3 November, 09:21