@opentiny/vue-theme/badge/index.css

An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.

.tiny-badge{display:inline-block;min-width:16px;height:16px;line-height:16px;border-radius:var(--tv-Badge-border-radius);padding:0 var(--tv-Badge-horizontal-padding);font-size:var(--tv-Badge-font-size);font-weight:var(--tv-Badge-font-weight);color:var(--tv-Badge-text-color);background-color:var(--tv-Badge-bg-color);vertical-align:baseline;white-space:nowrap;text-align:center;border:1px solid var(--tv-Badge-border-color);margin-left:var(--tv-Badge-margin-left)}.tiny-badge__wrapper{--tv-Badge-border-radius:var(--tv-border-radius-round, 999px);--tv-Badge-horizontal-padding:var(--tv-space-base, 4px);--tv-Badge-font-size:var(--tv-font-size-sm, 12px);--tv-Badge-font-weight:var(--tv-font-weight-regular, 400);--tv-Badge-text-color:var(--tv-color-text-inverse, #ffffff);--tv-Badge-bg-color:var(--tv-color-act-danger-bg, #f23030);--tv-Badge-border-color:var(--tv-color-border-inverse-tint, #ffffff);--tv-Badge-a-text-color:var(--tv-color-text-inverse, #ffffff);--tv-Badge-margin-left:var(--tv-space-sm, 4px);--tv-Badge-dot-bg-color:var(--tv-color-act-danger-bg, #f23030);--tv-Badge-primary-bg-color:var(--tv-color-bg-primary, #191919);--tv-Badge-success-bg-color:var(--tv-color-act-success-bg, #5cb300);--tv-Badge-warning-bg-color:var(--tv-color-act-warning-bg, #ff8800);--tv-Badge-danger-bg-color:var(--tv-color-act-danger-bg, #f23030);--tv-Badge-info-bg-color:var(--tv-color-act-info-bg, #1476ff)}.tiny-badge:empty{display:none}.btn .tiny-badge{position:relative;top:-1px}.tiny-badge a,.tiny-badge a:hover{color:var(--tv-Badge-a-text-color);text-decoration:none}.tiny-badge--default{width:6px;height:6px;min-width:auto;background-color:var(--tv-Badge-dot-bg-color);display:inline-block;vertical-align:top;padding:0;border-radius:50%;border:unset;margin-left:0}.tiny-badge--primary{background-color:var(--tv-Badge-primary-bg-color)}.tiny-badge--success{background-color:var(--tv-Badge-success-bg-color)}.tiny-badge--warning{background-color:var(--tv-Badge-warning-bg-color)}.tiny-badge--danger{background-color:var(--tv-Badge-danger-bg-color)}.tiny-badge--info{background-color:var(--tv-Badge-info-bg-color)}