Al usar el menú desplegable de notificación de temas (Watching/Tracking/Normal/Muted), el texto y el icono del elemento actualmente seleccionado se vuelven invisibles debido al contraste insuficiente entre el color de fondo de la selección y los colores del primer plano.
Pasos para reproducir
Abrir cualquier tema
Hacer clic en el botón de la campana de notificación en la parte inferior del tema
Observar el nivel de notificación actualmente seleccionado (por ejemplo, “Tracking”)
Comportamiento esperado
El elemento seleccionado debe tener texto e icono claramente visibles con buen contraste.
Comportamiento actual
La etiqueta de texto desaparece o se vuelve muy difícil de leer
El icono de la campana se vuelve invisible
El problema es más notable en los temas oscuros, pero puede afectar a cualquier tema dependiendo de la paleta de colores
Detalles técnicos
En app/assets/stylesheets/common/select-kit/select-kit.scss, el estado .is-selected solo establece el color de fondo sin garantizar el contraste del primer plano:
&.is-selected,
&.is-selected.is-highlighted {
background: var(--d-selected);
// Sin anulación de color para texto o iconos
}
La variable CSS --d-selected proviene del color $selected del tema, pero el texto (.name, .desc) y los iconos (.d-icon) conservan sus colores predeterminados, que pueden no contrastar bien con el fondo de la selección.
Parece que tu paleta de colores no se ha actualizado en mucho tiempo, porque ese no es el color de selección normal. ¿Cuándo fue la última vez que actualizaste tu foro?
Sí, este es probablemente el caso; he visto situaciones como esta en las que una paleta de colores personalizada creada antes de que se añadieran nuevos colores termina con un contraste deficiente… @BrettH si creas una nueva paleta de colores y usas esa, ¿persiste el problema?
Gracias a todos por las sugerencias. Permítanme abordar las preguntas:
NateDhaliwal: Todavía no he probado en modo seguro, pero basándome en lo que describen chapoi y Kris, sospecho que el modo seguro lo resolvería ya que volvería a la paleta Light predeterminada en lugar de mi paleta personalizada.
@chapoi: Buena pregunta. Nuestra paleta de colores se creó hace bastante tiempo, definitivamente antes de que se agregaran los colores selected y hover a la paleta base. Creo que la paleta se configuró cuando lanzamos la comunidad y no la hemos actualizado desde entonces.
@awesomerobot: Eso tiene sentido. Al observar el código, puedo ver que resolved_colors calcula valores de reserva para hover y selected usando dark_light_diff si faltan en la paleta. Pero el problema es que los colores del texto (.name, .desc, .d-icon) todavía usan sus valores predeterminados, que fueron diseñados para el color de selección de la paleta Light predeterminada, no para el valor de reserva calculado para mi tema más oscuro.
Crearé una nueva paleta y estableceré explícitamente los colores selected y hover a valores que contrasten adecuadamente. Sospecho que eso lo solucionará.
Una idea mientras pruebo: ¿tendría sentido que el cálculo de reserva también considere el contraste del texto? De esa manera, las paletas más antiguas manejarían con elegancia las nuevas adiciones de color sin intervención manual. Solo es una idea; sé que los sistemas de color son complicados de acertar, y el enfoque actual probablemente cubre la mayoría de los casos. Estaré encantado de presentar una solicitud de función separada si eso es útil.
