J’ai une couleur primaire par défaut : #4d238c. Le problème est que la couleur générée pour $primary-medium (#a179de) ne respecte pas les directives d’accessibilité, je dois donc l’assombrir.
Il semble fastidieux de la modifier partout où le système utilise la couleur medium, alors que je pourrais simplement écraser $primary-medium avec une couleur rouge, par exemple.
Oui, je comprends tout à fait. Pour le moment, il n’existe aucun moyen de remplacer directement l’une des variables secondaires que nous générons automatiquement, car elles sont figées lors de la construction du CSS. Donc, à court terme, vous devrez apporter ces modifications manuellement.
Quelques explications :
Les schémas de couleurs sont conçus pour être un moyen ultra-simple de définir des couleurs ; tout ce qui est plus spécifique nécessite du CSS personnalisé. Cela a été discuté un peu plus ici : Customizing colors - #2 by awesomerobot
Quelques points à considérer pour nous :
Je ne pense pas qu’un éditeur de schémas de couleurs avancé permettant de remplacer ces variables secondaires soit une mauvaise idée, mais comme elles sont utilisées de manière très large, vous auriez probablement besoin d’écrire du CSS de toute façon.
Par exemple… vous voudriez peut-être remplacer toutes les occurrences de texte de $primary-medium… mais cette variable est aussi utilisée pour les bordures et d’autres éléments où un contraste plus élevé avec $primary-medium ne serait pas souhaitable. Donc, au mieux, un éditeur de couleurs avancé permettrait de réduire le CSS personnalisé nécessaire, sans l’éliminer complètement.
Cela dit… le problème principal ici est-il le contraste du texte pour l’accessibilité, n’est-ce pas ? Nos styles par défaut échouent en matière de contraste du texte dans certaines zones, et il est possible que si nous améliorons cela, ce ne serait pas un problème pour vous dès le départ…
Donc, je pense que dans un avenir proche, notre équipe pourra examiner l’accessibilité du texte par défaut, et plus tard, nous pourrons envisager d’améliorer nos outils de schémas de couleurs pour prendre en compte l’accessibilité (https://cloudflare.design/color/ est une expérience intéressante qui prend en compte le contraste du texte, par exemple).
Salut Kris,
Merci pour ta réponse si rapide.
Oui, notre principale préoccupation est l’accessibilité, car nous utilisons votre produit dans un contexte gouvernemental.
J’ai contourné les problèmes d’accessibilité liés au contraste de manière étape par étape, mais comme nous en avons discuté, il serait préférable que les couleurs par défaut soient accessibles.
Le site ne présente pas seulement des problèmes de contraste ; d’autres éléments qui échouent souvent sont les suivants : les éléments de liste (<li>) ne sont pas contenus dans des éléments parents <ul> ou <ol>.
Pour l’instant, le contraste est le seul aspect que je puisse contrôler, donc cela va pour le moment en attendant qu’une correction soit mise en place.
Nous sommes tombés sur ce fil en raison d’un problème similaire. Nous avons trouvé une solution de contournement en ajoutant le code suivant au CSS commun du thème :
:root {
--primary-medium: #666666;
}