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

Desarrollador
1

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.

2

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:.

Pasted image1730×523 107 KB

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;
}

Pasted image1723×272 38.3 KB

6

Esto parece estar desactualizado: «title visited» ya no parece aparecer, y al intentar usarlo no hace nada.

Además, ¿cómo se podría cambiar el color de los temas que sí tienen publicaciones sin leer?

Intenté usar Inspeccionar elemento, pero la clase en ambos casos se llama simplemente «title», y al modificarla cambia el color de TODAS las publicaciones, independientemente de si hay publicaciones sin leer o no.

7

Parece que ahora puedes usar el selector .topic-list-item.visited .title.

También hay unseen-topic y new-posts :slight_smile:

8

@fefei gracias por los nuevos selectores. Una pregunta más. Estoy intentando cambiar también el color del número que representa las respuestas al post, pero noto que estos pueden tener diferentes colores. Está el color regular, pero veo que algunos son naranjas, lo que representa una alta proporción de likes por post. Es la misma situación que con el asunto de los posts leídos/no leídos. ¿Alguna idea sobre cómo gestionar los colores por separado aquí? (Además, ¿hay alguna forma de saber si existen otros colores posibles? Hasta ahora solo he visto el naranja).

9

Estoy en el móvil ahora mismo, así que no puedo comprobarlo por ti, pero como regla general: intenta inspeccionar el elemento que quieres estilizar en el inspector de tu navegador y busca clases útiles. Si te falta información, sube por el árbol (al elemento padre de cada elemento) y comprueba cada uno. Por ejemplo, en el caso del title mencionado, la clase visited solo aparecía unos elementos más arriba en el árbol, en el elemento que representa toda la fila :slight_smile: