Changer la couleur de fond de catégorie pour les boîtes

J’ai du mal à trouver comment changer la couleur d’arrière-plan de la catégorie pour les boîtes de catégorie :

L’objectif est d’hériter de la couleur principale de la catégorie et d’ajouter de la transparence à l’arrière-plan :

Quelqu’un sait comment je peux y parvenir ?

1 « J'aime »

Bonjour,

C’est possible avec CSS et une légère modification du template. :slightly_smiling_face:

Sur ordinateur, la bordure des catégories a une variable de couleur que vous pouvez également utiliser pour l’arrière-plan.

C’est la variable --category-color qui est la couleur de la bordure.
Screenshot 2022-09-12 at 17.25.56

Mais comme cette variable est une valeur hexadécimale, vous ne pouvez pas la rendre transparente. Cependant, vous pouvez l’ajouter à un pseudo ::before où vous pouvez également définir l’opacité.

Je l’ai fait sous forme de composant pour que vous puissiez l’installer ou le forker et modifier ce que vous voulez. :slightly_smiling_face:

Composant : GitHub - VaperinaDEV/discourse-category-background-color


Le CSS pour ordinateur ressemble à ceci :


Sur mobile, cette variable de couleur est manquante du template, vous devez donc ajouter ce style ici :


Après cela, vous pouvez utiliser la variable --category-color et faire quelque chose de similaire à ce que vous faites sur ordinateur :

Ordinateur


Mobile

3 « J'aime »

Tu es le meilleur !

Merci pour l’explication, je vais jouer avec ça un moment !

1 « J'aime »

Salut @MarcP, désolé, j’ai complètement raté que tu voulais ça pour les boîtes de catégorie. :smiley: J’ai mis à jour le CSS du bureau pour qu’il fonctionne aussi avec les boîtes de catégorie.

1 « J'aime »

Ah merci, je cherchais déjà comment faire fonctionner les boîtes ! C’était plus compliqué que ce que je pensais. J’apprécie beaucoup !

1 « J'aime »