Contenuto v1.0.0

Conto alla rovescia

Timer animato con conto alla rovescia verso una data obiettivo. Lo stile semplice mostra numeri con etichette. Lo stile flip riproduce un effetto orologio a palette 3D con schede divise e animazioni CSS keyframe.

Semplice

Numeri con etichette sotto ogni unità, separati da due punti

Opzioni

Nome Tipo Predefinito Descrizione
target_date * String obbligatorio ISO 8601 date/time string to count down to
show_days Boolean true Whether to display the days unit
show_hours Boolean true Whether to display the hours unit
show_minutes Boolean true Whether to display the minutes unit
show_seconds Boolean true Whether to display the seconds unit
expired_message String "Time's up!" Message shown when countdown reaches zero
labels Hash { days: "Days", hours: "Hours", minutes: "Minutes", seconds: "Seconds" } Custom labels for each time unit
size Symbol :md Size variant: :sm, :md, :lg

Flip

Animazione orologio a palette 3D con schede divise e trasformazioni prospettiche

Opzioni

Nome Tipo Predefinito Descrizione
target_date * String obbligatorio ISO 8601 date/time string to count down to
show_days Boolean true Whether to display the days unit
show_hours Boolean true Whether to display the hours unit
show_minutes Boolean true Whether to display the minutes unit
show_seconds Boolean true Whether to display the seconds unit
expired_message String "Time's up!" Message shown when countdown reaches zero
labels Hash { days: "Days", hours: "Hours", minutes: "Minutes", seconds: "Seconds" } Custom labels for each time unit
size Symbol :md Size variant: :sm, :md, :lg

Registro delle modifiche v1.0.0

- v1.0.0: Initial release with simple and flip styles

Ottieni l'Accesso Completo

Sblocca il codice sorgente di questo componente e di tutti gli altri. Un solo pagamento per l'accesso a vita.

Ottieni l'Accesso Ora