Countdown

Examples for the ss-c-countdown module.

Inline numbers

: :
HTML
<span class="ss-c-countdown">
            <span style="--ss-countdown-value: 23"></span>:
            <span style="--ss-countdown-value: 47"></span>:
            <span style="--ss-countdown-value: 12"></span>
        </span>

Live Countdown (TypeScript-driven)

Driven by the Countdown class (src/ts/content/Countdown.ts), auto-initialized by initializeStylescape(). Set data-countdown-seconds or data-countdown-to on the container.

: :
HTML
<span
        class="ss-c-countdown"
        data-countdown-seconds="3600"
        style="font-size: 2rem"
    >
        <span data-unit="hours" style="--ss-countdown-value: 0"></span>
        :
        <span data-unit="minutes" style="--ss-countdown-value: 0"></span>
        :
        <span data-unit="seconds" style="--ss-countdown-value: 0"></span>
    </span>