Toast
Notifiche toast impilabili e banner per messaggi flash per il feedback all'utente. Supporta le varianti successo, errore, avvertimento e informazione con posizione configurabile, durata di chiusura automatica e stili visivi multipli.
Predefinito
Notifica toast singola impilabile con accento bordo sinistro
███
█████ █████████ █████████
██████
███ ██████ ███████████████████ ████████ █████████ ████████ ████████ ██
███ ██████ ███████████████████ ██████ ████████ ████████ ██████████ ████ ███████ ████████ ██████ ██
███ ██████ ███████████████████ ████████ █████ ██████ ████████ ██████ █████████ █ ██
██
██
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ██████ █ █ █████████ █ █████ ███████ ████████ ████ █ █
█████████ █
██████████████████████████ █ ███
████████████████████████████ █ █████████████████████
█████████████████████████████ █ ████████ █████ █████ █████████ █████ █████
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ███████████
██████ ██████ █ █
████████████ █ █████ ████████ ████████ ████ ██
█████████ █ █████ ███████ ████████ ████ █
█
█████████ █
████ ██████████ █████████████ ███
███████████████████████
██████████████████████████████ █████████ ███
████████████████████████████████████ █████████████████████████
████████████
██████████████████████
█████ ██████████ ████████████ ████
███ ██████████████████████ ██
███████
████ █████████████ █████████
█ ██████████████████████ ████
█████ ██████████████ █ ███████████████████
████████ █ ██████████ █████ ███████ ████████████
███████████ ███████ █████████ █████████ █████████████ █████████
███ ████████████████████ ██████ ████ ████████ ██████ ████████████ █████ █████████ █████ ████████
██████ █ █████
████████ █ ███████
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ██████ █ █ █████████ █ █████ ███████ ████████ ████ █ █
█████████ █
██████████████████████████ █ ███
████████████████████████████ █ █████████████████████
█████████████████████████████ █ ████████ █████ █████ █████████ █████ █████
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ███████████
██████ ██████ █ █
████████████ █ █████ ████████ ████████ ████ ██
█████████ █ █████ ███████ ████████ ████ █
█
█████████ █
Flash standard
Banner a larghezza piena in cima alla pagina per i messaggi flash di Rails
███
█████ ████████ █████ █████████ █████████
██████████ ██████ ██ ███ ██ ████ ███ █████ █████ █████████
███████ █ █████ ████ ███ ███████ ████ ███████ ██ █ ███████████ ███████
██████
███ ██████ ██████████████████████████████████ █████████ █████ ██
███ ██████ ██████████████████████████████████ █████████ █ ███████ ████████ ██ █████████████ ████ ██
███ ██████ ██████████████████████████████████ █████████ █ ██████ ███████████ ██████ █████████ ██ █████████ ████ ██
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ██████ █ █ █████████ █ █████ ███████ ████████ ████ █ █
█████████ █
██████████████████████████ █ ███
████████████████████████████ █ █████████████████████
█████████████████████████████ █ ████████ █████ █████ █████████ █████ █████
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ███████████
██████ ██████ █ █
████████████ █ █████ ████████ ████████ ████ ██
█████████ █ █████ ███████ ████████ ████ █
█
█████████ █
█ ██████████████████████ ████
█████ ███████████████████████████ █ ███████████████████
███████████ █ █
███████ █████████
████████ █████████
██████ ███████
██████ █████████
████████ ████████
████████
██ ██ █████████████ ██
████ █████████████████
█████████████████████████████
████████████████████████████████████████ ████████████ ███
████████████████████████████████████ ████████ ████
██ █████████████ ██ ██████ ████████ ██
████ ██████████ ████████████████████ ███
█████████████████████████████████
████████████
██████████████████████
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ██████ █ █ █████████ █ █████ ███████ ████████ ████ █ █
█████████ █
██████████████████████████ █ ███
████████████████████████████ █ █████████████████████
█████████████████████████████ █ ████████ █████ █████ █████████ █████ █████
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ███████████
██████ ██████ █ █
████████████ █ █████ ████████ ████████ ████ ██
█████████ █ █████ ███████ ████████ ████ █
█
█████████ █
Toast flash
Notifiche toast impilabili posizionate nell'angolo per i messaggi flash di Rails
███
█████ █████ █████████ █████████
█████████████████ █████ ██ ████████ █████ █████████████ ████ █ █████ █████
███████ ████ ███████ ██ █ ███████████ █████ ██ █ █████ ██████ █████████
██████
████ ██████ █████████████████████████ █████████ █████ ██
████ ██████ █████████████████████████ █████████ █ ███████ ████████ ██ █████████ ██████████ ██
████ ██████ █████████████████████████ █████████ █ ██████ ███████████ ██████ █████████ ██ █████████ █████████████ ██
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ██████ █ █ █████████ █ █████ ███████ ████████ ████ █ █
█████████ █
██████████████████████████ █ ███
████████████████████████████ █ █████████████████████
█████████████████████████████ █ ████████ █████ █████ █████████ █████ █████
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ███████████
██████ ██████ █ █
████████████ █ █████ ████████ ████████ ████ ██
█████████ █ █████ ███████ ████████ ████ █
█
█████████ █
██ ██ █████████████ ██
████ ██████████ █████████████████ ███
█████████████████████████████
████████████████████████████████████████ ████████████ ███
████████████████████████████████████ ████████ ████
████ ██████████████████
██ █████████████ ██ ██████ ████████ ██
████ ██████████ ███████████████████ ███
█████████████████████████████████
████████████
█ ██████████████████████ ████
█████ ████████████████████████ █ ███████████████████
███████████ █ █
███████ █████████
████████ █████████
██████ ███████
██████ █████████
████████ ████████
████████
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ██████ █ █ █████████ █ █████ ███████ ████████ ████ █ █
█████████ █
██████████████████████████ █ ███
████████████████████████████ █ █████████████████████
█████████████████████████████ █ ████████ █████ █████ █████████ █████ █████
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ███████████
██████ ██████ █ █
████████████ █ █████ ████████ ████████ ████ ██
█████████ █ █████ ███████ ████████ ████ █
█
█████████ █
Registro delle modifiche
- v1.1.0: Added standard-flash and toast-flash styles for Rails flash messages
- v1.0.0: Initial release with success, error, warning, info variants
- Auto-dismiss with configurable duration
- Pause auto-dismiss on hover
- Smooth enter/exit animations
- Accessible with role="alert" and aria-live
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