vuesion/vuesion

$badge-padding: $space-2 $space-12;
$badge-with-icon-padding: $space-2 $space-8 $space-2 $space-12;
$badge-height: $space-20;
$badge-border-radius: 6px;

$badge-variations: (
  'info': (
    'color': var(--brand-text-info),
    'bg': var(--brand-surface-info-low),
    'border': 1px solid var(--brand-border-info-low),
  ),
  'warning': (
    'color': var(--brand-text-warning),
    'bg': var(--brand-surface-warning-low),
    'border': 1px solid var(--brand-border-warning-low),
  ),
  'success': (
    'color': var(--brand-text-success),
    'bg': var(--brand-surface-success-low),
    'border': 1px solid var(--brand-border-success-low),
  ),
  'danger': (
    'color': var(--brand-text-danger),
    'bg': var(--brand-surface-danger-low),
    'border': 1px solid var(--brand-border-danger-low),
  ),
  'neutral': (
    'color': var(--brand-text-default-medium),
    'bg': var(--brand-surface-default-medium),
    'border': 1px solid var(--brand-border-default-medium),
  ),
);