changelog date feed timeline sidebar anchor monospace badges api docs changelog date feed sidebar anchor monthly api model deprecation release date-grouped changelog with sidebar navigation product update feed with category badges API changelog with month index release history with anchor links
Changelog Date Feed
Fetch pattern JSON:
curl https://webspire.de/patterns/changelog/date-feed.json date-feed.html
<div class="ws-changelog bg-[var(--ws-changelog-bg)]">
<div class="mx-auto max-w-5xl px-6 py-16">
<div class="grid gap-12 lg:grid-cols-[200px_1fr]">
<!-- Left: sticky year/month index -->
<nav class="hidden lg:block" aria-label="Changelog navigation">
<div class="sticky top-24 space-y-6">
<!-- Year 2026 -->
<div>
<p class="mb-2 text-xs font-semibold uppercase tracking-wider text-[var(--ws-changelog-text-muted)]">2026</p>
<ul class="space-y-1 border-l border-[var(--ws-changelog-border)] pl-3">
<li><a href="#march-2026" class="block py-0.5 text-sm font-medium text-[var(--ws-changelog-accent)] hover:text-[var(--ws-changelog-accent)]">March</a></li>
<li><a href="#february-2026" class="block py-0.5 text-sm text-[var(--ws-changelog-text-soft)] hover:text-[var(--ws-changelog-text)]">February</a></li>
<li><a href="#january-2026" class="block py-0.5 text-sm text-[var(--ws-changelog-text-soft)] hover:text-[var(--ws-changelog-text)]">January</a></li>
</ul>
</div>
<!-- Year 2025 -->
<div>
<p class="mb-2 text-xs font-semibold uppercase tracking-wider text-[var(--ws-changelog-text-muted)]">2025</p>
<ul class="space-y-1 border-l border-[var(--ws-changelog-border)] pl-3">
<li><a href="#december-2025" class="block py-0.5 text-sm text-[var(--ws-changelog-text-soft)] hover:text-[var(--ws-changelog-text)]">December</a></li>
<li><a href="#november-2025" class="block py-0.5 text-sm text-[var(--ws-changelog-text-soft)] hover:text-[var(--ws-changelog-text)]">November</a></li>
<li><a href="#october-2025" class="block py-0.5 text-sm text-[var(--ws-changelog-text-soft)] hover:text-[var(--ws-changelog-text)]">October</a></li>
</ul>
</div>
</div>
</nav>
<!-- Right: chronological feed -->
<div class="space-y-14">
<!-- ── March 2026 ── -->
<section id="march-2026">
<h2 class="mb-6 flex items-center gap-3 text-lg font-bold text-[var(--ws-changelog-text)]">
March 2026
<a href="#march-2026" class="text-[var(--ws-changelog-text-muted)] opacity-0 hover:opacity-100 transition-opacity focus:opacity-100" aria-label="Link to March 2026">#</a>
</h2>
<div class="space-y-8">
<!-- Entry: March 26 -->
<div>
<time class="mb-3 block text-xs font-semibold text-[var(--ws-changelog-text-muted)]" datetime="2026-03-26">March 26, 2026</time>
<ul class="space-y-2.5">
<li class="flex items-baseline gap-3 text-sm text-[var(--ws-changelog-text-soft)]">
<span class="shrink-0 rounded bg-amber-500/15 px-1.5 py-0.5 font-mono text-[10px] font-semibold uppercase tracking-wider text-amber-400">model released</span>
<span>Magistral Medium 1.2 — state-of-the-art reasoning with <code class="rounded bg-[var(--ws-changelog-code-bg)] px-1 font-mono text-[11px] text-[var(--ws-changelog-text)]">magistral-medium-2506</code></span>
</li>
<li class="flex items-baseline gap-3 text-sm text-[var(--ws-changelog-text-soft)]">
<span class="shrink-0 rounded bg-sky-500/15 px-1.5 py-0.5 font-mono text-[10px] font-semibold uppercase tracking-wider text-sky-400">api updated</span>
<span>Added <code class="rounded bg-[var(--ws-changelog-code-bg)] px-1 font-mono text-[11px] text-[var(--ws-changelog-text)]">thinking_tokens</code> field to chat completions response for reasoning traces</span>
</li>
</ul>
</div>
<!-- Entry: March 18 -->
<div>
<time class="mb-3 block text-xs font-semibold text-[var(--ws-changelog-text-muted)]" datetime="2026-03-18">March 18, 2026</time>
<ul class="space-y-2.5">
<li class="flex items-baseline gap-3 text-sm text-[var(--ws-changelog-text-soft)]">
<span class="shrink-0 rounded bg-emerald-500/15 px-1.5 py-0.5 font-mono text-[10px] font-semibold uppercase tracking-wider text-emerald-400">new</span>
<span>Batch inference endpoint now supports up to 50,000 requests per job</span>
</li>
<li class="flex items-baseline gap-3 text-sm text-[var(--ws-changelog-text-soft)]">
<span class="shrink-0 rounded bg-slate-500/15 px-1.5 py-0.5 font-mono text-[10px] font-semibold uppercase tracking-wider text-slate-400">docs</span>
<span>Added agent orchestration cookbook with tool-calling examples</span>
</li>
</ul>
</div>
</div>
</section>
<!-- ── February 2026 ── -->
<section id="february-2026">
<h2 class="mb-6 flex items-center gap-3 text-lg font-bold text-[var(--ws-changelog-text)]">
February 2026
<a href="#february-2026" class="text-[var(--ws-changelog-text-muted)] opacity-0 hover:opacity-100 transition-opacity focus:opacity-100" aria-label="Link to February 2026">#</a>
</h2>
<div class="space-y-8">
<!-- Entry: February 12 -->
<div>
<time class="mb-3 block text-xs font-semibold text-[var(--ws-changelog-text-muted)]" datetime="2026-02-12">February 12, 2026</time>
<ul class="space-y-2.5">
<li class="flex items-baseline gap-3 text-sm text-[var(--ws-changelog-text-soft)]">
<span class="shrink-0 rounded bg-amber-500/15 px-1.5 py-0.5 font-mono text-[10px] font-semibold uppercase tracking-wider text-amber-400">model released</span>
<span>Ministral 3B and 8B now available via API — <code class="rounded bg-[var(--ws-changelog-code-bg)] px-1 font-mono text-[11px] text-[var(--ws-changelog-text)]">ministral-3b-2410</code>, <code class="rounded bg-[var(--ws-changelog-code-bg)] px-1 font-mono text-[11px] text-[var(--ws-changelog-text)]">ministral-8b-2410</code></span>
</li>
<li class="flex items-baseline gap-3 text-sm text-[var(--ws-changelog-text-soft)]">
<span class="shrink-0 rounded bg-sky-500/15 px-1.5 py-0.5 font-mono text-[10px] font-semibold uppercase tracking-wider text-sky-400">api updated</span>
<span>Fine-tuning API now supports <code class="rounded bg-[var(--ws-changelog-code-bg)] px-1 font-mono text-[11px] text-[var(--ws-changelog-text)]">validation_file</code> parameter for automatic eval during training</span>
</li>
<li class="flex items-baseline gap-3 text-sm text-[var(--ws-changelog-text-soft)]">
<span class="shrink-0 rounded bg-red-500/15 px-1.5 py-0.5 font-mono text-[10px] font-semibold uppercase tracking-wider text-red-400">deprecated</span>
<span><code class="rounded bg-[var(--ws-changelog-code-bg)] px-1 font-mono text-[11px] text-[var(--ws-changelog-text)]">mistral-tiny</code> scheduled for removal on June 1, 2026 — migrate to <code class="rounded bg-[var(--ws-changelog-code-bg)] px-1 font-mono text-[11px] text-[var(--ws-changelog-text)]">ministral-3b-2410</code></span>
</li>
</ul>
</div>
</div>
</section>
<!-- ── January 2026 ── -->
<section id="january-2026">
<h2 class="mb-6 flex items-center gap-3 text-lg font-bold text-[var(--ws-changelog-text)]">
January 2026
<a href="#january-2026" class="text-[var(--ws-changelog-text-muted)] opacity-0 hover:opacity-100 transition-opacity focus:opacity-100" aria-label="Link to January 2026">#</a>
</h2>
<div class="space-y-8">
<div>
<time class="mb-3 block text-xs font-semibold text-[var(--ws-changelog-text-muted)]" datetime="2026-01-08">January 8, 2026</time>
<ul class="space-y-2.5">
<li class="flex items-baseline gap-3 text-sm text-[var(--ws-changelog-text-soft)]">
<span class="shrink-0 rounded bg-orange-500/15 px-1.5 py-0.5 font-mono text-[10px] font-semibold uppercase tracking-wider text-orange-400">security</span>
<span>Rotated signing keys for JWT tokens — no action required, tokens are renewed on next authentication</span>
</li>
<li class="flex items-baseline gap-3 text-sm text-[var(--ws-changelog-text-soft)]">
<span class="shrink-0 rounded bg-emerald-500/15 px-1.5 py-0.5 font-mono text-[10px] font-semibold uppercase tracking-wider text-emerald-400">new</span>
<span>Function calling now supports parallel tool execution — multiple tools can be called simultaneously in a single response</span>
</li>
</ul>
</div>
</div>
</section>
</div>
</div>
</div>
</div>
Details
Responsive Dark Mode Tailwind Only SSR Safe Copy & Paste
Stable Published
changelogdatefeedtimelinesidebaranchormonospacebadgesapidocs
Slots
| Name | Required | Description |
|---|---|---|
| sidebar | No | Sticky left column with year/month index links for quick navigation. |
| sections | Yes | Month sections with anchor ID, date-stamped entry groups, and badge+text pairs. |
Date-grouped changelog feed. Left column (desktop only) shows a sticky year/month index with anchor links. Right column shows chronological month sections, each with anchor ID for deep-linking. Entries use inline monospace type badges: model released (amber), api updated (sky), new (emerald), deprecated (red), security (orange), docs (slate). Inspired by API documentation changelogs.