Fixer les problèmes d'affichage en mode contraste élevé

[gregpetit]

Voici les composantes ayant des problèmes d'affichage lors de l'utilisation du mode contraste élevé :

• Toutes les icônes
• Link
  • Icônes après le libellé
• Links list elements
  • Icônes avant ou après le libellé
• Link utilities
  • Icônes après le libellé
• Logo de la ville
  • Sachant que c'est une image, le texte ne s'affiche pas bien en dark mode.
    • Voir si c'est possible d'afficher la version "Reversed" en dark mode.
• Badge notification dot
  • Ni l'icône, ni le point s'affiche
• Barre de navigation
  • Les icônes
• Breadcrumbs
  • Chevron entre les pages
• Buttons (les icônes)
• Chips
  • Icônes de chevron, settings et de suppression
• Collapse
  • Icône + dans les accordéons
  • Chevron dans le collapse content
• Controls
  • Icônes dans le button group
  • • et - dans le Input stepper
• Dropdown
  • Icônes
  • Toggles (à vérifier une fois la composant source fixée)
  • Ajouter une vrai bordure plutôt qu'un shadow en mode contraste élevé
• Encadré
  • Ajouter une bordure
  • Icônes de la liste (à vérifier une fois la composant source fixée)
• Toutes les entrées de donnée
  • Icônes d'aide, d'erreur
• Champ de texte
  • Icône de clear
• Champ de recherche
  • Icône de recherche
• Sélecteur
  • Chevron
• Fichier
  • Icône de type de fichier ajouté
  • Icône dans le bouton pour chaque fichier
• Interrupteur
  • Fond du toggle
• Étiquettes
  • Icônes
• Indicateur de progrès
  • Dans les deux cas, la barre de progrès ne s'affiche pas
• Liste de contenu
  • Icônes
• Liste de liens
  • Icônes
• Liste d'objet utilitaire
  • Icône dans bouton
  • Icône au début de l'élément de liste
  • Séparateur entre élément d'info supplémenaire
• Media - galerie
  • Icône de copyright (aussi pour Figure)
  • Icône d'image en haut à droite
• Message ciblé
  • Icône de type de message
  • Icône du bouton de fermeture
  • Ajouter une bordure complète
• Message global
  • Icône de type de message
  • Icône du bouton de fermeture
  • Ajouter une bordure
• Message important
  • Icône d'illustration
• Modale
  • Ajouter une bordure plutôt qu'un shadow en mode contraste élevé
  • Ajuster le backdrop derrière la modale
  • Icône du bouton de fermeture
• Side nav
  • Icônes
• Nav filters
  • Chevron
• Stepper
  • Icône d'étape complètées
• Onglets
  • Icônes
• Pagination
  • Icône de précédent et suivant
• Spinner
  • Le spinner ne bouge pas
• Tableau
  • Chevron d'une colonne qui est triable
• Toast
  • Icône de type de message
  • Icône du bouton de fermeture
  • Ajouter une bordure
• Tuiles
  • Ajouter une bordure
  • Icône de tuile avec icône
• Content header full width mesures urgence
  • Icône de mesure d'urgence
• En-tête interne
  • Icônes de bouton
  • Flèche de retour
  • Chevron dans fil d'ariane
  • Séparateur entre élément d'info supplémentaire
• Footer
  • Icône des réseaux sociaux
  • Icône de lien externe
  • Séparateur entre les liens tout en bas
• Pre-footer
  • Texte logo d'arrondissement
  • Icône des réseaux sociaux
• Password
  • Icône de checkd es paramètres de mot de passe
  • Barre de progression de sécurité

[alexisletrotteur]

@gregpetit Peux-tu documenter comment activer le contraste élevé?

Idéalement il faudrait aussi savoir comment on veut afficher les icônes dans un mode contraste élevé?

On a 2 choix:

• Désactiver l'override pour contraste élevé pour les icônes (les icones s'affiche dans leur couleur original mais c'est peut-être pas l'idéal)
• Définir la couleur appropriée pour l'icône dans son contexte de contraste élevé (plus de travail parce qu'il faut intervenir a beaucoup d'endroit.