Dispatch chip

The mint pill labelling content as a Newsroom Dispatch. Distinct from claim-badge and section accents.

≈ 2 min read 213 words Updated 2026-08-23

On this page

.dispatch-chip is the small pill that labels Newsroom Dispatch entries as such. Mint-coloured by deliberate choice — distinct from the claim badge palette (cyan / mauve / yellow / lavender) and from Bifrost’s per-section accents.

Source: themes/bifrost/sass/components/_dispatch-chip.scss · rendered by templates/macros/dispatch.html

Anatomy#

TokenValue
Backgroundc.$mint-100
Border1px solid c.$mint-300
Textc.$mint-800
Padding0.25rem 0.625rem
Radiusborder-radius-full (pill)
Fontfont-size-xs, weight 600, uppercase, letter-spacing 0.04em

white-space: nowrap so the label never wraps; user-select: none so double-clicking the chip doesn’t select it.

Usage#

Don’t write the markup manually. The dispatch macro renders dispatches into list contexts, including the chip:

{%/* import "macros/dispatch.html" as dispatch */%}

{{ dispatch::card(page=page, lang=detected_lang) }}

The chip itself, if you need it standalone:

<span class="dispatch-chip">Dispatch</span>

Live examples#

  • /news/ index — every Dispatch card shows the chip in its header: www.wheelofheaven.world/news/
  • Individual Dispatch pages — chip appears next to the title.
  • Macros → dispatch — the macro that wraps the chip + the rest of a Dispatch card.
  • Claim badge — the orthogonal epistemic-status pills (a Dispatch carries both a claim badge and a dispatch chip).

Edit this page on GitHub