Skip to content

Commit d95cc58

Browse files
committed
style(docs): oxfmt italic marker normalization
oxfmt prefers underscore-style italics (_word_) over asterisk-style (*word*). Running the formatter normalized the emphasis markers in pages-design-system.md to match the repo's format output.
1 parent 7efd05f commit d95cc58

1 file changed

Lines changed: 28 additions & 26 deletions

File tree

docs/pages-design-system.md

Lines changed: 28 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,7 @@ Key traits:
7676
- **Large, confident toggles.** Easy to scan "on" vs "off" from across
7777
the screen.
7878

79-
Mood: *one important choice at a time*.
79+
Mood: _one important choice at a time_.
8080

8181
### Reference B — "Scan" screen
8282

@@ -118,7 +118,7 @@ Key traits:
118118
green means "done". Used consistently, a chip's color tells you what
119119
the row is about before you read the word.
120120

121-
Mood: *see everything at once*.
121+
Mood: _see everything at once_.
122122

123123
## One system, two tiers
124124

@@ -136,11 +136,11 @@ system applied at two densities.
136136
layout, short rules big toggles, long connectors
137137
```
138138

139-
If you are about to build a surface, ask: **"is the user *choosing*
140-
here, or *reading* here?"** If choosing → Tier 1. If reading → Tier 2.
139+
If you are about to build a surface, ask: **"is the user _choosing_
140+
here, or _reading_ here?"** If choosing → Tier 1. If reading → Tier 2.
141141

142142
> **Why this works:** decisions need room because the user is about to
143-
> *act*. Reading doesn't — dense layouts help comparison. Matching the
143+
> _act_. Reading doesn't — dense layouts help comparison. Matching the
144144
> density to the intent makes the page feel like it was made for what
145145
> you're about to do.
146146
@@ -176,9 +176,7 @@ Here's a before/after showing how a Tier 1 card is built.
176176

177177
```html
178178
<div>
179-
<label>
180-
<input type="checkbox"> Create Issue
181-
</label>
179+
<label> <input type="checkbox" /> Create Issue </label>
182180
<p>Create an issue in the ticketing system when conditions are met.</p>
183181
</div>
184182
```
@@ -191,8 +189,8 @@ Here's a before/after showing how a Tier 1 card is built.
191189
<div>
192190
<h3 class="decision-title">Create Issue</h3>
193191
<p class="decision-help">
194-
Create an issue in the ticketing system when the event
195-
occurs and conditions are met.
192+
Create an issue in the ticketing system when the event occurs and
193+
conditions are met.
196194
</p>
197195
</div>
198196
<button class="toggle" data-state="on" aria-pressed="true">
@@ -261,8 +259,12 @@ Today the TOC renders like this:
261259

262260
```html
263261
<ul>
264-
<li><a href="/part/1">Part 1: Anatomy of a PURL</a> <span>(41 sections)</span></li>
265-
<li><a href="/part/2">Part 2: Building PURLs</a> <span>(18 sections)</span></li>
262+
<li>
263+
<a href="/part/1">Part 1: Anatomy of a PURL</a> <span>(41 sections)</span>
264+
</li>
265+
<li>
266+
<a href="/part/2">Part 2: Building PURLs</a> <span>(18 sections)</span>
267+
</li>
266268
</ul>
267269
```
268270

@@ -364,22 +366,22 @@ quietest. Each role has a CSS variable defined in
364366
`walkthrough-overrides.css`. Use variables — never hex codes — so dark
365367
and light themes both work automatically.
366368

367-
| Role | CSS variable | What it's for |
368-
|---|---|---|
369-
| **Primary text** | `--prose-text` | Titles, values, the thing you came to read. Brightest on page. |
370-
| **Muted label** | `--eyebrow` | Definition-list labels (`Part 1`, `Events`), section kickers. Half-bright. |
371-
| **Chip surface** | `--code-bg` | The background of a chip or tag. A subtle step darker than the page. |
372-
| **Accent** | `--accent` | Primary buttons, active state, current step. Our brand violet. |
373-
| **Accent soft** | `--accent-soft` | Hover fills, active outlines. Lighter tint of accent. |
374-
| **Success** | `--success` | Confirm actions, "done" / "active" badges. Green. |
375-
| **Danger** | `--danger` | Destructive actions only. Red. Never for "attention." |
376-
| **Rule** | `--rule` | Horizontal/vertical lines at semantic boundaries. |
369+
| Role | CSS variable | What it's for |
370+
| ---------------- | --------------- | -------------------------------------------------------------------------- |
371+
| **Primary text** | `--prose-text` | Titles, values, the thing you came to read. Brightest on page. |
372+
| **Muted label** | `--eyebrow` | Definition-list labels (`Part 1`, `Events`), section kickers. Half-bright. |
373+
| **Chip surface** | `--code-bg` | The background of a chip or tag. A subtle step darker than the page. |
374+
| **Accent** | `--accent` | Primary buttons, active state, current step. Our brand violet. |
375+
| **Accent soft** | `--accent-soft` | Hover fills, active outlines. Lighter tint of accent. |
376+
| **Success** | `--success` | Confirm actions, "done" / "active" badges. Green. |
377+
| **Danger** | `--danger` | Destructive actions only. Red. Never for "attention." |
378+
| **Rule** | `--rule` | Horizontal/vertical lines at semantic boundaries. |
377379

378380
> **Junior-dev tip:** if you think you need a new color, you usually
379381
> don't — you need one of these roles at a different opacity. Add an
380382
> opacity step before adding a color. If the token you want doesn't
381383
> exist, add it to `walkthrough-overrides.css` and this doc in the
382-
> *same commit* so the system stays in sync.
384+
> _same commit_ so the system stays in sync.
383385
384386
## Component patterns
385387

@@ -517,7 +519,7 @@ walkthrough.json`). The secondary is `Dismiss`.
517519

518520
## Anti-patterns
519521

520-
These are mistakes that *look* reasonable until you see the
522+
These are mistakes that _look_ reasonable until you see the
521523
consequences. Learn to spot them.
522524

523525
### Mixing tiers on one surface
@@ -623,5 +625,5 @@ keeping it honest:
623625
tokens this doc references, with inline comments explaining why each
624626
value was picked.
625627
- [scripts/walkthrough.mts](../scripts/walkthrough.mts) — the generator
626-
+ post-processor; read this if you need to change the generated HTML
627-
shape (e.g. to add a new class a component needs).
628+
- post-processor; read this if you need to change the generated HTML
629+
shape (e.g. to add a new class a component needs).

0 commit comments

Comments
 (0)