yu.css.ui/dist/component/message.css

纯CSS通用UI模块和组件

.yu-message{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,SimSun,sans-serif;padding:8px 14px;width:300px;border-radius:4px;font-size:14px;position:fixed;left:50%;transform:translateX(-150px);top:0;z-index:1;box-sizing:border-box;background-color:#edeeee;color:#909399;border:1px solid #e0e1e2}.yu-message.transition{opacity:0;transform:translate(-150px,-100%);transition:transform .3s ease,opacity .3s ease}.yu-message.transition.transition-enter{opacity:1;transform:translate(-150px,22px)}.yu-message.transition.transition-leave{opacity:0;transform:translate(-150px,-100%)}.yu-message i.iconfont:not(.icon-close){font-size:18px;margin-right:5px;vertical-align:top}.yu-message .content{vertical-align:top;display:inline-block}.yu-message .icon-close{margin-top:2px;float:right;cursor:pointer}.yu-message.primary{background-color:#f3f9ff;color:#409eff;border:1px solid #d9ecff}.yu-message.success{background-color:#eef8e9;color:#67c23a;border:1px solid #c1e7ae}.yu-message.warning{background-color:#fffbeb;color:#fecf20;border:1px solid #fff0b8}.yu-message.info{background-color:#f2f3f3;color:#909399;border:1px solid #e0e1e2}.yu-message.danger{background-color:#feeded;color:#f56c6c;border:1px solid #fffbfb}.yu-message.center{text-align:center}