Cambio de color de nombre de usuario CSS para grupos personalizados completos, ¿funciona a veces y luego no?

Desarrollador
1

No estoy seguro de qué lo está causando exactamente, pero cualquier código CSS que uso para hacer esto parece activarse y desactivarse al azar, no sé si es por una actualización, alguna configuración, etc.

El que he usado durante más tiempo es

.topic-post .Veeps a {
color: #66FF00;
}

Siendo “Veeps” mi Grupo Personalizado. Funcionaba ayer o el día anterior, pero noté hoy que todos los colores, excepto los vinculados a nombres de usuario específicos, han vuelto a la configuración predeterminada, en todos los temas. Creé un nuevo tema y eliminé todas las modificaciones para intentar que literalmente ninguno funcionara. Funciona perfectamente con grupos predefinidos como “admin”, “staff”, moderador, pero no consigo que ninguno se active para grupos personalizados. Me he asegurado de que esté configurado como Grupo Principal, lo he convertido en el único grupo al que pertenecían, he probado en diferentes grupos personalizados (“Owner”), nada. Ahora, si lo aplico a nombres de usuario específicos, funciona bien, pero es tedioso tener que hacer 100 entradas separadas para individuos, que no se actualizan si su grupo cambia.

span.username.staff a {
      color: #00A9DB;
}

Funciona, pero tampoco para Grupos Personalizados. Sé que ERA posible hacer que los Grupos Personalizados funcionaran porque durante años ha funcionado para varios (excepto cuando no lo hace). ¿Hay algún CSS mejor que usar, o alguna configuración con la que esté interfiriendo inadvertidamente?

Instalé GitHub - discourse/discourse-groups-css-classes-in-body y ahora he conseguido que

div.topic-post.group-Veeps div.names span.username a {
  color: #8A2BE2;
}

Funcione como quiero, pero no he instalado esto (ni he estado usando ese CSS) en los últimos años, por lo que no me ayuda a entender qué dejó de funcionar exactamente / qué arreglar, solo estoy clavando el clavo con el taladro.

2 Me gusta
2

Hola,

Hubo un cambio ayer DEV: add title class name, prefix username class (#19482) · discourse/discourse@b1e0836 · GitHub así que ahora tienes que añadir el prefijo group-- al nombre del grupo en css. Por ejemplo: .group--Veeps.

5 Me gusta
3

Sí, disculpe las molestias, pero la forma anterior en que agregábamos el nombre de la clase de grupo era un poco propensa a errores… significaba que cualquier nombre de grupo que coincidiera con un nombre de clase en nuestro CSS causaría problemas de diseño.

Por ejemplo, un grupo llamado “hidden” agregaría la clase .hidden, lo que ocultaría los nombres de usuario. Agregar el prefijo group-- evita este problema y no debería ser necesario volver a cambiarlo en el futuro. Por lo tanto, solo necesitará cambiar .Veeps por .group--veeps.

6 Me gusta
4

Gracias por informarme, me siento un poco menos estúpido al haber roto algo intentando arreglar otra cosa, ¡como suele pasar! He probado varios casos diferentes y todos funcionan bien y he podido resolverlo con esta información.

¿Requiere el uso de GitHub - discourse/discourse-groups-css-classes-in-body para seguir utilizando Grupos Primarios personalizados de esta manera, o es innecesario? Posiblemente entendí mal el propósito de ese plugin en primer lugar y nunca fue necesario para lo que estaba haciendo; simplemente lo eliminé de mi tema de prueba para ver si los códigos personalizados de grupo primario seguían activándose, y lo hacen, así que parece que no es necesario… pero preferiría estar seguro antes de desactivarlo y encontrar algo inesperado en el futuro.

2 Me gusta
5

Los grupos primarios están presentes sin él, por lo que se pueden dirigir con CSS. Con el componente temático instalado, también puedes dirigirte a grupos que no sean primarios. :+1:

2 Me gusta
6

No entendí qué código usar, tal vez la traducción está fuera de contexto

así que en lugar de usar esto

div.topic-post.group-Veeps div.names span.username a {
  color: #8A2BE2;
}

uso esto

div.topic-post.group-- Veeps div.names span.username a {
  color: #8A2BE2;
}

No entiendo qué se debe poner en el código, es solo el --

@Kartoon @Don @awesomerobot

7

Hola,

Debería funcionar así: :arrow_down_small:

.names span {
  &.group--GroupName a {
    color: red;
  }
}

Pero he creado un componente temático rápido para esto ahora. :slightly_smiling_face:

Aquí puedes configurarlo fácilmente.

groupname;color

Screenshot 2023-01-14 at 21.07.53
Screenshot 2023-01-14 at 21.07.53767×399 31.1 KB

7 Me gusta
8

Probablemente no sea la mejor persona para preguntar, ya que puedo hacer que las cosas funcionen pero no necesariamente explicar por qué. Pero lo que estoy usando actualmente y funciona bien

.topic-post.group-Veeps div.names span.username a {
   color: #66FF00;
 }

Obviamente, cambia “Veeps” por el grupo de usuarios que tengas, solo que así se llama el mío.

.names span {
  &.group--Veeps a {
    color: red;
  }
}

Como se mencionó anteriormente, también funciona, simplemente lo cambié por lo que tenía. Probablemente instalaré el complemento que acaba de publicar para mayor comodidad de todos modos.

1 me gusta
9

Yo también tengo el mismo problema, no sé qué está mal, es impresionante que incluso usando el tema competente o el código, porque los nombres de los miembros no cambian de color, incluso usé el cogido y el tema del componente en un tema crudo sin ningún CSS o cambios y no cambia nada sobre los colores del título.

Acabo de notar algo intrigante, si pongo a alguien en el grupo como propietario, el código de cambio funciona y los colores de los nombres de los miembros que establecí como propietario cambian, pero los miembros que no son propietarios no cambian.

@Kartoon @Don @xebiyen