Port homepage, posts section, shortcodes; update hugo.toml menus
- content/_index.md: homepage with site description and callout examples - content/posts/asw-vocabulary.md: ASW data-* attribute vocabulary reference - content/posts/getting-started.md: ASW-Hugo setup guide (updated URLs) - hugo.toml: add params, taxonomies, menus (main + docs sidebar), ToC settings - layouts/partials/nav.html: dynamic Hugo menu rendering (was hardcoded) - layouts/shortcodes/callout.html, wikilink.html: ported from asw-hugo theme Closes: asw#17, asw#13, asw#11, asw#16 28 pages build clean, deploy confirmed at port 8000.
This commit is contained in:
parent
4f2b0a67e1
commit
267a7b1bc8
8 changed files with 353 additions and 7 deletions
74
content/posts/asw-vocabulary.md
Normal file
74
content/posts/asw-vocabulary.md
Normal file
|
|
@ -0,0 +1,74 @@
|
|||
---
|
||||
title: "ASW Data-Attribute Vocabulary"
|
||||
description: "The data-* attributes emitted by the ASW-Hugo pack."
|
||||
date: 2026-04-08
|
||||
tags: [asw, html, reference]
|
||||
ai-disclosure: "generated"
|
||||
ai-model: "claude-sonnet-4-5"
|
||||
ai-provider: "Anthropic"
|
||||
|
||||
---
|
||||
|
||||
# ASW Data-Attribute Vocabulary
|
||||
|
||||
The ASW-Hugo pack emits these `data-*` attributes in its HTML output.
|
||||
|
||||
| Attribute | Element | Meaning |
|
||||
|-----------|---------|---------|
|
||||
| `data-callout="note"` | `<aside>` | Note callout block |
|
||||
| `data-callout="warning"` | `<aside>` | Warning callout |
|
||||
| `data-callout="tip"` | `<aside>` | Tip callout |
|
||||
| `data-callout="info"` | `<aside>` | Info callout |
|
||||
| `data-wikilink` | `<a>` | Internal vault-style link |
|
||||
| `data-role="tag-cloud"` | `<nav>` | Tag navigation |
|
||||
| `data-layout="grid"` | `<section>` | Grid layout for list pages |
|
||||
| `data-tag` | `<a>` | Tag label on links |
|
||||
|
||||
All styling comes from `asw.css` targeting these attributes — no CSS classes required.
|
||||
|
||||
## Example: Full Page Skeleton
|
||||
|
||||
A complete ASW page emitted by the Hugo pack looks like this:
|
||||
|
||||
```html
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Session Log · Vault</title>
|
||||
<link rel="stylesheet" href="/css/asw.css">
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<nav>
|
||||
<ul><li><strong>Vault</strong></li></ul>
|
||||
<ul>
|
||||
<li><a href="/posts/">Posts</a></li>
|
||||
<li><a href="/vault/">Vault</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<div data-layout="docs">
|
||||
<aside>
|
||||
<nav aria-label="Vault documentation" data-nav="sidebar">
|
||||
<ul>
|
||||
<li><a href="/vault/tasks/" aria-current="page">Tasks</a></li>
|
||||
<li><a href="/vault/wikilinks/">Wikilinks</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</aside>
|
||||
|
||||
<article>
|
||||
<hgroup>
|
||||
<h1>Tasks</h1>
|
||||
<p>Render task lists with semantic state.</p>
|
||||
</hgroup>
|
||||
<!-- page content -->
|
||||
</article>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
Notice: no `class` attributes anywhere. The layout, sidebar, and navigation styles are all driven by element semantics and `data-*` attributes.
|
||||
Loading…
Add table
Add a link
Reference in a new issue