トーストの滑らかな出現

原則

トーストは下から ease-out で滑らかに出現。

実装例

.toast { transform: translateY(20px); opacity: 0; transition: all .25s cubic-bezier(0.16, 1, 0.3, 1); }
.toast.show { transform: translateY(0); opacity: 1; }