Fix dark mode : formulaires et composant lieu-picker

- app.css : règle @layer base globale pour tous les <input>, <select>,
  <textarea> en mode sombre (bg-gray-700, border-gray-600, text-gray-100)
  sans toucher checkboxes, radios ni boutons
- lieu-picker : bouton déclencheur, fenêtre modale, champ de recherche,
  liste de résultats et badges entièrement adaptés au thème sombre

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-06-04 20:14:44 +02:00
parent f530f55577
commit 3faa74640d
2 changed files with 66 additions and 24 deletions
+27
View File
@@ -3,3 +3,30 @@
@tailwind utilities;
[x-cloak] { display: none !important; }
@layer base {
/*
* Dark mode champs de formulaire
* Appliqué globalement pour couvrir tous les <input>, <select>, <textarea>
* bruts qui n'utilisent pas le composant <x-text-input>.
* La spécificité (.dark + élément) surpasse les resets de @tailwindcss/forms.
*/
.dark input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="range"]),
.dark select,
.dark textarea {
background-color: theme('colors.gray.700');
border-color: theme('colors.gray.600');
color: theme('colors.gray.100');
}
.dark input::placeholder,
.dark textarea::placeholder {
color: theme('colors.gray.400');
}
/* Options du <select> natif (fond navigateur) */
.dark select option {
background-color: theme('colors.gray.700');
color: theme('colors.gray.100');
}
}