byted-vui/packages/theme-chalk/lib/tag.css

A Component Library for Vue.js.

.vi-tag{background-color:rgba(68,93,137,.1);display:inline-block;padding:0 10px;height:32px;line-height:30px;font-size:12px;color:#445D89;border-radius:4px;-webkit-box-sizing:border-box;box-sizing:border-box;border:1px solid rgba(68,93,137,.2);white-space:nowrap}.vi-tag .vi-icon-close{border-radius:50%;text-align:center;position:relative;cursor:pointer;font-size:12px;height:16px;width:16px;line-height:16px;vertical-align:middle;top:-1px;right:-5px;color:#445D89}.vi-tag .vi-icon-close::before{display:block}.vi-tag .vi-icon-close:hover{background-color:#445D89;color:#fff}.vi-tag--info,.vi-tag--info .vi-tag__close{color:#909399}.vi-tag--info{background-color:rgba(144,147,153,.1);border-color:rgba(144,147,153,.2)}.vi-tag--info.is-hit{border-color:#909399}.vi-tag--info .vi-tag__close:hover{background-color:#909399;color:#fff}.vi-tag--success{background-color:rgba(103,194,58,.1);border-color:rgba(103,194,58,.2);color:#67c23a}.vi-tag--success.is-hit{border-color:#67c23a}.vi-tag--success .vi-tag__close{color:#67c23a}.vi-tag--success .vi-tag__close:hover{background-color:#67c23a;color:#fff}.vi-tag--warning{background-color:rgba(230,162,60,.1);border-color:rgba(230,162,60,.2);color:#e6a23c}.vi-tag--warning.is-hit{border-color:#e6a23c}.vi-tag--warning .vi-tag__close{color:#e6a23c}.vi-tag--warning .vi-tag__close:hover{background-color:#e6a23c;color:#fff}.vi-tag--danger{background-color:rgba(245,108,108,.1);border-color:rgba(245,108,108,.2);color:#f56c6c}.vi-tag--danger.is-hit{border-color:#f56c6c}.vi-tag--danger .vi-tag__close{color:#f56c6c}.vi-tag--danger .vi-tag__close:hover{background-color:#f56c6c;color:#fff}.vi-tag--medium{height:28px;line-height:26px}.vi-tag--medium .vi-icon-close{-webkit-transform:scale(.8);transform:scale(.8)}.vi-tag--small{height:24px;padding:0 8px;line-height:22px}.vi-tag--small .vi-icon-close{-webkit-transform:scale(.8);transform:scale(.8)}.vi-tag--mini{height:20px;padding:0 5px;line-height:19px}.vi-tag--mini .vi-icon-close{margin-left:-3px;-webkit-transform:scale(.7);transform:scale(.7)}