@oslokommune/punkt-css/dist/css/components/badge.css

CSS-rammeverket til Punkt, et designsystem laget av Oslo Origo

/* 
 * Badge element
 * DEPRECATED - use tag instead 
 */
.pkt-badge {
  display: inline-flex;
  height: 1.5em;
  margin-left: 0.4em;
  padding: 0.25em 0.4em;
  color: black;
  font-weight: 500;
  font-size: 0.75em;
  line-height: 1em;
  border-radius: 1px;
}

.pkt-badge.pkt-badge--small,
.pkt-h1 > .pkt-badge,
.pkt-h2 > .pkt-badge,
.pkt-h3 > .pkt-badge {
  font-size: 0.5em;
  transform: translateY(-0.25em);
}

.pkt-btn:not(.pkt-btn--ter) > .pkt-badge {
  color: inherit;
  background: transparent;
  border: 1px solid;
  border-radius: 4px;
}

.pkt-btn--pri:not(.pkt-btn--neg) > .pkt-badge,
.pkt-btn--neg.pkt-btn--ter > .pkt-badge,
.pkt-btn--neg.pkt-btn--ghost > .pkt-badge {
  border-color: white;
}

.pkt-btn--small > .pkt-badge {
  padding-top: 0.28em;
  transform: translateY(-0.1em);
}