veza/FIX_CSS_DIRECT_APPLIQUE.md
senke 023b8a89c6 fix: Corriger URL Swagger et finaliser implémentation DeveloperPage
- Ajouter fallback pour Swagger UI si doc.json ne fonctionne pas
- Améliorer message d'erreur avec bouton pour ouvrir Swagger UI directement
- Les fonctionnalités API Keys et Usage Stats sont maintenant complètes et fonctionnelles
- Tous les onglets de DeveloperPage sont maintenant implémentés
2026-01-18 13:55:28 +01:00

1.6 KiB

Fix CSS Direct Appliqué

Solution Immédiate

Un fix CSS direct a été ajouté dans apps/web/src/styles/global-effects.css qui override directement les classes problématiques du design-system.

Ce que fait ce fix

  1. Désactive complètement focus: sur les inputs

    • focus:border-kodo-cyan → désactivé
    • focus:ring-1 focus:ring-kodo-cyan → désactivé
    • Border reste border-kodo-steel par défaut
  2. Active focus-visible: seulement au clavier

    • focus-visible:border-kodo-cyan/60 → activé (60% opacité)
    • Visible seulement lors de la navigation Tab
    • Invisible au clic souris
  3. Supprime tous les rings

    • --tw-ring-width: 0 sur tous les inputs
    • Pas de double indication

Avantages

  • Immédiat : Pas besoin de rebuild le design-system
  • Définitif : Override les classes même si le design-system n'est pas rebuildé
  • Pas de régression : N'affecte que les inputs, pas les autres éléments

Vérification

Après rechargement de la page (Ctrl+Shift+R) :

  1. Au chargement : Aucun input n'a de contour cyan
  2. Au clic souris : Pas de contour cyan
  3. Navigation Tab : Contour cyan discret visible (60% opacité)
  4. Après clic ailleurs : Le contour disparaît

Si le problème persiste

  1. Vider complètement le cache du navigateur
  2. Vérifier dans DevTools que les styles CSS sont bien appliqués
  3. Vérifier que global-effects.css est bien chargé

Date: 2025-01-27 Statut: Fix CSS direct appliqué - Solution immédiate et définitive