vue-easy-toast
Version:
A toast plugin for vue/vue2
2 lines • 1.94 kB
CSS
.et-wrapper{background-color:rgba(48,45,55,.7);border-radius:5px;padding:10px 30px;display:inline-block;max-width:300px;min-width:120px;color:#fff;z-index:9999;margin:auto;position:fixed;top:80%}.et-content,.et-wrapper{text-align:center}.et-wrapper .et-close{position:absolute;top:0;right:5px;color:#fff}.et-wrapper.et-left{right:auto;left:0}.et-wrapper.et-right{left:auto;right:0}.et-wrapper.et-center{left:50%;transform:translateX(-50%)}.et-wrapper.et-top{top:0;bottom:auto}.et-wrapper.et-bottom{top:auto;bottom:0}.et-wrapper.et-alert{background-color:rgba(189,19,19,.7)}.et-wrapper.et-warn{background-color:rgba(250,180,90,.9)}.et-wrapper.et-info{background-color:rgba(32,83,201,.7)}.fade-enter-active,.fade-leave-active,.fade-transition{-webkit-transition:opacity .3s ease;transition:opacity .3s ease}.fade-enter,.fade-leave,.fade-leave-active{opacity:0}.slide-down-enter-active,.slide-down-leave-active,.slide-down-transition{-webkit-transition:opacity .3s ease,top .3s ease-in;transition:opacity .3s ease,top .3s ease-in}.slide-down-enter,.slide-down-leave,.slide-down-leave-active{opacity:0;top:-10%}.slide-up-enter-active,.slide-up-leave-active,.slide-up-transition{-webkit-transition:opacity .3s ease,top .3s ease-in;transition:opacity .3s ease,top .3s ease-in}.slide-up-enter,.slide-up-leave,.slide-up-leave-active{opacity:0;top:110%}.slide-left-enter-active,.slide-left-leave-active,.slide-left-transition{-webkit-transition:opacity .3s ease,left .3s ease-in;transition:opacity .3s ease,left .3s ease-in}.slide-left-enter,.slide-left-leave,.slide-left-leave-active{opacity:0;left:110%}.slide-right-enter-active,.slide-right-leave-active,.slide-right-transition{-webkit-transition:opacity .3s ease,left .3s ease;transition:opacity .3s ease,left .3s ease}.slide-right-enter,.slide-right-leave,.slide-right-leave-active{opacity:0;left:-1000px}
/*# sourceMappingURL=vue-easy-toast.css.map*/