vue-devui/badge/style.css

DevUI components based on Vite and Vue3

.devui-badge{position:relative;display:inline-block}.devui-badge__content{font-size:var(--devui-font-size-sm, 12px);color:var(--devui-light-text, #ffffff)}.devui-badge--count{padding:0 4px;min-width:16px;height:16px;line-height:16px;border-radius:var(--devui-border-radius-full, 100px);background:var(--devui-brand, #5e7ce0);text-align:center}.devui-badge--danger{background:var(--devui-danger, #f66f6a)}.devui-badge--warning{background:var(--devui-warning, #fac20a)}.devui-badge--waiting{background:var(--devui-waiting, #beccfa)}.devui-badge--success{background:var(--devui-success, #50d4ab)}.devui-badge--info{background:var(--devui-brand, #5e7ce0)}.devui-badge--common{background:var(--devui-unavailable, #f5f5f5);color:var(--devui-aide-text, #71757f)}.devui-badge--top-left{left:0;top:0;transform:translate(-50%,-50%)}.devui-badge--top-right{right:0;top:0;transform:translate(50%,-50%)}.devui-badge--bottom-left{left:0;bottom:0;transform:translate(-50%,50%)}.devui-badge--bottom-right{right:0;bottom:0;transform:translate(50%,50%)}.devui-badge--fixed{position:absolute}.devui-badge--dot{width:6px;height:6px;border-radius:50%}.devui-badge--show{visibility:visible;opacity:1;transition:all var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-out, cubic-bezier(.16, .75, .5, 1))}.devui-badge--hidden{visibility:hidden;opacity:0;transition:all var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in, cubic-bezier(.5, 0, .84, .25))}