lin-view-ui/lib/theme-chalk/message.css

vue components library

.lin-message{position:fixed;top:20px;left:50%;z-index:2000;box-sizing:border-box;display:flex;align-items:center;min-width:380px;padding:15px 15px 15px 20px;overflow:hidden;background-color:rgba(144,147,153,.1);border-color:rgba(144,147,153,.1);border-style:solid;border-width:1px;border-radius:4px;transition:opacity .3s,transform .4s,top .4s;transform:translateX(-50%)}.lin-message-center{justify-content:center}.lin-message-content{padding:0;margin:0}.lin-message-icon{margin-right:10px;font-size:14px}.lin-message-close-icon{position:absolute;top:50%;right:15px;font-size:16px;color:#c0c4cc;cursor:pointer;transform:translateY(-50%)}.lin-message-success{color:#67c23a;background-color:#eef8e9;border-color:#eef8e9}.lin-message-info{color:#909399;background-color:#edeeee;border-color:#edeeee}.lin-message-error{color:#f56c6c;background-color:#fef2f2;border-color:#fef2f2}.lin-message-warning{color:#e6a23c;background-color:#fdf8f1;border-color:#fdf8f1}.message-enter-active,.message-leave-active{transition:opacity .3s,transform .4s,top .4s}.message-enter,.message-leave-to{opacity:0;transform:translateY(-100%) translateX(-50%)}