Skip to content

style(web): higiene de tokens Forge (post-H17) #172

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Alexendros merged 1 commit into from
Oct 18, 2026
Merged

style(web): higiene de tokens Forge (post-H17) #172

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 5 additions & 2 deletions apps/web/a11y-playwright.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -116,9 +116,12 @@ test.describe("F6 viewports y foco", () => {
test(`rail y skip link visibles a ${width}px`, async ({ page }) => {
await page.setViewportSize({ width, height: 800 });
await page.goto(BASE_URL);
await page.waitForLoadState("networkidle");
await expect(
page.locator("nav, [role='navigation']").first(),
page.getByRole("heading", { name: /Disco y particiones/i }),
).toBeVisible({ timeout: 30_000 });
// Rail y stepper coexisten; solo uno es visible por viewport (CSS).
await expect(
page.locator("#step-rail:visible, #step-stepper:visible").first(),
).toBeVisible();
await page.keyboard.press("Tab");
const tag = await page.evaluate(() => document.activeElement?.tagName);
Expand Down
84 changes: 44 additions & 40 deletions apps/web/src/styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,9 @@
CSP style-src 'self' (Vite no debe inyectar <style> inline). */
@import "../../packages/tokens/tokens.css";

@layer reset, tokens, base, layout, components, utilities;
/* Capas alineadas al DS; `overrides` queda vacía a propósito: el runtime es
monolito (styles.css + tokens), no el árbol multi-archivo del doc. */
@layer reset, tokens, base, layout, components, utilities, overrides;

@layer base {
body {
Expand Down Expand Up @@ -36,7 +38,7 @@
max-width: 40rem;
margin: 4rem auto;
padding: var(--ds-space-6);
border: var(--ds-border-thin) var(--color-danger, #b00020);
border: var(--ds-border-thin) var(--color-danger);
border-radius: var(--ds-radius-md);
background: var(--color-surface);
}
Expand Down Expand Up @@ -65,7 +67,7 @@
background: var(--color-canvas);
position: sticky;
top: 0;
z-index: 40;
z-index: var(--ds-z-sticky);
}
.forge-brand {
display: flex;
Expand All @@ -77,7 +79,7 @@
height: 2rem;
border-radius: var(--ds-radius-sm);
background: var(--color-action);
color: #fff;
color: var(--button-fg);
display: grid;
place-items: center;
font-weight: 700;
Expand All @@ -97,7 +99,7 @@
padding: 0.125rem 0.375rem;
border-radius: var(--ds-radius-sm);
background: var(--color-action);
color: #fff;
color: var(--button-fg);
vertical-align: middle;
}
.forge-subtitle {
Expand Down Expand Up @@ -178,7 +180,7 @@
color: var(--color-action);
}
.forge-stepper-item.is-invalid {
border-color: var(--color-danger, #b42318);
border-color: var(--color-danger);
}
.forge-stepper-num {
font-weight: 700;
Expand Down Expand Up @@ -222,7 +224,7 @@
}
.forge-btn-primary {
background: var(--color-action);
color: #fff;
color: var(--button-fg);
border: var(--ds-border-thin) var(--color-action);
border-radius: var(--ds-radius-sm);
padding: var(--ds-space-2) var(--ds-space-4);
Expand All @@ -247,26 +249,6 @@
padding: var(--ds-space-1) var(--ds-space-2);
font-size: 0.6875rem;
}
.forge-mode-toggle {
display: flex;
gap: var(--ds-space-1);
padding: var(--ds-space-1);
background: var(--color-surface);
border: var(--ds-border-thin) var(--color-border);
border-radius: var(--ds-radius-md);
}
.forge-mode-toggle button {
border: none;
background: transparent;
border-radius: var(--ds-radius-sm);
padding: var(--ds-space-1) var(--ds-space-3);
font-size: 0.75rem;
color: var(--color-text-muted);
}
.forge-mode-active {
background: var(--color-text) !important;
color: var(--color-canvas) !important;
}
.forge-cmd-btn {
display: none;
}
Expand Down Expand Up @@ -301,6 +283,8 @@
border: var(--ds-border-thin) transparent;
background: transparent;
}
/* Herencia baseline: current = selected (action), no --rail-item-current-bg
(azul de token) hasta captura auditada contra reference/v5.1. */
.forge-rail-item.is-current {
background: var(--option-card-selected-bg);
border-color: var(--color-action);
Expand All @@ -319,18 +303,18 @@
}
.forge-rail-item.is-current .forge-rail-num {
background: var(--color-action);
color: #fff;
color: var(--button-fg);
border-color: var(--color-action);
}
.forge-rail-item.is-complete .forge-rail-num {
background: var(--color-success);
color: #fff;
color: var(--button-fg);
border-color: var(--color-success);
}
.forge-rail-item.is-invalid .forge-rail-num {
background: var(--color-danger, #b42318);
color: #fff;
border-color: var(--color-danger, #b42318);
background: var(--color-danger);
color: var(--button-fg);
border-color: var(--color-danger);
}
.forge-rail-title {
display: block;
Expand Down Expand Up @@ -447,7 +431,7 @@
}
.forge-card.is-selected .forge-tag {
background: var(--color-action);
color: #fff;
color: var(--button-fg);
border-color: var(--color-action);
}
.forge-info-card {
Expand Down Expand Up @@ -498,13 +482,25 @@
height: 2.75rem;
border-radius: var(--ds-radius-sm);
border: var(--ds-border-thin) var(--color-border);
background: linear-gradient(135deg, #e5e7eb, #d2d2d2);
background: linear-gradient(
135deg,
var(--ds-color-neutral-150),
var(--ds-color-neutral-200)
);
}
.forge-preview-mini[data-env="gnome"] {
background: linear-gradient(135deg, #2a2a2a, #151515);
background: linear-gradient(
135deg,
var(--ds-color-neutral-800),
var(--ds-color-neutral-900)
);
}
.forge-preview-mini[data-env="kde"] {
background: linear-gradient(135deg, #1e3a5f, #2d5aa0);
background: linear-gradient(
135deg,
var(--ds-color-blue-900),
var(--ds-color-blue-500)
);
}
.forge-nav-row {
display: flex;
Expand Down Expand Up @@ -599,13 +595,17 @@
margin: var(--ds-space-3);
border-radius: var(--ds-radius-sm);
border: var(--ds-border-thin) var(--color-border);
background: radial-gradient(120% 120% at 20% 10%, #2a2a2a 0%, #151515 60%);
background: radial-gradient(
120% 120% at 20% 10%,
var(--ds-color-neutral-800) 0%,
var(--ds-color-neutral-900) 60%
);
overflow: hidden;
}
.forge-preview-bar {
height: 1.5rem;
background: rgba(0, 0, 0, 0.8);
color: #fff;
color: var(--ds-color-neutral-0);
display: flex;
justify-content: space-between;
align-items: center;
Expand Down Expand Up @@ -720,7 +720,7 @@
.forge-drawer-backdrop {
position: fixed;
inset: 0;
z-index: 50;
z-index: var(--ds-z-dialog);
display: flex;
align-items: center;
justify-content: center;
Expand Down Expand Up @@ -751,7 +751,7 @@
.forge-cmd,
.forge-drawer {
position: relative;
z-index: 1;
z-index: var(--ds-z-base);
background: var(--color-canvas);
border: var(--ds-border-thin) var(--color-border);
border-radius: var(--ds-radius-md);
Expand Down Expand Up @@ -826,3 +826,7 @@
background: var(--color-surface);
}
}

@layer overrides {
/* Reservada: sin overrides de producto en esta entrega. */
}
Binary file modified apps/web/visual-baselines/home-dark.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified apps/web/visual-baselines/home-high-contrast.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified apps/web/visual-baselines/home-light.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified apps/web/visual-baselines/home-reduced-motion.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
53 changes: 29 additions & 24 deletions docs/10-delivery/closure/forge-integrity-findings-2026-10-18.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,25 +30,25 @@ reviewers:

## H01–H17

| ID | Prioridad | Estado | Evidencia / PR |
| --- | --------- | ---------- | ------------------------------------------------------------------------------------------------------------------- |
| H01 | P0 | fixed | `storagePlan` en draft vía cara + Rust; cadena `withFaceV2Fields` → `draftForCore` en helpers; PR #163 + #170 |
| H02 | P0 | fixed | Sin `uiState: validated` al generar manifiesto; PR #163 |
| H03 | P0 | fixed | Tipos v2 en `coreport.ts`; enum observación alineado al schema en #169 |
| H04 | P1 | superseded | Strip de intención/no verificadas documentado y visible; política de cara, no defecto silencioso; PR #163 |
| H05 | P1 | fixed | Inspector Manifiesto ← `effectiveSelections`; PR #165 |
| H06 | P1 | fixed | Listas kernel/boot/fs desde `loadCatalog` (`mergeFaceOptionsFromCatalog`); PR #169 |
| H07 | P1 | blocked | Steam/multilib sin `ProviderChannel::Multilib` aprobado; nota en cara; sin ADR |
| H08 | P1 | fixed | Cursor unverified y fuera de preselección; PR #165 |
| H09 | P1 | fixed | MB como estimación de cara en ficha, inspector, filas y paleta; chips de versión editoriales; PR #165 + #169 |
| H10 | P1 | fixed | Code - OSS en cara y fixture `local-catalog-mvp1.json`; PR #165 + #169 |
| H11 | P1 | fixed | Deshacer vía `applyDraft`/`draftRef`; PR #164 |
| H12 | P1 | fixed | Generación al elegir archivo; PR #164 |
| H13 | P1 | fixed | `goToStep` no borra `invalid`; PR #164 |
| H14 | P1 | fixed | `loadLastDraftLocal` discriminado; PR #164 |
| H15 | P1 | fixed | Focus trap + inert (incl. importación, glosario, stepper); PR #166 + #168 |
| H16 | P1 | fixed | T42 exige `AM-PROV-001` / `diagnostic.unverifiedProviderSelected`; buildManifest bloqueado; PR #167 + #170 |
| H17 | P0 | fixed | CSP `style-src 'self'` bloqueaba CSS de Vite (`<style>`); `/forge-face.css` + gate `!ready`/`bootError`; PR GUI-CSP |
| ID | Prioridad | Estado | Evidencia / PR |
| --- | --------- | ---------- | ---------------------------------------------------------------------------------------------------------------- |
| H01 | P0 | fixed | `storagePlan` en draft vía cara + Rust; cadena `withFaceV2Fields` → `draftForCore` en helpers; PR #163 + #170 |
| H02 | P0 | fixed | Sin `uiState: validated` al generar manifiesto; PR #163 |
| H03 | P0 | fixed | Tipos v2 en `coreport.ts`; enum observación alineado al schema en #169 |
| H04 | P1 | superseded | Strip de intención/no verificadas documentado y visible; política de cara, no defecto silencioso; PR #163 |
| H05 | P1 | fixed | Inspector Manifiesto ← `effectiveSelections`; PR #165 |
| H06 | P1 | fixed | Listas kernel/boot/fs desde `loadCatalog` (`mergeFaceOptionsFromCatalog`); PR #169 |
| H07 | P1 | blocked | Steam/multilib sin `ProviderChannel::Multilib` aprobado; nota en cara; sin ADR |
| H08 | P1 | fixed | Cursor unverified y fuera de preselección; PR #165 |
| H09 | P1 | fixed | MB como estimación de cara en ficha, inspector, filas y paleta; chips de versión editoriales; PR #165 + #169 |
| H10 | P1 | fixed | Code - OSS en cara y fixture `local-catalog-mvp1.json`; PR #165 + #169 |
| H11 | P1 | fixed | Deshacer vía `applyDraft`/`draftRef`; PR #164 |
| H12 | P1 | fixed | Generación al elegir archivo; PR #164 |
| H13 | P1 | fixed | `goToStep` no borra `invalid`; PR #164 |
| H14 | P1 | fixed | `loadLastDraftLocal` discriminado; PR #164 |
| H15 | P1 | fixed | Focus trap + inert (incl. importación, glosario, stepper); PR #166 + #168 |
| H16 | P1 | fixed | T42 exige `AM-PROV-001` / `diagnostic.unverifiedProviderSelected`; buildManifest bloqueado; PR #167 + #170 |
| H17 | P0 | fixed | CSP `style-src 'self'` bloqueaba CSS de Vite (`<style>`); `/forge-face.css` + gate `!ready`/`bootError`; PR #171 |

## Gates

Expand All @@ -71,13 +71,18 @@ reviewers:
3. Aceptación de `forge-declarative-scope` / ADR-0013…0018 si se pretende certificar hardware declarativo.
4. Catálogo remoto / snapshot-diff (fuera del veredicto CONDITIONAL-CLEAR).

## Nota de mantenibilidad GUI (post-H17)

Higiene de tokens en `styles.css` (CSS muerto Sencillo/Avanzado, literales → tokens, capa `overrides` vacía; rail current documentado como herencia selected). Sin V8/GO. PR de higiene de diseño tras #171.

## PRs de la serie residual (2026-10-18)

| PR | Tema |
| ---- | ------------------------------------ |
| #168 | H15 foco residual |
| #169 | H06/H09/H10 catálogo y etiquetas |
| #170 | H16 T42 + H01 cadena + este registro |
| PR | Tema |
| ---- | ------------------------------------- |
| #168 | H15 foco residual |
| #169 | H06/H09/H10 catálogo y etiquetas |
| #170 | H16 T42 + H01 cadena + este registro |
| #171 | H17 CSP `/forge-face.css` + boot gate |

## Comandos locales de referencia (serie residual)

Expand Down
Loading