e47a9f4401
- 2.1: packs/ -> archive/packs/ - 2.2: site/ -> archive/site/ - 2.3: src/lab/ -> archive/lab/ - 2.4: examples/ -> archive/examples-legacy/ (SSI-based)
121 lines
4.2 KiB
HTML
121 lines
4.2 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<!--#include virtual="/_include/head.html" -->
|
|
<title>Vault Page — ASW Examples</title>
|
|
<meta name="description" content="data-task, data-status,
|
|
data-callout, data-wikilink, data-session — a vault note rendered as a
|
|
web page">
|
|
</head>
|
|
<body>
|
|
<!--#include virtual="/_include/nav.html" -->
|
|
|
|
<main>
|
|
<header>
|
|
<h1>Vault Page</h1>
|
|
<p data-text="lead">data-task, data-status, data-callout,
|
|
data-wikilink, data-session — a vault note rendered as a web page</p>
|
|
</header>
|
|
|
|
<p>A vault note lives in Obsidian. When it ships to the web, the
|
|
data-attributes carry its meaning — tasks stay tasks, wikilinks stay
|
|
navigable, sessions stay bounded. No class names. No custom CSS.</p>
|
|
<hr />
|
|
<h2 id="tasks">Tasks</h2>
|
|
<ul>
|
|
<li data-task="done">Write agent directive and vocabulary reference</li>
|
|
<li data-task="done">Build data-diff and data-redacted CSS primitives</li>
|
|
<li data-task="todo">Promote examples to public catalog</li>
|
|
<li data-task="blocked">npm publish — pending homepage decision</li>
|
|
</ul>
|
|
|
|
<h2 id="status">Status</h2>
|
|
<dl data-layout="inline">
|
|
<dt>Vigilio</dt>
|
|
<dd><span data-status="awake" data-text="mono">ACTIVE</span></dd>
|
|
<dt>Shelley</dt>
|
|
<dd><span data-status="sleeping" data-text="mono">IDLE</span></dd>
|
|
<dt>Build</dt>
|
|
<dd><span data-status="done" data-text="mono">PASSING</span></dd>
|
|
<dt>Proton Bridge</dt>
|
|
<dd><span data-status="blocked" data-text="mono">WAITING</span></dd>
|
|
</dl>
|
|
|
|
<h2 id="callouts">Callouts</h2>
|
|
<div data-callout="note">
|
|
<span data-callout-title>Note</span>
|
|
<p>Informational content. Neutral styling for general notices and context.</p>
|
|
</div>
|
|
|
|
<div data-callout="tip">
|
|
<span data-callout-title>Tip</span>
|
|
<p>Write semantic HTML. Never write <code>style=</code>. Never invent classes.</p>
|
|
</div>
|
|
|
|
<div data-callout="warning">
|
|
<span data-callout-title>Warning</span>
|
|
<p><code>data-redacted</code> hides content visually but does not remove it from the DOM. Do not use for production secrets.</p>
|
|
</div>
|
|
|
|
<div data-callout="error">
|
|
<span data-callout-title>Error</span>
|
|
<p>Missing <code>aria-label</code> on redacted elements. Screen readers announce silence.</p>
|
|
</div>
|
|
|
|
<h2 id="wikilinks">Wikilinks</h2>
|
|
<p>See <span data-wikilink>agentic-semantic-web</span> for the design
|
|
philosophy, <span data-wikilink>data-attributes</span> for the
|
|
vocabulary reference, and
|
|
<span data-wikilink data-unresolved>future-extensions</span> for planned
|
|
work.</p>
|
|
<p>Wikilinks resolve at render time. Unresolved links stay styled but
|
|
inert.</p>
|
|
<h2 id="session">Session</h2>
|
|
<div data-session data-mode="autonomous" data-id="20260403-0900">
|
|
<header>
|
|
<strong><span data-mode="autonomous">autonomous</span></strong> · 2026-04-03 09:00 UTC · 31 min
|
|
</header>
|
|
<p>Processed inbox (senior-software-engineer skill installed). Updated sprint #66 Phase 1 status. Created vault-page example — promoted from <span data-wikilink>lab/examples</span>.</p>
|
|
<ul>
|
|
<li><span data-task="done">Install pi skill from inbox</span></li>
|
|
<li><span data-task="done">Comment Phase 1 complete on #66</span></li>
|
|
<li><span data-task="done">Create vault-page example (#65)</span></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<h2 id="text-utilities">Text Utilities</h2>
|
|
<ul>
|
|
<li>Default body text</li>
|
|
<li><span data-text="mono">Monospaced: commit hash, model name, token
|
|
values</span></li>
|
|
<li><span data-text="dim">Dimmed: metadata, timestamps, secondary
|
|
information</span></li>
|
|
<li><span data-text="accent">Accent: emphasis without
|
|
semantics</span></li>
|
|
</ul>
|
|
<h2 id="layout-two-column-grid">Layout: Two-Column Grid</h2>
|
|
<div data-layout="grid-2">
|
|
<div>
|
|
|
|
<p><strong>Vault-native</strong></p>
|
|
<p>Concepts that exist in knowledge management tools but have no HTML
|
|
equivalent: tasks, wikilinks, session boundaries, agent status.</p>
|
|
</div>
|
|
<div>
|
|
|
|
<p><strong>Web-native</strong></p>
|
|
<p>The structural layer stays standard: <code><article></code>,
|
|
<code><nav></code>, <code><header></code>,
|
|
<code><ul></code>, <code><details></code>. No divs with
|
|
class names.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<hr />
|
|
<p>→ <a href="/projects/asw/docs/vocabulary.html">Vocabulary
|
|
reference</a> for the full data-attribute index.</p>
|
|
</main>
|
|
|
|
<!--#include virtual="/_include/footer.html" -->
|
|
</body>
|
|
</html>
|