refactor: restructure repo into src/ site/ dist/ vendor/ packs/
Separate framework source from website: - src/layers/ + src/main.css: CSS framework source (was assets/css/) - site/: Hugo website (content/, layouts/, hugo.toml) - dist/: built output (asw.css, asw.min.css) - vendor/open-props/: vendored dependency with version tracking - Hugo module mounts: dist/ → static, site runs from site/ Build: hugo --source site/ passes (105 pages). npm run build produces dist/asw.css. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
5bf233348d
commit
910b0e42a6
71 changed files with 76 additions and 3 deletions
58
site/content/notes/diff.md
Normal file
58
site/content/notes/diff.md
Normal file
|
|
@ -0,0 +1,58 @@
|
|||
---
|
||||
title: "Diff"
|
||||
description: "Render structured diffs with line-level semantic markup — added, removed, context, hunk."
|
||||
section: notes
|
||||
prev-url: "status/"
|
||||
prev-title: "Status"
|
||||
next-url: "session/"
|
||||
next-title: "Session Log"
|
||||
type: notes
|
||||
date: 2026-04-09
|
||||
tags: ["notes", "diff", "reference"]
|
||||
ai-disclosure: "generated"
|
||||
ai-model: "claude-sonnet-4-5"
|
||||
ai-provider: "Anthropic"
|
||||
|
||||
---
|
||||
|
||||
## Overview
|
||||
|
||||
Use `data-diff` on a `<pre>` block to render a structured diff. Child elements carry line-level semantics.
|
||||
|
||||
```html
|
||||
<pre data-diff>
|
||||
<span data-line="hunk">@@ -12,7 +12,9 @@</span>
|
||||
<span data-line="context"> function greet(name) {</span>
|
||||
<span data-line="removed">- return "Hello " + name;</span>
|
||||
<span data-line="added">+ const greeting = `Hello, ${name}!`;</span>
|
||||
<span data-line="added">+ return greeting;</span>
|
||||
<span data-line="context"> }</span>
|
||||
</pre>
|
||||
```
|
||||
|
||||
## Line Types
|
||||
|
||||
| Value | Meaning |
|
||||
|-------|---------|
|
||||
| `hunk` | Hunk header (`@@ ... @@`) — muted, italic |
|
||||
| `context` | Unchanged surrounding line — default text |
|
||||
| `removed` | Deleted line — red background, `-` prefix |
|
||||
| `added` | New line — green background, `+` prefix |
|
||||
|
||||
## Inline Diffs
|
||||
|
||||
For single-value changes in prose, use `data-diff` directly on `<del>` and `<ins>`:
|
||||
|
||||
```html
|
||||
<p>
|
||||
Latency changed from
|
||||
<del data-diff="removed">240ms</del>
|
||||
to
|
||||
<ins data-diff="added">18ms</ins>
|
||||
after the index rebuild.
|
||||
</p>
|
||||
```
|
||||
|
||||
## Notes
|
||||
|
||||
The `data-diff` block expects monospace rendering. ASW applies `font-family: var(--asw-font-mono)` automatically — no additional class needed.
|
||||
Loading…
Add table
Add a link
Reference in a new issue