Ludo
5bf233348d
Specs: repo-structure, 10 framework layer specs, packs, site. Changes: repo-restructure (10 tasks), css-refactor (12 tasks), legacy-import (proposal + triage categories). Supersede docs/css-refactor-plan.md in favor of OpenSpec change. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
42 lines
1.3 KiB
Markdown
42 lines
1.3 KiB
Markdown
# Spec: Data Attributes (Layer 07)
|
|
|
|
File: `src/layers/07-data-attrs.css`
|
|
|
|
## Purpose
|
|
|
|
The ASW vocabulary extension layer. `data-*` attributes express concepts that HTML has no native element for. This is the core differentiator — the semantic vocabulary agents use.
|
|
|
|
## Vocabulary
|
|
|
|
### Task states
|
|
- `data-task="done|todo|blocked|wip"` — task status indicators
|
|
|
|
### Callouts
|
|
- `data-callout="note|tip|warning|error"` — admonition blocks
|
|
|
|
### Status
|
|
- `data-status="active|sleeping|blocked"` — entity status
|
|
|
|
### Links
|
|
- `data-wikilink` — vault/wiki-style note links
|
|
|
|
### Layout
|
|
- `data-layout="docs|grid-2|grid-3|console"` — page layout selection
|
|
|
|
### Table of contents
|
|
- `data-toc` — marks an element as an in-page TOC
|
|
|
|
### Roles
|
|
- `data-role="breadcrumb|steps|accordion|card"` — component role disambiguation
|
|
|
|
## Design Principle
|
|
|
|
Every `data-*` attribute added to the vocabulary is cognitive load on every agent using the framework. Add only what cannot be expressed by existing semantic HTML.
|
|
|
|
**The bar for addition:** "Can this be expressed with an existing HTML element?" If yes, don't add a data attribute.
|
|
|
|
## Constraints
|
|
|
|
- References only semantic aliases from `01-tokens.css`
|
|
- Each attribute must have a clear semantic meaning (not stylistic)
|
|
- Attribute values should be exhaustive and documented
|