43af35fd93
- Archiver 131 .md dans docs/archive/root-md/ - Archiver 22 .json dans docs/archive/root-json/ - Conserver 7 .md utiles (README, CONTRIBUTING, CHANGELOG, etc.) - Conserver package.json, package-lock.json, turbo.json - Ajouter README d'index dans chaque archive
47 lines
1.6 KiB
Markdown
47 lines
1.6 KiB
Markdown
# 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
|