asw-v01: archive deferred content (packs, site, lab, legacy examples)

- 2.1: packs/ -> archive/packs/
- 2.2: site/ -> archive/site/
- 2.3: src/lab/ -> archive/lab/
- 2.4: examples/ -> archive/examples-legacy/ (SSI-based)
This commit is contained in:
exe.dev user 2026-06-07 10:39:21 +02:00
parent 416fe2f180
commit e47a9f4401
173 changed files with 11 additions and 5 deletions

View file

@ -0,0 +1,125 @@
<!doctype html>
<html lang="en">
<head>
<!--#include virtual="/_include/head.html" -->
<title>Grid — ASW</title>
<meta name="description" content="data-layout grid patterns grid-2,
grid-3, card-grid, stats, inline definition list">
</head>
<body>
<!--#include virtual="/_include/nav.html" -->
<main>
<header>
<h1>Grid</h1>
<p data-text="lead">data-layout grid patterns — grid-2, grid-3, card-grid, stats, inline definition list</p>
</header>
<section>
<h2>Two-column grid</h2>
<p><code>data-layout="grid-2"</code> — equal two-column layout. Collapses to one column below 768px.</p>
<div data-layout="grid-2">
<article>
<h3>Vault-native</h3>
<p>Concepts that exist in knowledge management tools but have no HTML equivalent: tasks, wikilinks, session boundaries, agent status.</p>
</article>
<article>
<h3>Web-native</h3>
<p>The structural layer stays standard: <code>&lt;article&gt;</code>, <code>&lt;nav&gt;</code>, <code>&lt;header&gt;</code>, <code>&lt;ul&gt;</code>, <code>&lt;details&gt;</code>. No divs with class names.</p>
</article>
</div>
</section>
<section>
<h2>Three-column grid</h2>
<p><code>data-layout="grid-3"</code> — equal three-column layout. Collapses to one column below 768px.</p>
<div data-layout="grid-3">
<article>
<h4>Layer 1</h4>
<p data-text="small">Pico CSS — semantic HTML styled automatically. No classes required.</p>
</article>
<article>
<h4>Layer 2</h4>
<p data-text="small">Theme tokens — Trentuna aesthetic. Warm, dark, paper-and-ink.</p>
</article>
<article>
<h4>Layer 3</h4>
<p data-text="small">Agentic extensions — data-attribute vocabulary for vault-native concepts.</p>
</article>
</div>
</section>
<section>
<h2>Card grid</h2>
<p><code>data-layout="card-grid"</code> — auto-fill responsive grid. Cards minimum 280px wide; count determined by available space.</p>
<div data-layout="card-grid">
<article>
<hgroup>
<h3>Agentic Semantic Web</h3>
<p>Semantic HTML + data attributes</p>
</hgroup>
<p>A CSS framework for agents. Write semantic HTML; get styled output. No classes. No build step.</p>
<a href="/projects/asw/">Explore →</a>
</article>
<article>
<hgroup>
<h3>DocFeeder</h3>
<p>PDF inbox → structured knowledge</p>
</hgroup>
<p>Drop PDFs in a folder; DocFeeder extracts, structures, and writes companion notes for your Obsidian vault.</p>
<a href="#">Learn more →</a>
</article>
<article>
<hgroup>
<h3>Vigilio Garden</h3>
<p>The public-facing presence</p>
</hgroup>
<p>Now pages, projects, and writing. The garden is where sessions become posts.</p>
<a href="/vigilio/">Visit →</a>
</article>
</div>
</section>
<section>
<h2>Stats bar</h2>
<p><code>data-layout="stats"</code> — key-value metrics. Large monospace value, small uppercase label.</p>
<div data-layout="stats">
<div>
<span data-stat="value">2,700+</span>
<span data-stat="label">Sessions</span>
</div>
<div>
<span data-stat="value">68</span>
<span data-stat="label">Dialogues</span>
</div>
<div>
<span data-stat="value">31m</span>
<span data-stat="label">Beat interval</span>
</div>
<div>
<span data-stat="value">4</span>
<span data-stat="label">Grid patterns</span>
</div>
</div>
</section>
<section>
<h2>Inline definition list</h2>
<p><code>data-layout="inline"</code> on <code>&lt;dl&gt;</code> — two-column grid. Terms shrink to content; definitions fill the rest.</p>
<dl data-layout="inline">
<dt>Author</dt> <dd>Vigilio Desto</dd>
<dt>Status</dt> <dd>Published</dd>
<dt>Version</dt> <dd>0.1.0</dd>
<dt>License</dt> <dd>MIT</dd>
<dt>Framework</dt><dd>Agentic Semantic Web</dd>
</dl>
</section>
</main>
<!--#include virtual="/_include/footer.html" -->
</body>
</html>