_code.scss
sha256:a34090cc4a394a78bd72cbbe34b08cc59525141e19135b6c0ab154f10611b9ef
debug(push/stream): instrument O-frame decode path with INF…
Sonnet 4.6
patch
121 days ago
| 1 | // ───────────────────────────────────────────────────────────────────────────── |
| 2 | // Component: Code |
| 3 | // File: src/scss/components/_code.scss |
| 4 | // |
| 5 | // Variants: pre, code, pre code, .diff-track-*, .diff-sign-* |
| 6 | // Tokens: --code-output-bg, --bg-overlay, --border-default, --font-mono |
| 7 | // --color-success, --color-danger, --color-accent |
| 8 | // Usage: <pre><code>…</code></pre> |
| 9 | // |
| 10 | // Notes: Syntax highlight colors (hljs) are intentionally hardcoded — |
| 11 | // they are part of the One Dark theme, not the design system. |
| 12 | // ───────────────────────────────────────────────────────────────────────────── |
| 13 | |
| 14 | pre { |
| 15 | background: var(--code-output-bg); |
| 16 | border: 1px solid var(--border-default); |
| 17 | border-radius: var(--radius-base); |
| 18 | padding: var(--space-3); |
| 19 | font-size: 13px; |
| 20 | font-family: var(--font-mono); |
| 21 | overflow-x: auto; |
| 22 | white-space: pre-wrap; |
| 23 | word-break: break-word; |
| 24 | color: var(--text-secondary); |
| 25 | line-height: 1.65; |
| 26 | } |
| 27 | |
| 28 | code { |
| 29 | font-family: var(--font-mono); |
| 30 | font-size: 0.88em; |
| 31 | background: var(--bg-overlay); |
| 32 | border: 1px solid var(--border-subtle); |
| 33 | padding: 1px 6px; |
| 34 | border-radius: 4px; |
| 35 | } |
| 36 | |
| 37 | pre code { |
| 38 | background: transparent; |
| 39 | border: none; |
| 40 | padding: 0; |
| 41 | font-size: inherit; |
| 42 | color: inherit; |
| 43 | } |
| 44 | |
| 45 | // Diff track rows (musical / multi-domain diffs) |
| 46 | .diff-track-row { |
| 47 | display: flex; |
| 48 | align-items: center; |
| 49 | gap: var(--space-3); |
| 50 | padding: var(--space-2) var(--space-3); |
| 51 | border-radius: var(--radius-sm); |
| 52 | margin-bottom: var(--space-1); |
| 53 | } |
| 54 | |
| 55 | .diff-track-added { background: color-mix(in srgb, var(--color-success) 10%, transparent); border-left: 3px solid var(--color-success); } |
| 56 | .diff-track-removed { background: color-mix(in srgb, var(--color-danger) 10%, transparent); border-left: 3px solid var(--color-danger); } |
| 57 | .diff-track-changed { background: color-mix(in srgb, var(--color-accent) 10%, transparent); border-left: 3px solid var(--color-accent); } |
| 58 | |
| 59 | .diff-sign { font-size: var(--text-lg); font-weight: var(--weight-bold); width: 20px; flex-shrink: 0; } |
| 60 | .diff-sign-add, |
| 61 | .diff-sign-add { color: var(--color-success); } |
| 62 | .diff-sign-del, |
| 63 | .diff-sign-remove { color: var(--color-danger); } |
| 64 | .diff-sign-ctx, |
| 65 | .diff-sign-change { color: var(--color-accent); } |
File History
1 commit
sha256:a34090cc4a394a78bd72cbbe34b08cc59525141e19135b6c0ab154f10611b9ef
debug(push/stream): instrument O-frame decode path with INF…
Sonnet 4.6
patch
121 days ago