refrakt.md

Docs Runes Plan Blog Changelog

note

This rune is part of @refrakt-md/plan. Install with npm install @refrakt-md/plan and add "@refrakt-md/plan" to the packages array in your refrakt.config.json.

Milestone

A named release target or goal. Not a sprint — no timebox, no velocity, no ceremonies. A milestone is a coherent set of capabilities that together deliver value. When all work items assigned to it are done, the milestone is complete.

Active milestone

A milestone currently in progress with goals.

{% milestone name="v0.5.0" target="2026-03-29" status="active" %}
# v0.5.0 — Layout & Tint

- Complete alignment system migration
- Ship tint rune with dark mode support
- Publish layout spec as site documentation
- Resolve showcase bleed overflow bug
{% /milestone %}
<section data-rune="milestone">
  <meta content="v0.5.0" data-field="name">
  <meta content="2026-03-29" data-field="target">
  <meta content="active" data-field="status">
  <meta content="2026-04-10" data-field="created">
  <meta content="2026-04-10" data-field="modified">
  <div data-name="body">
    <header>
      <h1 id="v0.5.0-—-layout-&amp;-tint">v0.5.0 — Layout &amp; Tint</h1>
    </header>
    <ul>
      <li>Complete alignment system migration</li>
      <li>Ship tint rune with dark mode support</li>
      <li>Publish layout spec as site documentation</li>
      <li>Resolve showcase bleed overflow bug</li>
    </ul>
  </div>
</section>
Name:v0.5.0Status:active

v0.5.0 — Layout & Tint

  • Complete alignment system migration
  • Ship tint rune with dark mode support
  • Publish layout spec as site documentation
  • Resolve showcase bleed overflow bug
Progress5/17 criteria
<section class="rf-milestone rf-milestone--v0.5.0 rf-milestone--active" data-name="v0.5.0" data-status="active" data-target="2026-03-29" data-created="2026-04-10" data-modified="2026-04-10" data-rune="milestone" data-density="full">
  <div data-name="header" class="rf-milestone__header" data-section="header">
    <span data-name="name-badge" data-meta-type="id" data-meta-rank="primary" class="rf-milestone__name-badge">
      <span data-meta-label="" data-meta-label-hidden="">Name:</span>
      <span data-meta-value="">v0.5.0</span>
    </span>
    <span data-name="status-badge" data-meta-type="status" data-meta-rank="primary" data-meta-sentiment="positive" class="rf-milestone__status-badge">
      <span data-meta-label="" data-meta-label-hidden="">Status:</span>
      <span data-meta-value="">active</span>
    </span>
    <time data-name="target-badge" data-meta-type="temporal" data-meta-rank="secondary" class="rf-milestone__target-badge">
      <span data-meta-label="">Target:</span>
      <span data-meta-value="">2026-03-29</span>
    </time>
    <time data-name="created-badge" data-meta-type="temporal" data-meta-rank="secondary" class="rf-milestone__created-badge">
      <span data-meta-label="">Created:</span>
      <span data-meta-value="">2026-04-10</span>
    </time>
    <time data-name="modified-badge" data-meta-type="temporal" data-meta-rank="secondary" class="rf-milestone__modified-badge">
      <span data-meta-label="">Modified:</span>
      <span data-meta-value="">2026-04-10</span>
    </time>
  </div>
  <div data-name="body" class="rf-milestone__body" data-section="body">
    <meta content="v0.5.0" data-field="name" />
    <meta content="2026-03-29" data-field="target" />
    <meta content="active" data-field="status" />
    <meta content="2026-04-10" data-field="created" />
    <meta content="2026-04-10" data-field="modified" />
    <div data-name="body" class="rf-milestone__body" data-section="body">
      <header>
        <h1 id="v0.5.0-—-layout-&amp;-tint">v0.5.0 — Layout &amp; Tint</h1>
      </header>
      <ul>
        <li>Complete alignment system migration</li>
        <li>Ship tint rune with dark mode support</li>
        <li>Publish layout spec as site documentation</li>
        <li>Resolve showcase bleed overflow bug</li>
      </ul>
    </div>
    <div class="rf-milestone__backlog rf-milestone__backlog" data-name="backlog" data-rune="milestone-backlog">
      <div class="rf-milestone__progress" data-progress-checked="5" data-progress-total="17" data-percent="29">
        <div class="rf-milestone__progress-header">
          <span class="rf-milestone__progress-label">Progress</span>
          <span class="rf-milestone__progress-count">5/17 criteria</span>
        </div>
        <span class="rf-milestone__progress-bar" style="--rf-progress: 29%"></span>
      </div>
      <div data-name="tabs" role="tablist" class="rf-milestone__tabs rf-milestone__tabs">
        <button role="tab" class="rf-milestone__tab" data-status="ready">Ready (3)</button>
        <button role="tab" class="rf-milestone__tab" data-status="in-progress">In Progress (2)</button>
        <button role="tab" class="rf-milestone__tab" data-status="review">Review (1)</button>
        <button role="tab" class="rf-milestone__tab" data-status="confirmed">Confirmed (1)</button>
      </div>
      <div data-name="panels" class="rf-milestone__panels rf-milestone__panels">
        <div role="tabpanel" class="rf-milestone__panel" data-status="ready">
          <article class="rf-backlog__card" data-type="work" data-status="ready" data-id="WORK-101">
            <a class="rf-backlog__card-link" href="/runes/plan/examples">
              <div data-section="header">
                <span class="rf-backlog__card-header-left">
                  <span data-meta-type="id" data-meta-rank="primary">
                    <span data-meta-label="" data-meta-label-hidden="">ID:</span>
                    <span data-meta-value="">WORK-101</span>
                  </span>
                </span>
                <span class="rf-backlog__card-header-right">
                  <span data-meta-type="status" data-meta-rank="primary" data-meta-sentiment="neutral">
                    <span data-meta-label="" data-meta-label-hidden="">Status:</span>
                    <span data-meta-value="">ready</span>
                  </span>
                  <span class="rf-backlog__card-progress" data-checked="0" data-total="3">0/3</span>
                </span>
              </div>
              <div data-section="title">Content model validation errors</div>
              <div data-section="footer">
                <span data-meta-type="category" data-meta-rank="secondary" data-meta-sentiment="negative">
                  <span data-meta-label="">Priority:</span>
                  <span data-meta-value="">critical</span>
                </span>
                <span data-meta-type="quantity" data-meta-rank="secondary">
                  <span data-meta-label="">Complexity:</span>
                  <span data-meta-value="">moderate</span>
                </span>
                <span data-meta-type="tag" data-meta-rank="secondary">
                  <span data-meta-label="" data-meta-label-hidden="">Milestone:</span>
                  <span data-meta-value="">v0.5.0</span>
                </span>
              </div>
            </a>
          </article>
          <article class="rf-backlog__card" data-type="work" data-status="ready" data-id="WORK-102">
            <a class="rf-backlog__card-link" href="/runes/plan/examples">
              <div data-section="header">
                <span class="rf-backlog__card-header-left">
                  <span data-meta-type="id" data-meta-rank="primary">
                    <span data-meta-label="" data-meta-label-hidden="">ID:</span>
                    <span data-meta-value="">WORK-102</span>
                  </span>
                </span>
                <span class="rf-backlog__card-header-right">
                  <span data-meta-type="status" data-meta-rank="primary" data-meta-sentiment="neutral">
                    <span data-meta-label="" data-meta-label-hidden="">Status:</span>
                    <span data-meta-value="">ready</span>
                  </span>
                  <span class="rf-backlog__card-progress" data-checked="0" data-total="2">0/2</span>
                </span>
              </div>
              <div data-section="title">Token fallback chain for nested tints</div>
              <div data-section="footer">
                <span data-meta-type="category" data-meta-rank="secondary" data-meta-sentiment="caution">
                  <span data-meta-label="">Priority:</span>
                  <span data-meta-value="">high</span>
                </span>
                <span data-meta-type="quantity" data-meta-rank="secondary">
                  <span data-meta-label="">Complexity:</span>
                  <span data-meta-value="">simple</span>
                </span>
                <span data-meta-type="tag" data-meta-rank="secondary">
                  <span data-meta-label="" data-meta-label-hidden="">Milestone:</span>
                  <span data-meta-value="">v0.5.0</span>
                </span>
              </div>
            </a>
          </article>
          <article class="rf-backlog__card" data-type="work" data-status="ready" data-id="RF-142">
            <a class="rf-backlog__card-link" href="/runes/plan/work">
              <div data-section="header">
                <span class="rf-backlog__card-header-left">
                  <span data-meta-type="id" data-meta-rank="primary">
                    <span data-meta-label="" data-meta-label-hidden="">ID:</span>
                    <span data-meta-value="">RF-142</span>
                  </span>
                </span>
                <span class="rf-backlog__card-header-right">
                  <span data-meta-type="status" data-meta-rank="primary" data-meta-sentiment="neutral">
                    <span data-meta-label="" data-meta-label-hidden="">Status:</span>
                    <span data-meta-value="">ready</span>
                  </span>
                  <span class="rf-backlog__card-progress" data-checked="0" data-total="5">0/5</span>
                </span>
              </div>
              <div data-section="title">Implement tint rune dark mode support</div>
              <div data-section="footer">
                <span data-meta-type="category" data-meta-rank="secondary" data-meta-sentiment="caution">
                  <span data-meta-label="">Priority:</span>
                  <span data-meta-value="">high</span>
                </span>
                <span data-meta-type="quantity" data-meta-rank="secondary">
                  <span data-meta-label="">Complexity:</span>
                  <span data-meta-value="">moderate</span>
                </span>
                <span data-meta-type="tag" data-meta-rank="secondary">
                  <span data-meta-label="" data-meta-label-hidden="">Milestone:</span>
                  <span data-meta-value="">v0.5.0</span>
                </span>
              </div>
            </a>
          </article>
        </div>
        <div role="tabpanel" class="rf-milestone__panel" data-status="in-progress">
          <article class="rf-backlog__card" data-type="work" data-status="in-progress" data-id="WORK-104">
            <a class="rf-backlog__card-link" href="/runes/plan/examples">
              <div data-section="header">
                <span class="rf-backlog__card-header-left">
                  <span data-meta-type="id" data-meta-rank="primary">
                    <span data-meta-label="" data-meta-label-hidden="">ID:</span>
                    <span data-meta-value="">WORK-104</span>
                  </span>
                </span>
                <span class="rf-backlog__card-header-right">
                  <span data-meta-type="status" data-meta-rank="primary" data-meta-sentiment="neutral">
                    <span data-meta-label="" data-meta-label-hidden="">Status:</span>
                    <span data-meta-value="">in-progress</span>
                  </span>
                  <span class="rf-backlog__card-progress" data-checked="2" data-total="3">2/3</span>
                </span>
              </div>
              <div data-section="title">Heading level auto-detection for nested runes</div>
              <div data-section="footer">
                <span data-meta-type="category" data-meta-rank="secondary" data-meta-sentiment="caution">
                  <span data-meta-label="">Priority:</span>
                  <span data-meta-value="">high</span>
                </span>
                <span data-meta-type="quantity" data-meta-rank="secondary">
                  <span data-meta-label="">Complexity:</span>
                  <span data-meta-value="">moderate</span>
                </span>
                <span data-meta-type="tag" data-meta-rank="secondary">
                  <span data-meta-label="" data-meta-label-hidden="">Milestone:</span>
                  <span data-meta-value="">v0.5.0</span>
                </span>
              </div>
            </a>
          </article>
          <article class="rf-backlog__card" data-type="bug" data-status="in-progress" data-id="BUG-103">
            <a class="rf-backlog__card-link" href="/runes/plan/examples">
              <div data-section="header">
                <span class="rf-backlog__card-header-left">
                  <span data-meta-type="id" data-meta-rank="primary">
                    <span data-meta-label="" data-meta-label-hidden="">ID:</span>
                    <span data-meta-value="">BUG-103</span>
                  </span>
                </span>
                <span class="rf-backlog__card-header-right">
                  <span data-meta-type="status" data-meta-rank="primary" data-meta-sentiment="neutral">
                    <span data-meta-label="" data-meta-label-hidden="">Status:</span>
                    <span data-meta-value="">in-progress</span>
                  </span>
                </span>
              </div>
              <div data-section="title">Decision log ignores date filter</div>
              <div data-section="footer">
                <span data-meta-type="category" data-meta-rank="secondary" data-meta-sentiment="caution">
                  <span data-meta-label="">Severity:</span>
                  <span data-meta-value="">major</span>
                </span>
                <span data-meta-type="tag" data-meta-rank="secondary">
                  <span data-meta-label="" data-meta-label-hidden="">Milestone:</span>
                  <span data-meta-value="">v0.5.0</span>
                </span>
              </div>
            </a>
          </article>
        </div>
        <div role="tabpanel" class="rf-milestone__panel" data-status="review">
          <article class="rf-backlog__card" data-type="work" data-status="review" data-id="WORK-108">
            <a class="rf-backlog__card-link" href="/runes/plan/examples">
              <div data-section="header">
                <span class="rf-backlog__card-header-left">
                  <span data-meta-type="id" data-meta-rank="primary">
                    <span data-meta-label="" data-meta-label-hidden="">ID:</span>
                    <span data-meta-value="">WORK-108</span>
                  </span>
                </span>
                <span class="rf-backlog__card-header-right">
                  <span data-meta-type="status" data-meta-rank="primary" data-meta-sentiment="caution">
                    <span data-meta-label="" data-meta-label-hidden="">Status:</span>
                    <span data-meta-value="">review</span>
                  </span>
                  <span class="rf-backlog__card-progress" data-checked="3" data-total="4">3/4</span>
                </span>
              </div>
              <div data-section="title">Responsive modifier system</div>
              <div data-section="footer">
                <span data-meta-type="category" data-meta-rank="secondary" data-meta-sentiment="caution">
                  <span data-meta-label="">Priority:</span>
                  <span data-meta-value="">high</span>
                </span>
                <span data-meta-type="quantity" data-meta-rank="secondary">
                  <span data-meta-label="">Complexity:</span>
                  <span data-meta-value="">complex</span>
                </span>
                <span data-meta-type="tag" data-meta-rank="secondary">
                  <span data-meta-label="" data-meta-label-hidden="">Milestone:</span>
                  <span data-meta-value="">v0.5.0</span>
                </span>
              </div>
            </a>
          </article>
        </div>
        <div role="tabpanel" class="rf-milestone__panel" data-status="confirmed">
          <article class="rf-backlog__card" data-type="bug" data-status="confirmed" data-id="BUG-101">
            <a class="rf-backlog__card-link" href="/runes/plan/examples">
              <div data-section="header">
                <span class="rf-backlog__card-header-left">
                  <span data-meta-type="id" data-meta-rank="primary">
                    <span data-meta-label="" data-meta-label-hidden="">ID:</span>
                    <span data-meta-value="">BUG-101</span>
                  </span>
                </span>
                <span class="rf-backlog__card-header-right">
                  <span data-meta-type="status" data-meta-rank="primary" data-meta-sentiment="caution">
                    <span data-meta-label="" data-meta-label-hidden="">Status:</span>
                    <span data-meta-value="">confirmed</span>
                  </span>
                </span>
              </div>
              <div data-section="title">Pipeline crashes on circular entity references</div>
              <div data-section="footer">
                <span data-meta-type="category" data-meta-rank="secondary" data-meta-sentiment="negative">
                  <span data-meta-label="">Severity:</span>
                  <span data-meta-value="">critical</span>
                </span>
                <span data-meta-type="tag" data-meta-rank="secondary">
                  <span data-meta-label="" data-meta-label-hidden="">Milestone:</span>
                  <span data-meta-value="">v0.5.0</span>
                </span>
              </div>
            </a>
          </article>
        </div>
      </div>
    </div>
  </div>
</section>

Planning milestone

A future milestone still being scoped.

{% milestone name="v1.0" target="2026-06-01" status="planning" %}
# v1.0 — Stable Release

- Stabilise all public APIs
- Complete documentation for all runes
- Launch theme marketplace
- Publish migration guide from v0.x
{% /milestone %}
<section data-rune="milestone">
  <meta content="v1.0" data-field="name">
  <meta content="2026-06-01" data-field="target">
  <meta content="planning" data-field="status">
  <meta content="2026-04-10" data-field="created">
  <meta content="2026-04-10" data-field="modified">
  <div data-name="body">
    <header>
      <h1 id="v1.0-—-stable-release">v1.0 — Stable Release</h1>
    </header>
    <ul>
      <li>Stabilise all public APIs</li>
      <li>Complete documentation for all runes</li>
      <li>Launch theme marketplace</li>
      <li>Publish migration guide from v0.x</li>
    </ul>
  </div>
</section>
Name:v1.0Status:planning

v1.0 — Stable Release

  • Stabilise all public APIs
  • Complete documentation for all runes
  • Launch theme marketplace
  • Publish migration guide from v0.x
Progress0/4 criteria

ready

<section class="rf-milestone rf-milestone--v1.0 rf-milestone--planning" data-name="v1.0" data-status="planning" data-target="2026-06-01" data-created="2026-04-10" data-modified="2026-04-10" data-rune="milestone" data-density="full">
  <div data-name="header" class="rf-milestone__header" data-section="header">
    <span data-name="name-badge" data-meta-type="id" data-meta-rank="primary" class="rf-milestone__name-badge">
      <span data-meta-label="" data-meta-label-hidden="">Name:</span>
      <span data-meta-value="">v1.0</span>
    </span>
    <span data-name="status-badge" data-meta-type="status" data-meta-rank="primary" data-meta-sentiment="neutral" class="rf-milestone__status-badge">
      <span data-meta-label="" data-meta-label-hidden="">Status:</span>
      <span data-meta-value="">planning</span>
    </span>
    <time data-name="target-badge" data-meta-type="temporal" data-meta-rank="secondary" class="rf-milestone__target-badge">
      <span data-meta-label="">Target:</span>
      <span data-meta-value="">2026-06-01</span>
    </time>
    <time data-name="created-badge" data-meta-type="temporal" data-meta-rank="secondary" class="rf-milestone__created-badge">
      <span data-meta-label="">Created:</span>
      <span data-meta-value="">2026-04-10</span>
    </time>
    <time data-name="modified-badge" data-meta-type="temporal" data-meta-rank="secondary" class="rf-milestone__modified-badge">
      <span data-meta-label="">Modified:</span>
      <span data-meta-value="">2026-04-10</span>
    </time>
  </div>
  <div data-name="body" class="rf-milestone__body" data-section="body">
    <meta content="v1.0" data-field="name" />
    <meta content="2026-06-01" data-field="target" />
    <meta content="planning" data-field="status" />
    <meta content="2026-04-10" data-field="created" />
    <meta content="2026-04-10" data-field="modified" />
    <div data-name="body" class="rf-milestone__body" data-section="body">
      <header>
        <h1 id="v1.0-—-stable-release">v1.0 — Stable Release</h1>
      </header>
      <ul>
        <li>Stabilise all public APIs</li>
        <li>Complete documentation for all runes</li>
        <li>Launch theme marketplace</li>
        <li>Publish migration guide from v0.x</li>
      </ul>
    </div>
    <div class="rf-milestone__backlog rf-milestone__backlog" data-name="backlog" data-rune="milestone-backlog">
      <div class="rf-milestone__progress" data-progress-checked="0" data-progress-total="4" data-percent="0">
        <div class="rf-milestone__progress-header">
          <span class="rf-milestone__progress-label">Progress</span>
          <span class="rf-milestone__progress-count">0/4 criteria</span>
        </div>
        <span class="rf-milestone__progress-bar" style="--rf-progress: 0%"></span>
      </div>
      <div class="rf-milestone__backlog-group" data-status="ready">
        <h3 class="rf-milestone__backlog-group-label">ready</h3>
        <article class="rf-backlog__card" data-type="work" data-status="ready" data-id="WORK-103">
          <a class="rf-backlog__card-link" href="/runes/plan/examples">
            <div data-section="header">
              <span class="rf-backlog__card-header-left">
                <span data-meta-type="id" data-meta-rank="primary">
                  <span data-meta-label="" data-meta-label-hidden="">ID:</span>
                  <span data-meta-value="">WORK-103</span>
                </span>
              </span>
              <span class="rf-backlog__card-header-right">
                <span data-meta-type="status" data-meta-rank="primary" data-meta-sentiment="neutral">
                  <span data-meta-label="" data-meta-label-hidden="">Status:</span>
                  <span data-meta-value="">ready</span>
                </span>
                <span class="rf-backlog__card-progress" data-checked="0" data-total="4">0/4</span>
              </span>
            </div>
            <div data-section="title">Interactive rune playground</div>
            <div data-section="footer">
              <span data-meta-type="category" data-meta-rank="secondary" data-meta-sentiment="neutral">
                <span data-meta-label="">Priority:</span>
                <span data-meta-value="">medium</span>
              </span>
              <span data-meta-type="quantity" data-meta-rank="secondary">
                <span data-meta-label="">Complexity:</span>
                <span data-meta-value="">complex</span>
              </span>
              <span data-meta-type="tag" data-meta-rank="secondary">
                <span data-meta-label="" data-meta-label-hidden="">Milestone:</span>
                <span data-meta-value="">v1.0</span>
              </span>
            </div>
          </a>
        </article>
      </div>
    </div>
  </div>
</section>

Completed milestone

A milestone with all goals achieved.

{% milestone name="v0.4.0" status="complete" %}
# v0.4.0 — Foundation

- Core rune system operational
- Identity transform engine complete
- Lumina theme baseline shipped
{% /milestone %}
<section data-rune="milestone">
  <meta content="v0.4.0" data-field="name">
  <meta content="" data-field="target">
  <meta content="complete" data-field="status">
  <meta content="2026-04-10" data-field="created">
  <meta content="2026-04-10" data-field="modified">
  <div data-name="body">
    <header>
      <h1 id="v0.4.0-—-foundation">v0.4.0 — Foundation</h1>
    </header>
    <ul>
      <li>Core rune system operational</li>
      <li>Identity transform engine complete</li>
      <li>Lumina theme baseline shipped</li>
    </ul>
  </div>
</section>
Name:v0.4.0Status:complete

v0.4.0 — Foundation

  • Core rune system operational
  • Identity transform engine complete
  • Lumina theme baseline shipped
Progress3/3 criteria
<section class="rf-milestone rf-milestone--v0.4.0 rf-milestone--complete" data-name="v0.4.0" data-status="complete" data-created="2026-04-10" data-modified="2026-04-10" data-rune="milestone" data-density="full">
  <div data-name="header" class="rf-milestone__header" data-section="header">
    <span data-name="name-badge" data-meta-type="id" data-meta-rank="primary" class="rf-milestone__name-badge">
      <span data-meta-label="" data-meta-label-hidden="">Name:</span>
      <span data-meta-value="">v0.4.0</span>
    </span>
    <span data-name="status-badge" data-meta-type="status" data-meta-rank="primary" data-meta-sentiment="positive" class="rf-milestone__status-badge">
      <span data-meta-label="" data-meta-label-hidden="">Status:</span>
      <span data-meta-value="">complete</span>
    </span>
    <time data-name="created-badge" data-meta-type="temporal" data-meta-rank="secondary" class="rf-milestone__created-badge">
      <span data-meta-label="">Created:</span>
      <span data-meta-value="">2026-04-10</span>
    </time>
    <time data-name="modified-badge" data-meta-type="temporal" data-meta-rank="secondary" class="rf-milestone__modified-badge">
      <span data-meta-label="">Modified:</span>
      <span data-meta-value="">2026-04-10</span>
    </time>
  </div>
  <div data-name="body" class="rf-milestone__body" data-section="body">
    <meta content="v0.4.0" data-field="name" />
    <meta content="" data-field="target" />
    <meta content="complete" data-field="status" />
    <meta content="2026-04-10" data-field="created" />
    <meta content="2026-04-10" data-field="modified" />
    <div data-name="body" class="rf-milestone__body" data-section="body">
      <header>
        <h1 id="v0.4.0-—-foundation">v0.4.0 — Foundation</h1>
      </header>
      <ul>
        <li>Core rune system operational</li>
        <li>Identity transform engine complete</li>
        <li>Lumina theme baseline shipped</li>
      </ul>
    </div>
    <div class="rf-milestone__backlog rf-milestone__backlog" data-name="backlog" data-rune="milestone-backlog">
      <div class="rf-milestone__progress" data-progress-checked="3" data-progress-total="3" data-percent="100">
        <div class="rf-milestone__progress-header">
          <span class="rf-milestone__progress-label">Progress</span>
          <span class="rf-milestone__progress-count">3/3 criteria</span>
        </div>
        <span class="rf-milestone__progress-bar" style="--rf-progress: 100%"></span>
      </div>
      <div data-name="tabs" role="tablist" class="rf-milestone__tabs rf-milestone__tabs">
        <button role="tab" class="rf-milestone__tab" data-status="done">Done (1)</button>
        <button role="tab" class="rf-milestone__tab" data-status="fixed">Fixed (1)</button>
      </div>
      <div data-name="panels" class="rf-milestone__panels rf-milestone__panels">
        <div role="tabpanel" class="rf-milestone__panel" data-status="done">
          <article class="rf-backlog__card" data-type="work" data-status="done" data-id="WORK-106">
            <a class="rf-backlog__card-link" href="/runes/plan/examples">
              <div data-section="header">
                <span class="rf-backlog__card-header-left">
                  <span data-meta-type="id" data-meta-rank="primary">
                    <span data-meta-label="" data-meta-label-hidden="">ID:</span>
                    <span data-meta-value="">WORK-106</span>
                  </span>
                </span>
                <span class="rf-backlog__card-header-right">
                  <span data-meta-type="status" data-meta-rank="primary" data-meta-sentiment="positive">
                    <span data-meta-label="" data-meta-label-hidden="">Status:</span>
                    <span data-meta-value="">done</span>
                  </span>
                  <span class="rf-backlog__card-progress" data-checked="3" data-total="3">3/3</span>
                </span>
              </div>
              <div data-section="title">Add copy button to code fences</div>
              <div data-section="footer">
                <span data-meta-type="category" data-meta-rank="secondary" data-meta-sentiment="neutral">
                  <span data-meta-label="">Priority:</span>
                  <span data-meta-value="">low</span>
                </span>
                <span data-meta-type="quantity" data-meta-rank="secondary">
                  <span data-meta-label="">Complexity:</span>
                  <span data-meta-value="">trivial</span>
                </span>
                <span data-meta-type="tag" data-meta-rank="secondary">
                  <span data-meta-label="" data-meta-label-hidden="">Milestone:</span>
                  <span data-meta-value="">v0.4.0</span>
                </span>
              </div>
            </a>
          </article>
        </div>
        <div role="tabpanel" class="rf-milestone__panel" data-status="fixed">
          <article class="rf-backlog__card" data-type="bug" data-status="fixed" data-id="BUG-104">
            <a class="rf-backlog__card-link" href="/runes/plan/examples">
              <div data-section="header">
                <span class="rf-backlog__card-header-left">
                  <span data-meta-type="id" data-meta-rank="primary">
                    <span data-meta-label="" data-meta-label-hidden="">ID:</span>
                    <span data-meta-value="">BUG-104</span>
                  </span>
                </span>
                <span class="rf-backlog__card-header-right">
                  <span data-meta-type="status" data-meta-rank="primary" data-meta-sentiment="positive">
                    <span data-meta-label="" data-meta-label-hidden="">Status:</span>
                    <span data-meta-value="">fixed</span>
                  </span>
                </span>
              </div>
              <div data-section="title">Plan progress bar label misaligned in Safari</div>
              <div data-section="footer">
                <span data-meta-type="category" data-meta-rank="secondary">
                  <span data-meta-label="">Severity:</span>
                  <span data-meta-value="">cosmetic</span>
                </span>
                <span data-meta-type="tag" data-meta-rank="secondary">
                  <span data-meta-label="" data-meta-label-hidden="">Milestone:</span>
                  <span data-meta-value="">v0.4.0</span>
                </span>
              </div>
            </a>
          </article>
        </div>
      </div>
    </div>
  </div>
</section>

Attributes

AttributeTypeDefaultDescription
namestring—Milestone name, e.g. v0.5.0 (required)
targetstring—Target date (aspirational, not a commitment)
statusstringplanningCurrent status: planning, active, complete
createdstring$file.createdCreation date (ISO 8601). Auto-populated from git history
modifiedstring$file.modifiedLast modified date (ISO 8601). Auto-populated from git history

Common attributes

All block runes share these attributes for layout and theming.

AttributeTypeDefaultDescription
widthstringcontentPage grid width: content, wide, or full
spacingstring—Vertical spacing: flush, tight, default, loose, or breathe
insetstring—Horizontal padding: flush, tight, default, loose, or breathe
tintstring—Named colour tint from theme configuration
tint-modestringautoColour scheme override: auto, dark, or light
bgstring—Named background preset from theme configuration