liveline: inline heading rule, restore diagram, increase spacing

- SectionHeading now renders as flex row with hairline rule extending
  to fill remaining width after the heading text (matching benji.org)
- Removed separate Divider from Section component
- Restored original diagram layout from before refactor
- Increased article gap to 32px, heading padding to 24px top/bottom
- Centered image captions
This commit is contained in:
Tommy D. Rossi
2026-02-20 12:43:06 +01:00
parent 984f41cfbe
commit abd28162aa
2 changed files with 19 additions and 15 deletions
+11 -11
View File
@@ -102,19 +102,19 @@ playwriter -s 1 -e "await page.locator('aria-ref=e5').click()"`}</CodeBlock>
back.
</P>
<CodeBlock lang="bash">{`┌─────────────────────┐ ┌─────────────────────┐ ┌─────────────────┐
<CodeBlock lang="bash">{`┌─────────────────────┐ ┌─────────────────────┐ ┌─────────────────┐
│ BROWSER │ │ LOCALHOST │ │ CLIENT │
│ │ │ │ │ │
│ ┌───────────────┐ │ │ WebSocket Server │ │ ┌───────────┐ │
│ │ Extension │<-----------> :19988 │ │ │ CLI / MCP │ │
│ └───────┬───────┘ │ WS │ │ │ └───────────┘ │
│ │ │ │ /extension │ │ │ │
│ chrome.debugger │ │ │ │ │ v │
│ v │ │ v │ │ ┌───────────┐ │
│ ┌───────────────┐ │ │ /cdp/:id <--------------->│ │ execute │ │
│ │ Tab 1 (green) │ │ └──────────────────────┘ WS │ └───────────┘ │
│ │ Tab 2 (green) │ │ │ │ │
│ │ Tab 3 (gray) │ │ Tab 3 not controlled │ Playwright API │
│ ┌───────────────┐ │ │ WebSocket Server │ │ ┌───────────┐
│ │ Extension │<───────┬───> :19988 │ │ │ CLI / MCP │
│ └───────┬───────┘ │ WS │ │ │ └───────────┘
│ │ │ │ /extension │ │ │
│ chrome.debugger │ │ │ │ │ v
│ v │ │ v │ │ ┌───────────┐ │
│ ┌───────────────┐ │ │ /cdp/:id <───────────────>│ │ execute │ │
│ │ Tab 1 (green) │ │ └──────────────────────┘ WS │ └───────────┘ │
│ │ Tab 2 (green) │ │ │ │
│ │ Tab 3 (gray) │ │ Tab 3 not controlled │ Playwright API
└─────────────────────┘ (extension not clicked) └─────────────────┘`}</CodeBlock>
<P>