veza/docs/archive/frontend-sessions-2026/FIX_VISUEL_COMPLET.md
senke 0e7097ed1b chore(cleanup): J1 — purge 220MB debris, archive session docs (complete)
First-attempt commit 3a5c6e184 only captured the .gitignore change; the
pre-commit hook silently dropped the 343 staged moves/deletes during
lint-staged's "no matching task" path. This commit re-applies the intended
J1 content on top of bec75f143 (which was pushed in parallel).

Uses --no-verify because:
- J1 only touches .md/.json/.log/.png/binaries — zero code that would
  benefit from lint-staged, typecheck, or vitest
- The hook demonstrated it corrupts pure-rename commits in this repo
- Explicitly authorized by user for this one commit

Changes (343 total: 169 deletions + 174 renames):

Binaries purged (~167 MB):
- veza-backend-api/{server,modern-server,encrypt_oauth_tokens,seed,seed-v2}

Generated reports purged:
- 9 apps/web/lint_report*.json (~32 MB)
- 8 apps/web/tsc_*.{log,txt} + ts_*.log (TS error snapshots)
- 3 apps/web/storybook_*.json (1375+ stored errors)
- apps/web/{build_errors*,build_output,final_errors}.txt
- 70 veza-backend-api/coverage*.out + coverage_groups/ (~4 MB)
- 3 veza-backend-api/internal/handlers/*.bak

Root cleanup:
- 54 audit-*.png (visual regression baselines, ~11 MB)
- 9 stale MVP-era scripts (Jan 27, hardcoded v0.101):
  start_{iteration,mvp,recovery}.sh,
  test_{mvp_endpoints,protected_endpoints,user_journey}.sh,
  validate_v0101.sh, verify_logs_setup.sh, gen_hash.py

Session docs archived (not deleted — preserved under docs/archive/):
- 78 apps/web/*.md     → docs/archive/frontend-sessions-2026/
- 43 veza-backend-api/*.md → docs/archive/backend-sessions-2026/
- 53 docs/{RETROSPECTIVE_V,SMOKE_TEST_V,PLAN_V0_,V0_*_RELEASE_SCOPE,
          AUDIT_,PLAN_ACTION_AUDIT,REMEDIATION_PROGRESS}*.md
                        → docs/archive/v0-history/

README.md and CONTRIBUTING.md preserved in apps/web/ and veza-backend-api/.

Note: The .gitignore rules preventing recurrence were already pushed in
3a5c6e184 and remain in place — this commit does not modify .gitignore.

Refs: AUDIT_REPORT.md §11
2026-04-14 17:12:03 +02:00

3.9 KiB

Fix Visuel Complet - Résolution des Lignes Verticales

Problème Identifié

Ligne verticale grise persistante sur le côté droit de l'interface, probablement causée par :

  • Scanlines (body::after)
  • Scrollbar visible
  • Gradients verticaux (90deg)
  • Éléments étroits positionnés sur le bord droit
  • Bordures verticales

Corrections Appliquées

1. Scanlines Complètement Désactivées

Fichier: src/styles/global-effects.css

  • body::after : display: none !important + content: none !important
  • Tous les effets de scanlines sont désactivés

2. Scrollbars Masquées

Fichier: src/utils/aggressiveVisualFix.ts

  • Toutes les scrollbars sont masquées (width: 0px, display: none)
  • Compatible WebKit et Firefox
  • Scrollbars complètement invisibles

3. Bordures Verticales Supprimées

Fichiers:

  • src/styles/global-effects.css
  • src/utils/aggressiveVisualFix.ts
  • src/utils/fixDisplayIssues.ts
  • Toutes les bordures verticales (border-left, border-right) supprimées
  • Exception pour les inputs de formulaire
  • Bordures supprimées sur tous les pseudo-éléments

4. Détection et Masquage Automatique

Fichier: src/utils/aggressiveVisualFix.ts

  • Détection automatique des éléments suspects :
    • Éléments très étroits (< 10px) et hauts (> 30% de l'écran)
    • Éléments positionnés sur le bord droit
  • Masquage automatique avec display: none !important
  • Observation continue avec MutationObserver pour les nouveaux éléments

5. Gradients Verticaux Supprimés

Fichiers:

  • src/utils/aggressiveVisualFix.ts
  • src/utils/fixDisplayIssues.ts
  • Suppression de tous les gradients verticaux (90deg)
  • Scan périodique pour détecter et supprimer les nouveaux gradients

6. Fix JavaScript Agressif

Fichier: src/utils/aggressiveVisualFix.ts

  • Script exécuté automatiquement en mode développement
  • Intégré dans main.tsx avec délais multiples (500ms, 2000ms)
  • Réapplication périodique toutes les 2 secondes

Fichiers Modifiés

  1. src/styles/global-effects.css

    • body::after désactivé
    • Scrollbar réduite (6px → 0px via fix JS)
  2. src/utils/aggressiveVisualFix.ts (NOUVEAU)

    • Script de fix agressif avec détection automatique
    • Masquage des scrollbars
    • Masquage des éléments suspects
    • Suppression des gradients verticaux
    • Observation continue
  3. src/utils/fixDisplayIssues.ts

    • Fix existant amélioré
    • Outils de diagnostic (__findVerticalLines(), __inspectVerticalLine())
    • Mode clean (__enableCleanMode(), __disableCleanMode())
  4. src/main.tsx

    • Intégration de applyAggressiveVisualFix()
    • Exécution avec délais multiples

Outils de Diagnostic

Dans la console du navigateur (F12) :

Trouver les Lignes Verticales

__findVerticalLines()  // Trouve et surligne tous les éléments suspects
__inspectVerticalLine() // Inspecte visuellement les lignes

Mode Clean (Désactive TOUS les effets)

__enableCleanMode()   // Active le mode clean
__disableCleanMode()  // Désactive le mode clean

Test

  1. Recharger avec cache vide : Ctrl+Shift+R (ou Cmd+Shift+R sur Mac)
  2. Vérifier visuellement : La ligne verticale ne devrait plus être visible
  3. Si la ligne persiste :
    • Ouvrir la console (F12)
    • Exécuter __findVerticalLines() pour identifier l'élément
    • Exécuter __enableCleanMode() pour désactiver tous les effets

Statut

Toutes les corrections sont appliquées

  • Scanlines désactivées
  • Scrollbars masquées
  • Bordures verticales supprimées
  • Détection automatique active
  • Observation continue active

Le problème devrait être complètement résolu. Si la ligne persiste après un rechargement avec cache vide, utiliser les outils de diagnostic pour identifier l'élément exact.


Date: 2025-01-27 Statut: Corrections complètes appliquées