jiku-ui/lib/theme-chalk/alert.css

A Component Library for Vue.js.

.hn-alert{width:100%;padding:8px 16px;margin:0;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:4px;position:relative;background-color:#FFF;overflow:hidden;opacity:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:opacity .2s;transition:opacity .2s}.hn-alert.is-light .hn-alert__closebtn{color:#C0C4CC}.hn-alert.is-dark .hn-alert__closebtn,.hn-alert.is-dark .hn-alert__description{color:#FFF}.hn-alert.is-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.hn-alert--success.is-light{background-color:#f0f9eb;color:#67C23A}.hn-alert--success.is-light .hn-alert__description{color:#67C23A}.hn-alert--success.is-dark{background-color:#67C23A;color:#FFF}.hn-alert--info.is-light{background-color:#f4f4f5;color:#909399}.hn-alert--info.is-dark{background-color:#909399;color:#FFF}.hn-alert--info .hn-alert__description{color:#909399}.hn-alert--warning.is-light{background-color:#fef6e9;color:#F5A623}.hn-alert--warning.is-light .hn-alert__description{color:#F5A623}.hn-alert--warning.is-dark{background-color:#F5A623;color:#FFF}.hn-alert--error.is-light{background-color:#fef0f0;color:#F56C6C}.hn-alert--error.is-light .hn-alert__description{color:#F56C6C}.hn-alert--error.is-dark{background-color:#F56C6C;color:#FFF}.hn-alert__content{display:table-cell;padding:0 8px}.hn-alert__icon{font-size:16px;width:16px}.hn-alert__icon.is-big{font-size:28px;width:28px}.hn-alert__title{font-size:13px;line-height:18px}.hn-alert__title.is-bold{font-weight:700}.hn-alert .hn-alert__description{font-size:12px;margin:5px 0 0}.hn-alert__closebtn{font-size:12px;opacity:1;position:absolute;top:12px;right:15px;cursor:pointer}.hn-alert__closebtn.is-customed{font-style:normal;font-size:13px;top:9px}.hn-alert-fade-enter,.hn-alert-fade-leave-active{opacity:0}