@@ -6,6 +6,19 @@ Deze integratie vertaalt het Stitch-project **VacatureRadar Intelligence Cockpit
|
||||
|
||||
De volledige ontvangen referentie staat in `docs/design/stitch-reference/`. Deze map en de validatiescreenshots zijn uitgesloten van de productiecontainer via `.dockerignore`; er worden geen externe Tailwind-, font-, icoon-, afbeelding- of JavaScript-CDN's aan de applicatie toegevoegd.
|
||||
|
||||
## VR-119: compositie als primaire bron
|
||||
|
||||
Na productfeedback is de integratie aangescherpt: Stitch bepaalt nu niet alleen kleur, vorm en typografie, maar ook de dominante schermcompositie en informatiedichtheid. Alleen aantoonbaar onveilige of fictieve onderdelen worden vervangen door een functioneel equivalent met echte repositorydata.
|
||||
|
||||
- De utilitybar neemt de brede zoekbalk en directe profielactie over.
|
||||
- Het dashboard gebruikt een enkelkoloms matchfeed met vaste radar-/actierail; één resultaat blijft daardoor een volwaardig primair signaal.
|
||||
- De vacaturelijst toont een dichte intelligencefeed met de laatste gebruikersgescopeerde score via databaseannotaties.
|
||||
- Het detail combineert scorehero, drie echte kernmetingen, analyse en een vaste menselijke actierail.
|
||||
- Pipeline, profieleditor, bronkaarten en systeemtelemetrie volgen de Stitch-kolommen en panelhiërarchie.
|
||||
- Handmatige import blijft volledig beschikbaar, maar staat compact achter een disclosure zodat brongezondheid visueel voorrang krijgt.
|
||||
|
||||
De bedoelde “circa 90% Stitch” slaat hiermee op overgenomen visuele structuur en interactiehiërarchie, niet op het kopiëren van fictieve content, externe assets, auto-apply of routes waarvoor het domeinmodel geen betrouwbare data bezit.
|
||||
|
||||
## Visuele richting
|
||||
|
||||
- Donkere cockpit als standaard: diep marineblauw, tonale panelen, fijne slate-randen, signaalcyaan voor primaire interactie, emerald voor aantoonbaar gezonde status en koraal/amber voor fouten of aandacht.
|
||||
|
||||
@@ -0,0 +1,21 @@
|
||||
# VR-119 browservalidatie
|
||||
|
||||
Datum: 2026-07-21
|
||||
|
||||
## Scope
|
||||
|
||||
De tweede Stitch-pass is gecontroleerd tegen dashboard, vacaturelijst, vacaturedetail, sollicitatiepipeline, profieloverzicht/editor, bronnen en systeemstatus met de lokale `visualtest`-fixture. Alle weergegeven cijfers en acties kwamen uit de lokale Django-database; er is geen fictieve frontenddata toegevoegd.
|
||||
|
||||
## Resultaten
|
||||
|
||||
- Dashboardmatrix geslaagd op 1440×900, 1280×800, 1024×768, 768×1024, 390×844 en 360×800.
|
||||
- Iedere gecontroleerde kernroute had exact één `h1`, zichtbare inhoud en geen pagina-brede horizontale overflow.
|
||||
- De pipeline gebruikt bewust een intern horizontaal scrollgebied voor zes statuskolommen; de pagina zelf overflowt niet.
|
||||
- Mobiele navigatie opent op 390×844, verplaatst focus naar de drawer en houdt de pagina binnen de viewport.
|
||||
- Dark en light renderen met dezelfde informatiehiërarchie; de themawissel gaf geen consolefout.
|
||||
- Externe vacaturelinks behouden `noopener`; er werden geen browserconsolefouten gevonden.
|
||||
- Lokale CSS, JavaScript, iconsprite en favicon laden zonder externe productie-assets.
|
||||
|
||||
## Bewijs
|
||||
|
||||
Nieuwe screenshots gebruiken het prefix `vr119-` in deze map. De oudere VR-118-screenshots blijven bewaard als visuele voor/na-historie.
|
||||
|
After Width: | Height: | Size: 73 KiB |
|
After Width: | Height: | Size: 99 KiB |
|
After Width: | Height: | Size: 90 KiB |
|
After Width: | Height: | Size: 27 KiB |
|
After Width: | Height: | Size: 103 KiB |
|
After Width: | Height: | Size: 84 KiB |
|
After Width: | Height: | Size: 21 KiB |
|
After Width: | Height: | Size: 88 KiB |
|
After Width: | Height: | Size: 85 KiB |
|
After Width: | Height: | Size: 72 KiB |