MediaWiki:Toasts.css

/** * Toasts CSS */ .toasts { position: fixed; display: flex; top: 0; flex-direction: column; align-items: center; justify-content: flex-end; pointer-events: none; z-index: 4000; }

.toast { animation: toast-up 300ms ease; transform: translateY(-10px); background: #36393F; padding: 10px; border-radius: 5px; box-shadow: 0 0 0 1px rgba(32, 34, 37, 0.6), 0 2px 10px 0 rgba(0, 0, 0, 0.2); font-weight: 500; color: #FFF; user-select: text; font-size: 14px; opacity: 1; margin-top: 10px; display: flex; justify-content: center; align-items: center; }

.toast.closing { animation: toast-down 200ms ease; animation-fill-mode: forwards; opacity: 1; transform: translateY(-10px); }

.toast.toast-info { background-color: #4A90E2; }

.toast.toast-success { background-color: #43B581; }

.toast.toast-danger, .toast.toast-error { background-color: #F04747; }

.toast.toast-warning, .toast.toast-warn { background-color: #FFA600; }

.toast-icon { margin-right: 5px; fill: white; border-radius: 50%; overflow: hidden; height: 20px; width: 20px; }

.toast-text { line-height: 20px; }

/* Animations */

@keyframes toast-up { from { transform: translateY(0); opacity: 0; } }

@keyframes toast-down { to { transform: translateY(0px); opacity: 0; } }

/*@end@*/