How to set text color of topic that was read already?

How to set text color of topic that was read already in the list of topics? It is grayed out too much and it hurts usability.

You probably won’t be surprised that this can be done with a CSS customization :slight_smile:

The general approach to find these is to :one: right-click the element you want to customize, select Inspect :two: and look for the CCS classes :three:. Then, you write CCS to target this (your favorite search engine will help you), and test it by directly injecting it in your browser :four:.

Once you’re done, simply apply it in site settings.

In this case, the following will make these topics appear red:

.title.visited {
    color: #FF0000 !important;
}

Cela semble être obsolète : « title visited » ne semble plus apparaître, et essayer ne donne aucun résultat.

De plus, comment pourrait-on changer la couleur des sujets qui ont des messages non lus ?

J’ai essayé d’utiliser l’inspecteur d’éléments, mais la classe est simplement appelée « title » dans les deux cas, et la modifier semble changer la couleur de TOUS les messages, qu’il y ait des messages non lus ou non.

Il semble que vous puissiez maintenant utiliser le sélecteur .topic-list-item.visited .title.

Il y a aussi unseen-topic et new-posts :slight_smile:

@fefrei merci pour les nouveaux sélecteurs ! Une dernière question. J’essaie aussi de changer la couleur du nombre représentant les réponses au message. Mais je remarque qu’ils peuvent avoir différentes couleurs. Il y a la couleur normale, mais j’en vois certains en orange, ce qui représente un ratio de likes élevé par rapport aux messages. C’est la même situation que pour les messages lus/non lus. Des idées sur la façon de gérer séparément ces couleurs ici ? (Aussi, y a-t-il un moyen de savoir s’il existe d’autres couleurs possibles ? Pour l’instant, je n’ai vu que l’orange.)

Je suis actuellement sur mobile, donc je ne peux pas vérifier cela pour vous, mais en règle générale : essayez d’examiner l’élément que vous souhaitez styliser dans l’inspecteur de votre navigateur et cherchez des classes utiles. Si vous manquez d’informations, remontez l’arborescence (vers l’élément parent de chaque élément) et vérifiez chacun d’eux – par exemple, dans le cas du titre title, la classe visited n’apparaissait que quelques éléments plus haut dans l’arbre, au niveau de l’élément représentant toute la ligne :slight_smile: