You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
svelte-kit-vice/docs/audit/theming/result.md

6.2 KiB

result — alcance de tema: análisis y propuesta

Generado por node --import tsx/esm scripts/theming-census.ts --report. Lo medido y la propuesta se regeneran; el Veredicto (§5) se conserva. Vista de conjunto: README · método y protocolo: PLAN-theming.md §1, §2, §7.

  • Medido: 2026-08-22 · Alcance: 14% — 3 de 22 knobs por token público
  • Knobs de apariencia: 22 — público 3 · privado 0 · global 15 · literal 4 · sistema 0 (fuera del ratio)
  • Contrato hoy (lib/recipes/base.ts): 8 pública(s) — gap, actions-gap, description-measure, extra-measure, success-fg, error-fg, warning-fg, info-fg
  • Eje size: no · ficheros: result.css

1. Knobs fuera de alcance

1.1 Directo a primitivo global (15)

# fichero:línea selector propiedad valor
1 result.css:22 [data-result] padding-block var(--space-12)
2 result.css:23 [data-result] padding-inline var(--space-5)
3 result.css:34 [data-result-media] font-size calc(var(--size-xl-font-size) * 3)
4 result.css:54 [data-result-code] font-family var(--font-family-mono, monospace)
5 result.css:56 [data-result-code] font-weight var(--font-weight-semibold)
6 result.css:58 [data-result-code] color var(--color-content-muted)
7 result.css:65 [data-result-title] font-size var(--size-xl-font-size)
8 result.css:66 [data-result-title] font-weight var(--font-weight-semibold)
9 result.css:67 [data-result-title] line-height var(--font-line-height-sm, 1.4)
10 result.css:68 [data-result-title] color var(--color-content-primary)
11 result.css:75 [data-result-description] font-size var(--size-md-font-size)
12 result.css:76 [data-result-description] line-height var(--font-line-height-md, 1.5)
13 result.css:77 [data-result-description] color var(--color-content-muted)
14 result.css:100 [data-result-extra] font-size var(--size-sm-font-size)
15 result.css:101 [data-result-extra] color var(--color-content-secondary)

1.2 A través de un privado (0)

Ninguno.

1.3 Literales (4)

# fichero:línea selector propiedad valor
1 result.css:35 [data-result-media] line-height 1
2 result.css:55 [data-result-code] font-size 1em
3 result.css:57 [data-result-code] letter-spacing 0.04em
4 result.css:98 [data-result-extra] inline-size 100%

2. Sistema transversal (0) — informativo, fuera del ratio

Un tema los alcanza a nivel de sistema, por diseño (recipe-contract §2).

Ninguno.

3. Privados de la receta — ¿de dónde sale su valor?

privado declaraciones valor(es) origen ¿deriva de un público?
--_result-media-color 4 var(--result-success-fg), var(--result-error-fg), var(--result-warning-fg), var(--result-info-fg) public sí

4. Propuesta de corrección

4.1 Tokens a declarar en lib/recipes/base.ts (17)

Valor verbatim del CSS de hoy: el default no se mueve, sólo cambia quién puede moverlo. Nombres derivados de recipe-contract §1 (ejes lógicos, talla al final) y theming §6.7 (slots de color, modificador delante). Un token con DOS valores distintos es una colisión de nombre: son dos knobs, o el nombre no distingue lo que debería — se marca ⚠.

token (--result-…) scope TSC valor propuesto usos
padding-block root var(--space-12) 1
padding-inline root var(--space-5) 1
media-font-size root calc(var(--size-xl-font-size) * 3) 1
code-font-family root var(--font-family-mono, monospace) 1
code-font-size root 1em 1
code-font-weight root var(--font-weight-semibold) 1
code-letter-spacing root 0.04em 1
code-fg root var(--color-content-muted) 1
title-font-size root var(--size-xl-font-size) 1
title-font-weight root var(--font-weight-semibold) 1
title-line-height root var(--font-line-height-sm, 1.4) 1
title-fg root var(--color-content-primary) 1
description-font-size root var(--size-md-font-size) 1
description-line-height root var(--font-line-height-md, 1.5) 1
description-fg root var(--color-content-muted) 1
extra-font-size root var(--size-sm-font-size) 1
extra-fg root var(--color-content-secondary) 1

4.2 Sin nombre mecánico (2)

  • ⚠ decisión: 1 es un valor identidad o geometría de layout, no un knob de tema — el perímetro de «knob» es D-TH.2, sin firmar — 1: line-height.
  • ⚠ decisión: 100% es un valor identidad o geometría de layout, no un knob de tema — el perímetro de «knob» es D-TH.2, sin firmar — 1: inline-size.

4.3 Avisos sobre los tokens propuestos (1)

  • ⚠ decisión: el valor es una expresión — el token puede llevar la expresión entera o sólo su término variable — --result-media-font-size

4.4 Lo que hay que comprobar a mano (PLAN-theming §1.3 · §7.4)

  • Privado que no deriva de un público — §3 lo marca; el privado debe leer el público o desaparecer.
  • Velo o acento en el nodo equivocado (archetype: 'item' en un envoltorio, un background en shorthand que mata la capa de estado) — se mide desde el píxel hacia arriba.
  • Doble animación al mover un sello a una superficie con animación propia — registro de animationstart/animationend.
  • Diff de computed = 0 en reposo · hover · abierto · disabled · foco, por talla, antes y después.
  • Centinela por token nuevo: valor imposible en el root → el nodo lo sigue. Si no, el token miente.

5. Veredicto

(pendiente — lo escribe el autor; se conserva al regenerar)

Powered by TurnKey Linux.