quasar/src/components/badge/QBadge.styl

Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time

.q-badge
  background-color $primary
  background-color var(--q-color-primary)
  color white
  padding 2px 6px
  border-radius $generic-border-radius
  font-size 12px
  line-height 12px
  font-weight normal
  vertical-align baseline

  &--single-line
    white-space nowrap
  &--multi-line
    word-break break-all
    word-wrap break-word

  &--floating
    position absolute
    top -4px
    right -3px
    cursor inherit

  &--transparent
    opacity 0.8

  &--outline
    background-color transparent
    border 1px solid currentColor