bk-magic-vue
Version:
基于蓝鲸 Magicbox 和 Vue 的前端组件库
3 lines (2 loc) • 3.66 kB
CSS
.bk-badge-wrapper{position:relative;display:inline-block}.bk-badge-wrapper .bk-badge{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;min-width:18px;height:18px;line-height:16px;padding:0 2px;border:1px solid #c3cdd7;border-radius:18px;background-color:#fff;font-size:10px;text-align:center}.bk-badge-wrapper .bk-badge .bk-icon{position:absolute;left:50%;top:50%;margin-top:0;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);display:block;line-height:18px}.bk-badge-wrapper .bk-badge.pinned{position:absolute}.bk-badge-wrapper .bk-badge.pinned.top-right{top:0;right:0;-webkit-transform:translate(50%,-50%) scale(1);transform:translate(50%,-50%) scale(1)}.bk-badge-wrapper .bk-badge.pinned.top-right.fade-center-enter,.bk-badge-wrapper .bk-badge.pinned.top-right.fade-center-leave-active{opacity:0;-webkit-transform:translate(50%,-50%) scale(0);transform:translate(50%,-50%) scale(0)}.bk-badge-wrapper .bk-badge.pinned.right{top:50%;right:0;-webkit-transform:translate(100%,-50%) scale(1);transform:translate(100%,-50%) scale(1)}.bk-badge-wrapper .bk-badge.pinned.right.fade-center-enter,.bk-badge-wrapper .bk-badge.pinned.right.fade-center-leave-active{opacity:0;-webkit-transform:translate(50%,-50%) scale(0);transform:translate(50%,-50%) scale(0)}.bk-badge-wrapper .bk-badge.pinned.bottom-right{bottom:0;right:0;-webkit-transform:translate(50%,50%) scale(1);transform:translate(50%,50%) scale(1)}.bk-badge-wrapper .bk-badge.pinned.bottom-right.fade-center-enter,.bk-badge-wrapper .bk-badge.pinned.bottom-right.fade-center-leave-active{opacity:0;-webkit-transform:translate(50%,50%) scale(0);transform:translate(50%,50%) scale(0)}.bk-badge-wrapper .bk-badge.pinned.top-left{top:0;left:0;-webkit-transform:translate(-50%,-50%) scale(1);transform:translate(-50%,-50%) scale(1)}.bk-badge-wrapper .bk-badge.pinned.top-left.fade-center-enter,.bk-badge-wrapper .bk-badge.pinned.top-left.fade-center-leave-active{opacity:0;-webkit-transform:translate(-50%,-50%) scale(0);transform:translate(-50%,-50%) scale(0)}.bk-badge-wrapper .bk-badge.pinned.bottom-left{bottom:0;left:0;-webkit-transform:translate(-50%,50%) scale(1);transform:translate(-50%,50%) scale(1)}.bk-badge-wrapper .bk-badge.pinned.bottom-left.fade-center-enter,.bk-badge-wrapper .bk-badge.pinned.bottom-left.fade-center-leave-active{opacity:0;-webkit-transform:translate(-50%,50%) scale(0);transform:translate(-50%,50%) scale(0)}.bk-badge-wrapper .bk-badge.dot{width:8px;height:8px;min-width:8px}.bk-badge-wrapper .bk-badge.bk-danger{background-color:#ea3636;border:2px solid #fff;color:#fff}.bk-badge-wrapper .bk-badge.bk-danger.is-icon{background-color:#fff;border-color:#fff;color:#ea3636}.bk-badge-wrapper .bk-badge.bk-warning{background-color:#ff9c01;border:2px solid #fff;color:#fff}.bk-badge-wrapper .bk-badge.bk-warning.is-icon{background-color:#fff;border-color:#fff;color:#ff9c01}.bk-badge-wrapper .bk-badge.bk-success{background-color:#2dcb56;border:2px solid #fff;color:#fff}.bk-badge-wrapper .bk-badge.bk-success.is-icon{background-color:#fff;border-color:#fff;color:#2dcb56}.bk-badge-wrapper .bk-badge.bk-primary{background-color:#3a84ff;border:2px solid #fff;color:#fff}.bk-badge-wrapper .bk-badge.bk-primary.is-icon{background-color:#fff;border-color:#fff;color:#3a84ff}.bk-badge-wrapper .bk-badge.bk-info{background-color:#3a84ff;border:2px solid #fff;color:#fff}.bk-badge-wrapper .bk-badge.bk-info.is-icon{background-color:#fff;border-color:#fff;color:#3a84ff}
/*# sourceMappingURL=badge.min.css.map */