feat(ms-ai-architect): v1.11.0 Sesjon 2 — design-system 100%-adoption (Fase 4-6) [skip-docs]

Migrerer alle 6 PARALLEL CSS-navn i playground HTML til DS-konvensjon:
- .topbar*           -> .app-header*               (DS components.css)
- .residual-pair*    -> .pair-before-after*        (DS components-tier3.css; data-severity -> BEM modifier)
- .command-card*     -> .card + .card__*           (DS base.css + tier3-supplement; outer + 4 sub-elementer)
- .catalog-card*     -> .card + .card__*           (samme; outer + 7 sub-elementer)
- .screen-tabs/.screen-tab/.screen
                     -> .tab-list/.tab/.tab-panel  (DS tier3-supplement; data-active="..." -> [hidden]-attr)
- .pyramide-desc*    -> .stack-sm + .pyramide-tier-detail*
                                                   (DS tier3-supplement section 22+23)

Trimmer plugin-local <style>-blokk fra 202 -> 127 linjer (37% reduksjon):
- Sletter inline duplikater av DS v0.3 sections 14-15 (.page__*, .key-stats, .key-stat--{level})
- Sletter inline duplikater av sections 18-19 (.top-risks, .recommendation-card)
- Refaktorerer renderPageShell + renderKeyStatsGrid til DS markup-pattern
  (.page__header-main + .page__header-aside + .page__title h1; .key-stat--{level} BEM)

Beholdt eksplisitt plugin-local (med dokumentasjon i CSS-kommentarer):
- .verdict-pill (domain-semantikk go/block — distinkt fra DS .verdict-pill-lg severity-band)
- .scenario-card[data-status="met/partial/missing"] (DS har kun "winner")
- .read-more-block + .suppressed-panel (native <details>; DS bruker JS-toggled aria-expanded)
- .onboarding-*, .home-*, .project-*, .modal*, .command-form*, .catalog-cards (plugin-spesifikk layout)

Visuell oppgradering (Fase 6):
- Eyebrow-label "PROSJEKTER · X av X" over home-projects seksjon
- .card--severity-{positive/medium/critical} venstre-border på rapport-cards basert på
  parsed.verdict (go/approved/allow=positive, go-with-conditions/warning=medium,
  block/failed=critical) — visuell signal for rapport-status i project surface
- AI Act-pyramide bredde min-width: 480px + tier-label font-size: var(--font-size-md)
  for å fjerne tekstklipping ("Uakseptabe...", "klassifisert"). Responsive @media for <560px.
- App-header-restruktur: brand + breadcrumb + spacer + actions (DS pattern), ikke flex-between
- .stack-lg vertikalt rytme-utility på home/project/catalog body i renderPageShell

Tests oppdatert for nye DS-navn:
- Step 10: residual-pair -> pair-before-after assert
- Step 12: screen-tabs -> tab-list assert (class="tab-list" eksplisitt)

Verification: 201 + 70 + 7 = 278/278 PASS, 0 FAIL.
6 intentional plugin-local residuals (1 .catalog-cards container + 4 .read-more-block + 1 .suppressed-panel)
— alle dokumenterte i inline <style>.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
Kjell Tore Guttormsen 2026-05-04 16:46:40 +02:00
commit 31aed40308
3 changed files with 168 additions and 216 deletions

View file

@ -2,8 +2,8 @@
"generated_by": "scripts/sync-design-system.mjs",
"do_not_edit": true,
"source": "shared/playground-design-system/",
"source_commit": "e3378e9b9c8df259ba12f8146c44e5c18b40ff31",
"sync_date": "2026-05-04T07:56:18.490Z",
"source_commit": "f58b89243653b8207f006460e75d4a39bc8348a1",
"sync_date": "2026-05-04T14:45:29.457Z",
"file_count": 26,
"files": {
"CHANGELOG.md": "e293a911701e0ae8e95f8d30e2b583d1c578d0c2af4fd2abfbee3a7d65d5f7ba",