@utrecht/web-component-library-stencil/dist/collection/components/data-badge.css

Stencil component library bundle for the Municipality of Utrecht based on the NL Design System architecture

/**
 * @license EUPL-1.2
 * Copyright (c) 2020-2024 Frameless B.V.
 * Copyright (c) 2021-2024 Gemeente Utrecht
 */
/**
 * @license EUPL-1.2
 * Copyright (c) 2020-2022 Gemeente Utrecht
 * Copyright (c) 2020-2022 Frameless B.V.
 */
/**
 * @license EUPL-1.2
 * Copyright (c) 2020-2022 Gemeente Utrecht
 * Copyright (c) 2020-2022 Frameless B.V.
 */
/* `.utrecht-badge-data` is deprecated, but we'll keep supporting it for a while before we remove it */
.utrecht-badge-data,
.utrecht-data-badge {
  background-color: var(--utrecht-data-badge-background-color, var(--utrecht-badge-background-color, hsl(0, 0%, 0%)));
  border-radius: var(--utrecht-data-badge-border-radius, var(--utrecht-badge-border-radius, 0.5ch));
  border-width: var(--utrecht-data-badge-border-width, 0);
  color: var(--utrecht-data-badge-color, var(--utrecht-badge-color, hsl(0, 0%, 100%)));
  display: inline-block;
  font-family: var(--utrecht-data-badge-font-family, var(--utrecht-document-font-family, sans-serif));
  font-size: var(--utrecht-data-badge-font-size, var(--utrecht-badge-font-size, inherit));
  font-weight: var(--utrecht-data-badge-font-weight, var(--utrecht-badge-font-weight, bold)); /* no inheritance */
  line-height: var(--utrecht-data-badge-line-height, var(--utrecht-badge-line-height, 1em));
  max-block-size: max-content;
  max-inline-size: max-content;
  min-block-size: var(--utrecht-data-badge-min-block-size, 1em);
  min-inline-size: var(--utrecht-data-badge-min-inline-size, 1em);
  padding-block-end: var(--utrecht-data-badge-padding-block, var(--utrecht-badge-padding-block, 0.5ex));
  padding-block-start: var(--utrecht-data-badge-padding-block, var(--utrecht-badge-padding-block, 0.5ex));
  padding-inline-end: var(--utrecht-data-badge-padding-inline, var(--utrecht-badge-padding-inline, 0.5ch));
  padding-inline-start: var(--utrecht-data-badge-padding-inline, var(--utrecht-badge-padding-inline, 0.5ch));
  text-decoration: none; /* no inheritance */
}

:host {
  display: inline-block;
}

:host([hidden]) {
  display: none !important;
}